
/* ============ tokens: midnight default ============ */
:root{
  color-scheme: dark;
  --bg:#060B18;
  --glow-1:rgba(77,141,255,.17);
  --glow-2:rgba(154,132,255,.14);
  --surface:#0C1630;
  --surface-2:#12203E;
  --surface-3:#1A2B4F;
  --glass:rgba(13,24,48,.78);
  --line:rgba(150,175,230,.12);
  --line-2:rgba(150,175,230,.24);
  --ink:#EEF2FF;
  --ink-2:#BAC6E1;
  --muted:#8293B6;
  --faint:#56678A;
  --blue:#4D8DFF;
  --blue-2:#8DB6FF;
  --violet:#A08BFF;
  --book:#E6EBF7;
  --win:#3AD49C;
  --loss:#FF6E84;
  --warn:#F6B84E;
  --pending:#7889AD;
  --hero-1:#13285A;
  --hero-2:#1D1E58;
  --hero-3:#2A1A5E;
  --hero-ink:#F3F6FF;
  --hero-muted:#AFBCE0;
  --shadow:0 18px 48px rgba(0,0,0,.38);
  --r:20px;
  --r-sm:12px;
  --display:"Barlow Condensed","Arial Narrow","Roboto Condensed",sans-serif;
  --body:"Instrument Sans","Segoe UI",system-ui,-apple-system,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,"SF Mono",Menlo,monospace;
  --rail:236px;
}
:root[data-theme="light"]{
  color-scheme: light;
  --bg:#EDF1F9;
  --glow-1:rgba(77,141,255,.16);
  --glow-2:rgba(154,132,255,.12);
  --surface:#FFFFFF;
  --surface-2:#F3F6FC;
  --surface-3:#E4EAF6;
  --glass:rgba(255,255,255,.86);
  --line:rgba(25,45,95,.10);
  --line-2:rgba(25,45,95,.20);
  --ink:#0B1533;
  --ink-2:#34446A;
  --muted:#5F6E91;
  --faint:#94A1BD;
  --blue:#2F6BEA;
  --blue-2:#2459C9;
  --violet:#6B53EE;
  --book:#1C2440;
  --win:#0E9466;
  --loss:#D7344F;
  --warn:#B9770E;
  --pending:#7A88A8;
  --hero-1:#D9E6FF;
  --hero-2:#E3E0FF;
  --hero-3:#EBDDFF;
  --hero-ink:#0B1533;
  --hero-muted:#46557A;
  --shadow:0 14px 36px rgba(30,50,110,.12);
}

/* ============ base ============ */
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;min-height:100%;
  background:
    radial-gradient(60rem 30rem at 10% -8%, var(--glow-1), transparent 70%),
    radial-gradient(50rem 28rem at 95% 0%, var(--glow-2), transparent 70%),
    var(--bg);
  background-color:var(--bg);
  background-attachment:fixed;
  color:var(--ink);
  font:15px/1.45 var(--body);
  -webkit-font-smoothing:antialiased;
}
button{font:inherit;color:inherit;cursor:pointer}
a{color:inherit}
img{max-width:100%}
h1,h2,h3,p{margin:0}
h1,h2,h3{text-wrap:balance}
.num,.tab{font-variant-numeric:tabular-nums}
:focus-visible{outline:2px solid var(--blue-2);outline-offset:3px;border-radius:8px}
[hidden]{display:none!important}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* ============ shell ============ */
.topbar{
  position:sticky;top:0;z-index:40;
  padding:calc(env(safe-area-inset-top,0px) + 10px) 16px 10px;
  display:flex;align-items:center;gap:10px;
  background:linear-gradient(var(--bg),color-mix(in srgb,var(--bg) 82%,transparent));
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line);
}
.brand{display:flex;align-items:center;gap:9px;text-decoration:none;min-width:0}
.mark{
  width:30px;height:30px;border-radius:9px;flex:none;display:grid;place-items:center;
  background:linear-gradient(135deg,var(--blue),var(--violet));
  color:#fff;font:700 15px/1 var(--display);letter-spacing:.02em;
  box-shadow:0 6px 18px rgba(77,141,255,.35);
}
.brand b{font:700 21px/1 var(--display);letter-spacing:.01em}
.week-pill{
  font:600 12px/1 var(--body);padding:6px 9px;border-radius:999px;
  background:var(--surface-2);border:1px solid var(--line);color:var(--ink-2);white-space:nowrap;
}
.spacer{flex:1}
.health{display:flex;align-items:center;gap:7px;background:none;border:0;padding:4px;color:var(--ink-2);font-size:12px}
.dot{width:10px;height:10px;border-radius:50%;flex:none;background:var(--pending)}
.dot.ok{background:var(--win);box-shadow:0 0 0 4px color-mix(in srgb,var(--win) 20%,transparent)}
.dot.attn{background:var(--warn);box-shadow:0 0 0 4px color-mix(in srgb,var(--warn) 22%,transparent);animation:pulse 2.4s ease-in-out infinite}
.dot.down{background:var(--loss)}
@keyframes pulse{50%{box-shadow:0 0 0 7px color-mix(in srgb,var(--warn) 6%,transparent)}}
.icon-btn{width:34px;height:34px;border-radius:10px;border:1px solid var(--line);background:var(--surface);display:grid;place-items:center;flex:none}
.icon-btn svg{width:17px;height:17px}

