:root { color-scheme:dark; font:16px/1.5 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; color:#edf2fa; background:#080e1a; }
* { box-sizing:border-box; }
[hidden] { display:none!important; }
body { margin:0; }
button,input,select { font:inherit; }
button,a,input { -webkit-tap-highlight-color:transparent; }
button { cursor:pointer; border:1px solid #3b4b63; border-radius:8px; padding:10px 16px; background:#182338; color:#edf2fa; font-size:14px; font-weight:600; }
button:hover { background:#24344e; }
button:disabled { cursor:default; opacity:.45; }
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,.table-wrap:focus-visible { outline:3px solid #73efb0; outline-offset:4px; }
a { color:inherit; text-underline-offset:4px; }
.top-bar { min-height:76px; display:flex; align-items:center; justify-content:space-between; gap:18px; padding:14px max(24px,calc((100vw - 1120px)/2)); background:#080d1b; color:white; }
.brand { display:flex; align-items:center; gap:12px; text-decoration:none; font-weight:750; font-size:18px; white-space:nowrap; }
.brand img { object-fit:contain; border-radius:5px; }
nav { display:flex; align-items:center; gap:18px; font-size:14px; }
nav button { background:transparent; color:white; border-color:#576174; }
nav button:hover { background:#26334b; }
main { max-width:1120px; padding:42px 24px 48px; margin:auto; }
.eyebrow { margin:0 0 8px; color:#a9b7cc; font-size:11px; letter-spacing:.14em; font-weight:750; }
h1 { margin:0; font-size:clamp(28px,5vw,40px); letter-spacing:-.04em; line-height:1.2; }
h2 { margin:0 0 10px; font-size:22px; line-height:1.3; }
.intro { margin:12px 0 28px; color:#a9b7cc; }
.status { color:#a9b7cc; margin:16px 0; }
.sign-in { max-width:480px; padding:28px; border:1px solid #31415a; border-radius:12px; background:#111b2c; }
.sign-in > p { color:#a9b7cc; font-size:14px; }
label { display:block; margin-top:16px; font-size:14px; font-weight:600; }
input:not([type="checkbox"]) { display:block; margin-top:6px; padding:11px 12px; width:100%; min-width:0; border:1px solid #4a5b75; border-radius:7px; background:#080f1d; color:#edf2fa; font-size:16px; }
.remember { display:flex; align-items:center; gap:9px; font-weight:400; font-size:13px; }
.remember input { width:17px; height:17px; accent-color:#73efb0; }
.primary { margin-top:22px; color:#082216; background:#73efb0; border-color:#73efb0; width:100%; }
.primary:hover { background:#9af5c6; }
.error { color:#ffc0c4; padding:12px 14px; border:1px solid #854249; background:#351b25; border-radius:8px; font-size:14px; }
.scores-toolbar { display:flex; align-items:center; justify-content:space-between; gap:16px; margin:0 0 16px; }
.view-tools { display:flex; align-items:center; flex-wrap:wrap; gap:10px 12px; }
.view-label { margin:0; font-size:13px; }
select { max-width:100%; padding:9px 32px 9px 12px; border:1px solid #3b4b63; border-radius:8px; background:#182338; color:#edf2fa; font-size:14px; }
.view-tools .totals { flex-basis:100%; }
.score-notice { color:#82efb8; font-size:14px; }
.totals { margin:0; color:#a9b7cc; font-size:14px; }
.table-wrap { overflow-x:auto; border:1px solid #31415a; border-radius:10px; background:#111b2c; }
table { width:100%; min-width:740px; border-collapse:collapse; font-size:14px; }
th,td { padding:16px 18px; text-align:left; border-bottom:1px solid #28364b; }
th { color:#b7c5da; background:#1a283e; font-size:12px; font-weight:700; }
td { overflow-wrap:anywhere; }
th:first-child,td:first-child { width:76px; text-align:center; color:#a9b7cc; }
th:nth-child(2) { width:32%; }
td:nth-child(2) { font-weight:650; }
td:nth-child(3) { color:#82efb8; font-weight:750; }
th:last-child,td:last-child { white-space:nowrap; }
.number { text-align:right; white-space:nowrap; font-variant-numeric:tabular-nums; }
tbody tr:last-child td { border-bottom:0; }
tbody tr:hover { background:#1a2940; }
.empty { padding:30px 20px; text-align:center; color:#a9b7cc; }
.paging { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:18px; }
.paging p { margin:0; color:#a9b7cc; font-size:13px; text-align:center; }
.updated,.footnote { font-size:12px; color:#a9b7cc; margin:16px 0 0; }
.footnote { margin-top:6px; }
.delete-score { padding:7px 12px; border-color:#86444d; background:#301d2a; color:#ffc0c4; }
.delete-score:hover { background:#512635; }
dialog { width:min(480px,calc(100vw - 32px)); max-height:calc(100dvh - 32px); padding:28px; border:1px solid #4a5b75; border-radius:12px; background:#111b2c; color:#edf2fa; }
dialog::backdrop { background:#030712c9; }
dialog p { overflow-wrap:anywhere; }
#delete-help { color:#a9b7cc; font-size:14px; }
.dialog-actions { display:flex; justify-content:flex-end; flex-wrap:wrap; gap:12px; margin-top:24px; }
.danger { background:#a33545; border-color:#c65868; color:white; }
.danger:hover { background:#ba3f51; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
@media(max-width:520px) { .top-bar { padding:12px 16px; flex-wrap:wrap; gap:12px; } .brand { font-size:16px; gap:8px; } nav { gap:12px; font-size:13px; } nav button { padding:7px 10px; } main { padding:30px 16px; } .sign-in { padding:22px; } .scores-toolbar { align-items:flex-start; } .scores-toolbar button { flex:none; padding:9px 11px; } }