







































:root{
  



  --green:#2fc78e; --red:#f87171; --amber:#ffc24b; --grey:#8b95a1;
  --green-tint:rgba(47,199,142,.16); --red-tint:rgba(248,113,113,.16);
  --amber-tint:rgba(255,194,75,.14); --grey-tint:rgba(139,149,161,.14);
  --accent:#5b9dff; --accent-2:#b98cff; --focus:#5b9dff;
  



  --sep:#26282b;
  






  --container-bg:var(--hover); --row-bg:var(--surface-4);
  --head-bg:var(--surface-3);
  



  --info:#60a5fa; --info-tint:rgba(96,165,250,.14);
  --shadow:0 6px 24px rgba(0,0,0,.45);
  --shadow-lift:0 1px 0 rgba(255,255,255,.035) inset;
}




:root,
:root[data-theme="dark"],
:root[data-theme="graphite"]{
  --bg:#111417; --surface-1:#191c1f; --surface-2:#212428; --surface-3:#292c30;
  --surface-4:#34373b; --control-bg:#2e3135; --hover:#3d4044;
  --line:#373a3e; --line-strong:#4d5055;
  --text:#d7dadf; --muted:#989ca0; --faint:#7e8186;
}
:root[data-theme="neutral"]{
  --bg:#131313; --surface-1:#1b1b1b; --surface-2:#242424; --surface-3:#2c2c2c;
  --surface-4:#373737; --control-bg:#313131; --hover:#404040;
  --line:#3a3a3a; --line-strong:#505050;
  --text:#dadada; --muted:#9b9b9b; --faint:#818181;
}
:root[data-theme="charcoal"]{
  --bg:#16181a; --surface-1:#1e2023; --surface-2:#27292c; --surface-3:#303235;
  --surface-4:#3c3e41; --control-bg:#35373a; --hover:#45484b;
  --line:#3f4144; --line-strong:#57595c;
  --text:#d7dade; --muted:#999b9f; --faint:#7f8185;
}
:root[data-theme="obsidian"]{
  --bg:#0b0e13; --surface-1:#14171b; --surface-2:#1b1e22; --surface-3:#22252a;
  --surface-4:#2b2e33; --control-bg:#26292e; --hover:#33363b;
  --line:#2e3136; --line-strong:#414449;
  --text:#d6dae1; --muted:#979ba2; --faint:#7e8187;
}
:root[data-theme="carbon"]{
  --bg:#131516; --surface-1:#1a1b1d; --surface-2:#212224; --surface-3:#28292b;
  --surface-4:#313334; --control-bg:#2c2d2f; --hover:#393a3c;
  --line:#343537; --line-strong:#464849;
  --text:#d8dadc; --muted:#9a9b9d; --faint:#808183;
}
:root[data-theme="gunmetal"]{
  --bg:#10161d; --surface-1:#181f25; --surface-2:#21272e; --surface-3:#2a3138;
  --surface-4:#353c44; --control-bg:#2f353d; --hover:#3f464e;
  --line:#383f47; --line-strong:#50575f;
  --text:#d2dbe5; --muted:#949ca5; --faint:#7a828b;
}


:root[data-theme="tiger"]{
  --bg:#0a0a0a; --surface-1:#101011; --surface-2:#151517; --surface-3:#121212;
  --surface-4:#1b1b1e; --control-bg:#0f0f0f; --hover:#1f1f1f;
  --line:#242424; --line-strong:#3a3a3a;
  --text:#e5e7eb; --muted:#9ca3af; --faint:#6b6b6b;
  --green:#34d399; --red:#f87171; --amber:#fbbf24; --grey:#6b6b6b;
  --green-tint:rgba(52,211,153,.14); --red-tint:rgba(248,113,113,.14);
  --amber-tint:rgba(251,191,36,.14); --grey-tint:rgba(107,107,107,.14);
  --accent:#9ca3af; --accent-2:#9ca3af; --focus:#9ca3af;
  --shadow:0 6px 24px rgba(0,0,0,.45);
  --shadow-lift:0 1px 0 rgba(255,255,255,.035) inset;
}







