.scores-page { min-height:calc(100vh - 180px) }
.scores-breadcrumbs { display:flex; flex-wrap:wrap; gap:8px 24px; margin-bottom:24px; font-size:12px; color:var(--muted) }
.scores-breadcrumbs a { display:inline-flex; align-items:center; min-height:32px }
.scores-watch { color:var(--muted); font-size:12px }
.scores-filters { margin-bottom:20px; overflow:hidden }
.scores-filter-fields { display:grid; grid-template-columns:1fr 1.45fr 1fr 1.5fr auto; gap:14px; padding:20px; align-items:end }
.scores-field { display:flex; flex-direction:column; gap:7px; min-width:0 }
.scores-field>span { font-size:11px; font-weight:700; color:var(--muted) }
.scores-field select,.scores-field input { width:100%; min-width:0; height:44px; padding:0 12px; border:1px solid var(--line); border-radius:8px; background:var(--panel); color:var(--text); font-size:13px }
.scores-field input::placeholder { color:var(--muted); opacity:1 }
.scores-apply { min-height:44px; padding:10px 16px; border-radius:8px; background:#c91f2d; color:#fff; font-size:12px; font-weight:700; white-space:nowrap }
.scores-apply:hover { background:#ad1a27 }
.scores-apply span { margin-left:12px }
.scores-dates { position:relative; display:flex; overflow-x:auto; scrollbar-width:thin; border-top:1px solid var(--line); background:var(--hover); padding:0 10px }
.scores-dates a { flex:1; min-width:88px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px; padding:13px 10px 11px; border-bottom:3px solid transparent; color:var(--muted) }
.scores-dates a span { font-size:10px; text-transform:uppercase; letter-spacing:.8px }
.scores-dates a strong { font-size:13px; font-weight:400 }
.scores-dates a[aria-current] { border-color:var(--red); background:var(--panel); color:var(--text) }
.scores-dates a[aria-current] strong { font-weight:700 }
.scores-dates a:hover { color:var(--link) }
.scores-dates a:focus-visible { outline-offset:-4px }
.scores-toolbar { display:flex; justify-content:space-between; align-items:center; gap:16px; margin-bottom:28px }
.scores-statuses { display:flex; gap:8px; flex-wrap:wrap }
.scores-statuses a { display:inline-flex; gap:6px; align-items:center; justify-content:center; min-height:40px; padding:8px 16px; border-radius:22px; background:var(--soft); border:1px solid transparent; color:var(--muted); font-size:12px; font-weight:700 }
.scores-statuses a[aria-current] { color:var(--text); border-color:var(--line); background:var(--panel) }
.scores-statuses a:hover { color:var(--link) }
.scores-page .refresh-group { display:flex; align-items:center; gap:10px }
.scores-page .refresh-group .icon-button { display:grid; place-items:center; width:44px; height:44px }
.scores-timezone { font-size:11px; color:var(--muted) }
.scores-results-heading h2:focus { outline:none }
.scores-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px }
.scores-grid .score-card { padding:18px; align-self:start }
.scores-grid .score-meta { margin-bottom:15px }
.scores-grid .team-row { min-height:41px }
.scores-team { display:flex; align-items:center; gap:6px; flex-wrap:wrap; min-width:0 }
.scores-record { background:var(--soft); color:var(--muted); padding:2px 6px; border-radius:6px; font-size:10px; white-space:nowrap }
.scores-grid .team-score { flex-shrink:0; min-width:24px; text-align:right; font-size:21px }
.scores-description { margin-top:12px; color:var(--muted); font-size:11px; overflow-wrap:anywhere }
.scores-details-link { color:var(--text); white-space:nowrap; font-weight:700 }
.scores-details-link>span { margin-left:7px; color:var(--red) }
.scores-last-update { margin-top:9px; color:var(--muted); font-size:10px; overflow-wrap:anywhere }
.scores-empty { min-height:240px }
.scores-is-loading { overflow:hidden }
.scores-loading { width:min(320px,calc(100% - 32px)); max-height:calc(100dvh - 32px); overflow:auto; padding:24px; border:1px solid var(--line); border-radius:10px; background:var(--panel); color:var(--text); box-shadow:0 20px 70px #0005; text-align:center }
.scores-loading::backdrop { background:#0008 }
.scores-loading h2 { margin:0; font-size:17px; font-weight:600 }
.scores-powered-by { margin-top:12px; color:var(--muted); font-size:12px }
.scores-sponsor { display:grid; place-items:center; width:min(224px,100%); min-height:60px; margin:12px auto; padding:4px; border-radius:6px; background:#fff; color:#182329 }
.scores-sponsor img { display:block; width:100%; height:auto; aspect-ratio:216/122; object-fit:contain }
.scores-spinner { display:block; width:36px; height:36px; margin:12px auto; border:3px solid var(--line); border-top-color:#ef3340; border-radius:50%; animation:scores-spin .8s linear infinite }
#scores-loading-message { margin:12px 0; color:var(--muted); font-size:12px }
#scores-cancel { min-height:40px; padding:8px 20px; border:1px solid var(--line); border-radius:8px; background:var(--soft); color:var(--text); font:inherit; font-size:12px }
.scores-load-error { padding:20px; margin-bottom:20px; display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; color:var(--text) }
.scores-load-error p { flex:1 1 240px }
.scores-no-script { padding:20px; margin-top:16px }
@keyframes scores-spin { to { transform:rotate(360deg) } }
@media(prefers-reduced-motion:reduce) { .scores-spinner { animation:none; border-style:dotted } }
@media(max-width:1100px) {
    .scores-filter-fields { grid-template-columns:1fr 1.4fr 1fr }
    .scores-search { grid-column:span 2 }
    .scores-grid { grid-template-columns:repeat(2,minmax(0,1fr)) }
}
@media(max-width:600px) {
    .scores-page .dashboard-heading { align-items:flex-start }
    .scores-watch { min-height:44px; gap:8px }
    .scores-filter-fields { grid-template-columns:1fr 1fr; padding:16px; gap:12px }
    .scores-search { grid-column:auto }
    .scores-apply { grid-column:1/-1 }
    .scores-toolbar { gap:8px; margin-bottom:22px }
    .scores-statuses { gap:5px }
    .scores-statuses a { padding:8px 11px; font-size:11px }
    .scores-grid { grid-template-columns:1fr; gap:12px }
    .scores-results-heading { flex-wrap:wrap; gap:5px }
    .scores-results-heading h2 { font-size:16px }
}
@media(max-width:360px) {
    .scores-filter-fields { grid-template-columns:1fr }
    .scores-toolbar { gap:6px }
    .scores-statuses { gap:4px }
    .scores-statuses a { padding:8px 6px; font-size:10px }
}