/* Scoped layout for the hockey and CS2 event picker. */
#sports-events-panel { --events-gutter: 30px; }
#sports-events-panel .events-heading { margin-bottom: 24px; }
#sports-events-panel .events-heading h2 { font-size: 22px; }
#sports-events-panel .events-heading p { margin-top: 8px; font-size: 14px; }
#sports-events-panel .match-form-card { padding: 0; }
#sports-events-panel .load-zone { padding: 26px var(--events-gutter); gap: 24px; flex-direction: row; flex-wrap: wrap; }
#sports-events-panel .load-zone > div:first-child { display: block; flex: 1 1 260px; }
#sports-events-panel .load-zone h3 { font-size: 20px; line-height: 1.35; }
#sports-events-panel .load-zone p { max-width: 44ch; margin-top: 8px; font-size: 14px; line-height: 1.65; color: #596c59; }
#sports-events-panel .load-controls { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 12px; max-width: 100%; }
#sports-events-panel .load-controls label { min-width: 190px; flex: 1 1 190px; }
#sports-events-panel .load-controls .button { flex-shrink: 0; white-space: nowrap; }
#sports-events-panel label { min-width: 0; gap: 9px; font-size: 14px; font-weight: 600; color: #43574a; }
#sports-events-panel input, #sports-events-panel select { min-width: 0; height: 50px; font-size: 16px; font-weight: 400; }
#sports-events-panel .button { min-height: 50px; font-size: 15px; padding: 13px 22px; }
#sports-events-panel .events-form-body { padding: 24px var(--events-gutter) 28px; }
#sports-events-status { margin: 0 0 22px; font-size: 13px; line-height: 1.65; color: #65746c; max-width: 90ch; overflow-wrap: anywhere; }
#sports-events-status:empty, #sports-events-list:empty, :is(#sports-events-detail, #personal-sports-detail):empty { display: none; }
#sports-events-panel .filter-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
#sports-events-panel .filter-grid label:last-child { grid-column: auto; }
#sports-events-panel .match-select-label { margin-top: 22px; }
#sports-events-panel .chosen-match { display: block; margin: 18px 0 0; padding: 15px 18px; border: 1px solid #e3eadb; border-radius: 12px; background: #f5f8f0; color: #435a42; font-size: 14px; line-height: 1.7; overflow-wrap: anywhere; }
#sports-events-panel .chosen-match:empty { display: none; }
#sports-events-more { margin-top: 16px; }
#sports-events-panel .form-action { padding: 22px var(--events-gutter); display: flex; flex-direction: row; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 20px; background: #fbfcf9; }
#sports-events-panel .events-analysis-note { flex: 1 1 280px; }
#sports-events-panel .events-analysis-note strong { display: block; font-size: 14px; font-weight: 600; }
#sports-events-panel .events-analysis-note p { margin-top: 5px; max-width: 62ch; color: #65746c; font-size: 13px; line-height: 1.65; }
#sports-events-analyze { flex-shrink: 0; }
#sports-events-panel .events-history { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; padding: 18px 4px; }
#sports-events-panel .events-history p { color: #65746c; font-size: 13px; }
#sports-events-history { font-size: 13px; white-space: normal; gap: 10px; }
:is(#sports-events-detail, #personal-sports-detail) { margin-top: 24px; color: #43574a; font-size: 14px; line-height: 1.7; overflow-wrap: anywhere; }
:is(#sports-events-detail, #personal-sports-detail) .event-report { display: grid; gap: 20px; }
:is(#sports-events-detail, #personal-sports-detail) .card { padding: 28px; }
:is(#sports-events-detail, #personal-sports-detail) h2 { color: var(--ink); font-size: clamp(22px, 2.3vw, 30px); margin: 16px 0 9px; line-height: 1.3; }
:is(#sports-events-detail, #personal-sports-detail) h3 { color: var(--ink); font-size: 20px; margin: 0; line-height: 1.35; }
:is(#sports-events-detail, #personal-sports-detail) h4 { color: var(--ink); font-size: 15px; font-weight: 650; margin: 0 0 7px; }
:is(#sports-events-detail, #personal-sports-detail) .event-report-top { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 12px; }
:is(#sports-events-detail, #personal-sports-detail) .event-report-eyebrow { font-size: 11px; letter-spacing: 1.3px; font-weight: 650; color: #61764f; }
:is(#sports-events-detail, #personal-sports-detail) .event-report-competition { color: #54684f; font-size: 14px; }
:is(#sports-events-detail, #personal-sports-detail) .event-report-start { color: #65746c; font-size: 13px; margin-top: 5px; }
:is(#sports-events-detail, #personal-sports-detail) .event-report-layout { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(280px, 1fr); align-items: start; gap: 20px; }
:is(#sports-events-detail, #personal-sports-detail) .event-report-intro { font-size: 13px; color: #65746c; margin-top: 9px; line-height: 1.7; }
:is(#sports-events-detail, #personal-sports-detail) .event-probabilities { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 12px; margin-top: 22px; }
:is(#sports-events-detail, #personal-sports-detail) .event-probability { display: flex; flex-direction: column; padding: 18px; border: 1px solid #dce7cf; border-radius: 14px; background: #f0f5e7; min-width: 0; }
:is(#sports-events-detail, #personal-sports-detail) .event-probability-label { font-size: 14px; font-weight: 600; line-height: 1.5; color: #34522c; }
:is(#sports-events-detail, #personal-sports-detail) .event-probability-team { margin-top: 5px; font-size: 12px; color: #637855; line-height: 1.5; }
:is(#sports-events-detail, #personal-sports-detail) .event-probability-value { display: block; color: #254d2b; font-size: clamp(28px, 2.8vw, 38px); letter-spacing: -.8px; font-weight: 600; line-height: 1.2; padding-top: 20px; margin-top: auto; font-variant-numeric: tabular-nums; white-space: nowrap; }
:is(#sports-events-detail, #personal-sports-detail) .event-probability-value > span { font-size: .55em; font-weight: 450; margin-left: 3px; }
:is(#sports-events-detail, #personal-sports-detail) .event-probability-value.event-value-missing { font-size: 16px; letter-spacing: 0; white-space: normal; }
:is(#sports-events-detail, #personal-sports-detail) .event-probability-meter { margin-top: 13px; height: 4px; border-radius: 4px; background: #dfe8d3; overflow: hidden; }
:is(#sports-events-detail, #personal-sports-detail) .event-probability-meter > span { display: block; height: 100%; background: #7f9d58; border-radius: inherit; }
:is(#sports-events-detail, #personal-sports-detail) .event-report-footnote { font-size: 12px; color: #65746c; margin-top: 14px; }
:is(#sports-events-detail, #personal-sports-detail) .event-report-goals, :is(#sports-events-detail, #personal-sports-detail) .event-report-history { border-top: 1px solid var(--line); margin-top: 24px; padding-top: 22px; }
:is(#sports-events-detail, #personal-sports-detail) .event-report-pair { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-top: 16px; }
:is(#sports-events-detail, #personal-sports-detail) .event-report-stat { min-width: 0; display: flex; flex-direction: column; align-items: flex-start; }
:is(#sports-events-detail, #personal-sports-detail) .event-report-stat > span { display: block; font-size: 13px; color: #65746c; line-height: 1.6; margin-bottom: 6px; }
:is(#sports-events-detail, #personal-sports-detail) .event-report-stat > strong { font-size: 26px; line-height: 1.3; font-weight: 600; color: #34522c; font-variant-numeric: tabular-nums; margin-top: auto; }
:is(#sports-events-detail, #personal-sports-detail) .event-report-method { margin-top: 15px; font-size: 14px; line-height: 1.75; }
:is(#sports-events-detail, #personal-sports-detail) .event-report-provenance { background: #fbfcf8; }
:is(#sports-events-detail, #personal-sports-detail) .event-report-provenance h3 { font-size: 16px; }
:is(#sports-events-detail, #personal-sports-detail) .event-report-provenance p { font-size: 13px; line-height: 1.7; margin-top: 9px; color: #65746c; }
:is(#sports-events-detail, #personal-sports-detail) .event-report-provenance .event-report-timestamp { color: #43574a; }
:is(#sports-events-detail, #personal-sports-detail) .event-report-limits { border: 1px solid #dfe6da; background: #f7f9f3; border-radius: 16px; padding: 24px 28px; color: #43574a; }
:is(#sports-events-detail, #personal-sports-detail) .event-report-limits h3 { font-size: 18px; color: #244a35; }
:is(#sports-events-detail, #personal-sports-detail) .event-report-limits .event-report-limits-intro { margin-top: 7px; color: #596c59; }
:is(#sports-events-detail, #personal-sports-detail) .event-report-limits ul { padding: 0; margin: 18px 0 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; list-style: none; }
:is(#sports-events-detail, #personal-sports-detail) .event-report-limits li { padding: 14px 16px; border: 1px solid #e1e7db; border-radius: 10px; background: #fff; }
:is(#sports-events-detail, #personal-sports-detail) .event-report-limits li:last-child:nth-child(odd) { grid-column: 1 / -1; }
:is(#sports-events-detail, #personal-sports-detail) .event-report-limits li, :is(#sports-events-detail, #personal-sports-detail) .event-report-limits p { font-size: 13px; font-weight: 400; line-height: 1.7; }
:is(#sports-events-detail, #personal-sports-detail) .event-report-state { border-color: #e8dfc8; background: #fcfaf4; }
:is(#sports-events-detail, #personal-sports-detail) .event-report-state p { margin-top: 12px; font-size: 14px; max-width: 80ch; }
@media (max-width: 1200px) {
  :is(#sports-events-detail, #personal-sports-detail) .event-report-layout { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 700px) {
  #sports-events-panel { --events-gutter: 20px; }
  #sports-events-panel .load-zone { flex-direction: column; align-items: stretch; gap: 20px; padding-top: 22px; padding-bottom: 22px; }
  #sports-events-panel .load-zone > div:first-child { flex: none; }
  #sports-events-panel .load-controls { display: grid; grid-template-columns: minmax(0, 1fr); width: 100%; gap: 16px; }
  #sports-events-panel .load-controls label { min-width: 0; }
  #sports-events-panel .load-controls .button { width: 100%; }
  #sports-events-panel .filter-grid { grid-template-columns: minmax(0, 1fr); gap: 20px; }
  #sports-events-panel .form-action { flex-direction: column; align-items: stretch; }
  #sports-events-panel .events-analysis-note { flex: none; }
  #sports-events-panel .events-history { align-items: flex-start; padding: 18px 0; }
  :is(#sports-events-detail, #personal-sports-detail) .card, :is(#sports-events-detail, #personal-sports-detail) .event-report-limits { padding: 22px 20px; }
  :is(#sports-events-detail, #personal-sports-detail) .event-report { gap: 16px; }
  :is(#sports-events-detail, #personal-sports-detail) .event-report-limits ul { grid-template-columns: minmax(0, 1fr); }
  :is(#sports-events-detail, #personal-sports-detail) .event-report-top { align-items: flex-start; }
  :is(#sports-events-detail, #personal-sports-detail) .event-probabilities { grid-auto-flow: row; grid-template-columns: minmax(0, 1fr); }
  :is(#sports-events-detail, #personal-sports-detail) .event-probability { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 14px; align-items: center; }
  :is(#sports-events-detail, #personal-sports-detail) .event-probability-label { grid-column: 1; grid-row: 1; }
  :is(#sports-events-detail, #personal-sports-detail) .event-probability-team { grid-column: 1; grid-row: 2; }
  :is(#sports-events-detail, #personal-sports-detail) .event-probability-value { grid-column: 2; grid-row: 1 / 3; padding-top: 0; margin-top: 0; font-size: 32px; }
  :is(#sports-events-detail, #personal-sports-detail) .event-probability-meter { grid-column: 1 / -1; width: 100%; }
}

#personal-sports-refresh { margin-top:12px; }
#page-history .page-heading > #personal-sports-refresh { position:static; width:auto; height:auto; min-height:44px; font-size:14px; padding:12px 16px; white-space:normal; }
#personal-sports-list { margin-top:20px; }
#personal-sports-list .event-name { overflow-wrap:anywhere; }
#personal-sports-detail:empty { display:none; }
@media(max-width:700px) { #page-history .personal-history-heading { display:block; } }