:root[data-theme="dragon"]{
  --bg:#1e0b07; --surface-1:#25110d; --surface-2:#2b1713; --surface-3:#321d19;
  --surface-4:#3a2521; --control-bg:#36201c; --hover:#412b27;
  --line:#402a26; --line-strong:#4e3732;
  --text:#f0d2cc; --muted:#af948e; --faint:#957a75;
  --green:#3ee08a; --red:#ff7a6b; --amber:#ffb057; --grey:#957a75;
  --green-tint:rgba(62,224,138,.14); --red-tint:rgba(255,122,107,.14);
  --amber-tint:rgba(255,176,87,.14); --grey-tint:rgba(149,122,117,.14);
  --accent:#ff8a4c; --accent-2:#ffb057; --focus:#ff8a4c;
  --shadow:0 6px 24px rgba(0,0,0,.5);
  --shadow-lift:0 1px 0 rgba(255,190,150,.05) inset;
}




:root[data-theme="abyss"]{
  --bg:#0a0c12; --surface-1:#12151b; --surface-2:#181b22; --surface-3:#1f2229;
  --surface-4:#272a31; --control-bg:#22252c; --hover:#2e3138;
  --line:#2b2e36; --line-strong:#3a3d45;
  --text:#d6dae4; --muted:#979ba4; --faint:#7d818a;
  --green:#34d399; --red:#f87171; --amber:#fbbf24; --grey:#7d818a;
  --green-tint:rgba(52,211,153,.14); --red-tint:rgba(248,113,113,.14);
  --amber-tint:rgba(251,191,36,.14); --grey-tint:rgba(125,129,138,.14);
  --accent:#8b93b8; --accent-2:#9aa3c9; --focus:#8b93b8;
  --shadow:0 6px 24px rgba(0,0,0,.55);
  --shadow-lift:0 1px 0 rgba(160,170,255,.05) inset;
}
:root[data-theme="slate"]{
  --bg:#171a1e; --surface-1:#1e2227; --surface-2:#24292f; --surface-3:#2a3037;
  --surface-4:#323942; --control-bg:#2b323a; --hover:#37404a;
  --line:#39424c; --line-strong:#4a5560;
  --text:#eceff3; --muted:#adb6c0; --faint:#8892a0;
  --green:#3ddc97; --red:#ff7a7a; --amber:#ffc24b; --grey:#8b95a1;
  --green-tint:rgba(61,220,151,.14); --red-tint:rgba(255,122,122,.14);
  --amber-tint:rgba(255,194,75,.14); --grey-tint:rgba(139,149,161,.14);
  --accent:#5b9dff; --accent-2:#b98cff; --focus:#5b9dff;
  --shadow:0 6px 24px rgba(0,0,0,.45);
  --shadow-lift:0 1px 0 rgba(255,255,255,.035) inset;
}




:root[data-theme="light"],
:root[data-theme="paper"]{
  --bg:#f1f2f4; --surface-1:#f7f8fa; --surface-2:#fbfcfd; --surface-3:#ffffff;
  --surface-4:#ffffff; --control-bg:#ffffff; --hover:#e9ebee;
  --line:#e2e4e8; --line-strong:#c6c9cf;
  --text:#1f2328; --muted:#5c636d; --faint:#6f7277;
  



  --green:#047857; --red:#b91c1c; --amber:#b45309; --grey:#9ca3af;
  --green-tint:rgba(4,120,87,.12); --red-tint:rgba(185,28,28,.12);
  --amber-tint:rgba(180,83,9,.12); --grey-tint:rgba(156,163,175,.14);
  --accent:#2563eb; --accent-2:#7c3aed; --focus:#2563eb;
  --info:#1d4ed8; --info-tint:rgba(29,78,216,.12);
  
  --sep:#ced1d6;
  
  --container-bg:var(--surface-3); --row-bg:var(--surface-1);
  

  --head-bg:var(--hover);
  --shadow:0 1px 2px rgba(0,0,0,.06),0 6px 20px rgba(0,0,0,.07);
  --shadow-lift:0 1px 0 rgba(0,0,0,.02) inset;
}