.rail{display:none}
.tabbar{
  position:fixed;left:0;right:0;bottom:0;z-index:50;
  display:grid;grid-template-columns:repeat(6,1fr);
  padding:6px 6px calc(env(safe-area-inset-bottom,0px) + 6px);
  background:color-mix(in srgb,var(--bg) 88%,transparent);
  backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
  border-top:1px solid var(--line);
}
.tabbar a{
  display:flex;flex-direction:column;align-items:center;gap:3px;padding:6px 0 4px;
  text-decoration:none;color:var(--muted);font-size:10.5px;font-weight:600;letter-spacing:.01em;border-radius:12px;
}
.tabbar a svg{width:22px;height:22px}
.tabbar a[aria-current="page"]{color:var(--ink)}
.tabbar a[aria-current="page"] svg{color:var(--blue-2)}

main{padding:14px 16px 110px;max-width:1180px;margin:0 auto}
.page{display:grid;gap:22px;animation:enter .42s cubic-bezier(.2,.8,.2,1)}
@keyframes enter{from{transform:translateY(10px);opacity:.35}to{transform:none;opacity:1}}

.snap{font:500 11px/1.3 var(--mono);color:var(--muted);letter-spacing:.01em}
.page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;flex-wrap:wrap}
.page-head h1{font:700 34px/1 var(--display);letter-spacing:.005em;text-transform:uppercase}
.eyebrow{font:700 11px/1 var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.tier{display:grid;gap:12px}
.tier-h{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
.tier-h h2{font:700 21px/1.1 var(--display);text-transform:uppercase;letter-spacing:.02em}
.tier-h .aside{font-size:12px;color:var(--muted)}

/* ============ cards ============ */
.card{
  background:var(--surface);border:1px solid var(--line);border-radius:var(--r);
  padding:16px;min-width:0;position:relative;
}
.card.flat{background:var(--surface-2)}
.hero{
  border-radius:24px;padding:18px;position:relative;overflow:hidden;color:var(--hero-ink);
  background:
    radial-gradient(28rem 14rem at 100% 0%, color-mix(in srgb,var(--violet) 34%,transparent), transparent 70%),
    linear-gradient(140deg,var(--hero-1),var(--hero-2) 55%,var(--hero-3));
  border:1px solid color-mix(in srgb,var(--blue-2) 22%,transparent);
  box-shadow:var(--shadow);
}
.hero .muted{color:var(--hero-muted)}
.hero::after{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.5;
  background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
  background-size:26px 26px;mask-image:linear-gradient(160deg,#000,transparent 60%);
}
.hero > *{position:relative;z-index:1}
.grid{display:grid;gap:12px}
.page > *,.tier > *,.grid > *,.split > *,details.ev .body > *{min-width:0}
.split{display:grid;gap:12px}
.g2,.g3,.g4{grid-template-columns:1fr}
.muted{color:var(--muted)}
.ink2{color:var(--ink-2)}
.small{font-size:12.5px}
.tiny{font-size:11px}
.big{font:700 56px/.9 var(--display);letter-spacing:-.005em}
.mid{font:700 34px/.95 var(--display)}
.kpis{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.kpi{padding:10px 12px;border-radius:14px;background:color-mix(in srgb,var(--surface) 55%,transparent);border:1px solid var(--line);min-width:0}
.hero .kpi{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.10)}
:root[data-theme="light"] .hero .kpi{background:rgba(255,255,255,.55);border-color:rgba(20,40,90,.08)}
.kpi .l{font-size:11px;color:var(--muted);font-weight:600;letter-spacing:.04em;text-transform:uppercase}
.hero .kpi .l{color:var(--hero-muted)}
.kpi .v{font:700 24px/1.05 var(--display);margin-top:3px}
.kpi .s{font-size:11.5px;color:var(--muted)}
.hero .kpi .s{color:var(--hero-muted)}

.chip{
  display:inline-flex;align-items:center;gap:5px;padding:4px 9px;border-radius:999px;
  font:600 11.5px/1.2 var(--body);background:var(--surface-2);border:1px solid var(--line);color:var(--ink-2);white-space:nowrap;
}
.chip.edge{background:linear-gradient(120deg,color-mix(in srgb,var(--blue) 26%,transparent),color-mix(in srgb,var(--violet) 26%,transparent));border-color:color-mix(in srgb,var(--violet) 40%,transparent);color:var(--ink)}
.chip.win{color:var(--win);background:color-mix(in srgb,var(--win) 13%,transparent);border-color:color-mix(in srgb,var(--win) 30%,transparent)}
.chip.loss{color:var(--loss);background:color-mix(in srgb,var(--loss) 12%,transparent);border-color:color-mix(in srgb,var(--loss) 30%,transparent)}
.chip.warn{color:var(--warn);background:color-mix(in srgb,var(--warn) 12%,transparent);border-color:color-mix(in srgb,var(--warn) 32%,transparent)}
.chip.coming{color:var(--muted);background:transparent;border-style:dashed}
.chip.bt{color:var(--ink-2);background:transparent;border-style:dashed;border-color:var(--line-2)}
.chip.wh{color:var(--book);background:color-mix(in srgb,var(--book) 8%,transparent);border-color:color-mix(in srgb,var(--book) 22%,transparent)}
.pos{color:var(--win)}
.neg{color:var(--loss)}
.coming-txt{color:var(--muted);font-style:italic}

/* segmented */
.seg{display:inline-flex;padding:3px;border-radius:12px;background:var(--surface-2);border:1px solid var(--line);gap:2px;max-width:100%;overflow-x:auto;scrollbar-width:none}
.hero .seg{background:rgba(0,0,0,.18);border-color:rgba(255,255,255,.1)}
:root[data-theme="light"] .hero .seg{background:rgba(255,255,255,.5);border-color:rgba(20,40,90,.08)}
.seg button{border:0;background:none;padding:7px 11px;border-radius:9px;font-size:12.5px;font-weight:600;color:var(--muted);white-space:nowrap}
.hero .seg button{color:var(--hero-muted)}
.seg button[aria-pressed="true"]{background:var(--surface-3);color:var(--ink);box-shadow:0 2px 8px rgba(0,0,0,.18)}
.hero .seg button[aria-pressed="true"]{background:rgba(255,255,255,.14);color:var(--hero-ink)}
:root[data-theme="light"] .hero .seg button[aria-pressed="true"]{background:#fff}

/* disclosure = evidence tier */
details.ev{border:1px solid var(--line);border-radius:var(--r-sm);background:color-mix(in srgb,var(--surface) 60%,transparent)}
details.ev > summary{list-style:none;cursor:pointer;padding:11px 14px;display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:13px;font-weight:600;color:var(--ink-2)}
details.ev > summary::-webkit-details-marker{display:none}
details.ev > summary::after{content:"";width:8px;height:8px;border-right:2px solid var(--muted);border-bottom:2px solid var(--muted);transform:rotate(45deg) translateY(-2px);transition:transform .2s}
details.ev[open] > summary::after{transform:rotate(-135deg)}
details.ev .body{padding:0 14px 14px;display:grid;gap:10px}
.tbl-wrap{overflow-x:auto}
table.t{width:100%;border-collapse:collapse;font-size:12.5px}
table.t th{font-weight:600;color:var(--muted);text-align:left;padding:6px 8px;border-bottom:1px solid var(--line);white-space:nowrap}
table.t td{padding:7px 8px;border-bottom:1px solid var(--line);white-space:nowrap;font-variant-numeric:tabular-nums}
table.t td.r,table.t th.r{text-align:right}
.season-meta{margin:12px 0}.season-controls{display:flex;align-items:center;gap:9px;margin:14px 0;font-size:13px;font-weight:600}.season-controls select{background:var(--surface-2);color:var(--ink);border:1px solid var(--line);border-radius:9px;padding:8px;max-width:100%}.season-table-wrap{width:100%;overflow-x:auto}.season-table{min-width:490px}.season-table th button{border:0;background:none;color:inherit;font:inherit;padding:0;cursor:pointer}.season-table th:first-child,.season-table td:first-child{font-weight:700}.season-table td:nth-child(2){color:var(--blue)}.season-table td:nth-child(3){color:var(--violet)}.season-table td:nth-child(4){color:var(--book)}.season-odds{display:block;font-size:11px;color:var(--muted)}
.pb-meta{font-size:12px;color:var(--muted);margin:12px 0}.pb-scroll,.pb-table-wrap{width:100%;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}.pb-scroll{margin:14px 0}.pb-bracket{display:flex;gap:12px;width:max-content;min-height:380px;padding:3px 2px 12px}.pb-col{display:flex;flex-direction:column;justify-content:space-around;gap:12px;width:165px;flex:none}.pb-label{text-align:center;text-transform:uppercase;letter-spacing:.06em;font-size:10px;color:var(--muted)}.pb-game{border:1px solid var(--line);border-radius:12px;background:var(--surface);overflow:hidden}.pb-row{display:flex;align-items:center;gap:5px;padding:7px 6px;font-size:12px}.pb-row+.pb-row{border-top:1px solid var(--line)}.pb-row.win{background:var(--surface-2);font-weight:700}.pb-seed{width:17px;flex:none;text-align:center;color:var(--muted);font-size:10px}.pb-name{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.pb-pct{font-variant-numeric:tabular-nums}.pb-row.win .pb-pct{color:var(--blue)}.pb-center{align-items:center;text-align:center;width:190px;justify-content:center;gap:9px}.pb-center strong{font:800 30px/1 var(--display);color:var(--blue)}.pb-center>span{font-size:11px;color:var(--muted)}.pb-center .pb-game{width:100%;text-align:left}.tm.pb-large{width:72px;height:72px}.tm.pb-large b{font-size:22px}.pb-byes{display:flex;align-items:center;gap:5px;flex-wrap:wrap;font-size:12px;color:var(--muted)}.pb-standings{margin-top:20px}.pb-standings h2{font-size:18px}.pb-division{margin:16px 0}.pb-division h3{font-size:13px;margin:0 0 4px}.pb-table{width:100%;font-size:12px}.pb-table td:not(:first-child),.pb-table th:not(:first-child){text-align:right}.pb-team{display:inline-flex;align-items:center;gap:5px}.pb-seedtag{font-size:10px;color:var(--blue);font-weight:700}.pb-table small{color:var(--muted)}
@media(max-width:600px){.season-table{min-width:0;font-size:11px;table-layout:fixed}.season-table th,.season-table td{padding:7px 3px}.season-table th:first-child{width:48px}.season-table th:not(:first-child){width:calc((100% - 48px)/3)}.season-odds{font-size:10px}}

/* team badge */
.tm{
  --tc:#445;position:relative;flex:none;display:inline-grid;place-items:center;width:34px;height:34px;border-radius:50%;
  background:radial-gradient(circle at 32% 26%,color-mix(in srgb,var(--tc) 70%,#fff),var(--tc) 72%);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.18);
}
.tm b{font:700 12px/1 var(--display);letter-spacing:.03em;color:var(--tt,#fff)}
.tm img{position:absolute;inset:3px;width:calc(100% - 6px);height:calc(100% - 6px);object-fit:contain;opacity:0;transition:opacity .25s}
.tm.ok{background:radial-gradient(circle at 50% 40%,color-mix(in srgb,var(--tc) 30%,transparent),color-mix(in srgb,var(--tc) 12%,transparent))}
.tm.ok img{opacity:1}
.tm.ok b{opacity:0}
.tm.sm{width:24px;height:24px}
.tm.sm b{font-size:9px}
.tm.lg{width:46px;height:46px}
.tm.lg b{font-size:15px}
.pair{display:inline-flex;align-items:center}
.pair .tm + .tm{margin-left:-7px}

/* avatar */
.av{width:34px;height:34px;border-radius:50%;flex:none;position:relative;overflow:hidden;display:grid;place-items:center;background:var(--surface-3);font:700 12px/1 var(--display);color:var(--ink-2)}
.av img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0}
.av.ok img{opacity:1}

/* scroller (phone carousel) */
.rail-x{display:grid;grid-auto-flow:column;grid-auto-columns:86%;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:4px;margin:0 -16px;padding-inline:16px;scrollbar-width:none}
.rail-x > *{scroll-snap-align:start}
.rail-x::-webkit-scrollbar{display:none}

/* game card */
.game{display:grid;gap:12px;overflow:hidden}
.game::before{content:"";position:absolute;inset:0 0 auto 0;height:3px;background:linear-gradient(90deg,var(--ac),var(--hc));opacity:.85}
.game .top{display:flex;justify-content:space-between;align-items:center;gap:8px}
.teamrow{display:flex;align-items:center;gap:10px}
.teamrow .nm{font:600 15px/1.15 var(--body)}
.teamrow .nm small{display:block;font-size:11.5px;color:var(--muted);font-weight:500}
.teamrow .sc{margin-left:auto;font:700 26px/1 var(--display)}
.teamrow .sc.lose{color:var(--muted)}
.strip{display:grid;gap:6px}
.strip .lbl{display:flex;justify-content:space-between;font-size:11px;color:var(--muted);font-weight:600;letter-spacing:.05em;text-transform:uppercase}
.track{position:relative;height:26px}
.track .base{position:absolute;left:0;right:0;top:12px;height:2px;border-radius:2px;background:var(--line-2)}
.track .zero{position:absolute;top:5px;width:1px;height:16px;background:var(--faint)}
.track .band{position:absolute;top:8px;height:10px;border-radius:6px;background:color-mix(in srgb,var(--violet) 22%,transparent)}
.mk{position:absolute;top:13px;transform:translate(-50%,-50%)}
.mk.book{width:3px;height:22px;border-radius:2px;background:var(--book)}
.mk.ours{width:13px;height:13px;border-radius:50%;background:var(--blue);box-shadow:0 0 0 3px color-mix(in srgb,var(--blue) 30%,transparent)}
.mk.world{width:11px;height:11px;transform:translate(-50%,-50%) rotate(45deg);background:var(--violet)}
.mk.actual{width:4px;height:24px;border-radius:2px;background:var(--win)}
.legend{display:flex;flex-wrap:wrap;gap:4px 12px;font-size:12px;color:var(--ink-2)}
.legend i{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:5px;vertical-align:0}
.legend i.book{background:var(--book);border-radius:1px;width:3px;height:10px}
.legend i.ours{background:var(--blue)}
.legend i.world{background:var(--violet);border-radius:1px;transform:rotate(45deg)}
.legend i.actual{background:var(--win);border-radius:1px;width:3px;height:10px}
.wp{display:flex;height:8px;border-radius:6px;overflow:hidden;gap:2px}
.wp span{display:block;height:100%}
.game-results{width:100%;table-layout:fixed;border-collapse:collapse;font-size:11px;line-height:1.35}
.game-results th,.game-results td{padding:3px 1px;text-align:center;white-space:nowrap}
.game-results th{color:var(--muted);font-weight:500}
.game-results th:first-child{width:25%;text-align:left;white-space:normal}
.game-results tbody th{color:var(--ink-2)}
.game-results th small{display:block;font-size:9px;color:var(--muted)}
.game-results td{color:var(--muted);font-variant-numeric:tabular-nums}
.game-results td.result-correct{color:var(--win)}
.game-results td.result-wrong{color:color-mix(in srgb,var(--loss) 70%,var(--muted))}
.game-results td span{font-weight:800}

/* play card */
.play{display:grid;gap:10px}
.play .head{display:flex;align-items:center;gap:10px}
.play .pick{font:700 24px/1 var(--display);letter-spacing:.005em}
.play .meta{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.meter{height:6px;border-radius:4px;background:var(--surface-3);overflow:hidden}
.meter span{display:block;height:100%;border-radius:4px;background:linear-gradient(90deg,var(--blue),var(--violet));transform-origin:left;animation:grow .9s cubic-bezier(.2,.8,.2,1)}
@keyframes grow{from{transform:scaleX(.15)}}
.conf{display:flex;justify-content:space-between;font-size:12px;color:var(--muted)}
.conf b{color:var(--ink);font-weight:700}

/* roster */
.roster{display:grid}
.prow{display:grid;grid-template-columns:34px 34px minmax(0,1fr) 54px;gap:10px;align-items:center;padding:9px 0;border-bottom:1px solid var(--line)}
.prow:last-child{border-bottom:0}
.slot{font:700 12px/1 var(--display);color:var(--muted);text-align:center;letter-spacing:.04em}
.slot.swap-start,.slot.swap-sit{position:relative;z-index:0;color:var(--ink)}
.slot.swap-start::before,.slot.swap-sit::before{content:"";position:absolute;z-index:-1;width:34px;height:34px;left:50%;top:50%;transform:translate(-50%,-50%)}
.slot.swap-start::before{background:radial-gradient(circle,rgba(120,224,153,.7) 0%,rgba(120,224,153,.3) 42%,transparent 76%)}
.slot.swap-sit::before{background:radial-gradient(circle,rgba(249,215,109,.7) 0%,rgba(249,215,109,.3) 42%,transparent 76%)}
.swap-action{display:inline-block;vertical-align:1px;margin-right:5px;padding:2px 5px;border-radius:4px;color:var(--ink);font:700 10px/1 var(--display);text-transform:uppercase;letter-spacing:.03em}
.swap-action.start{background:radial-gradient(ellipse,rgba(120,224,153,.42),rgba(120,224,153,.12) 70%,transparent)}
.swap-action.sit{background:radial-gradient(ellipse,rgba(249,215,109,.42),rgba(249,215,109,.12) 70%,transparent)}
.swap-card{border:1px solid var(--line);border-radius:14px;background:var(--surface);padding:14px;display:grid;gap:12px}
.swap-sides{display:grid;grid-template-columns:minmax(0,1fr) 24px minmax(0,1fr);gap:6px;align-items:center}
.swap-sides>div{min-width:0}
.swap-arrow{font:700 21px/1 var(--display);text-align:center;color:var(--muted)}
.swap-label{display:flex;align-items:center;gap:7px;font:700 11px/1 var(--display);text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin-bottom:9px}
.swap-orb{display:inline-block;width:16px;height:16px;flex:none}
.swap-orb.start{background:radial-gradient(circle,rgba(120,224,153,.9) 0%,rgba(120,224,153,.4) 38%,transparent 76%)}.swap-orb.sit{background:radial-gradient(circle,rgba(249,215,109,.9) 0%,rgba(249,215,109,.4) 38%,transparent 76%)}
.swap-player{display:flex;align-items:center;gap:7px;margin:7px 0;min-width:0}
.swap-player>div{display:grid;gap:5px;min-width:0}
.swap-player .av,.swap-player .tm{width:30px;height:30px;flex:none}
.swap-player b{font-size:13px;overflow-wrap:anywhere}
.swap-position{justify-self:start;padding:3px 7px;font:700 10px/1 var(--display);color:var(--ink)}
.swap-position.start{background:radial-gradient(ellipse,rgba(120,224,153,.55) 0%,rgba(120,224,153,.22) 48%,transparent 82%)}.swap-position.sit{background:radial-gradient(ellipse,rgba(249,215,109,.55) 0%,rgba(249,215,109,.22) 48%,transparent 82%)}
.swap-benefit{border-top:1px solid var(--line);padding-top:10px;color:var(--win);font:700 16px/1.25 var(--display)}
.swap-benefit span{font:500 11px/1.3 var(--body);color:var(--muted);margin-left:5px}
.pn{min-width:0}
.pn b{display:block;font-weight:600;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pn small{display:block;color:var(--muted);font-size:11.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.range{position:relative;height:6px;margin-top:6px;border-radius:4px;background:var(--surface-3)}
.range .fc{position:absolute;top:0;height:6px;border-radius:4px;background:color-mix(in srgb,var(--blue) 38%,transparent)}
.range .pt{position:absolute;top:-2px;width:10px;height:10px;border-radius:50%;background:var(--blue);transform:translateX(-50%)}
.range .yh{position:absolute;top:-3px;width:2px;height:12px;background:var(--book);transform:translateX(-50%)}
.range .actual-mark{position:absolute;top:-5px;width:8px;height:16px;border:2px solid var(--win);background:var(--surface);transform:translateX(-50%);border-radius:2px;z-index:2}
.legend .actual-mark.legend-mark{position:static;display:inline-block;width:8px;height:13px;transform:none;border:2px solid var(--win);background:var(--surface);border-radius:2px}
.fantasy-score-kpis .kpi{min-width:0;padding:10px 6px}
.fantasy-score-kpis .kpi .v{font-size:clamp(13px,2.6vw,20px);white-space:nowrap;font-variant-numeric:tabular-nums}
.fantasy-head-controls{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.fantasy-head-controls select{max-width:110px;padding:7px 24px 7px 9px;border:1px solid var(--line);border-radius:6px;background:var(--surface);color:var(--ink)}
.pv{text-align:right;font:700 20px/1 var(--display)}
.pv small{display:block;font:500 10.5px/1.3 var(--body);color:var(--muted)}

/* matrix heatmap */
.hm{display:grid;grid-template-columns:64px repeat(5,minmax(0,1fr));gap:5px}
.hm .ch{font-size:10.5px;color:var(--muted);font-weight:600;text-align:center;padding-bottom:2px;line-height:1.15}
.hm .rh{font:700 14px/1.1 var(--display);text-transform:uppercase;display:flex;align-items:center;letter-spacing:.03em}
.cell{border-radius:10px;min-height:66px;padding:7px 6px;display:grid;align-content:space-between;gap:4px;border:1px solid var(--line);font-size:11px;position:relative;cursor:default;min-width:0}
.cell .st{font-weight:700;font-size:10.5px;letter-spacing:.02em;text-transform:uppercase}
.cell .n{font:700 17px/1 var(--display)}
.cell.nb{background:repeating-linear-gradient(135deg,transparent 0 6px,color-mix(in srgb,var(--faint) 18%,transparent) 6px 7px);color:var(--muted)}
.cell.prod{background:color-mix(in srgb,var(--blue) 14%,var(--surface))}
.cell.graded{background:color-mix(in srgb,var(--blue) 34%,var(--surface));border-color:color-mix(in srgb,var(--blue) 45%,transparent)}
.cell.same::after{content:"=";position:absolute;right:6px;top:5px;color:var(--muted);font-weight:700}

/* forest plot */
.forest{display:grid;gap:12px}
.frow{display:grid;grid-template-columns:52px minmax(0,1fr);gap:10px;align-items:center}
.frow .lb{font:700 15px/1 var(--display)}
.fx{position:relative;height:30px}
.fx .ax{position:absolute;left:0;right:0;top:15px;height:1px;background:var(--line-2)}
.fx .z{position:absolute;top:2px;bottom:2px;width:1px;background:var(--faint)}
.fx .fl{position:absolute;top:0;bottom:0;width:0;border-left:2px dashed var(--win)}
.fx .ci{position:absolute;top:13px;height:5px;border-radius:3px;background:color-mix(in srgb,var(--violet) 55%,transparent)}
.fx .pe{position:absolute;top:10px;width:11px;height:11px;border-radius:50%;background:var(--violet);transform:translateX(-50%);box-shadow:0 0 0 3px var(--surface)}
.fscale{display:flex;justify-content:space-between;font-size:10.5px;color:var(--muted);padding-left:62px}

/* ring */
.ring{position:relative;width:96px;height:96px;flex:none}
.ring svg{width:96px;height:96px;transform:rotate(-90deg)}
.ring .c{position:absolute;inset:0;display:grid;place-items:center;text-align:center}
.ring .c b{font:700 28px/1 var(--display)}
.ring .c small{display:block;font-size:10px;color:var(--muted);font-weight:600;letter-spacing:.06em;text-transform:uppercase}
.ring circle.prog{transition:stroke-dashoffset 1s cubic-bezier(.2,.8,.2,1)}

/* charts */
.chart{position:relative;width:100%}
.chart svg{display:block;width:100%;height:auto;overflow:visible}
.chart text{fill:var(--muted);font:500 10.5px var(--body)}
.chart .grid line{stroke:var(--line);stroke-width:1}
.chart .draw{stroke-dasharray:2400;stroke-dashoffset:2400;animation:draw 1.3s cubic-bezier(.3,.7,.2,1) forwards}
@keyframes draw{to{stroke-dashoffset:0}}
.tip{
  position:fixed;z-index:80;pointer-events:none;padding:7px 10px;border-radius:10px;font-size:12px;line-height:1.35;
  background:var(--surface-3);color:var(--ink);border:1px solid var(--line-2);box-shadow:var(--shadow);transform:translate(-50%,calc(-100% - 12px));white-space:nowrap
}
.list{display:grid}
.li{display:flex;gap:12px;align-items:center;padding:11px 0;border-bottom:1px solid var(--line)}
.li:last-child{border-bottom:0}
.li .grow{flex:1;min-width:0}
.li .grow b{display:block;font-weight:600;font-size:14px}
.li .grow small{display:block;color:var(--muted);font-size:12px}
#p-machine .list{grid-template-columns:minmax(0,1fr)}
#p-machine .list .li{min-width:0;max-width:100%}
#p-machine .list .grow b,#p-machine .list .grow small{white-space:normal;overflow-wrap:anywhere}
.clamp{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.timeline{display:grid;gap:0;position:relative}
.tl{display:grid;grid-template-columns:14px minmax(0,1fr);gap:12px;padding-bottom:14px;position:relative}
.tl::before{content:"";position:absolute;left:6px;top:14px;bottom:0;width:2px;background:var(--line)}
.tl:last-child::before{display:none}
.tl .pip{width:14px;height:14px;border-radius:50%;margin-top:3px;background:var(--surface-3);border:3px solid var(--blue)}
.tl b{font-weight:600;font-size:13.5px;display:block}
.tl small{color:var(--muted);font-size:11.5px}
.wkstrip{display:grid;grid-template-columns:repeat(18,minmax(0,1fr));gap:3px;align-items:end;height:64px}
.wkstrip span{display:block;border-radius:3px 3px 1px 1px;min-height:3px}
.tierrow{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 12px;align-items:center;padding:12px 0;border-bottom:1px solid var(--line)}
.tierrow:last-child{border-bottom:0}
.leg{display:inline-flex;align-items:center;gap:6px;padding:5px 8px 5px 5px;border-radius:999px;background:var(--surface-2);border:1px solid var(--line);font-size:12px;font-weight:600}
.legs{display:flex;flex-wrap:wrap;gap:6px}
.vs{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:10px}
.side{display:grid;justify-items:center;text-align:center;gap:6px;min-width:0}
.side .tn{font-weight:600;font-size:13.5px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.side .own{font-size:11.5px;color:var(--hero-muted)}
.lg-logo{width:52px;height:52px;border-radius:16px;overflow:hidden;position:relative;display:grid;place-items:center;font:700 18px/1 var(--display);color:#fff}
.lg-logo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0}
.lg-logo.ok img{opacity:1}
.bar2{display:flex;height:10px;border-radius:6px;overflow:hidden;gap:3px}
.bar2 span{height:100%;border-radius:6px}
.princ{counter-reset:p;display:grid;gap:10px;margin:0;padding:0;list-style:none}
.princ li{counter-increment:p;display:grid;grid-template-columns:34px minmax(0,1fr);gap:12px;align-items:start;padding:14px;border-radius:16px;background:var(--surface);border:1px solid var(--line)}
.princ li::before{content:counter(p);font:700 26px/1 var(--display);color:transparent;background:linear-gradient(135deg,var(--blue),var(--violet));-webkit-background-clip:text;background-clip:text}
.princ b{display:block;font-size:15px;margin-bottom:2px}
.princ span{color:var(--ink-2);font-size:13.5px}
.swatches{display:flex;flex-wrap:wrap;gap:8px}
.sw{display:flex;align-items:center;gap:7px;font-size:12px;color:var(--ink-2)}
.sw i{width:18px;height:18px;border-radius:6px;display:block;border:1px solid var(--line-2)}

/* ============ desktop ============ */
@media (max-width:420px){ #healthTxt{display:none} .week-pill{padding:6px 8px} }
@media (min-width:720px){
  .g2{grid-template-columns:repeat(2,minmax(0,1fr))}
  .g3{grid-template-columns:repeat(3,minmax(0,1fr))}
  .g4{grid-template-columns:repeat(4,minmax(0,1fr))}
  .kpis{grid-template-columns:repeat(4,minmax(0,1fr))}
  .rail-x{grid-auto-flow:row;grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-columns:auto;overflow:visible;margin:0;padding:0}
  .big{font-size:72px}
}
@media (min-width:1024px){
  .tabbar{display:none}
  .rail{
    display:flex;flex-direction:column;gap:4px;position:fixed;left:0;top:0;bottom:0;width:var(--rail);z-index:45;
    padding:20px 14px;background:color-mix(in srgb,var(--surface) 70%,transparent);border-right:1px solid var(--line);
    backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
  }
  .rail .brand{padding:4px 10px 22px}
  .rail a.nav{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:12px;text-decoration:none;color:var(--ink-2);font-weight:600;font-size:14px}
  .rail a.nav svg{width:19px;height:19px;color:var(--muted)}
  .rail a.nav:hover{background:var(--surface-2)}
  .rail a.nav[aria-current="page"]{background:linear-gradient(120deg,color-mix(in srgb,var(--blue) 24%,transparent),color-mix(in srgb,var(--violet) 16%,transparent));color:var(--ink)}
  .rail a.nav[aria-current="page"] svg{color:var(--blue-2)}
  .rail .foot{margin-top:auto;display:grid;gap:10px;padding:12px;border-radius:14px;background:var(--surface-2);border:1px solid var(--line)}
  .topbar .brand{display:none}
  .topbar,main{margin-left:var(--rail)}
  .topbar{padding-inline:28px}
  main{padding:24px 28px 60px;max-width:calc(1180px + var(--rail))}
  .page-head h1{font-size:44px}
  .split{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:16px;align-items:start}
  .rail-x.cols2{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  .chart .draw{stroke-dashoffset:0}
}
/* Saved research titles can contain long identifiers. Keep the concept's grid within a 320px viewport. */
.timeline .tl > div,.timeline .tl b{min-width:0;overflow-wrap:anywhere}
@media(max-width:350px){#p-betting .hero>*{min-width:0;max-width:100%}#p-betting .hero .seg{min-width:0;max-width:100%}}
@media(max-width:350px){.play .head{flex-wrap:wrap}.play .head>.chip{margin-left:auto}}

@media(max-width:600px){.pb-table{table-layout:fixed;font-size:10.5px}.pb-table th,.pb-table td{padding:5px 3px;white-space:normal}.pb-table th:first-child{width:60px}.pb-table th:nth-child(2){width:36px}.pb-table th:nth-child(3){width:78px}.pb-table th:nth-child(4){width:37px}.pb-table th:nth-child(5){width:49px}.pb-table .tm.sm{width:20px;height:20px}.pb-table small{display:block}.pb-team{gap:2px}.pb-seedtag{font-size:9px}}
/* Keep the first saved roster row visible above phone navigation. */
@media(max-width:699px){
  #p-fantasy{gap:12px}
  #p-fantasy .hero{padding:12px}
  #p-fantasy .lg-logo{width:44px;height:44px}
  #p-fantasy .fantasy-score-kpis .kpi{padding:6px 4px}
  #p-fantasy .fantasy-head-controls{gap:5px}
  #p-fantasy .fantasy-head-controls .snap:last-child{font-size:10px}
}

/* October 6: five consumer tabs; saved forecasts share one model selection. */
.tabbar{grid-template-columns:repeat(5,minmax(0,1fr))}
#p-rankings{gap:16px}
.rankings-body>details{margin-top:14px}
.rankings-controls{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap}
.rankings-controls .seg{margin:0}
.forecast-model button[aria-pressed=true]{color:var(--blue-2)}
.rankings-caption{display:flex;align-items:baseline;justify-content:space-between;gap:8px;flex-wrap:wrap}
.rankings-caption h2{margin:0;font:700 22px/1.2 var(--display)}
.forecast-stamp{margin:5px 0 12px}
.power-table{width:100%;font-variant-numeric:tabular-nums}
.power-table td,.power-table th{padding:8px 10px}
.power-table th:first-child{width:52px}
.power-table .pb-team{gap:10px}
.power-table .pb-team small{display:block;color:var(--muted);font-size:10px;font-weight:400;margin-top:2px}
.power-table .power-rank{color:var(--muted);font:600 18px/1 var(--display)}
.power-table .power-move{display:block;margin-top:3px;font:700 11px/1.1 var(--body);color:var(--muted)}
.power-table .power-move.up{color:var(--win)}
.power-table .power-move.down{color:color-mix(in srgb,var(--loss) 72%,var(--muted))}
.power-table .power-rating{font:700 24px/1 var(--display);color:var(--blue-2)}
.power-table .power-rating-value{display:block}
.power-table .power-rating-change{display:block;margin-top:3px;font:700 11px/1.1 var(--body);color:var(--muted)}
.power-table .power-rating-change.up{color:var(--win)}
.power-table .power-rating-change.down{color:color-mix(in srgb,var(--loss) 72%,var(--muted))}
.power-table tbody tr:nth-child(-n+3){background:color-mix(in srgb,var(--blue) 6%,transparent)}
#p-rankings .pb-standings{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin:0}
#p-rankings .pb-division{margin:8px 0}
#p-rankings .projected-record{color:var(--blue-2);font-weight:700}
@media(max-width:700px){#p-rankings .pb-standings{grid-template-columns:minmax(0,1fr);gap:8px}.rankings-controls{gap:9px}.rankings-controls .seg{width:100%;display:flex}.rankings-controls button{flex:1}.power-table td,.power-table th{padding:7px 6px}#p-rankings .pb-table{font-size:12px;table-layout:auto}#p-rankings .pb-table th:first-child{width:34%}#p-rankings .pb-table th:nth-child(2),#p-rankings .pb-table th:nth-child(3),#p-rankings .pb-table th:nth-child(4){width:22%}#p-rankings .pb-team{gap:5px}}