:root:not([data-theme="light"]):not([data-theme="paper"]){color-scheme:dark}
:root[data-theme="light"],:root[data-theme="paper"]{color-scheme:light}




option,optgroup{background:var(--surface-4);color:var(--text)}





:root{
  --r:12px; --r-lg:14px; --r-sm:10px;
  --pad:clamp(12px,1.4vw,18px);
  --t:140ms ease;
  

  --on-accent:#fff;
  --font:var(--wt-font),-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Arial,sans-serif;
  --accent-soccer:#4ade80; --accent-baseball:#60a5fa; --accent-football:#f59e0b;
  --accent-basketball:#f472b6; --accent-hockey:#22d3ee; --accent-neutral:#94a3b8;
}




:root[data-theme="light"],
:root[data-theme="paper"]{
  --accent-soccer:#047857; --accent-baseball:#1d4ed8; --accent-football:#b45309;
  --accent-basketball:#be185d; --accent-hockey:#0e7490; --accent-neutral:#475569;
}

*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--text)}
body{font:15px/1.5 var(--font);-webkit-font-smoothing:antialiased}
h1{font-size:24px;line-height:1.25;margin:0 0 8px}
h2{font-size:19px;line-height:1.25;margin:0 0 8px}
h3{font-size:16px;margin:0 0 8px}
a{color:var(--accent)}
table{border-collapse:collapse;width:100%;font-variant-numeric:tabular-nums}
th,td{padding:9px 10px;text-align:left;border-bottom:1px solid var(--line)}
th{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.06em;
   position:sticky;top:0;background:var(--surface-3)}
tbody tr:hover{background:var(--hover)}
:focus-visible{outline:2px solid var(--focus);outline-offset:2px}


.card{background:var(--surface-3);border:1px solid var(--line);border-radius:var(--r-lg);
      padding:var(--pad)}






.card:has(.card){background:var(--surface-2)}










.card .stat{background:var(--container-bg);background-image:none;border-color:var(--line)}
.card.raised{background:var(--surface-4);box-shadow:var(--shadow)}

















.scores-page .container > .card{background:var(--surface-2)}
.scores-page .game-card{background:var(--container-bg)}
.scores-page .card .game-head{background:var(--head-bg)}














.season-page{--future-ring:color-mix(in srgb,var(--text) 60%,transparent)}
:root[data-theme="light"] .season-page,
:root[data-theme="paper"] .season-page{--future-ring:var(--line-strong)}
:root .season-page .game-tile.F{border-color:var(--future-ring);opacity:1}
:root .season-page .legend .swatch.F{background:var(--row-bg);
  border:2px solid var(--future-ring);opacity:1}

.section{background:var(--surface-2);border:1px solid var(--line);border-radius:var(--r-lg);
         padding:var(--pad);display:grid;gap:12px}






























.stat{position:relative;min-width:0;
      background-color:var(--surface-3);
      background-image:linear-gradient(180deg,
        color-mix(in srgb,var(--surface-4) 58%,var(--surface-3)) 0%,
        var(--surface-3) 62%);
      border:1px solid var(--line);
      border-left:3px solid var(--rail,var(--line-strong));
      border-radius:var(--r-lg);
      padding:calc(var(--pad) * .82) calc(var(--pad) * .9) calc(var(--pad) * .88);
      box-shadow:var(--shadow-lift),inset 2px 0 8px -4px var(--rail-glow,transparent);
      transition:border-color var(--t),box-shadow var(--t),transform var(--t)}
.stat:hover{border-color:var(--line-strong);
      border-left-color:var(--rail,var(--line-strong));
      box-shadow:var(--shadow-lift),inset 2px 0 8px -4px var(--rail-glow,transparent),var(--shadow);
      transform:translateY(-1px)}
.stat:has(.v.pos),.stat.won{--rail:var(--green);--rail-glow:var(--green-tint)}
.stat:has(.v.neg),.stat.lost{--rail:var(--red);--rail-glow:var(--red-tint)}
.stat:has(.v.zero),.stat.push{--rail:var(--grey)}
.stat.pending{--rail:var(--amber);--rail-glow:var(--amber-tint)}
.stat .k{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.stat .v{font-size:clamp(21px,1.5vw + .5rem,30px);font-weight:800;line-height:1.1;
      margin-top:6px;font-variant-numeric:tabular-nums;letter-spacing:-.01em;
      white-space:nowrap;word-break:keep-all}
.stat .sub{font-size:11px;line-height:1.35;margin-top:3px;color:var(--muted)}


.stat.hero .v{font-size:clamp(22px,1.9vw + .5rem,34px)}
.stat .spark{display:block;width:100%;height:26px;margin-top:8px;opacity:.9}
.btn{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);
     background:var(--control-bg);color:var(--text);padding:8px 12px;border-radius:var(--r-sm);
     font:600 13px var(--font);cursor:pointer;transition:background var(--t),border-color var(--t)}
.btn:hover{background:var(--hover);border-color:var(--line-strong)}
.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
input,select,textarea{width:100%;padding:9px 10px;border:1px solid var(--line);
  border-radius:var(--r-sm);background:var(--control-bg);color:var(--text);font-size:14px}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--focus);
  box-shadow:0 0 0 3px color-mix(in srgb,var(--focus) 22%,transparent)}
label{font-size:12px;color:var(--muted);display:block;margin-bottom:6px}
.pill{display:inline-flex;align-items:center;gap:5px;padding:2px 9px;border-radius:999px;
      font-size:12px;font-weight:600;border:1px solid var(--line);color:var(--muted);
      background:var(--grey-tint)}
.pill-result.won{background:var(--green-tint);color:var(--green)}
.pill-result.lost{background:var(--red-tint);color:var(--red)}
.pill-result.push,.pill-result.void{background:var(--grey-tint);color:var(--muted)}
.pill-result.pending{background:var(--amber-tint);color:var(--amber)}
.pill-result.building{background:var(--amber-tint);color:var(--amber)}
.pill-result.locked{background:var(--grey-tint);color:var(--muted)}
.pill-result.live{background:var(--grey-tint);color:var(--accent);
  background:color-mix(in srgb,var(--accent) 16%,transparent)}
.pos{color:var(--green)} .neg{color:var(--red)} .zero{color:var(--muted)}
.dot{width:9px;height:9px;border-radius:50%;display:inline-block;background:var(--accent-neutral)}
.dot.soccer{background:var(--accent-soccer)} .dot.baseball{background:var(--accent-baseball)}
.dot.football{background:var(--accent-football)} .dot.basketball{background:var(--accent-basketball)}
.dot.hockey{background:var(--accent-hockey)}
.sig-note{font-size:11px;color:var(--muted);flex:0 1 auto}
.sw{width:10px;height:10px;border-radius:3px;display:inline-block}


body.ops{display:grid;grid-template-columns:220px 1fr;min-height:100vh}
.ops-rail{background:var(--surface-1);border-right:1px solid var(--line);padding:16px;
          display:flex;flex-direction:column;gap:10px}
.ops-rail strong{font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.ops-rail nav{display:flex;flex-direction:column;gap:4px}
.ops-rail nav button{text-align:left;background:none;border:none;color:var(--text);
  font:600 13px var(--font);padding:8px 10px;border-radius:var(--r-sm);cursor:pointer}
.ops-rail nav button:hover{background:var(--hover)}
.ops-main{padding:var(--pad);display:grid;gap:12px;align-content:start}
pre{background:var(--surface-2);border:1px solid var(--line);border-radius:var(--r-sm);
    padding:12px;overflow:auto;font-size:12px}
@media (max-width:820px){
  body.ops{grid-template-columns:1fr}
  .ops-rail{flex-direction:row;align-items:center;overflow-x:auto;border-right:none;
            border-bottom:1px solid var(--line)}
  .ops-rail nav{flex-direction:row}
}
@media (prefers-reduced-motion:reduce){
  *{transition:none !important}
  
  .stat:hover{transform:none}
}

