@font-face{font-family:'Sohne';src:url('fonts/Sohne-Buch.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Sohne';src:url('fonts/Sohne-Kraftig.woff2') format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:'Sohne';src:url('fonts/Sohne-Halbfett.woff2') format('woff2');font-weight:600;font-display:swap}
@font-face{font-family:'Sohne';src:url('fonts/Sohne-Dreiviertelfett.woff2') format('woff2');font-weight:700;font-display:swap}
@font-face{font-family:'Sohne Schmal';src:url('fonts/SohneSchmal-Halbfett.woff2') format('woff2');font-weight:600;font-display:swap}
@font-face{font-family:'Sohne Schmal';src:url('fonts/SohneSchmal-Dreiviertelfett.woff2') format('woff2');font-weight:700;font-display:swap}
@font-face{font-family:'Sohne Mono';src:url('fonts/SohneMono-Buch.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Tiempos Text';src:url('fonts/TiemposText-Regular.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Tiempos Text';src:url('fonts/TiemposText-Semibold.woff2') format('woff2');font-weight:600;font-display:swap}

:root{--paper:#FAFAF6;--ink:#191917;--body:#26251F;--note:#2B2A24;--mut:#605F58;--mut2:#4C4A43;--fnt:#9C9B92;
--hr:rgba(25,25,23,.09);--hr2:rgba(25,25,23,.2);--frame:rgba(25,25,23,.14);
--hl:#FFE86B;--hls:#FFD84D;--acc:#2451B3;--up:#1F7A3D;--dn:#C93030;
--sans:'Sohne',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;--serif:'Tiempos Text',Georgia,'Times New Roman',serif;--mono:'Sohne Mono',ui-monospace,monospace;--cond:'Sohne Schmal','Sohne',sans-serif;
--pad:20px;--measure:590px;--bar:56px;--tab:#EFD066}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-variant-numeric:tabular-nums;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;padding-bottom:calc(58px + env(safe-area-inset-bottom))}
a{color:var(--acc);text-decoration:none}
a:hover{color:#1B3F8C}
h1,h2,h3,h4,h5,p{margin:0}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
mark{background:var(--hl);color:inherit;padding:0 3px;border-radius:2px}
.n{font-family:var(--sans);font-weight:500;font-size:.93em;font-variant-numeric:tabular-nums}/* masthead *//* The masthead takes the section's colour and runs straight into the head
   band below it, so the two read as one field. Opaque, not translucent: the
   old rgba+blur let content ghost through as it scrolled past. */



.mast{position:sticky;top:0;z-index:30;height:var(--bar);display:flex;align-items:center;gap:10px;padding:0 var(--pad);background:var(--paper);border-bottom:1px solid rgba(25,25,23,.14)}
@media(prefers-reduced-motion:reduce){.mast{transition:none}}
.wm{flex:none;display:block;width:20px;height:20px;color:var(--gc,var(--ink));
  transition:color var(--d-state) var(--e-out)}
.wmk{display:block;width:100%;height:100%;
  transition:transform 620ms var(--e-out)}
.wmk svg{display:block;width:100%;height:100%}
@media(prefers-reduced-motion:reduce){.wmk{transition:none}}
.wk{margin-left:auto;font-size:12.5px;color:var(--fnt);flex:none;white-space:nowrap}/* The bar opens on the section — the one thing the page below it does not
   already say — and takes the page's own title only once that title has
   scrolled out of sight. At the top of a route the title is already six lines
   down in 33px, and saying it twice inside sixty pixels reads as a mistake. */

.masttitle{min-width:0;font-family:var(--cond);font-size:21px;font-weight:700;
  letter-spacing:-.016em;color:var(--ink);white-space:nowrap;overflow:hidden;
  text-overflow:ellipsis}
.mastsec{color:var(--ink)}
.mastpage{display:inline-block;color:var(--gink,var(--mut));opacity:0;transform:translateY(7px);
  transition:opacity var(--d-state) var(--e-out),transform var(--d-state) var(--e-out)}/* the divider is the only thing set light: two words butted together read as
   one, and the section is not part of the page's name */

.mastpage i{font-style:normal;color:var(--fnt);padding-right:.14em}
.mast.collapsed .mastpage{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.mastpage{transition:none;transform:none}}
.mast .wk{display:none}/* These two open straight into their content, so the head keeps the title and
   drops the rule. Scoped rather than applied to .schhd itself, which All Games
   and Season Preview also use and which still close on that 2px. */
.deskn{display:none}
.deskn a,.deskn button{font-size:13.5px;font-weight:500;color:var(--mut);padding:4px 9px;border-radius:3px;white-space:nowrap}
.deskn a:hover,.deskn button:hover{background:rgba(25,25,23,.05);color:var(--ink)}
.deskn a.on{background:var(--tab);color:var(--ink);font-weight:600}
.deskn .ext{color:var(--acc)}/* bottom bar *//* The bottom bar is one pull tab now, not five slots. It floats rather than
   spanning the width, so the page reads to the bottom edge instead of stopping
   at a rule, and it carries the current section's own colour on the grab so
   you can tell where you are before reading the word. *//* The peek state of the nav sheet, not a bar of tabs and not a floating pill.
   It is anchored to the edge and shaped like the panel it opens — same radius,
   same paper, same upward shadow — so dragging it up reads as raising one
   object rather than summoning a different one.

   Three things the research is firm about, all of them here: the collapsed
   state carries a short label saying where you are (NN/G), the handle is
   clickable as well as draggable and toggles the sheet (Material), and the
   whole tab clears the 48dp minimum touch target — the 34x4 grab is the
   affordance, the 56px-tall bar is the target. */




.tabbar{position:fixed;left:0;right:0;bottom:0;z-index:30;display:block;
  background:none;border:0;padding:0}
#navpull{display:flex;width:100%;flex-direction:column;align-items:center;gap:6px;
  min-height:56px;padding:9px 20px calc(11px + env(safe-area-inset-bottom));
  border:0;cursor:pointer;background:rgba(250,250,246,.97);backdrop-filter:blur(10px);
  border-radius:16px 16px 0 0;
  box-shadow:0 -1px 0 rgba(25,25,23,.1),0 -6px 22px rgba(25,25,23,.09);
  transition:background var(--d-press) var(--e-out)}
#navpull:active{background:rgba(240,240,234,.98)}
#navpull:focus-visible{outline:2px solid var(--acc);outline-offset:-3px}
.npgrab{display:block;width:36px;height:4px;border-radius:2px;background:var(--tab,#EFD066)}
.npname{display:flex;align-items:center;gap:7px;font-size:14.5px;font-weight:700;
  letter-spacing:-.016em;color:var(--ink);line-height:1.1;white-space:nowrap}
.nparr{display:block;width:8px;height:8px;border-left:1.6px solid var(--mut);
  border-top:1.6px solid var(--mut);transform:rotate(45deg);position:relative;top:1px}
@media(prefers-reduced-motion:reduce){#navpull{transition:none}}/* more sheet — a bottom sheet, not a takeover */


.moresheet{position:fixed;inset:0;z-index:40}
.mscrim{position:absolute;inset:0;background:rgba(25,25,23,.34);opacity:0;transition:opacity .18s}
.moresheet.up .mscrim{opacity:1}
.mpanel{position:absolute;left:0;right:0;bottom:0;max-height:86vh;display:flex;flex-direction:column;background:var(--paper);border-radius:16px 16px 0 0;box-shadow:0 -8px 34px rgba(25,25,23,.22);transform:translateY(12px);opacity:.6;transition:transform .2s cubic-bezier(.2,.7,.3,1),opacity .18s;padding:0 var(--pad) calc(18px + env(safe-area-inset-bottom))}
.moresheet.up .mpanel{transform:translateY(0);opacity:1}
.mgrab{width:38px;height:4px;border-radius:2px;background:rgba(25,25,23,.18);margin:9px auto 4px;flex:none}/* page */


.sheet{max-width:1120px;margin:0 auto;padding:24px var(--pad) 56px}
.sheet.rail>.read{max-width:660px;margin:0 auto}
.sheet.rail>.side{max-width:660px;margin:44px auto 0;padding-top:16px;border-top:2px solid var(--ink)}
.hed{font-size:29px;font-weight:700;letter-spacing:-.03em;line-height:1.08;text-wrap:balance}
.dek{font-size:15.5px;color:var(--mut);line-height:1.48;margin-top:11px;text-wrap:pretty;max-width:44ch}
.prose{font-family:var(--serif);font-size:16.5px;line-height:1.62;color:var(--body);max-width:var(--measure);text-wrap:pretty}
.prose p{margin:0 0 15px}
.prose p:last-child{margin:0}
.sect{margin-top:42px;padding-top:0}
.sh{display:flex;align-items:baseline;justify-content:space-between;gap:14px}
.sect h4,.sh>h4{font-size:21px;font-weight:700;letter-spacing:-.028em;line-height:1.1}
.sh>span{font-size:12.5px;color:var(--mut);flex:none}
/* one gap from a section head to whatever follows it, on every page */
.sh+*{margin-top:14px!important}
.snote{font-family:var(--serif);font-size:15px;line-height:1.56;color:var(--note);margin-top:10px;max-width:var(--measure);text-wrap:pretty}
.blk{margin-top:26px}
.bhead{font-size:15px;font-weight:600;letter-spacing:-.015em}
.foot{font-size:12px;color:var(--fnt);margin-top:14px;padding-top:10px;border-top:1px solid var(--hr2);line-height:1.5}
.empty{font-family:var(--serif);font-size:15px;line-height:1.55;color:var(--mut);background:rgba(25,25,23,.035);padding:16px 18px;border-radius:5px;margin-top:14px;max-width:var(--measure);text-wrap:pretty}/* tables */


.tbl{width:100%}
.tbl .th{display:grid;align-items:end;gap:8px;font-size:11.5px;color:var(--mut);padding-bottom:8px;margin-bottom:5px;border-bottom:1px solid var(--hr2)}
.tbl .tr{display:grid;align-items:center;gap:8px;padding:9px 0;border-bottom:1px solid var(--hr)}
.tbl .tr:last-child{border-bottom:0}
.tbl .nm{font-size:14px;font-weight:500;letter-spacing:-.012em;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tbl .you .nm{font-weight:700}
.tbl .you .nm span{box-shadow:inset 0 -.14em 0 var(--hl)}
.tbl .num{font-variant-numeric:tabular-nums;font-size:12px;letter-spacing:-.012em;color:var(--mut);text-align:right;white-space:nowrap}
.tbl .num.ink{color:var(--ink)}
.cell{font-family:var(--mono);font-size:12.5px;letter-spacing:-.03em;text-align:center;padding:7px 0;border-radius:3px}
.mv{font-variant-numeric:tabular-nums;font-size:12px;letter-spacing:-.012em;text-align:right}
.mv.up{color:var(--up)}
.mv.dn{color:var(--dn)}
.mv.z{color:var(--fnt)}
.sub{font-size:11.5px;color:var(--fnt);font-weight:400}
.pos{font-family:var(--sans);font-size:11px;font-weight:600;color:var(--mut);letter-spacing:.01em}/* word-sized graphics */


.wbar{height:7px;background:rgba(25,25,23,.06);border-radius:1px;overflow:hidden}
.wbar i{display:block;height:100%;background:var(--hls)}
.wbar.you i{background:var(--ink)}
.rng{position:relative;height:9px;background:rgba(25,25,23,.05);border-radius:2px}
.rng i{position:absolute;top:0;bottom:0;background:rgba(255,216,77,.7);border-radius:2px;transition:background .15s}
.rng b{position:absolute;top:-3px;width:2px;height:15px;background:var(--ink);border-radius:1px}/* chips */


.chips{display:flex;flex-wrap:wrap;gap:6px}
.chip{font-size:12.5px;font-weight:500;padding:7px 11px;border-radius:4px;border:1px solid var(--frame);color:var(--mut);min-height:36px;display:inline-flex;align-items:center}
.chip.on{background:var(--hl);border-color:rgba(25,25,23,.3);color:var(--ink);font-weight:600}
.vd{font-size:11.5px;font-weight:600;padding:3px 7px;border-radius:3px;white-space:nowrap}
.vd.claim{background:var(--hl)}
.vd.stash{background:rgba(255,216,77,.32)}
.vd.stream{background:rgba(25,25,23,.07);color:var(--mut2)}
.vd.pass{background:transparent;color:var(--fnt);border:1px solid var(--hr)}
.st{font-size:11.5px;font-weight:500;color:var(--mut)}
.st.hit{color:var(--up);font-weight:600}
.st.missed{color:var(--fnt)}
.missed .lbl{text-decoration:line-through;text-decoration-color:rgba(25,25,23,.35)}/* tiles */


.tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.tiles>div,.tiles>button{min-height:56px;padding:11px 6px 12px;border-radius:5px;border:1px solid transparent;text-align:center;transition:border-color .15s,box-shadow .15s}
.tiles button:hover{border-color:rgba(25,25,23,.22)}
.tiles button.on{border-color:rgba(25,25,23,.45);box-shadow:0 1px 3px rgba(25,25,23,.1)}
.tiles b{display:block;font-variant-numeric:tabular-nums;font-size:19px;font-weight:600;line-height:1;letter-spacing:-.012em}
.tiles span{display:block;font-size:11.5px;color:var(--mut2);margin-top:7px}/* hero */


.bignum{font-size:52px;font-weight:700;letter-spacing:-.045em;line-height:.9;display:inline-block;box-shadow:inset 0 -.13em 0 var(--hl)}
.bignum i{font-style:normal;font-size:.42em}
.bigsub{font-size:13px;color:var(--mut);margin-top:12px;line-height:1.5;max-width:38ch}
.bigsub em{font-style:normal;font-variant-numeric:tabular-nums;font-size:12px}
.bigsub em.up{color:var(--up)}
.bigsub em.dn{color:var(--dn)}/* charts */


svg.g{display:block;width:100%;height:auto;overflow:visible}
svg.g .ax{font-family:var(--sans);font-size:10.5px;fill:rgba(25,25,23,.44)}
svg.g .lb{font-family:var(--cond);font-size:14px;font-weight:600;fill:#3A3833}
svg.g .rr{stroke:rgba(25,25,23,.07)}
svg.g g.ln polyline{fill:none;stroke:rgba(25,25,23,.18);stroke-width:1.2;stroke-linejoin:round}
svg.g g.ln circle{fill:#C8C7C0}
svg.g g.you polyline{stroke:var(--ink);stroke-width:2.4}
svg.g g.you polyline.mk{stroke:var(--hl);stroke-width:5;opacity:.72}
svg.g g.you circle{fill:var(--hl);stroke:var(--ink);stroke-width:1.6}
svg.g g.you .lb{fill:var(--ink);font-weight:700}
.ndl{max-width:222px;margin:0 auto}
.ndlread{display:flex;align-items:baseline;justify-content:center;gap:6px;margin-top:8px}
.ndlread b{font-size:25px;font-weight:700;letter-spacing:-.032em}
.ndlread span{font-size:13px;color:var(--mut)}/* cards */


.card{border-top:1px solid var(--hr2);padding:16px 0}
.card:last-child{padding-bottom:2px}
.card h5{font-size:16px;font-weight:600;letter-spacing:-.015em}
.why{font-family:var(--serif);font-size:15px;line-height:1.56;color:var(--note);margin-top:7px;text-wrap:pretty;max-width:62ch}
.kv{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 14px;padding:11px 0;border-bottom:1px solid var(--hr)}
.kv:last-child{border-bottom:0}
.kv dt{font-size:14px;font-weight:500}
.kv dd{margin:0;font-family:var(--serif);font-size:15px;color:var(--note);text-align:right}

@media(min-width:760px){
:root{--pad:40px}
.hed{font-size:33px}
.mast{gap:26px}
.deskn{display:flex;gap:2px;margin-left:-9px}
.tabbar{display:none}
body{padding-bottom:0}
.sheet{padding:36px var(--pad) 72px}
.tiles{max-width:420px}}/* ranked entries, cards, kv *//* season preview *//* roster tables *//* waivers *//* tiered boards *//* manual *//* trades *//* phone column budgets — inline templates are the desktop case, these are the 390px case *//* market picker — a segmented selector, not four bordered boxes *//* the odds board — the settled standing-panel treatment: no row rules, tinted cells carry the column *//* desktop reading size — the scale was calibrated at 390px; give it room on a big screen *//* Odds on a wide screen: the two number blocks sit side by side, the writing runs full measure under them *//* position colours — tinted so the label always reads in ink *//* the lineup assistant *//* the settled rankings block *//* waiver assistant *//* headshots *//* the matchup column on Odds *//* Start/Sit posture *//* close-call floor vs ceiling *//* waiver priority *//* trade window + first message *//* risers and fallers *//* compare: one position per row, diverging from a centre rule *//* playoffs *//* stat-line hover must never reflow the row *//* situations *//* timeline *//* precedents *//* scenarios *//* impact numbers *//* the season board: four markets, one table *//* the board lives in a narrow column on the Odds page — size off the column, not the viewport *//* Rec is the first thing to go; Proj holds until it truly cannot *//* the bracket — matchup cards on a strict row grid *//* seed odds table *//* the head-to-head lives in a column; size its tracks off that column *//* 3 — the bracket's tallest card overhangs its row span; reserve the space *//* the range swap must not reflow the row *//* head-to-head: more air between the name, its number, and the slot chip *//* head to head, full measure *//* Start/Sit lineup — column alignment, consistent pills, the projection tied to its bar *//* rank: the position quiet, the number the fact *//* the projection sits on its range, not above a stripe *//* the projection and its range read on one line *//* the range is readable without hovering: floor and ceiling sit at the bar's ends *//* pills size to their label, with one consistent padding *//* pills hug their labels, but sit in a fixed track so every headshot starts on the same line *//* My Team rows read exactly like the lineup *//* player rows — identity left, one figure as the fulcrum, the range right *//* positional rank: the letters quiet, the standing loud *//* the range: a dumbbell that prints its own endpoints *//* position decks — the settled roster row *//* start/sit decks — lineup rows in the settled grammar *//* swap modal — rows in the deck grammar *//* start/sit — one card per starting slot *//* lineup total row *//* head-to-head duel rows *//* the tale of the tape (matchup) *//* matchup week selector: chips on desktop, dropdown on phones *//* bench: position pills + full-bleed on phones *//* matchup needle: bigger, readout to the right *//* matchup: what decides it */






























































































































.rwgrid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:14px;align-items:start}
.rw{background:#FFFDF7;border:1px solid rgba(25,25,23,.12);border-radius:8px;padding:15px 18px 17px}
.rw h5{font-family:var(--cond);font-size:22px;font-weight:700;letter-spacing:.012em;text-transform:uppercase;margin:0 0 11px;padding-bottom:9px;border-bottom:1px solid var(--hr)}
.rw ul{margin:0;padding-left:18px}
.rw li{font-family:var(--serif);font-size:14.5px;line-height:1.5;color:var(--body);margin-bottom:10px;text-wrap:pretty}
.rw li:last-child{margin-bottom:0}
.rw.up h5{color:var(--up)}
.rw.dn h5{color:var(--dn)}/* matchup browser — scoreboard cards */

.mbar{display:flex;align-items:center;gap:12px;margin:14px 0 12px;flex-wrap:wrap}
/* ===== All Games: the bracket card, with the lineup opening under it ===== */
.mgames{display:grid;gap:24px;max-width:760px}
.mgtop{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}
/* the line is a pill, cut the same as the variance chip beside it and the
   week pill above a bracket round: neutral grey, gold when it is a coin flip */
.mgtop .hubmt{font-size:10.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;
  padding:3px 8px;border-radius:3px;background:rgba(25,25,23,.06);color:var(--mut2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mgtop .hubmt.flip{background:var(--hl);color:var(--ink)}
.mgcard{background:#FFFDF7;border-radius:10px;overflow:hidden;box-shadow:var(--cardsh)}
.mgh{position:relative;width:100%;text-align:center}
.mgh.simduo{background:none;border-radius:0;box-shadow:none}
.mgh .simhalf{padding:15px 10px 16px}
.mgh .simhn{font-size:13.5px}
.mgh .simhs{font-size:32px}
.mgh .simhk{font-family:var(--sans);font-size:12.5px;letter-spacing:-.006em;margin-top:8px}
.mgh .simhalf.w .simhk{color:var(--mut2)}
.mgx{position:absolute;right:13px;top:13px;width:12px;height:12px}
.mgx::before,.mgx::after{content:"";position:absolute;left:50%;top:50%;background:rgba(25,25,23,.34);transition:opacity .16s}
.mgx::before{width:12px;height:2px;margin:-1px 0 0 -6px}
.mgx::after{width:2px;height:12px;margin:-6px 0 0 -1px}
.mgame.open .mgx::after{opacity:0}
.mgame.open .mgx::before{background:var(--ink)}/* expanded: one line per slot */

.mgb{border-top:1px solid var(--hr2);padding:6px 15px 16px}
.mres{font-size:12.5px;font-weight:600;margin:12px 0 4px}
.mtr{display:grid;grid-template-columns:minmax(0,1fr) 40px 42px 40px minmax(0,1fr);gap:0 12px;align-items:center;height:34px;border-bottom:1px solid var(--hr);overflow:hidden}
.mtr:last-of-type{border-bottom:0}
.mtn{display:flex;align-items:center;gap:7px;min-width:0;height:34px;font-size:13px;line-height:1;font-weight:500;color:rgba(25,25,23,.42);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mtn.r{justify-content:flex-end}
.mtn i{font-style:normal;min-width:0;overflow:hidden;text-overflow:ellipsis}
.mtn .sn{display:none}
.mtn.r{text-align:right}
.mtn.w{color:var(--ink);font-weight:600}
.mtp{font-variant-numeric:tabular-nums;font-size:11.5px;color:rgba(25,25,23,.34);text-align:right}
.mtr .mtp:nth-of-type(2){text-align:left}
.mtp.w{color:var(--ink)}
.mtr .tsl{display:inline-grid;place-items:center;font-style:normal;font-size:9px;font-weight:600;border-radius:3px;padding:3px 0;background:rgba(25,25,23,.06);width:42px}
.mtr .tsl.p-QB,.mtr .tsl.p-SF{background:#F9B3C4}
.mtr .tsl.p-RB{background:#A2E3D8}
.mtr .tsl.p-WR{background:#AECDFB}
.mtr .tsl.p-TE{background:#F8CFA4}
.mtr .tsl.p-FLEX{background:#CFD6A8}
.mtr .tsl.p-K{background:#D9B7FB}
.mtr .tsl.p-DST{background:#C4CBD6}
.mbys{display:grid;grid-template-columns:minmax(0,1fr) 42px minmax(0,1fr);gap:0 12px;align-items:center;min-height:42px;padding-top:4px;border-top:1px solid var(--hr)}
.mby{display:flex;flex-wrap:wrap;gap:5px;min-width:0}
.mby.r{justify-content:flex-end}
.mby em{font-style:normal;font-size:11.5px;font-weight:500;color:var(--mut);background:rgba(25,25,23,.05);border-radius:3px;padding:3px 7px;white-space:nowrap}
.mby em.none{background:none;color:var(--fnt);padding:3px 0}
.mbyp{display:inline-grid;place-items:center;font-size:9px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--fnt);border:1px dashed rgba(25,25,23,.22);border-radius:3px;padding:3px 0;width:42px}
.fnote{flex:none;display:inline-flex;align-items:center;font-style:normal;font-size:9px;font-weight:600;line-height:1;height:16px;letter-spacing:.04em;text-transform:uppercase;color:var(--mut);background:rgba(25,25,23,.07);border-radius:3px;padding:0 5px;white-space:nowrap;position:relative;top:0}

.mlink{font-size:13px;margin:14px 0 0}/* league extremes */

/* coin flips and blowouts: the semifinal cards, two up */
.xgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 10px;max-width:760px}
.xg2 .simbl{margin:0 0 10px}
.xg2 .simhalf{padding:15px 10px 16px}
.xg2 .simhn{margin-bottom:8px}
@media(max-width:600px){
.rwgrid{grid-template-columns:1fr;gap:10px}
.mgb{padding:4px 15px 14px}
.mtr{grid-template-columns:minmax(0,1fr) 32px 34px 32px minmax(0,1fr);gap:0 8px;height:33px}
.mtn{height:33px;font-size:12px;gap:5px}
.mtn .fn{display:none}
.mtn .sn{display:inline}
.mtp{font-size:10.5px}
.mtr .tsl{width:34px;font-size:8px;padding:2px 0}
.fnote{font-size:8px;height:14px;padding:0 4px}
.mbys{grid-template-columns:minmax(0,1fr) 34px minmax(0,1fr);gap:0 8px}
.mbyp{width:34px;font-size:8px}
.mby em{font-size:10.5px;padding:2px 6px}}/* the odds sheet */
.oddsx .mkwrap{display:flex;align-items:center;gap:16px;margin-top:30px;padding-bottom:26px;flex-wrap:wrap}/* The market switcher, in the same idiom as every other tab set in the app:
   text on paper, and a rule in the market's own colour under the live one. The
   grey trough with a filled pill inside it was the last piece of chrome on the
   page that did not match anything else. */

.oddsx .mk{display:inline-flex;gap:0;padding:0;border-radius:0;background:none;
  box-shadow:inset 0 -1px 0 var(--hr)}
.oddsx .mk button{min-height:32px;display:grid;place-items:center;padding:0 13px;
  border-radius:0;font-size:12.5px;font-weight:500;letter-spacing:-.01em;color:var(--mut);
  white-space:nowrap;cursor:pointer;transition:color var(--d-state) var(--e-out)}
.oddsx .mk button:hover{background:none;color:var(--ink)}
.oddsx .mk button.on,.oddsx .mk button.on:hover{background:none;color:var(--ink);
  font-weight:700;box-shadow:inset 0 -2px 0 var(--mkc,var(--hls))}
.oddsx .obr{display:grid;grid-template-columns:40px minmax(0,1fr) 78px 62px 62px 62px 82px;gap:0 16px;max-width:840px;width:100%;text-align:left}
.oddsx .obx{display:none}
.oddsx .obd{display:none}
.oddsx .obw{font-family:var(--sans);font-weight:500;font-size:14px;letter-spacing:-.01em;text-align:center;color:var(--mut2)}
.oddsx .obr{align-items:center;min-height:66px;padding:8px 0;border-bottom:1px solid var(--hr)}
.oddsx .obi{font-family:var(--cond);font-size:26px;font-weight:700;color:rgba(25,25,23,.15);text-align:center;line-height:1}
.oddsx .obr.you .no{color:var(--ink)}
.oddsx .who{min-width:0;line-height:1}
.oddsx .fnm{display:block;font-size:17px;font-weight:700;letter-spacing:-.024em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.15}
.oddsx .fown{display:block;font-size:11.5px;font-weight:500;color:var(--mut);margin-top:5px;line-height:1}
.oddsx .obn{font-family:var(--sans);font-weight:500;font-size:14px;letter-spacing:-.01em;text-align:center;color:var(--mut2)}
.oddsx .obo{font-weight:500;font-size:14px;letter-spacing:-.01em;text-align:center;color:var(--mut2);white-space:nowrap}
.oddsx .obm{font-weight:500;font-size:14px;letter-spacing:-.01em;text-align:center;white-space:nowrap;color:var(--fnt)}
.oddsx .obm.up{color:var(--up)}.oddsx .obm.dn{color:var(--dn)}

.oddsx .obo i.up{color:var(--up)}.oddsx .obo i.dn{color:var(--dn)}.oddsx .obo i.z{color:var(--fnt)}
.oddsx .obp{text-align:center}
.oddsx .obp b{font-family:var(--cond);font-size:32px;font-weight:700;letter-spacing:.01em;display:inline-block;line-height:1}
.oddsx .obp b em{font-style:normal;font-size:17px;color:var(--mut);margin-left:1px}
.oddsx .obr.you .obp b{background:linear-gradient(var(--hl),var(--hl)) 0 62%/100% 52% no-repeat;padding:0 5px;margin:0 -5px}
.oddsx .foot{max-width:62ch}
.oddsx .deck{margin-top:42px}
.oddsx .dh{font-size:16px;font-weight:700;letter-spacing:-.02em;color:var(--ink);margin:0 0 12px;padding-bottom:9px;border-bottom:1px solid var(--hr2)}
.oddsx .mvr{display:flex;justify-content:space-between;align-items:baseline;gap:12px;height:30px}
.oddsx .mvl{font-size:12.5px;font-weight:500;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.oddsx .mvl em{font-style:normal;color:var(--mut);font-weight:400;font-size:11px;margin-left:6px}
.oddsx .mvd{font-family:var(--sans);font-weight:500;font-size:12.5px;flex:none}
.oddsx .mvd.up{color:var(--up)}.oddsx .mvd.dn{color:var(--dn)}.oddsx .mvd.z{color:var(--fnt)}
@media(max-width:720px){/* priority+: rank, team, market figure stay a table; the rest opens on tap */

.oddsx .obr{grid-template-columns:26px minmax(0,1fr) 86px 20px;gap:0 12px;min-height:60px;padding:9px 0}
.oddsx .obx{display:block}
.oddsx .obr .obx{justify-self:end;align-self:center;position:relative;width:13px;height:13px}
.oddsx .obr .obx::before,.oddsx .obr .obx::after{content:"";position:absolute;left:50%;top:50%;background:rgba(25,25,23,.55);transition:opacity .16s,background .16s}
.oddsx .obr .obx::before{width:13px;height:2px;margin:-1px 0 0 -6.5px}
.oddsx .obr .obx::after{width:2px;height:13px;margin:-6.5px 0 0 -1px}
.oddsx .obr.open .obx::before{background:var(--ink)}
.oddsx .obr.open .obx::after{opacity:0}
.oddsx .obn,.oddsx .obw,.oddsx .obo,.oddsx .obm{display:none}
.oddsx .obi{font-size:19px}
.oddsx .fnm{font-size:15.5px;gap:7px}
.oddsx .fnm em.wl{font-size:11.5px}
.oddsx .fown{font-size:11px;margin-top:3px}
.oddsx .obp b{font-size:26px}
.oddsx .obp b em{font-size:13px}

.oddsx .obr.open .obp b{background:linear-gradient(var(--hl),var(--hl)) 0 62%/100% 52% no-repeat;padding:0 5px;margin-right:-5px}
.oddsx .obr.open{border-bottom-color:transparent}

.oddsx .obd{display:block;margin:0 0 0 38px;padding:2px 0 12px;border-bottom:1px solid var(--hr)}
.oddsx .obd[hidden]{display:none}/* the drawer, while it is opening or closing */

.oddsx .obd.obanim{overflow:hidden;will-change:height;
  transition:height var(--d-draw) var(--e-out),
    padding-top var(--d-draw) var(--e-out),
    padding-bottom var(--d-draw) var(--e-out),
    opacity var(--d-state) var(--e-out)}
@media(prefers-reduced-motion:reduce){.oddsx .obd.obanim{transition:none}}
.oddsx .obdg{display:grid}
.oddsx .obdg div{display:flex;align-items:baseline;justify-content:space-between;gap:16px;min-height:34px;padding:7px 0;border-top:1px solid var(--hr)}
.oddsx .obdg div:first-child{border-top:0}
.oddsx .obdg i{font-style:normal;font-size:13px;font-weight:400;color:var(--mut)}
.oddsx .obdg b{font-weight:500;font-size:14px;letter-spacing:-.01em;color:var(--ink)}
.oddsx .obdg b.up{color:var(--up)}.oddsx .obdg b.dn{color:var(--dn)}.oddsx .obdg b.z{color:var(--fnt)}
.oddsx .deck{grid-template-columns:1fr;gap:26px}
.oddsx .mkwrap{margin-top:24px;padding-bottom:20px}
.oddsx .chwrap{overflow:visible}
.oddsx .chwrap svg{min-width:0;width:100%}
.oddsx .bump .lb{font-size:16px}
.oddsx .bump .ax{font-size:13px}
.oddsx .bump .rk{font-size:14px}}

@media(min-width:1000px){
.sheet.rail{display:grid;grid-template-columns:minmax(0,1fr) 376px;gap:0}
.sheet.rail>.read{max-width:none;margin:0;padding-right:48px;min-width:0}
.sheet.rail>.side{max-width:none;margin:0;padding-top:0;border-top:0;padding-left:48px;border-left:1px solid var(--hr2);align-self:start;position:sticky;top:calc(var(--bar) + 16px)}
.sheet.rail>.side .blk:first-child{margin-top:0}}
@media(prefers-reduced-motion:reduce){*{transition-duration:0s!important;animation-duration:0s!important}}/* ranked entries, cards, kv */


.ranked{margin-top:6px}
.pr{display:grid;grid-template-columns:40px minmax(0,1fr);gap:0 16px;padding:16px 0;border-bottom:1px solid var(--hr);align-items:start}
.pr:last-child{border-bottom:0}
.pr .rk{font-size:28px;font-weight:700;letter-spacing:-.04em;line-height:.9;padding-top:2px}
.pr.you h5 span,.pr.you h5{box-shadow:none}
.pr.you h5{position:relative;display:inline-block;box-shadow:inset 0 -.14em 0 var(--hl)}
.pr h5{font-size:16px;font-weight:600;letter-spacing:-.015em}
.kvlist{margin:10px 0 0}
.folded{margin-top:6px}
.card h5 .sub{font-weight:400}/* The position chip styles itself. This was a whitelist of parent classes —
   .card h5, .nm, .pch — so a chip in any other component got the colour rule and
   nothing else: no padding, no radius, and whatever font-size its parent
   happened to set. On the waiver board that meant a 16px block. The scoped
   rules below still win where they set something; this only fills the gaps. */

em.slot{font-style:normal;font-family:var(--sans);font-size:10.5px;font-weight:600;
  color:var(--mut);background:rgba(25,25,23,.06);padding:2px 5px;border-radius:3px;
  vertical-align:1px;white-space:nowrap}

.card h5 em.slot,.nm em.slot,.pch em.slot{font-style:normal;font-family:var(--sans);font-size:10.5px;font-weight:600;color:var(--mut);background:rgba(25,25,23,.06);padding:2px 5px;border-radius:3px;margin-right:8px;vertical-align:1px}/* season preview */


.cover{font-family:var(--cond);font-size:46px;font-weight:700;letter-spacing:-.01em;line-height:.98;text-wrap:balance;margin-top:2px}
.tr.missed .lbl{color:var(--fnt)}/* roster tables */


.split{font-size:11.5px;color:var(--mut);padding:14px 0 6px;border-bottom:1px solid var(--hr2);margin-bottom:2px}
.alt{font-size:12.5px;color:var(--mut);text-align:right;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.alt em{font-style:normal;font-variant-numeric:tabular-nums;font-size:11.5px;color:var(--dn)}
.needs{margin-top:16px;max-width:540px}
.nrow{display:grid;grid-template-columns:32px minmax(0,1fr) 52px;gap:0 16px;align-items:center;height:32px}
.nrow .nk{font-size:13.5px;font-weight:600}
.ntrack{position:relative;height:32px}
.ntrack i{position:absolute;top:10px;height:12px;border-radius:1px}
.nrow .nv{font-variant-numeric:tabular-nums;font-size:12.5px;letter-spacing:-.012em;color:var(--dn);text-align:right}
.nrow .nv.pos{color:var(--up)}
.thead{margin-top:14px}/* Four columns held by two hairlines rather than four filled chips — a card
   here sat inside the roster deck's own cards directly below and stopped
   meaning anything. Title is marked with a rule under the figure instead of a
   wash behind the cell, which restated the number printed on it. */

.tstats{display:grid;grid-template-columns:repeat(4,1fr);
  border-top:1px solid rgba(25,25,23,.22);border-bottom:1px solid rgba(25,25,23,.1)}
.tstats>div{padding:15px 6px 16px;text-align:center;border-left:1px solid rgba(25,25,23,.07)}
.tstats>div:first-child{border-left:0}
.tstats b{display:inline-block;font-family:var(--cond);font-size:21px;font-weight:700;
  line-height:1;letter-spacing:.004em}
.tstats b i{font-style:normal;font-size:.5em;color:var(--fnt);margin-left:1px}
.tstats>div.hi b{box-shadow:inset 0 -.11em 0 var(--hl)}
.tstats span{display:block;font-size:11px;color:var(--mut);margin-top:9px}
@media(max-width:600px){
.tstats>div{padding:14px 4px 15px}
.tstats b{font-size:19px}
.tstats span{font-size:10.5px;margin-top:8px}}
.star{font-family:var(--serif);font-size:15px;line-height:1.55;color:var(--note);margin-top:12px}
.num.fa{color:var(--fnt)}/* waivers */


.adds{margin-top:6px}
.add{padding:16px 0;border-bottom:1px solid var(--hr)}
.add:last-child{border-bottom:0}
.qt{font-size:13px;color:var(--mut)}/* tiered boards */


.tiers .tier{display:grid;grid-template-columns:130px minmax(0,1fr);gap:0 24px;padding:16px 0;border-top:1px solid var(--hr2)}
.tiers .tn{font-family:var(--cond);font-size:21px;font-weight:700;letter-spacing:-.008em;line-height:1.08}
.vt{margin-top:20px}
.vt .tn{font-family:var(--cond);font-size:19px;font-weight:700;margin-bottom:6px}/* The superflex matrix. These widths used to ride on a style attribute
   written into every row, so the phone layout could only reach them with
   !important; they answer to the cascade now. *//* trades */


.calc{display:grid;gap:18px;margin-top:16px}

.tsel{display:flex;align-items:center;gap:10px;font-size:12.5px;color:var(--mut)}
.recs{margin-top:6px}
.rec{padding:18px 0;border-bottom:1px solid var(--hr)}
.rec:last-child{border-bottom:0}
.rg{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:10px}
.rg>div{background:rgba(25,25,23,.035);border-radius:4px;padding:10px 12px}
.rg p{font-size:14.5px;font-weight:500;letter-spacing:-.012em;margin-bottom:2px}

@media(min-width:760px){
.calc{grid-template-columns:1fr 1fr;gap:32px}
.cover{font-size:60px}}
@media(max-width:520px){
.tiers .tier{grid-template-columns:1fr;gap:8px}}

/* phone column budgets — inline templates are the desktop case, these are the 390px case */
@media(max-width:600px){
.hs{display:none!important}
.tbl .th,.tbl .tr{gap:6px}
.qt.fa{color:var(--fnt)}}
.qt.fa{color:var(--fnt)}

.morelinks{display:flex;flex-wrap:wrap;gap:10px 28px;margin-top:30px;font-size:14px;font-weight:500}
.morelinks a{border-bottom:1px solid rgba(36,81,179,.32);padding:7px 0;line-height:1.4}
.say{font-family:var(--serif);font-size:14.5px;line-height:1.5;color:var(--body);margin-top:8px;text-wrap:pretty;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;min-height:65px}
.cell{transition:background .18s}
[data-mkrows] .cell{cursor:pointer}
.cell.dl{font-weight:500}
[data-mkrows]{transition:opacity .22s cubic-bezier(.16,1,.3,1)}
@media(max-width:999px){
.sheet.rail{display:flex;flex-direction:column}
.sheet.rail>.side{order:-1;width:100%;max-width:660px;margin:0 auto;padding-top:0;border-top:0}
.sheet.rail>.read{order:1;margin-top:40px;padding-top:18px;border-top:2px solid var(--ink)}}

.sheet.one{max-width:700px}
.sheet.one .sect .hed{margin-top:2px}/* market picker — a segmented selector, not four bordered boxes */


.tiles[data-tiles]{background:rgba(25,25,23,.05);border-radius:8px;padding:3px;gap:3px}
.tiles[data-tiles]>button{border:0;border-radius:6px;background:transparent!important;box-shadow:none;transition:background .15s}
.tiles[data-tiles]>button:hover{background:rgba(25,25,23,.05)!important}
.tiles[data-tiles]>button.on{background:var(--hl)!important;box-shadow:0 1px 2px rgba(25,25,23,.12)}
.tiles[data-tiles]>button.on span{color:var(--ink)}/* the odds board — the settled standing-panel treatment: no row rules, tinted cells carry the column */


[data-mkrows] .tr{border-bottom:0;padding:0;margin-bottom:5px}
[data-mkrows] .nm{font-size:13.5px;font-weight:500;letter-spacing:-.005em;padding:7px 0}
[data-mkrows] .you .nm{font-weight:700}
[data-mkrows] .you .nm span{box-shadow:none}
[data-mkrows] .th{align-items:end}
[data-mkrows] .cell{width:48px;margin-left:auto}
[data-mkrows] .th>span:last-child{width:48px;margin-left:auto}

/* desktop reading size — the scale was calibrated at 390px; give it room on a big screen */
@media(min-width:760px){body{zoom:1.18}}
@media(min-width:1600px){body{zoom:1.3}}

/* Odds on a wide screen: the two number blocks sit side by side, the writing runs full measure under them */
@media(min-width:900px){
.sheet.one{max-width:1080px;display:grid;grid-template-columns:minmax(0,0.86fr) minmax(0,1.14fr);column-gap:44px;align-items:start}
.sheet.one>.blk{margin-top:0}
.sheet.one>.sect,.sheet.one>#live,.sheet.one>.morelinks{grid-column:1/-1}
.sheet.one>.sect{margin-top:44px}}

.sheet.one .bhead{font-size:19px;letter-spacing:-.02em}/* position colours — tinted so the label always reads in ink */


.slot.slot.p-QB{background:#F9B3C4;color:var(--ink)}
.slot.slot.p-RB{background:#A2E3D8;color:var(--ink)}
.slot.slot.p-WR{background:#AECDFB;color:var(--ink)}
.slot.slot.p-TE{background:#F8CFA4;color:var(--ink)}
.slot.slot.p-FLEX{background:#CFD6A8;color:var(--ink)}
.slot.slot.p-SF,.slot.slot.p-SFLEX{background:#F9B3C4;color:var(--ink)}
.slot.slot.p-K{background:#D9B7FB;color:var(--ink)}
.slot.slot.p-DST{background:#C4CBD6;color:var(--ink)}
/* the lineup assistant */


.lstat{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-top:24px}
.lstat .bigsub{margin-top:10px}
.lstat button[disabled]{opacity:.4;pointer-events:none}
.pl{display:grid;grid-template-columns:46px minmax(0,1fr) auto;gap:0 14px;align-items:center;min-height:62px;padding:13px 4px;border-bottom:1px solid var(--hr);text-align:left;transition:background .14s}
.pl{border-bottom:0}
.pl:hover{background:rgba(25,25,23,.04)}
.pnone{font-size:13.5px;color:var(--mut);padding:6px 2px 10px}

.lmodal{position:fixed;inset:0;z-index:50;background:rgba(25,25,23,.34);display:flex;align-items:flex-end;justify-content:center}
.lcard{background:var(--paper);width:100%;max-width:540px;border-radius:14px 14px 0 0;padding:20px 20px 24px;max-height:84vh;overflow-y:auto;box-shadow:0 -6px 30px rgba(25,25,23,.18)}
.lch{display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding-bottom:12px;border-bottom:2px solid var(--ink)}
.lch h3{font-size:19px;font-weight:700;letter-spacing:-.02em}
.lch em.slot{font-style:normal;font-family:var(--sans);font-size:15px;font-weight:600;letter-spacing:-.01em;padding:5px 10px;border-radius:4px;margin:0}
.lx{font-size:14px;color:var(--mut);min-height:44px;padding:0 4px}
.plist{display:grid;gap:2px;margin-top:10px}
.pl>em.slot{font-style:normal;font-family:var(--sans);font-size:10.5px;font-weight:600;padding:2px 5px;border-radius:3px;justify-self:start;margin-right:0}
.pgh{font-size:11.5px;color:var(--mut);padding:14px 2px 6px;border-top:1px solid var(--hr2);margin-top:6px}
@media(min-width:760px){.lmodal{align-items:center}.lcard{border-radius:14px;box-shadow:0 12px 44px rgba(25,25,23,.22)}}

.nfl{font-size:11.5px;font-weight:500;color:var(--fnt);letter-spacing:.01em;margin-left:3px}

@keyframes marker{from{background:rgba(255,232,107,.85)}to{background:transparent}}
@keyframes dipin{from{opacity:.3}to{opacity:1}}
.bignum.dip{animation:dipin .28s cubic-bezier(.16,1,.3,1)}
.bump{display:block;width:100%;height:auto}
.bump .rr{stroke:rgba(25,25,23,.05);stroke-width:1}
.bump .ax{font-family:var(--sans);font-size:10.5px;fill:rgba(25,25,23,.44)}
.bump .rk{font-size:12px;font-weight:600;fill:rgba(25,25,23,.58);letter-spacing:-.01em}
.bump .lb{font-family:var(--cond);font-size:15px;font-weight:600;fill:#3A3833;letter-spacing:.004em}
.bump g.ln polyline{stroke:rgba(25,25,23,.16);stroke-width:1;transition:stroke .16s,stroke-width .16s}
.bump g.ln circle{fill:#C8C7C0;transition:fill .16s}
.bump g.you polyline{stroke:var(--ink);stroke-width:2.4}
.bump g.you polyline.mk{stroke:var(--hl);stroke-width:5;opacity:.72}
.bump g.you circle{fill:var(--hl);stroke:var(--ink);stroke-width:1.6}
.bump g.you circle.wk{fill:var(--ink);stroke:none}
.bump g.you .lb{fill:var(--ink);font-weight:700}
.bump.dim g.ln:not(.lit):not(.you) polyline{stroke:rgba(25,25,23,.08)}
.bump.dim g.ln:not(.lit):not(.you) .lb{fill:#C4C3BA}
.bump g.lit polyline{stroke:rgba(25,25,23,.8);stroke-width:1.9}
.bump g.lit circle{fill:#5F5E58}
.bump g.lit .lb{fill:var(--ink);font-weight:700}
@media(max-width:640px){}

.h2{margin-top:12px}

.pn2{display:block;min-width:0}
.pn2>.sl{margin-top:5px;transition:color .14s}
.pn2>.sl.lit{color:var(--mut2)}/* waiver assistant */


.moves{display:grid;gap:14px;margin-top:16px}
.move{padding:16px 18px;border-radius:6px;background:rgba(25,25,23,.035)}
.move.claim{background:rgba(255,232,107,.34)}
.move h5{font-size:19px;font-weight:700;letter-spacing:-.022em;margin-top:8px}
.move h5 em.slot{font-style:normal;font-family:var(--sans);font-size:10.5px;font-weight:600;padding:2px 5px;border-radius:3px;margin-right:9px;vertical-align:3px;background:rgba(25,25,23,.1)}
.mvd{font-size:13.5px;color:var(--mut2);margin-top:5px}
.mvd b{font-weight:600;color:var(--ink)}
.mvd em{font-style:normal;font-variant-numeric:tabular-nums;font-size:12.5px}
.mvd em.up{color:var(--up)}
.mvd em.dn{color:var(--dn)}
.move .why{margin-top:9px}
.sheet.one .ndl{max-width:290px}
.sheet.one .ndlread{margin-top:12px}
.sheet.one .ndlread b{font-size:34px;letter-spacing:-.035em}
.sheet.one .ndlread span{font-size:15px}

.add .sl{margin-top:8px}
.card .sl{margin-top:7px}
@media(max-width:600px){.pn2>.sl{font-size:11px}}

.sl{display:grid;grid-template-columns:repeat(3,minmax(0,92px));gap:0 10px;white-space:normal!important}
.sl>span{display:flex;align-items:baseline;gap:5px;min-width:0}
.sl b{font-variant-numeric:tabular-nums;font-size:11.5px;font-weight:600;letter-spacing:-.012em;color:var(--ink)}
.sl i{font-style:normal;font-size:11px;color:var(--fnt);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sl.lit b{color:var(--ink)}
@media(max-width:600px){.sl{grid-template-columns:repeat(2,minmax(0,86px))}.sl>span:nth-child(3){display:none}}
@media(max-width:600px){}/* headshots */


.face{width:34px;height:34px;flex:none;border-radius:50%;background:var(--tc,rgba(25,25,23,.055));overflow:hidden;display:inline-flex;align-items:flex-end;justify-content:center;box-shadow:inset 0 0 0 1px rgba(25,25,23,.12)}
.face img{width:100%;height:100%;object-fit:cover;object-position:50% 8%;transform:scale(1.18);transform-origin:50% 15%}
.face.noimg i{font-style:normal;font-size:11.5px;font-weight:600;color:rgba(255,255,255,.92);align-self:center;letter-spacing:.01em}
.face.noimg{background:var(--tc,rgba(25,25,23,.12))}
.face.big{width:44px;height:44px}
.face.big.noimg i{font-size:14px}
.pl{grid-template-columns:44px minmax(0,1fr) auto}
.tbl .tr:not(.t-ros):not(.t-line) .nm{display:flex;align-items:center;gap:10px}
@media(max-width:600px){.face{width:28px;height:28px}}
@media(max-width:600px){}
@media(max-width:600px){}
@media(max-width:600px){}

.face.sm{width:24px;height:24px}
.face.sm.noimg i{font-size:9px}
.move h5{display:flex;align-items:center;gap:10px}
.move h5 em.slot{margin-right:0;vertical-align:baseline}
@media(max-width:600px){.face.sm{width:20px;height:20px}}

.kv.named dd{text-align:right}
.nmrow{display:inline-flex;align-items:center;gap:8px;justify-content:flex-end}
.nmrow b{font-family:var(--sans);font-size:14.5px;font-weight:600;letter-spacing:-.012em}
.nmrow em.slot{font-style:normal;font-family:var(--sans);font-size:10px;font-weight:600;padding:2px 4px;border-radius:3px;margin:0}
.nmtail{display:block;font-family:var(--serif);font-size:14px;color:var(--mut);margin-top:3px}

.face.logo{background:rgba(25,25,23,.05)!important;align-items:center}
.face.logo img{transform:none;object-fit:contain;object-position:50% 50%;width:78%;height:78%}/* the matchup column on Odds */


.mcol{margin-top:16px;font-size:16px;max-width:var(--measure)}/* Start/Sit posture *//* No slab. A filled yellow panel for a two-word status was the heaviest thing
   on the page carrying the least, and it stranded the chevron at the far edge
   of an otherwise empty row. This is the treatment the rest of the site gives
   a figure that matters: the number marked with the highlight, the reading
   next to it, a rule under the lot. */



.post{margin-top:14px;border-bottom:1px solid var(--hr)}/* Full width so the whole row is tappable, but the content clusters left and
   the chevron sits with it — pushed to the far edge it read as unrelated to
   the thing it opens. */

.posh{display:flex;align-items:baseline;gap:9px;width:100%;min-height:44px;
  background:none;border:0;padding:0;text-align:left;cursor:pointer;color:inherit}
.posw{font-family:var(--cond);font-size:22px;font-weight:700;letter-spacing:.01em;
  box-shadow:inset 0 -.15em 0 var(--hl)}/* the stance is the reading, so it carries the colour */

.post-l{font-family:var(--cond);font-size:14px;font-weight:700;letter-spacing:.05em;
  text-transform:uppercase;color:var(--mut)}
.post.favored .post-l{color:var(--up)}
.posh .chev{width:10px;height:6px;fill:none;stroke:var(--fnt);stroke-width:1.6;
  stroke-linecap:round;stroke-linejoin:round;align-self:center;flex:none;
  transition:transform var(--d-press) var(--e-out)}
.posh[aria-expanded="true"] .chev{transform:rotate(180deg)}
.post .why{margin-top:0;margin-bottom:13px;max-width:62ch}
.mvr{display:grid;grid-template-columns:minmax(0,1fr) 40px 44px;gap:0 10px;align-items:center;padding:8px 0;border-bottom:1px solid var(--hr)}
.mvr:last-child{border-bottom:0}
.mvr .nm{display:flex;align-items:center;gap:8px;min-width:0}/* compare: one position per row, diverging from a centre rule *//* Two equal halves so the join sits exactly on the centre line. It used to be
   a flex row with an auto margin on BOTH bars, which centres the pair rather
   than the join — the join landed at 50%+(wl-wr)/2, so the winning bar always
   crossed the axis, and crossed further the bigger its lead. *//* playoffs */


.seedp{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:16px}
.spl{display:block;font-size:12.5px;color:var(--mut);margin-bottom:8px}
.bignum.plain{box-shadow:none;color:var(--mut2)}
.sp.dim .wbar i{background:rgba(25,25,23,.16)}
.fin{margin-top:14px}
.fin h5{font-size:19px;font-weight:700;letter-spacing:-.025em}
.findn{display:grid;grid-template-columns:1fr 1fr;gap:4px;margin-top:12px}
.findn>div{padding:14px 12px;border-radius:4px;background:rgba(25,25,23,.04);text-align:center}
.findn b{display:block;font-family:var(--sans);font-size:24px;font-weight:700;letter-spacing:-.035em}
.findn span{display:block;font-size:11.5px;color:var(--mut2);margin-top:4px}
@media(min-width:760px){}
@media(max-width:600px){.seedp{grid-template-columns:1fr;gap:18px}}/* stat-line hover must never reflow the row */


.sl b{white-space:nowrap}
.pc{padding:18px 0;border-bottom:1px solid var(--hr)}
.pc:last-child{border-bottom:0}/* scenarios */
.sc{padding:20px 0;border-bottom:1px solid var(--hr)}
.sc:last-child{border-bottom:0}/* Named .scl/.scll until the week scrubber's own .scl — 12px in the faintest
   grey on the page — landed later in the file and took them over. The two
   takeaways are the point of a scenario; they are not a scrubber label. *//* impact numbers */
/* ===== A situation on a phone =====
   Seven thousand pixels of one texture: every section was set in the same
   16-17px serif at the same measure, so the chronology, the case notes, the
   four scenarios and the read all looked like the same long article. The
   reading matter stays serif and gets smaller; the reference matter — the
   dates, the case labels, the odds — goes to sans and lines up in columns you
   can run an eye down. Nothing is hidden; it is sorted. */
@media(max-width:600px){
.sitx .prose{font-size:15.5px;line-height:1.6}
.sitx .prose p{margin:0 0 13px}
.sitx .foot{font-size:11.5px}}
@media(max-width:600px){}
@media(max-width:600px){}

.mast .wk{font-family:var(--mono);font-size:10.5px;font-weight:400;letter-spacing:-.02em;
  text-transform:lowercase;color:var(--mut);background:none;padding:0;border-radius:0}/* the season board: four markets, one table */
.b4{margin-top:12px}
.b4 .bh,.b4 .br{display:grid;grid-template-columns:minmax(0,1fr) 50px 58px repeat(4,minmax(46px,54px));gap:5px;align-items:center}
.b4 .bh{border-bottom:1px solid var(--hr2)}
.b4 .bh span,.b4 .bh b{font-size:11.5px;font-weight:400;color:var(--mut);padding-bottom:9px;display:block}
.b4 .bh .q{text-align:center}
.b4 .br>.num{text-align:center;font-family:var(--sans);font-size:11.5px;font-weight:400;letter-spacing:0;color:var(--fnt)}
.b4 .bh .q{color:var(--fnt)}
.b4 .bh b{font-weight:600;color:var(--ink);text-align:center}
.b4 .br{padding:8px 0;border-bottom:1px solid var(--hr)}
.b4 .br:last-child{border-bottom:0}
.b4 .br.you .nm{font-weight:700}
.b4 .br.you .nm span{box-shadow:inset 0 -.14em 0 var(--hl)}
.b4 .bc{font-family:var(--mono);font-size:12.5px;letter-spacing:-.03em;text-align:center;padding:8px 0;border-radius:3px;transition:background .16s,color .16s}
.b4 .bc.d{font-weight:500}
.b4 .bc.d.up{color:var(--up)}
.b4 .bc.d.dn{color:var(--dn)}
.b4 .bc.d.z{color:var(--fnt)}
@media(max-width:620px){
.b4 .bh,.b4 .br{grid-template-columns:minmax(0,1fr) 46px repeat(4,minmax(40px,1fr));gap:4px}
.b4 .bh span:nth-child(2),.b4 .br>span:nth-child(2){display:none}
.b4 .bc{font-size:11.5px;padding:7px 0}}/* the board lives in a narrow column on the Odds page — size off the column, not the viewport */


.blk{container-type:inline-size}
.b4 .nm{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.b4 .nm span{display:inline-block;max-width:100%;overflow:hidden;text-overflow:ellipsis;vertical-align:bottom}
/* Rec is the first thing to go; Proj holds until it truly cannot */
@container (max-width:392px){
.b4 .bh,.b4 .br{grid-template-columns:minmax(0,1.7fr) 44px 50px repeat(4,minmax(38px,1fr));gap:0 5px}
.b4 .bc{font-size:11.5px;padding:7px 0}}
@container (max-width:326px){
.b4 .bh,.b4 .br{grid-template-columns:minmax(0,1.5fr) 48px repeat(4,minmax(38px,1fr))}
.b4 .bh span:nth-child(2),.b4 .br>span:nth-child(2){display:none}}
@container (max-width:278px){
.b4 .bh,.b4 .br{grid-template-columns:minmax(0,1fr) repeat(4,minmax(36px,1fr))}
.b4 .bh span:nth-child(3),.b4 .br>span:nth-child(3){display:none}}
.bs{display:grid;grid-template-columns:19px minmax(0,1fr) auto;align-items:baseline;gap:0 10px;padding:8px 0}
.bs+.bs{border-top:1px solid rgba(25,25,23,.07)}/* December schedule tables — columns live here, not inline, so mobile can restack */

.sched .th,.sched .tr{grid-template-columns:minmax(0,1fr) minmax(0,0.9fr)}
.sched.own .th,.sched.own .tr{grid-template-columns:minmax(0,1fr) 62px minmax(0,0.9fr)}
.sched .ra{text-align:right}/* long names ellipsis inside their own cell instead of running into the next column */

.sched .nm .pn2{min-width:0;overflow:hidden}
.sched .nm .pn{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media(max-width:760px){}/* seed odds table */


.sdt{margin-top:14px}
.sdh,.sdr{display:grid;grid-template-columns:minmax(0,1fr) 46px 56px repeat(8,minmax(34px,1fr));gap:4px;align-items:center}
.sdh{border-bottom:1px solid var(--hr2)}
.sdh span,.sdh b{font-size:11px;font-weight:400;color:var(--fnt);padding-bottom:9px;display:block;text-align:center}
.sdh span:first-child{text-align:left;color:var(--mut)}
.sdh b{font-weight:600;color:var(--ink)}
.sdr{padding:7px 0;border-bottom:1px solid var(--hr)}
.sdr:last-child{border-bottom:0}
.sdr .nm{font-size:14px;font-weight:500;letter-spacing:-.012em;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sdr.you .nm{font-weight:700}
.sdr.you .nm span{box-shadow:inset 0 -.14em 0 var(--hl)}
.sdr .num{font-family:var(--sans);font-size:11.5px;color:var(--fnt);text-align:center}
.sdr .bc{font-family:var(--mono);font-size:11.5px;letter-spacing:-.04em;text-align:center;padding:7px 0;border-radius:3px}
@media(max-width:760px){
.sdh,.sdr{grid-template-columns:54px repeat(8,minmax(0,1fr));gap:2px}
.sdh span:nth-child(2),.sdh span:nth-child(3),.sdr>.num{display:none}
.sdr .bc{font-size:10.5px;padding:6px 0}}/* the head-to-head lives in a column; size its tracks off that column *//* the range swap must not reflow the row *//* head-to-head: more air between the name, its number, and the slot chip *//* head to head, full measure */

.mcol{max-width:660px!important}/* player rows — identity left, one figure as the fulcrum, the range right */


/* The dumbbell — floor, projection, ceiling — printed by dumbbell() in core.js
   and used by the player card and the lineup rows. */
.db{position:relative;display:block;height:26px}
.db .ln{position:absolute;top:6px;height:1px;background:rgba(25,25,23,.24)}
.db .e{position:absolute;top:3px;width:7px;height:7px;border-radius:50%;border:1px solid rgba(25,25,23,.4);background:var(--paper);margin-left:-3.5px}
.db .mk{position:absolute;top:.5px;width:12px;height:12px;border-radius:50%;background:var(--hls);border:1.5px solid var(--ink);margin-left:-6px}
.db em{position:absolute;top:14px;font-style:normal;font-variant-numeric:tabular-nums;font-size:10px;color:var(--fnt);letter-spacing:-.012em;transform:translateX(-50%);white-space:nowrap}
/* a range too narrow to draw prints an em dash instead */
.db.none{display:grid;place-items:center;font-variant-numeric:tabular-nums;font-size:12px;color:var(--fnt)}

/* positional rank: the letters quiet, the standing loud */
.rk{display:inline-flex;align-items:baseline;gap:1px}
.rk i{font-style:normal;font-size:.62em;font-weight:600;color:var(--mut);letter-spacing:.01em}
.rk b{font-weight:700;letter-spacing:-.03em}
.rk.none{color:var(--fnt)}

/* position decks — the settled roster row */


.pdeck{margin-top:14px}
.pdr{display:grid;grid-template-columns:38px minmax(0,1fr) 108px 64px;gap:0 14px;align-items:center;padding:0 16px}
.pdt{display:flex;align-items:flex-end;justify-content:space-between}/* the select now leads the panel, so it carries the gap instead of sitting in it */

.pgrp .tsel{margin:0 0 12px}
.pdhd{display:grid;grid-template-columns:108px 64px;gap:0 14px;padding:0 16px 6px 0;font-size:11.5px;font-weight:500;color:var(--mut)}
.pgrp{margin-top:0}
.pgrp+.pgrp{margin-top:18px}
.pgt{display:inline-block;font-size:12px;font-weight:600;padding:4px 12px 3px;border-radius:4px 4px 0 0;color:var(--ink)}
.pgt.p-QB{background:#F9B3C4}.pgt.p-RB{background:#A2E3D8}.pgt.p-WR{background:#AECDFB}.pgt.p-TE{background:#F8CFA4}.pgt.p-FLEX{background:#CFD6A8}.pgt.p-K{background:#D9B7FB}.pgt.p-DST{background:#C4CBD6}
.pgs{display:grid;background:#FFFDF7;border:1px solid rgba(25,25,23,.11);border-radius:0 5px 5px 5px;box-shadow:0 1px 1px rgba(25,25,23,.04)}
.pdr{height:64px;border-top:1px solid var(--hr)}
.pdr:first-child{border-top:0}
.pdr .face{width:38px;height:38px}
.pdw{min-width:0;line-height:1.25}
.pdn{display:block;font-size:15.5px;font-weight:600;letter-spacing:-.015em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pdm{display:block;font-size:12px;color:var(--mut);margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}/* the projection is a figure: condensed, the way every other figure on the
   site is set. Mono stays on ranges and prices, which are readings not scores. */

.pdv{font-family:var(--cond);font-size:20px;font-weight:700;letter-spacing:.01em;text-align:right;white-space:nowrap}
.pdk{font-size:13.5px;font-weight:600;text-align:right;white-space:nowrap}/* the range is a range, not a sum: floor over ceiling in its own quiet box,
   the hyphen kept against the low number so the pair reads top to bottom */

.pdg{font-variant-numeric:tabular-nums;font-size:11.5px;color:var(--mut2);text-align:right;white-space:nowrap;
  display:grid;justify-self:end;gap:1px;padding:5px 7px;border-radius:4px;background:rgba(25,25,23,.05);line-height:1.15}
.pdg i,.pdg b{font-style:normal;font-weight:400;display:block}
.pdg b{color:var(--ink);font-weight:500}
.pdr.dim .pdn{color:var(--mut2);font-weight:500}
.pdr.dim .face{opacity:.75}
@media(max-width:600px){
.pdr{grid-template-columns:32px minmax(0,1fr) 96px 56px;gap:0 10px;padding:0 12px}
.pdhd{grid-template-columns:96px 56px;gap:0 10px;padding:0 12px 5px 0}
.pdr{height:60px}
.pdr .face{width:32px;height:32px}
.pdn{font-size:14.5px}
.pdv{font-size:19px}
.pdk{font-size:13px}
.pdg{font-size:12px}}/* start/sit decks — lineup rows in the settled grammar */


.pdhd.w3{grid-template-columns:56px 60px 76px}
.pdr.pdsl{grid-template-columns:46px 38px minmax(0,1fr) 56px 60px 76px;height:64px}/* grouped decks put the slot on the band above, so the row's slot track is
   empty — collapse it and give the width to the name */

.pdr.pdsl.pdso{grid-template-columns:38px minmax(0,1fr) 56px 60px 76px}
.pdr.pdsl .face{width:38px;height:38px}
.pdr.pdsl .pdn{font-size:15.5px}/* Both roster column heads stack over their figure. The head is its own grid
   sitting next to the position chip, so it only lands over the columns if it is
   pushed to the right edge and carries the row's own track widths and padding.
   Right-aligned to match the figures, which are right-aligned. */

.pdhd span i{font-style:normal;display:block}
.pdhd{font-size:10.5px;line-height:1.25;margin-left:auto}
.pdhd span{text-align:right}/* the projection is a figure, so it takes the condensed face the site uses
   for figures; mono stays on the range, which is a pair of readings */


.pdr.pdsl .pdv,.mrow .pdv,.pdtot .pdv{font-family:var(--cond);font-size:21px;font-weight:700;letter-spacing:.01em}
.pdhd.w3 span:first-child{font-weight:600;color:var(--mut2)}
.pds{font-size:11.5px;font-weight:600;letter-spacing:.02em;color:var(--mut2);white-space:nowrap}
.pdr.pdsl.runs{border-top:1px solid var(--hr2)}
.pgs>.pdr.pdsl:first-child{border-top:0}
.pgt.t-bn{background:#E9E7DC}
.pdr.tap{cursor:pointer;transition:background .12s}
.pdr.tap:hover{background:rgba(25,25,23,.03)}
.pdr.tap:focus-visible{outline:2px solid var(--acc);outline-offset:-2px}
.pdm em.gain{font-style:normal;color:var(--up);font-weight:500}
.pdr.flash{animation:pcf .9s ease}
@keyframes pcf{from{background:var(--hl)}}
@media(max-width:600px){/* the row held 236px of fixed columns and left the name about fifty. The
   positional rank goes — it is on the player's card — and the name gets it. */

.pdhd.w3{grid-template-columns:52px 52px;gap:0 10px}
.pdhd.w3 span:nth-child(2){display:none}
.pdr.pdsl{grid-template-columns:40px 32px minmax(0,1fr) 52px 52px;height:62px}
.pdr.pdsl.pdso{grid-template-columns:32px minmax(0,1fr) 52px 52px}
.pdr.pdsl>.pdk{display:none}
.pdr.pdsl .face{width:32px;height:32px}
.pdr.pdsl .pdn{font-size:14.5px}
.pdr.pdsl .pdv,.mrow .pdv{font-size:20px}
.pds{font-size:10.5px}
.pdg{font-size:11px;padding:4px 6px}}/* swap modal — rows in the deck grammar */


.mhd{display:grid;grid-template-columns:38px minmax(0,1fr) 48px 76px 56px;gap:0 14px;padding:12px 4px 6px;font-size:11.5px;font-weight:500;color:var(--mut)}
.mhd span{text-align:right}
.mhd .sp{grid-column:1/3}
.mlist{display:grid}
.mrow{display:grid;grid-template-columns:38px minmax(0,1fr) 48px 76px 56px;gap:0 14px;align-items:center;min-height:60px;padding:8px 4px;border-top:1px solid var(--hr);text-align:left;transition:background .1s}
.mlist>.mrow:first-child{border-top:0}
.mrow:not(.cur){cursor:pointer}
.mrow:not(.cur):hover{background:rgba(25,25,23,.04)}
.mrow:focus-visible{outline:2px solid var(--acc);outline-offset:-2px}
.mrow .face{width:38px;height:38px}
.mrow .pdv{font-size:16px}
.mrow.cur .pdn{font-weight:700;box-shadow:inset 0 -.14em 0 var(--hl);display:inline}
.mdl{font-variant-numeric:tabular-nums;font-size:13px;font-weight:500;letter-spacing:-.012em;text-align:right;white-space:nowrap}
.mdl.up{color:var(--up)}
.mdl.dn{color:var(--dn)}
.mdl.z{color:var(--fnt)}
.mrow.cur .mdl{font-family:var(--sans);font-size:12px;color:var(--mut)}
@media(max-width:600px){
.mhd,.mrow{grid-template-columns:32px minmax(0,1fr) 44px 68px 48px;gap:0 10px}
.mrow .face{width:32px;height:32px}
.mrow .pdv{font-size:14.5px}
.mrow .pdg{font-size:12px}}/* start/sit — one card per starting slot */


.pdeck.slots .pgrp+.pgrp{margin-top:12px}
.pdr.pdso{grid-template-columns:38px minmax(0,1fr) 56px 60px 76px}
.pgt.p-SF{background:#F9B3C4}
@media(max-width:600px){
.pdr.pdso{grid-template-columns:32px minmax(0,1fr) 48px 54px 62px}}/* lineup total row */


.pdtot{display:grid;grid-template-columns:minmax(0,1fr) 56px 60px 76px;gap:0 14px;align-items:center;margin-top:12px;padding:13px 16px;background:#FFFDF7;border:1px solid rgba(25,25,23,.11);border-radius:5px;box-shadow:0 1px 1px rgba(25,25,23,.04)}
.pdtot .lbl{font-size:13.5px;font-weight:600;letter-spacing:-.015em}
.pdtot .pdv{background:var(--hl);border-radius:2px;padding:1px 4px;justify-self:end}/* the total's range has the width to stay on one line */

.pdtot .pdg{font-size:12.5px;color:var(--mut2);justify-self:end;display:block}
.pdtot .pdg i,.pdtot .pdg b{display:inline}
@media(max-width:600px){
.pdtot{grid-template-columns:minmax(0,1fr) 48px 54px 62px;gap:0 10px;padding:11px 12px}}
.pdtot .lbl em.gain,.pdtot .lbl em.loss{font-style:normal;font-weight:600}
.pdtot .lbl em.gain{color:var(--up)}/* the tale of the tape (matchup) */


.h2tape{--tpx:22px;margin-top:14px;max-width:760px;background:#FFFDF7;border:1px solid rgba(25,25,23,.11);border-radius:6px;box-shadow:0 1px 1px rgba(25,25,23,.04);padding:0 var(--tpx)}
.h2tape .sb{display:grid;grid-template-columns:1fr auto 1fr;align-items:baseline;gap:0 16px;padding:20px 0 16px;border-bottom:2px solid var(--ink)}
.h2tape .tn{display:block;font-size:16.5px;font-weight:700;letter-spacing:-.02em;margin-bottom:8px}
.h2tape .ow2{display:block;font-size:11.5px;color:var(--mut);font-weight:500;margin-bottom:4px}
.h2tape .sb .r .own{margin-left:0;margin-right:6px}
.h2tape .sb b{font-family:var(--cond);font-size:48px;font-weight:700;letter-spacing:.01em;line-height:1}
.h2tape .sb b i{font-style:normal;border-radius:3px;padding:0 6px;margin:0 -6px;background:linear-gradient(var(--hl),var(--hl)) 0 58%/100% 72% no-repeat}
.h2tape .sb .r,.h2tape .tt .r{text-align:right}
.h2tape .mid{text-align:center;align-self:center}
.h2tape .mid .wk{display:block;font-size:12.5px;color:var(--mut)}
.h2tape .mid em{font-style:normal;display:block;font-weight:700;font-size:15.5px;letter-spacing:-.02em;margin-top:5px;white-space:nowrap;background:var(--hl);border-radius:3px;padding:2px 8px}
.h2tape .tr{display:grid;grid-template-columns:minmax(0,1fr) 60px minmax(0,1fr);align-items:center;min-height:58px;position:relative;margin:0 calc(-1*var(--tpx));padding:0 var(--tpx)}
.h2tape .tr::before{content:"";position:absolute;left:var(--tpx);right:var(--tpx);top:0;height:1px;background:var(--hr)}
.h2tape .tr .hc{padding-right:14px}
.h2tape .tr .hc.r{padding-right:0;padding-left:14px}
.h2tape .tr:nth-of-type(2)::before{display:none}
.h2tape .hc,.h2duo .hc{display:grid;grid-template-columns:32px minmax(0,1fr) 48px;gap:0 13px;align-items:center;min-width:0;font-family:var(--sans);text-align:left}
.h2tape .hc.r,.h2duo .hc.r{grid-template-columns:48px minmax(0,1fr) 32px}
.h2tape .hc.r .w2,.h2duo .hc.r .w2{text-align:right}
.h2tape .w2,.h2duo .w2{min-width:0;line-height:1.25}
.h2tape .hc .nm,.h2duo .hc .nm{display:block;font-family:var(--sans);font-size:15px;font-weight:600;letter-spacing:-.015em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.h2tape .mt,.h2duo .mt{display:block;font-family:var(--sans);font-weight:400;font-size:11.5px;color:var(--mut);margin-top:4px;white-space:nowrap}
.h2tape .pv,.h2duo .pv{font-family:var(--sans);font-size:15px;font-weight:500;letter-spacing:-.012em;white-space:nowrap;color:var(--mut2)}
.h2tape .pv.w{color:var(--ink);background:var(--hl);border-radius:2px;padding:1px 5px;margin-right:-5px}
.h2tape .hc.r .pv.w{margin-right:0;margin-left:-5px}
.h2tape .tsl{display:inline-grid;place-items:center;justify-self:center;font-size:10px;font-weight:600;border-radius:3px;padding:2px 7px;background:rgba(25,25,23,.06);white-space:nowrap}
.h2tape .tsl.p-QB,.h2tape .tsl.p-SF{background:#F9B3C4}
.h2tape .tsl.p-RB{background:#A2E3D8}
.h2tape .tsl.p-WR{background:#AECDFB}
.h2tape .tsl.p-TE{background:#F8CFA4}
.h2tape .tsl.p-FLEX{background:#CFD6A8}
.h2tape .tsl.p-K{background:#D9B7FB}
.h2tape .tsl.p-DST{background:#C4CBD6}
.h2tape .tt{display:grid;grid-template-columns:1fr auto 1fr;align-items:baseline;gap:0 16px;padding:16px 0 18px;border-top:2px solid var(--ink)}
.h2tape .tt b{font-family:var(--cond);font-size:28px;font-weight:700;letter-spacing:.02em}
.h2tape .rg{display:block;font-variant-numeric:tabular-nums;font-size:10.5px;color:var(--fnt);margin-top:5px}
.h2tape .tt .m{font-size:11px;color:var(--fnt);align-self:center;text-align:center;white-space:nowrap}
.h2duo{display:grid;grid-template-columns:1fr 1fr;gap:0 40px;margin-top:14px;max-width:760px}
.h2duo .bh2{font-size:13px;font-weight:600;color:var(--mut2);padding-bottom:6px}
.h2duo .bh2.r{text-align:right}
.h2duo .bstk{--bpx:16px;background:#FFFDF7;border:1px solid rgba(25,25,23,.11);border-radius:6px;box-shadow:0 1px 1px rgba(25,25,23,.04);padding:4px var(--bpx)}
.h2duo .bstk .hc{min-height:48px;position:relative;margin:0 calc(-1*var(--bpx));padding:0 var(--bpx)}
.h2duo .bstk .hc::before{content:"";position:absolute;left:var(--bpx);right:var(--bpx);top:0;height:1px;background:var(--hr)}
.h2duo .bstk .hc:first-child::before{display:none}
.h2duo .bstk .face{width:28px;height:28px}
.h2duo .bstk .nm{font-weight:500;font-size:14px}
.h2duo .bstk .pv{font-size:13.5px}
@media(max-width:600px){
.h2tape{--tpx:16px;margin-left:calc(-1*var(--pad));margin-right:calc(-1*var(--pad));max-width:none;border-left:0;border-right:0;border-radius:0}
.h2tape .hc .face,.h2tape .hc .face.big,.h2duo .hc .face{width:26px;height:26px}
.h2tape .hc,.h2duo .hc{grid-template-columns:26px minmax(0,1fr) auto;gap:0 11px}
.h2tape .hc.r,.h2duo .hc.r{grid-template-columns:auto minmax(0,1fr) 26px}
.h2tape .hc .nm,.h2duo .hc .nm{font-size:13px}
.h2tape .nm em.tm2,.h2duo .nm em.tm2{display:none}
.h2tape .pv,.h2duo .pv{font-size:12.5px}
.h2tape .tr .hc{padding-right:8px}
.h2tape .tr .hc.r{padding-left:8px}
.h2tape .sb b{font-size:34px}
.h2tape .tn{font-size:13.5px}
.h2tape .mid em{font-size:12px;padding:2px 6px}
.h2tape .tr{grid-template-columns:minmax(0,1fr) 42px minmax(0,1fr);min-height:52px}
.h2tape .tsl{padding:2px 5px;font-size:9px}
.h2tape .tt b{font-size:21px;letter-spacing:.01em}
.h2duo{grid-template-columns:1fr;gap:22px}
.h2duo .bh2.r{text-align:left}}

@media(min-width:601px){.h2tape .hc .face,.h2tape .hc .face.big{width:32px;height:32px}}
.h2tape .tr{background:none}
.h2tape .tsl{font-family:var(--sans);color:var(--ink);font-style:normal}

.h2tape .nm em.tm2,.h2duo .nm em.tm2{font-style:normal;font-family:var(--sans);font-size:11.5px;font-weight:400;color:var(--mut);margin-left:7px;letter-spacing:0}

.h2tape .pv.asrk,.h2duo .pv.asrk{font-family:var(--sans);font-size:13px;font-weight:600}
.h2tape .tr,.h2duo .hc{cursor:default}
@media(hover:hover){.h2tape .tr:hover,.h2duo .hc:hover{background:rgba(25,25,23,.02)}}

.h2tape .nm i.fn,.h2duo .nm i.fn,.h2tape .nm i.sn,.h2duo .nm i.sn{font-style:normal}
.h2tape .nm i.sn,.h2duo .nm i.sn{display:none}
@media(max-width:600px){
.h2tape .nm i.fn,.h2duo .nm i.fn{display:none}
.h2tape .nm i.sn,.h2duo .nm i.sn{display:inline}
.h2tape .hc .nm,.h2duo .hc .nm{font-size:12.5px}}/* matchup week selector: chips on desktop, dropdown on phones */


.wkselwrap{display:block;margin-top:18px}
.wkselwrap .wl{display:block;font-size:11.5px;font-weight:500;color:var(--mut);margin-bottom:6px}
.wksel{font:inherit;font-size:13.5px;font-weight:600;letter-spacing:-.01em;color:var(--ink);background-color:#FFFDF7;border:1px solid rgba(25,25,23,.16);border-radius:5px;padding:8px 32px 8px 12px;width:auto;min-height:38px;box-shadow:0 1px 1px rgba(25,25,23,.05);-webkit-appearance:none;appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--ink) 50%),linear-gradient(135deg,var(--ink) 50%,transparent 50%);background-position:calc(100% - 18px) 50%,calc(100% - 13px) 50%;background-size:5px 5px;background-repeat:no-repeat;cursor:pointer}
.wksel:active{background-color:rgba(25,25,23,.03)}
.wksel:focus-visible{outline:2px solid var(--acc);outline-offset:1px}

.h2tape .hc .pv,.h2duo .hc .pv{justify-self:end;text-align:right}
.h2tape .hc.r .pv,.h2duo .hc.r .pv{justify-self:start;text-align:left}
@media(max-width:600px){.h2tape .hc,.h2duo .hc{grid-template-columns:26px minmax(0,1fr) 44px}.h2tape .hc.r,.h2duo .hc.r{grid-template-columns:44px minmax(0,1fr) 26px}}/* bench: position pills + full-bleed on phones */


.h2duo .tsl{display:inline-grid;place-items:center;justify-self:start;font-style:normal;font-family:var(--sans);font-size:9.5px;font-weight:600;border-radius:3px;padding:2px 6px;background:rgba(25,25,23,.06);letter-spacing:0}
.h2duo .hc.r .tsl{justify-self:end}
.h2duo .tsl.p-QB,.h2duo .tsl.p-SF{background:#F9B3C4}
.h2duo .tsl.p-RB{background:#A2E3D8}
.h2duo .tsl.p-WR{background:#AECDFB}
.h2duo .tsl.p-TE{background:#F8CFA4}
.h2duo .tsl.p-K{background:#D9B7FB}
.h2duo .tsl.p-DST{background:#C4CBD6}
@media(max-width:600px){
.h2duo{max-width:none}
.h2duo .bstk{--bpx:var(--pad);margin-left:calc(-1*var(--pad));margin-right:calc(-1*var(--pad));border-left:0;border-right:0;border-radius:0}}

.h2duo .bstk .hc{grid-template-columns:28px auto minmax(0,1fr) 48px}
.h2duo .bstk .hc.r{grid-template-columns:48px minmax(0,1fr) auto 28px}
@media(max-width:600px){
.h2duo .bstk .hc{grid-template-columns:26px auto minmax(0,1fr) 44px}
.h2duo .bstk .hc.r{grid-template-columns:44px minmax(0,1fr) auto 26px}}

.sect.nb{border-top:0;padding-top:0}/* matchup needle: bigger, readout to the right */


.ndlx{display:flex;align-items:center;gap:28px;flex-wrap:wrap}
.ndlx .ndl{max-width:320px;margin:0;flex:none;width:min(320px,60vw)}
.ndlx .ndlread{display:block;margin:0;max-width:330px}
.ndlx .ndlread .fig{display:flex;align-items:flex-start;gap:3px;line-height:1}
.ndlx .ndlread .fig b{font-family:var(--cond);font-size:82px;font-weight:700;line-height:.84;letter-spacing:.005em}
.ndlx .ndlread .fig i{font-style:normal;font-family:var(--cond);font-size:28px;font-weight:700;color:var(--mut);margin-top:4px}
.ndlx .ndlread p{font-family:var(--serif);font-size:18px;line-height:1.42;color:var(--ink);margin:10px 0 0;text-wrap:pretty;letter-spacing:-.005em}
.ndlx .ndlread p b{font-family:var(--sans);font-weight:600;font-size:.88em}
@media(max-width:600px){
.ndlx{flex-direction:column;align-items:center;gap:14px}
.ndlx .ndl{width:min(300px,80vw);max-width:none}
.ndlx .ndlread{max-width:none;text-align:center}
.ndlx .ndlread .fig{justify-content:center}
.ndlx .ndlread .fig b{font-size:64px}
.ndlx .ndlread p{font-size:16px;margin-left:auto;margin-right:auto;max-width:32ch}}/* matchup: what decides it *//* value chart movers */



.vmov{margin-top:42px;max-width:840px}
.vm{display:block;font-size:11.5px;color:var(--mut);margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vd{font-weight:600;font-size:15px;letter-spacing:-.015em;white-space:nowrap}.vd.z{color:var(--fnt)}

.oddsx .chwrap{background:#FFFDF7;border:1px solid rgba(25,25,23,.12);border-radius:8px;padding:16px 18px 14px;margin-top:4px}
.oddsx .chwrap .dh{border-bottom:1px solid var(--hr);padding-bottom:9px;margin-bottom:6px}/* the bump chart, Layout VI vocabulary */

.oddsx .bump{display:block;width:100%;height:auto;margin-top:6px}
.oddsx .bump .rr{stroke:rgba(25,25,23,.04);stroke-width:1}
.oddsx .bump .ax{font-family:var(--sans);font-size:10.5px;fill:rgba(25,25,23,.44)}
.oddsx .bump .rk{font-size:12px;font-weight:600;fill:rgba(25,25,23,.58);letter-spacing:-.01em}
.oddsx .bump g.you circle.wk{fill:#191917;stroke:none}
.oddsx .bump .lb{font-family:var(--sans);font-size:14px;font-weight:500;fill:#3A3833;letter-spacing:-.012em}
.oddsx .bump g.ln polyline{stroke:rgba(25,25,23,.16);stroke-width:1;transition:stroke .16s,stroke-width .16s}
.oddsx .bump g.ln circle{fill:#C8C7C0;transition:fill .16s}
.oddsx .bump g.you polyline{stroke:#191917;stroke-width:2.4}
.oddsx .bump g.you polyline.mk{stroke:#FFE86B;stroke-width:5;opacity:.72}
.oddsx .bump g.you circle{fill:#FFE86B;stroke:#191917;stroke-width:1.6}
.oddsx .bump g.you .lb{fill:#191917;font-weight:700}
.oddsx .bump.dim g.ln:not(.lit):not(.you) polyline{stroke:rgba(25,25,23,.08)}
.oddsx .bump.dim g.ln:not(.lit):not(.you) .lb{fill:#C4C3BA}
.oddsx .bump.dim g.ln:not(.lit):not(.you) .lv{fill:#D4D3CC}
.oddsx .bump g.lit polyline{stroke:rgba(25,25,23,.8);stroke-width:1.9}
.oddsx .bump g.lit circle{fill:#5F5E58}
.oddsx .bump g.lit .lb{fill:#191917;font-weight:700}

.oddsx .fnm em.wl{font-style:normal;font-size:13px;font-weight:500;color:var(--mut);letter-spacing:-.01em;padding:0;flex:none;line-height:1.1}

.oddsx .vnone{font-family:var(--serif);font-size:14.5px;line-height:1.5;color:var(--mut);margin:12px 0 0;max-width:58ch}

.oddsx .vbtn{margin:16px 0 0}
.oddsx .vbtn a{display:inline-block;font-size:13.5px;font-weight:600;letter-spacing:-.012em;color:var(--ink);background:#FFFDF7;border:1px solid rgba(25,25,23,.2);border-radius:5px;padding:10px 16px;box-shadow:0 1px 1px rgba(25,25,23,.04);transition:background .12s,border-color .12s}
.oddsx .vbtn a:hover{background:var(--hl);border-color:rgba(25,25,23,.32);color:var(--ink)}
.oddsx .fnm{display:flex;align-items:baseline;gap:9px;min-width:0;overflow:visible;text-overflow:clip;line-height:1.1}
.oddsx .fnm>span.tt{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

.oddsx .dateline.wk{font-size:17px;font-weight:700;letter-spacing:-.02em;color:var(--ink);margin-bottom:10px}

.oddsx .upd{font-size:12.5px;color:var(--fnt);margin:9px 0 0}

@media(max-width:600px){.oddsx .mkwrap{gap:9px}.oddsx .mk{display:flex;width:100%}.oddsx .mk button{flex:1;padding:0 4px;font-size:12px}}/* week scrubber */
.scb{display:inline-flex;gap:3px;padding:3px;border-radius:8px;background:rgba(25,25,23,.05);overflow-x:auto;scrollbar-width:none;max-width:100%}
.scb::-webkit-scrollbar{display:none}
.scb button{flex:none;min-height:30px;padding:0 12px;border-radius:6px;font-size:12.5px;font-weight:600;color:var(--mut);white-space:nowrap;transition:background .14s,color .14s}
.scb button:hover{background:rgba(25,25,23,.05);color:var(--ink)}
.scb button.on,.scb button.on:hover{background:var(--hl);color:var(--ink)}
@media(max-width:600px){.scb{width:100%}}/* mobile: rank by week as a scrubbed board */


.chwrap.wkboard .scb{display:flex;gap:3px;padding:3px;border-radius:8px;background:rgba(25,25,23,.05);margin-bottom:14px;overflow-x:auto;scrollbar-width:none}
.chwrap.wkboard .scb::-webkit-scrollbar{display:none}
.chwrap.wkboard .scb button{flex:1;min-width:52px;min-height:30px;border-radius:6px;font-size:12.5px;font-weight:600;color:var(--mut);white-space:nowrap}
.chwrap.wkboard .scb button.on{background:var(--hl);color:var(--ink)}
.r1hd{display:grid;grid-template-columns:22px minmax(0,1fr) 44px 62px;gap:0 10px;align-items:end;padding-bottom:7px;border-bottom:1px solid var(--hr2);font-size:11px;color:var(--fnt)}
.r1hd span:nth-child(3),.r1hd span:last-child{text-align:right}
.r1{display:grid;grid-template-columns:22px minmax(0,1fr) 44px 62px;gap:0 10px;align-items:center;height:46px;border-bottom:1px solid var(--hr)}
.r1:last-child{border-bottom:0}
.r1 .k{font-family:var(--cond);font-size:20px;font-weight:700;color:rgba(25,25,23,.22)}
.r1.you .k{color:var(--ink)}
.r1 .n{font-size:14px;font-weight:600;letter-spacing:-.015em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.r1 .m{font-size:11.5px;text-align:right;color:var(--fnt)}
.r1 .m.up{color:var(--up)}.r1 .m.dn{color:var(--dn)}
.r1 .v{font-family:var(--cond);font-size:23px;font-weight:700;text-align:right}
.r1 .v em{font-style:normal;font-size:12px;color:var(--mut);margin-left:1px}
.r1.you .v{background:linear-gradient(var(--hl),var(--hl)) 0 60%/100% 56% no-repeat}/* volatility readout */


.volc{margin-top:14px;background:#FFFDF7;border:1px solid rgba(25,25,23,.12);border-radius:8px;padding:16px 18px 17px;max-width:760px}
.vscale{padding:6px 0 0}
.vtrack{position:relative;display:flex;gap:0;height:26px;align-items:center}
.vtrack::before{content:"";position:absolute;left:0;right:0;top:50%;height:2px;margin-top:-1px;background:rgba(25,25,23,.1)}
.vtrack i{position:relative;flex:1;height:9px;border-left:1px solid rgba(25,25,23,.14)}
.vtrack i:first-child{border-left:0}
.vdot{position:absolute;top:50%;width:15px;height:15px;margin:-7.5px 0 0 -7.5px;border-radius:50%;background:var(--hl);box-shadow:0 0 0 2px var(--ink) inset}
.vends{display:flex;align-items:baseline;justify-content:space-between;gap:14px;margin-top:9px;font-size:11.5px;color:var(--fnt)}
.vnow{font-size:13.5px;font-weight:600;color:var(--ink);letter-spacing:-.015em}
.volp{font-family:var(--serif);font-size:15px;line-height:1.55;color:var(--body);margin:13px 0 0;max-width:62ch;text-wrap:pretty}
@media(max-width:600px){
.volc{padding:14px 15px 15px}
.volp{font-size:14.5px}}

@media(max-width:600px){
.rwgrid{grid-template-columns:1fr!important;gap:10px}}

.prose.mwide{margin-top:16px;font-size:16px;max-width:78ch}/* Schedule — the written season *//* .upd2 had no base rule, so on the magazine the date fell back to the sheet's
   body size and read almost as loud as the title */

.schx .upd2,.rkx .upd2,.agx .upd2,.propx .upd2,.mag .upd2{font-size:13px;color:var(--mut);margin:12px 0 0}
.wkcs2{display:grid;gap:7px;margin-top:18px;max-width:820px}
.wkc{background:#FFFDF7;border:1px solid rgba(25,25,23,.11);border-radius:7px;overflow:hidden;transition:border-color .14s}
.wkc:hover{border-color:rgba(25,25,23,.2)}
.wkc.now{border-color:rgba(25,25,23,.3)}/* closed rows are all exactly the same height */

.wkch{display:grid;grid-template-columns:52px minmax(0,1fr) auto 13px;gap:0 18px;align-items:center;width:100%;height:58px;text-align:left;padding:0 18px;position:relative}
.wkch:active{background:rgba(25,25,23,.02)}
.wkcw{font-size:12px;font-weight:500;color:var(--fnt);white-space:nowrap}
.wkco{display:flex;align-items:center;gap:10px;min-width:0;font-size:16px;font-weight:600;letter-spacing:-.018em;line-height:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wknow{flex:none;font-style:normal;font-size:9.5px;font-weight:600;letter-spacing:.02em;line-height:17px;height:17px;background:var(--hl);color:var(--ink);border-radius:3px;padding:0 7px}
.wkcp{font-family:var(--cond);font-size:21px;font-weight:700;letter-spacing:.01em;line-height:1;white-space:nowrap}
.wkcp em{font-style:normal;font-family:var(--sans);font-size:11px;font-weight:500;color:var(--mut);margin-left:1px}/* played weeks show the result in place of the projection */

.wkres{display:flex;align-items:center;gap:9px;white-space:nowrap}
.wkres b{flex:none;display:inline-grid;place-items:center;width:20px;height:20px;border-radius:4px;font-family:var(--sans);font-size:11px;font-weight:700;line-height:1;background:rgba(25,25,23,.08);color:var(--mut)}
.wkres.w b{background:rgba(31,122,61,.14);color:var(--up)}
.wkres.l b{background:rgba(201,48,48,.12);color:var(--dn)}
.wkres em{font-style:normal;font-family:var(--cond);font-size:19px;font-weight:700;letter-spacing:.01em;line-height:1;color:var(--ink)}
.wkc.past{background:rgba(25,25,23,.018)}
.wkc.past .wkco{color:var(--mut2)}
@media(max-width:600px){.wkres{gap:8px}.wkres b{width:18px;height:18px;font-size:10px}.wkres em{font-size:17px}}

.wkcx{position:relative;width:11px;height:11px;justify-self:end}
.wkcx::before,.wkcx::after{content:"";position:absolute;left:50%;top:50%;background:rgba(25,25,23,.32);transition:opacity .16s}
.wkcx::before{width:11px;height:2px;margin:-1px 0 0 -5.5px}
.wkcx::after{width:2px;height:11px;margin:-5.5px 0 0 -1px}
.wkc.open .wkcx::after{opacity:0}
.wkc.open .wkcx::before{background:var(--ink)}/* expanded body */

.wkcb{border-top:1px solid var(--hr);padding:18px}
.wkfig{display:inline-flex;align-items:stretch;gap:0;background:rgba(25,25,23,.03);border-radius:6px;padding:12px 0}
.wkf{display:grid;gap:4px;padding:0 20px;border-left:1px solid rgba(25,25,23,.09)}
.wkf:first-child{border-left:0}
.wkf i{font-style:normal;font-size:10px;color:var(--mut);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wkf b{font-family:var(--cond);font-size:22px;font-weight:700;line-height:1;letter-spacing:.01em}
.wkf.mid b{color:var(--ink)}
.prose.wkp{margin-top:18px;font-size:16px;max-width:70ch}
.prose.wkp p{margin:0 0 12px}
.prose.wkp p:last-child{margin-bottom:0}
.prose.wkp.first{margin-top:18px}
.wkbtn{margin:18px 0 0;padding-top:16px;border-top:1px solid var(--hr)}
.wkbtn a{display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 15px;border:1px solid rgba(25,25,23,.18);border-radius:6px;background:#FFFDF7;font-size:13px;font-weight:600;letter-spacing:-.012em;color:var(--ink);text-decoration:none;transition:background .14s,border-color .14s}
.wkbtn a:hover{background:var(--hl);border-color:rgba(25,25,23,.3)}
.wkbtn a span{font-size:12px;color:var(--mut)}
.wkbtn a:hover span{color:var(--ink)}
@media(max-width:600px){
.wkch{grid-template-columns:42px minmax(0,1fr) auto 11px;gap:0 11px;padding:0 14px;height:56px}
.wkco{font-size:15px;gap:8px}
.wkcp{font-size:19px}
.wkcb{padding:14px}
.wkfig{padding:11px 0}
.wkf{padding:0 13px}
.wkf b{font-size:19px}
.prose.wkp{font-size:15.5px;margin-top:15px}}
/* Props */
.pcards{display:grid;gap:12px;margin-top:18px;max-width:900px}
/* overflow:hidden was arriving from a player-card component that shared this
   class name and no longer exists; stated here now, where it is actually
   needed to keep the row list inside the rounded corners. */
.pcard{background:#FFFDF7;border:1px solid rgba(25,25,23,.11);border-radius:8px;
  padding:16px 18px 17px;overflow:hidden}
/* The rule under the heading was a 2px band in the tab's own colour running
   the full width of the card, directly above eight probability pills painted
   in that same colour — it won every scan it competed in. It is now 1px and
   only as wide as the word it underlines, so it marks the heading instead of
   dividing the card. On the h4 rather than on .pch: a flex item is the width
   of its own text, which is the whole point. */
.pch{display:flex;align-items:baseline;justify-content:space-between;gap:14px;padding-bottom:11px}
.pch h4{font-size:15px;font-weight:700;letter-spacing:-.02em;margin:0;
  padding-bottom:6px;border-bottom:1px solid var(--pmk,var(--hr))}
.pch span{font-size:11px;color:var(--fnt)}
.pnote{font-family:var(--serif);font-size:14px;line-height:1.55;color:var(--mut2);margin:14px 0 0;padding-top:12px;border-top:1px solid var(--hr);max-width:66ch;text-wrap:pretty}
.plist{display:grid}
.prow{display:grid;grid-template-columns:minmax(0,1fr) 66px 68px 62px;gap:0 14px;align-items:center;min-height:52px;padding:9px 0;border-bottom:1px solid var(--hr)}
.prow:last-child{border-bottom:0}
.plab{font-size:14px;font-weight:500;letter-spacing:-.012em;line-height:1.35;min-width:0}
.plab em{display:block;font-style:normal;font-size:11px;font-weight:400;color:var(--fnt);margin-top:4px;line-height:1.4}
.pchance{font-family:var(--cond);font-size:20px;font-weight:700;letter-spacing:.01em;text-align:right}
.podds{font-size:13.5px;font-weight:500;color:var(--mut2);text-align:right;white-space:nowrap}
.pst{font-size:10px;font-weight:600;letter-spacing:.02em;text-align:center;border-radius:3px;padding:3px 0;background:rgba(25,25,23,.06);color:var(--mut)}
.pst.hit{background:rgba(31,122,61,.14);color:var(--up)}
.pst.missed{background:rgba(201,48,48,.12);color:var(--dn)}
.prow.missed .plab{color:var(--mut)}
.ptbl{display:block;width:auto;margin-top:2px}
.pth,.ptr{display:grid;gap:0 14px;align-items:center}
.ptbl.fut .pth,.ptbl.fut .ptr,.ptbl.wt .pth,.ptbl.wt .ptr,.ptbl.wl .pth,.ptbl.wl .ptr{grid-template-columns:minmax(0,1fr) 66px 62px 78px 62px}
.ptbl.op .pth,.ptbl.op .ptr{grid-template-columns:minmax(0,1fr) 78px 78px}
.pth{padding:9px 0 8px;font-size:11px;color:var(--fnt)}
.pth span:not(:first-child){text-align:right}
.ptr{min-height:52px;padding:7px 0;border-top:1px solid var(--hr)}
.ptn{font-size:14.5px;font-weight:600;letter-spacing:-.016em;line-height:1.25;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ptn em{display:block;font-style:normal;font-size:11px;font-weight:400;color:var(--mut);margin-top:3px}
.ptn .pat{font-style:normal;font-size:11px;font-weight:400;color:var(--fnt)}/* Each figure carries its own label in the markup. The column head says it at
   desktop width, so the label only appears where the head cannot follow. *//* The section index is a phone answer to a phone problem — eight cards and six
   thousand pixels of scroll. The desktop column keeps the plain stack. */


.pnav{display:none}
.flb{display:none}
.pnum{font-size:13.5px;font-weight:500;color:var(--mut2);text-align:right;white-space:nowrap}
.pnum.ink{color:var(--ink)}
.pnum.q{color:rgba(25,25,23,.4)}
.pbig{font-family:var(--cond);font-size:21px;font-weight:700;letter-spacing:.01em;text-align:right;white-space:nowrap}/* The pill takes its card's market colour at an opacity equal to the figure —
   full strength at a hundred, paper at nothing — so each market is legible as a
   gradient down its own column. color-mix rather than a fixed rgba ramp,
   because the hue is different in every card. */

.pbt{border-radius:3px;padding:2px 6px;justify-self:end;
  background:color-mix(in srgb,var(--pmk,var(--hls)) calc(var(--pt,0) * 1%),transparent)}
.pbig i{font-style:normal;font-family:var(--sans);font-size:11px;font-weight:500;color:var(--mut);margin-left:1px}
.pmv{font-size:13px;font-weight:500;text-align:right;white-space:nowrap;color:var(--fnt)}
.pmv.up{color:var(--up)}.pmv.dn{color:var(--dn)}
.ptr.you{margin:0 -18px;padding:7px 18px}/* the phone layout for this page is one block, further down *//* ===== The hub =====
   The weekly recap is the way in to the rest of the site: a card per section
   carrying a headline, that section's own prose, and a named button through to
   it. Colour is the accent set already in this file — the house highlight, the
   six --sel chips the Odds market rotates through, and the two nav-group tints
   — one per card, so the stack reads as a colour-coded index. It says where a
   card sends you, so it carries meaning rather than decorating. */



.hubcards{display:grid;gap:10px;margin-top:20px;max-width:760px}
.hubc{display:block;width:100%;text-align:left;cursor:pointer;background:#FFFDF7;
  border:1px solid rgba(25,25,23,.11);border-radius:8px;padding:15px 16px 14px;
  box-shadow:0 1px 1px rgba(25,25,23,.04);transition:border-color .14s}
.hubc:hover{border-color:rgba(25,25,23,.22)}
.hubc:focus-visible{outline:2px solid var(--acc);outline-offset:2px}
.hubk{display:inline-block;font-family:var(--cond);font-size:14px;font-weight:700;letter-spacing:.06em;
  text-transform:uppercase;color:var(--ink);background:var(--c,var(--hl));padding:4px 10px 3px;border-radius:3px}
.hubh{display:block;font-size:21px;font-weight:700;letter-spacing:-.026em;line-height:1.2;margin:9px 0 0;text-wrap:balance}
.hubb{display:block;font-family:var(--serif);font-size:14.5px;line-height:1.5;color:var(--body);
  margin:11px 0 0;text-wrap:pretty}/* no rule above the action — the card already ends where it ends */

.hubgo{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:15px}
.hubgo span{font-size:12.5px;font-weight:600;letter-spacing:-.008em;color:var(--mut)}
.hubc:hover .hubgo span{color:var(--ink)}
.hubarr{flex:none;width:32px;height:32px;border-radius:50%;background:var(--c,var(--hl));
  display:grid;place-items:center;transition:box-shadow .14s,transform .14s}
.hubc:hover .hubarr{box-shadow:0 2px 6px rgba(25,25,23,.18);transform:translateX(1px)}
.hubarr::after{content:"";width:7px;height:7px;border-right:1.6px solid var(--ink);border-top:1.6px solid var(--ink);
  transform:rotate(45deg);margin-left:-3px}/* section heads take the colour of what they introduce */


.hubhh{font-size:13px;font-weight:600;letter-spacing:-.006em;color:var(--mut);
  margin:34px 0 0;padding-bottom:9px;border-bottom:2px solid var(--c,var(--ink));max-width:760px}/* around the league — one card a game, each side with its share of the game */


.hubmg{display:grid;gap:9px;max-width:760px}
.hubm{display:block;width:100%;text-align:left;cursor:pointer;background:#FFFDF7;
  border:1px solid rgba(25,25,23,.11);border-radius:8px;padding:13px 15px 14px}
.hubm.you{background:rgba(255,232,107,.16);border-color:rgba(25,25,23,.16)}
.hubm:hover{border-color:rgba(25,25,23,.22)}
.hubmh{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:11px}
.hubmt{font-size:12.5px;color:var(--mut);letter-spacing:-.006em}
.hubmt.flip{color:var(--ink);font-weight:600}/* variance as a signal, on the tinted-pill treatment the props board uses */

.hubmv{font-family:var(--sans);font-size:10.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;
  padding:3px 8px;border-radius:3px;background:rgba(25,25,23,.06);color:var(--mut)}
.hubmv.low{background:rgba(31,122,61,.14);color:var(--up)}
.hubmv.med{background:rgba(255,216,77,.45);color:var(--ink)}
.hubmv.high{background:rgba(201,48,48,.12);color:var(--dn)}
.hubms{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:0 10px;align-items:baseline;padding:5px 0}
.hubmn{font-size:16px;font-weight:600;letter-spacing:-.018em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hubms.win .hubmn{font-weight:700}
/* Sohne Mono ships in one weight, so a bold mono figure is a faux-bold the
   browser smears on its own. Figures on this page are set in the sans, the
   same face and weight as the "where you stand" numbers below them. */
.hubmp{font-size:15px;font-weight:500;letter-spacing:-.016em;color:var(--mut2)}
.hubms.win .hubmp{color:var(--ink);font-weight:600}
.hubmb{grid-column:1/-1;display:flex;align-items:center;gap:8px;margin-top:5px}
.hubmb i{flex:1;height:5px;border-radius:2px;background:rgba(25,25,23,.08);overflow:hidden;display:block}
.hubmb i em{display:block;height:100%;background:rgba(25,25,23,.22)}
.hubms.win .hubmb i em{background:var(--ink)}
.hubmb b{font-size:11.5px;font-weight:400;letter-spacing:-.006em;color:var(--mut);min-width:38px;text-align:right}
.hubms.win .hubmb b{color:var(--ink);font-weight:600}/* ranked player lists *//* where you stand */


.hubql{max-width:760px;border-top:1px solid var(--hr)}
.hubq{display:flex;align-items:baseline;justify-content:space-between;gap:12px;
  padding:11px 0;border-bottom:1px solid var(--hr)}
.hubq:last-child{border-bottom:0}
.hubq span{font-size:14.5px;color:var(--body)}
.hubq b{font-size:16px;font-weight:600;letter-spacing:-.016em;white-space:nowrap}/* every block on Odds opens the same way: a head sitting on its own rule */


.oddsx .mkwrap{margin-top:16px}

@media(max-width:600px){
.hubcards{margin-top:16px}
.hubh{font-size:19px}
.hubmn{font-size:15px}}/* ===== Value charts =====
   Researched against three references and adapted to this paper.
   Primary: Uniswap Cup — a bracket/scoreboard system where every figure is
   monospace and tracked tight, corners are square, density is compact, and one
   accent is spent only on the leader and the active state. A price chart is a
   scoreboard, so it is built like one. Its fuchsia does not travel here; the
   house yellow keeps that role, which is the same rule with our own token.
   Borrowed, narrowly: the catalog discipline of Fonts In Use — condensed
   labels, small square-cornered inputs, dense ordered rows — and the ledger
   structure of Odin's Crow, where hairline rules do the work that cards were
   doing. The old chart stacked 154 rounded white cards; nothing else on this
   site is carded, and at 154 rows the card was pure cost. */



.vcx .phead{max-width:640px}/* the toolbar: lookup first, then the two ways to narrow the field */


.vbar{display:grid;gap:8px;margin-top:22px;max-width:760px}
.vsearch{position:relative;display:flex}
.vsearch input{flex:1;min-width:0;height:40px;padding:0 34px 0 12px;font:inherit;font-size:14.5px;
  color:var(--ink);background:#FFFDF7;border:1px solid var(--hr2);border-radius:2px;
  -webkit-appearance:none;appearance:none}
.vsearch input::-webkit-search-cancel-button{display:none}
.vsearch input::placeholder{color:var(--fnt)}
.vsearch input:focus{outline:none;border-color:var(--ink)}
.vclr{position:absolute;right:0;top:0;width:34px;height:40px;font-size:19px;line-height:1;color:var(--mut);cursor:pointer}
.vclr:hover{color:var(--ink)}/* The selectors are the market chips from Odds: a segmented control on a grey
   track, the live one filled in the house yellow. That control is already the
   site's way of saying "pick one of these", it reads as a control at a glance,
   and the position codes are short enough that all seven fit a phone without
   scrolling. Outlined boxes and bare type were both tried and were worse. *//* Filters as underline tabs rather than filled slabs. Three stacked grey
   panels was most of the 393px of chrome standing between the top of this page
   and its first row; the same controls set as tabs carry the state on a rule
   under the active one — the grammar .pnav already uses — and cost a third of
   the height and none of the weight. */


.vchips{display:flex;gap:0;padding:0;border-radius:0;background:none;
  box-shadow:inset 0 -1px 0 var(--hr)}
.vchips.own{box-shadow:none}
.vchip{flex:1;min-width:0;min-height:32px;display:grid;place-items:center;padding:0 4px;border-radius:0;
  font-size:12.5px;font-weight:500;letter-spacing:-.012em;color:var(--mut);white-space:nowrap;cursor:pointer;
  background:none;transition:color .14s,box-shadow .14s}
.vchip:hover{background:none;color:var(--ink)}
.vchip.on,.vchip.on:hover{background:none;color:var(--ink);font-weight:700;
  box-shadow:inset 0 -2px 0 var(--ink)}
.vchip:focus-visible{outline:2px solid var(--acc);outline-offset:-2px}/* The position filter is the one rail here that picks a category rather than a
   view, so it stops wearing the same underline as the other two and takes the
   position palette the roster, the waiver board and the trade calculator
   already use. A selected position holds its own colour. */


.vchips.vpos{display:flex;gap:6px;box-shadow:none;padding:3px 0 1px;margin-top:6px}
.vpc{flex:1 1 0;min-width:0;min-height:32px;padding:0 4px;border-radius:999px;
  display:grid;place-items:center;
  font-size:12.5px;font-weight:600;letter-spacing:-.008em;color:var(--mut2);
  background:rgba(25,25,23,.055);
  transition:background var(--d-state) var(--e-out),color var(--d-state) var(--e-out)}
.vpc:hover{background:rgba(25,25,23,.09);color:var(--ink)}
.vpc.on,.vpc.on:hover{color:var(--ink);font-weight:700;
  background:var(--vpcc,rgba(25,25,23,.055));box-shadow:inset 0 0 0 1px rgba(25,25,23,.13)}
.vpc.all.on,.vpc.all.on:hover{background:var(--ink);color:var(--paper);box-shadow:none}
.vpc.p-QB{--vpcc:#F9B3C4}.vpc.p-RB{--vpcc:#A2E3D8}.vpc.p-WR{--vpcc:#AECDFB}
.vpc.p-TE{--vpcc:#F8CFA4}.vpc.p-K{--vpcc:#D9B7FB}.vpc.p-DST{--vpcc:#C4CBD6}/* the owner rail keeps the underline, and now gets room of its own */

.vchips.own{margin-top:6px}/* The head was two ghost labels with 8px carets floating over a row they did
   not line up with — on a phone the figures stack, so a column head was lying
   about the layout anyway. It is a count and a sort control now, and the sort
   control is the same segmented switch as the filters above it. One direction
   only: a price list reads highest first, and nobody wants the worthless end
   of it on top. *//* No rule of its own any more. The sort tabs carry their state on their own
   underline, and the column head twelve pixels below closes the group — a black
   rule here made a second line doing the same job. *//* Just the sort tabs now. The count that used to share this row was what made
   the control slide: with space-between, a hidden count left the tabs at the
   left edge and a shown one threw them to the right, so filtering to Yours
   moved the whole sort control across the page. */




.vhead{display:flex;align-items:center;justify-content:flex-start;gap:12px;flex-wrap:wrap;
  margin-top:14px;padding-bottom:2px;max-width:760px}
.vsegs{display:flex;gap:0;padding:0;border-radius:0;background:none}
.vseg{min-height:27px;padding:0 11px;border-radius:0;font-size:11.5px;font-weight:500;
  letter-spacing:-.008em;color:var(--mut);white-space:nowrap;cursor:pointer;
  transition:background .14s,color .14s}
.vseg:hover{background:none;color:var(--ink)}
.vseg.on,.vseg.on:hover{background:none;color:var(--ink);font-weight:700;
  box-shadow:inset 0 -2px 0 var(--hl)}
.vseg:focus-visible{outline:2px solid var(--acc);outline-offset:-2px}
.vrow{display:grid;grid-template-columns:30px 34px minmax(0,1fr) 62px 58px;gap:0 12px;align-items:center}

.vlist{max-width:760px}
.vrow{padding:9px 0;border-bottom:1px solid var(--hr);cursor:pointer;position:relative}
.vrow[hidden]{display:none}
.vrow:last-child{border-bottom:0}
.vrow:hover{background:rgba(25,25,23,.025)}/* the accent marks your players, and nothing else. The site already marks
   "yours" with a full-bleed tint rather than a rail, so this follows it. */

.vrow.you::before{content:"";position:absolute;left:-14px;right:-14px;top:0;bottom:0;background:rgba(255,232,107,.16);z-index:0}
.vrow.you>*{position:relative;z-index:1}
.vrow.you .vn{font-weight:700}
.vrow.you .vv{background:linear-gradient(var(--hl),var(--hl)) 0 62%/100% 50% no-repeat;padding:0 3px;margin-right:-3px}
.vrk{font-variant-numeric:tabular-nums;font-size:11.5px;letter-spacing:-.012em;color:var(--fnt);text-align:right}
.vrow.you .vrk{color:var(--mut2)}
.vnm{min-width:0}
.vn{display:block;font-size:14.5px;font-weight:600;letter-spacing:-.016em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vm{display:flex;align-items:center;gap:6px;font-size:11.5px;color:var(--mut);margin-top:3px;white-space:nowrap;overflow:hidden}/* the site's position pill, sized for this row */

.vm em.slot{flex:none;font-style:normal;font-family:var(--sans);font-size:9.5px;font-weight:700;
  letter-spacing:.03em;color:var(--ink);background:rgba(25,25,23,.06);padding:2px 5px;border-radius:3px}
.vm .vmt{min-width:0;overflow:hidden;text-overflow:ellipsis}/* figures in the sans with tabular numerals; mono is kept for grids and brackets only */

.vpg,.vv,.vd{font-variant-numeric:tabular-nums;letter-spacing:-.016em;text-align:right;white-space:nowrap}
.vpg{font-size:12.5px;color:var(--mut2)}
.vpg i{font-style:normal;font-size:.8em;color:var(--fnt);margin-left:2px}
.vv{font-size:16px;font-weight:600;color:var(--ink)}
.vd{font-size:12px;color:var(--fnt)}
.vd.up{color:var(--up)}.vd.dn{color:var(--dn)}
.vnone{font-family:var(--serif);font-size:15px;color:var(--mut2);margin:22px 0 0}/* risers and fallers reuse the row, two columns wide */


.vrf{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 34px;margin-top:10px;max-width:760px}
.vrfl{font-family:var(--cond);font-size:13px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--mut);padding-bottom:6px;border-bottom:1px solid var(--hr2)}
.vrow.vmv{grid-template-columns:34px minmax(0,1fr) 46px 46px;cursor:pointer}

@media(min-width:601px){
.vcx .vrow{grid-template-columns:34px 38px minmax(0,1fr) 74px 66px 62px}/* until the first Tuesday run there is no movement to show, so the column is
   not reserved — an empty track reads as a missing figure, not as no news */

.vcx.nomove .vrow{grid-template-columns:34px 38px minmax(0,1fr) 74px 66px}
.vcx .vrow{padding:10px 0}
.vcx .vn{font-size:15px}
.vcx .vv{font-size:17px}}

@media(max-width:600px){/* the toolbar follows you down 154 rows */

.vbar{position:sticky;top:var(--bar);z-index:20;margin:18px calc(var(--pad)*-1) 0;padding:10px var(--pad) 11px;
  background:rgba(250,250,246,.94);backdrop-filter:blur(8px);border-bottom:1px solid var(--hr2)}
.vrow{grid-template-columns:24px 30px minmax(0,1fr) 56px;gap:0 9px}/* the price leads and the rate sits under it, one right-hand edge */

.vrow{grid-template-areas:"rk fc nm vv" "rk fc nm pg";row-gap:1px;align-items:center;padding:10px 0}
.vrow .vrk{grid-area:rk}
.vrow>.face{grid-area:fc}
.vrow .vnm{grid-area:nm}
.vrow .vv{grid-area:vv;align-self:end}
.vrow .vpg{grid-area:pg;align-self:start;font-size:11.5px}
.vrow .vd{display:none}
.vhead{margin-top:12px}
.vrow.you::before{left:calc(var(--pad)*-1);right:calc(var(--pad)*-1)}
.vrf{grid-template-columns:1fr;gap:22px}
.vcx .vv{font-size:15.5px}}

/* ===== 2026 Scoring Leaders =====
   The record of what has been scored, against Value Charts' price of what is
   still to come — the same players, a neighbouring question. So it is the same
   page furniture outright: the toolbar, the sort tabs, the row, and the column
   system on .sheet.vcx that names the metric once in the head rather than on
   every row. Nothing here re-states any of that; it sets the one column that
   page does not have and gets out of the way.

   Scoped to .slx throughout. `.sl*` is short, and short global names on this
   site have collided six separate times. */
.sheet.vcx.slx{--vcols:34px 38px minmax(0,1fr) 58px 78px}
/* No column head: the sort tabs name the figure, and a count needs no label.
   Without one the tabs were pinched between the toolbar rule above and the
   list rule below, twelve pixels from each — a 36px control in a 60px band.
   The rules stay, because the list needs a top edge; the air is what was
   missing. */
.slx .vhead{margin-top:24px}
.slx .slist{border-top:1px solid var(--hr);margin-top:20px}
/* Games played is context for the average, not a figure competing with it —
   so it is set a step below the row's own meta line rather than beside the
   number it qualifies. */
/* align-self is set, not inherited: the phone rule for .vrow .vpg pins that
   cell to the top of a two-line row, and .sheet.vcx resets the grid-area under
   it but not the alignment — which is why the pill sat level with the name
   rather than with the row. */
.slx .vpg{align-self:center;justify-self:center;display:inline-block;
  font-family:var(--sans);font-size:9.5px;font-weight:400;letter-spacing:.03em;
  line-height:1.5;color:var(--mut);text-align:center;
  padding:1.5px 6px;border-radius:4px;background:rgba(25,25,23,.055)}
/* Short samples are ranked below the field rather than dropped: one big
   afternoon off a bench should not outrank a season, and hiding him would be
   the other way of being wrong. */
.slx .slq{display:flex;align-items:center;gap:10px;margin:18px 0 2px;max-width:760px}
.slx .slq span{font-family:var(--cond);font-size:11px;font-weight:700;letter-spacing:.05em;
  text-transform:uppercase;color:var(--fnt)}
.slx .slq::after{content:"";flex:1;height:1px;background:var(--hr2)}
.slx .vrow[data-unq] .vn{font-weight:500;color:var(--mut2)}
.slx .vrow[data-unq] .vv b{color:var(--mut2)}
.slx .slnone{font-family:var(--serif);font-size:15px;color:var(--mut2);margin:22px 0 0}
@media(max-width:600px){
.sheet.vcx.slx{--vcols:22px 32px minmax(0,1fr) 50px 62px}
.slx .vpg{font-size:9px;padding:1.5px 5px}}
/* ===== Power rankings: the team panel, and the phone list =====
   The panel's rows were .pl, which is also the lineup row. Six rules answer to
   .pl and six more to .prkl .pl; the last pair left them as blocks with a
   border down one side, so a label, a figure and a note stacked ninety pixels
   tall with a stray vertical rule beside them. The panel owns .rkstar and
   .rkls/.rkli now, and the lineup keeps .pl. */


.rkstar{display:flex;align-items:center;gap:9px;padding:14px 0 15px;border-bottom:1px solid var(--hr);cursor:pointer}
.rkstar em.slot{flex:none;font-style:normal;font-family:var(--sans);font-size:9.5px;font-weight:700;
  letter-spacing:.03em;color:var(--ink);background:rgba(25,25,23,.06);padding:2px 5px;border-radius:3px}
.rkstn{min-width:0;flex:1}
.rkstn i{font-style:normal;display:block;font-size:11px;color:var(--mut);margin-bottom:2px}
.rkstn b{display:block;font-size:15.5px;font-weight:600;letter-spacing:-.016em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rksth{flex:none;font-family:var(--cond);font-size:20px;font-weight:700;letter-spacing:.01em;text-align:right;line-height:1}
.rksth u{display:block;font-family:var(--sans);font-size:10.5px;font-weight:400;text-decoration:none;color:var(--fnt);letter-spacing:0;margin-top:3px}

.rkls{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 18px;margin-top:2px}
.rkli{padding:14px 0 2px}
.rkli i{font-style:normal;display:block;font-size:11px;color:var(--mut);margin-bottom:4px}
.rkli b{display:block;font-family:var(--cond);font-size:24px;font-weight:700;letter-spacing:.01em;line-height:1}
.rkli b u{font-family:var(--sans);font-size:11px;font-weight:500;text-decoration:none;color:var(--mut);margin-left:1px}
.rkli em{font-style:normal;display:block;font-size:11px;color:var(--fnt);margin-top:5px;line-height:1.35}

@media(max-width:600px){
.rkstar{padding:13px 0 14px}
.rkls{grid-template-columns:repeat(2,minmax(0,1fr));gap:0 16px}
.rkli{padding:13px 0 3px}
.rkli:nth-child(n+3){border-top:1px solid var(--hr);padding-top:13px}
.rkli b{font-size:22px}/* the list: no movement to show yet, so the track it would sit in collapses
   rather than holding a thumb of empty space at the start of every row. The
   areas are left alone — redefining them orphans the position figures, which
   ride into this grid on display:contents. */


.rkx.nomove .prkh{grid-template-columns:0 22px minmax(0,1fr) auto 12px}
.rkx.nomove .prkh>.prkv{display:none}/* A figure with no name on it is a puzzle, but a header row of its own put a
   second rule thirty pixels above the tier rule. The label hangs off the first
   tier's rule instead — same line, no extra furniture. */

.rkx .rkidxhd{display:none}
.rkx .rkt:first-of-type .rkth{justify-content:space-between}
.rkx .rkt:first-of-type .rkth::after{content:"IDX";font-family:var(--sans);font-size:11px;
  font-weight:400;letter-spacing:.02em;text-transform:none;color:var(--mut)}/* a little air between the rank and the team block */

.rkx .prkm{padding-left:7px}/* tiers of one team do not need a 20px slab and a 2px rule; the first one
   still needs real air under the IDX button */

.rkx .rkt{margin-top:42px}
.rkx .rkt:first-of-type{margin-top:38px}
.rkx .rkth{padding-bottom:6px;border-bottom-width:1px}
.rkx .rktn{font-size:14px;letter-spacing:.06em;color:var(--mut)}}
.rkt{margin-top:42px;max-width:900px}
.rkth{display:flex;align-items:baseline;gap:12px;padding-bottom:8px;border-bottom:2px solid var(--ink)}
.rktn{font-family:var(--cond);font-size:20px;font-weight:700;letter-spacing:.02em;text-transform:uppercase}
.prk{border-bottom:1px solid var(--hr)}
.prk:last-child{border-bottom:0}

.prkh{display:grid;grid-template-columns:46px 32px minmax(0,1fr) 74px repeat(4,68px) 13px;gap:0 14px;align-items:center;width:100%;text-align:left;height:62px;padding:0}
.prkh:active{background:rgba(25,25,23,.02)}
.prkn{font-family:var(--cond);font-size:28px;font-weight:700;color:rgba(25,25,23,.2);text-align:center;line-height:1}
.prk.you .prkn,.prk.open .prkn{color:var(--ink)}
.prkm{min-width:0}
.prkt{display:block;font-size:16px;font-weight:600;letter-spacing:-.018em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.prko{display:block;font-size:11.5px;color:var(--mut);margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.prkv{font-size:12px;font-weight:600;text-align:right;white-space:nowrap;color:var(--fnt);letter-spacing:-.01em}
.prkv.up{color:var(--up)}.prkv.dn{color:var(--dn)}
.prkx{position:relative;width:11px;height:11px;justify-self:end}
.prkx::before,.prkx::after{content:"";position:absolute;left:50%;top:50%;background:rgba(25,25,23,.3);transition:opacity .16s}
.prkx::before{width:11px;height:2px;margin:-1px 0 0 -5.5px}
.prkx::after{width:2px;height:11px;margin:-5.5px 0 0 -1px}
.prk.open .prkx::after{opacity:0}
.prk.open .prkx::before{background:var(--ink)}
.prkb{padding:4px 0 22px 106px}
.prose.rkp{margin:0 0 18px;font-size:16px;max-width:70ch}
@media(max-width:600px){/* phones: the row scans, the positions open one tap down */

.prkh{grid-template-columns:36px 22px minmax(0,1fr) auto 12px;gap:0 10px;height:58px;padding:0;grid-template-areas:"x n t r c"}
.prkh>.prkx{grid-area:c}

.prkh>.rat b{font-size:22px}
.prkh>.rat i{width:24px;height:15px;font-size:8.5px}
.prkh>.prkx{display:block;justify-self:end}

.prkn{grid-area:n;align-self:start;padding-top:2px}
.prkm{grid-area:t}
.rat{grid-area:r;align-self:start;justify-content:flex-start}
.rat b{font-size:21px}
.rat i{width:24px;height:15px;font-size:8.5px}
.prkv{grid-area:x;align-self:start;text-align:left;font-size:11px}
.prkh>.rgs .rg{flex:1;justify-content:flex-start;gap:6px;height:auto}

.rg b{font-size:19px}
.rg i{width:18px;height:15px;font-size:8.5px}
.prkn{font-size:23px}
.prkt{font-size:14.5px}
.prkb{padding:2px 0 18px 70px}
.prose.rkp{font-size:15.5px}
.rkt{margin-top:42px}}/* the index, then a chip and figure per position */


.rgs{display:contents}
.rat{display:flex;align-items:center;justify-content:flex-end;gap:7px;height:26px;align-self:center}
.rat i{font-style:normal;width:26px;height:17px;border-radius:2px;font-size:9.5px;font-weight:700;color:rgba(25,25,23,.6);background:rgba(25,25,23,.09);display:grid;place-items:center}
.rat b{font-family:var(--cond);font-size:25px;font-weight:700;line-height:26px;letter-spacing:.01em;display:block}
.rg{display:flex;align-items:center;justify-content:flex-end;gap:7px;height:26px;align-self:center}
.rg i{font-style:normal;width:22px;height:17px;border-radius:2px;font-size:9.5px;font-weight:700;color:rgba(25,25,23,.68);display:grid;place-items:center}
.rg b{font-family:var(--cond);font-size:23px;font-weight:700;line-height:26px;color:var(--mut2);display:block}
.rg.p-QB i{background:#F9B3C4}
.rg.p-RB i{background:#A2E3D8}
.rg.p-WR i{background:#AECDFB}
.rg.p-TE i{background:#F8CFA4}
@media(max-width:600px){
.prkv{font-size:11px}
.prkx{display:none}}

@media(min-width:601px){
.prkh>.rat{align-self:center;justify-content:flex-end}
.prkh>.rat b{font-size:25px}
.prkh>.rat i{width:26px;height:17px;font-size:9.5px}
.prkh>.prkn{align-self:center;padding-top:0}
.prkh>.prkv{align-self:center;text-align:right;font-size:12px}
.prkh>.rg,.prkh>.rg:nth-of-type(1),.prkh>.rg:nth-of-type(2),.prkh>.rg:nth-of-type(3),.prkh>.rg:nth-of-type(4){grid-area:auto;align-self:center;justify-content:flex-end;gap:7px}
.prkh>.prkm,.prkh>.prkx{grid-area:auto}}

@media(min-width:601px){
.prkh>.rat,.prkh>.rg{align-self:center!important;height:26px!important;align-items:center!important}
.prkh>.rat b,.prkh>.rg b{line-height:26px!important}}

@media(min-width:601px){.prkh>.rat{transform:translateY(5px)}}

@media(min-width:601px){.prkpos{display:none}}
@media(max-width:600px){
.prkpos{display:flex;justify-content:space-between;gap:8px;margin:0 0 16px;padding:14px;background:rgba(25,25,23,.035);border-radius:6px}
.prkpos .rg{flex:1;justify-content:flex-start;gap:7px;height:auto;align-self:auto}/* these four are the whole point of opening the row, so they carry at phone size */

.prkpos .rg b{font-size:24px;line-height:1}
.prkpos .rg i{width:26px;height:18px;font-size:10px;border-radius:3px}}

@media(max-width:600px){/* the row: arrow rides with the rank, the label is said once per page */

.prkh{grid-template-columns:44px minmax(0,1fr) auto 16px;gap:0 12px;grid-template-areas:"n t r c"}
.prkh>.prkv{grid-area:n;align-self:center;justify-self:end;text-align:right;font-size:11px;padding-right:26px;pointer-events:none}
.prkh>.prkn{grid-area:n;justify-self:end;text-align:right}

.prkh>.rat b{font-size:24px}
.prkh>.prkx{width:14px;height:14px}
.prkh>.prkx::before{width:14px;margin-left:-7px}
.prkh>.prkx::after{height:14px;margin-top:-7px}/* the panel: one even grid, no ragged indents */

.prkb{padding:0 0 18px}
.prkpos{margin:0 0 2px}}

.rkidxhd{display:none}
@media(max-width:600px){
.rkidxhd{display:grid;grid-template-columns:44px minmax(0,1fr) auto 16px;gap:0 12px;margin-top:26px;padding-bottom:6px;font-size:10.5px;color:var(--fnt)}
.rkidxhd span:first-child{grid-column:2}
.rkidxhd span:last-child{grid-column:3;text-align:right}
.rkt:first-of-type{margin-top:10px}}/* ============ Power rankings on phones — one grid, one left edge ============ */


.mvm{display:none}
@media(max-width:600px){/* one shared 3-column frame: rank / body / figure, with a fixed 16px toggle rail */


.prkh{display:grid;grid-template-columns:24px minmax(0,1fr) 64px 16px;gap:0 12px;grid-template-areas:none;align-items:center}
.rkidxhd{display:none}

.rkt{margin-top:42px}
.rkt:first-of-type{margin-top:6px}
.rkth{padding-bottom:8px}
.rktn{font-size:17px}

.prkh{height:62px;padding:0;text-align:left}
.prkh>.prkv{display:none}
.prkh>.prkn{grid-column:1;justify-self:end;align-self:center;font-size:21px;padding:0;color:rgba(25,25,23,.28)}
.prk.you .prkh>.prkn,.prk.open .prkh>.prkn{color:var(--ink)}
.prkh>.prkm{grid-column:2;align-self:center;min-width:0}
.prkt{font-size:15.5px;line-height:1.2}
.prko{font-size:11.5px;margin-top:3px;line-height:1.2}
.mvm{display:inline;font-style:normal;font-weight:600;margin-left:5px}
.mvm.up{color:var(--up)}.mvm.dn{color:var(--dn)}
.prkh>.rat{grid-column:3;justify-self:end;align-self:center;height:auto;transform:none;display:block}
.prkh>.rat i{display:none}
.prkh>.rat b{font-size:24px;line-height:1;display:block;text-align:right}
.prkh>.rgs{display:none}
.prkh>.prkx{grid-column:4;justify-self:center;align-self:center;width:13px;height:13px}
.prkh>.prkx::before{width:13px;height:1.5px;margin:-0.75px 0 0 -6.5px}
.prkh>.prkx::after{width:1.5px;height:13px;margin:-6.5px 0 0 -0.75px}/* the panel: full measure, two even columns, one hairline system */


.prkb{padding:0 0 18px;margin:0}
.prose.rkp{margin:0 0 14px;font-size:15.5px}
.prkpos{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin:0 0 14px;padding:11px 0;background:rgba(25,25,23,.035);border-radius:6px}
.prkpos .rg{display:grid;justify-items:center;align-content:center;gap:5px;flex:none;height:auto;align-self:auto;justify-content:center;border-left:1px solid rgba(25,25,23,.08)}
.prkpos .rg:first-child{border-left:0}
.prkpos .rg i{width:22px;height:15px;font-size:8.5px}}
.pl{display:flex;align-items:baseline;justify-content:space-between;gap:16px;min-height:44px;padding:10px 0;border-top:1px solid var(--hr)}
.pl i{font-style:normal;font-size:12.5px;color:var(--mut);flex:none}
.pv{text-align:right;min-width:0}
.pv b{font-family:var(--cond);font-size:22px;font-weight:700;line-height:1;letter-spacing:.01em;display:block}
.pv b u{text-decoration:none;font-family:var(--sans);font-size:11px;font-weight:500;color:var(--mut);margin-left:1px}
.pv b.nm{font-family:var(--sans);font-size:14.5px;font-weight:600;letter-spacing:-.016em;line-height:1.2}
.pv em{display:block;font-style:normal;font-size:10.5px;color:var(--fnt);margin-top:4px;line-height:1.3}
@media(max-width:600px){
.pl{min-height:48px}
.pl i{font-size:13px}
.pv b{font-size:21px}
.rkt:first-of-type{margin-top:0}}

@media(max-width:600px){/* positions sit in the same left-edge system as the facts, not a floating box */

.prkpos{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin:0;padding:12px 0 13px;background:none;border-radius:0;border-bottom:1px solid var(--hr)}
.prkpos .rg{display:flex;align-items:center;justify-content:flex-start;gap:7px;border-left:0;height:auto}
.prkpos .rg i{width:21px;height:15px;font-size:8.5px;flex:none}
.prkpos .rg b{font-size:19px;line-height:1;color:var(--ink)}}

@media(max-width:600px){/* the open panel sits under the team name, not the page edge */

.prkb{padding-left:36px}
.prkpos{grid-template-columns:repeat(4,1fr);padding:11px 0 12px}

.pl{min-height:38px;padding:8px 0}
.pl i{font-size:11.5px}
.pv b{font-size:16px}
.pv b.nm{font-size:13px}
.pv b u{font-size:10px}
.pv em{font-size:10px;margin-top:3px}
.prose.rkp{font-size:15px}}

@media(max-width:600px){
.prkpos .rg b{font-size:20px}
.prkpos .rg i{width:21px;height:15px;font-size:8.5px}
.prkpos{padding:13px 0 14px}}

@media(max-width:600px){
.prkpos .rg b{font-size:16px}
.prkpos .rg i{width:19px;height:14px;font-size:8px}
.prkpos{padding:11px 0 12px}
.pv b{font-size:20px}
.pv b.nm{font-size:14.5px}
.pv b u{font-size:11px}
.pl{min-height:44px;padding:10px 0}}

@media(max-width:600px){
.prkpos{margin-bottom:0}
.prose.rkp{margin:18px 0 16px;line-height:1.62}
.prose.rkp p+p{margin-top:14px}}
.prose.rkp{margin:20px 0 18px}/* the team sheet — mobile only */


html.rklock,html.rklock body{overflow:hidden}
.rksheet{position:fixed;inset:0;z-index:60;display:none}
.rkscrim{position:absolute;inset:0;background:rgba(25,25,23,.42)}
.rkpanel{position:absolute;left:0;right:0;bottom:0;max-height:90vh;display:flex;flex-direction:column;background:var(--paper);border-radius:16px 16px 0 0;box-shadow:0 -8px 40px rgba(25,25,23,.24);animation:rkup .22s cubic-bezier(.2,.7,.3,1)}
@keyframes rkup{from{transform:translateY(24px);opacity:.6}to{transform:none;opacity:1}}
.rkgrab{width:36px;height:4px;border-radius:2px;background:rgba(25,25,23,.18);margin:9px auto 0;flex:none}
.rkph{display:grid;grid-template-columns:24px minmax(0,1fr) auto auto;gap:0 12px;align-items:center;padding:14px 20px 13px;border-bottom:1px solid var(--hr2);flex:none}
.rkpr{font-family:var(--cond);font-size:21px;font-weight:700;color:rgba(25,25,23,.3);text-align:right}
.rkpm{min-width:0}
.rkpt{display:block;font-size:16.5px;font-weight:700;letter-spacing:-.022em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rkpo{display:block;font-size:11.5px;color:var(--mut);margin-top:3px}
.rkpi{display:flex;align-items:center;gap:6px}
.rkpi i{font-style:normal;width:24px;height:15px;border-radius:2px;font-size:8.5px;font-weight:700;color:rgba(25,25,23,.6);background:rgba(25,25,23,.09);display:grid;place-items:center}
.rkpi b{font-family:var(--cond);font-size:22px;font-weight:700;line-height:1}
.rkpc{position:relative;width:30px;height:30px;border-radius:50%;background:rgba(25,25,23,.06);margin-left:4px}
.rkpc::before,.rkpc::after{content:"";position:absolute;left:50%;top:50%;width:13px;height:1.6px;background:var(--ink);margin:-.8px 0 0 -6.5px}
.rkpc::before{transform:rotate(45deg)}
.rkpc::after{transform:rotate(-45deg)}
.rkpb{overflow-y:auto;-webkit-overflow-scrolling:touch;padding:0 20px 28px}
.rkpb .prkpos{margin:0;padding:15px 0 16px;border-bottom:1px solid var(--hr)}
.rkpb .prkpos .rg{gap:7px}
.rkpb .prkpos .rg b{font-size:24px;line-height:1}
.rkpb .prkpos .rg i{width:26px;height:18px;font-size:10px;border-radius:3px}
.rkpb .prose.rkp{margin:18px 0 4px;font-size:15.5px;line-height:1.62}
@media(max-width:600px){
.rksheet{display:block}/* the row is a link into the sheet, so the inline toggle goes quiet */

.prkh>.prkx{position:relative;width:7px;height:7px;transform:rotate(45deg)}
.prkh>.prkx::before{content:"";position:absolute;inset:0;width:7px;height:7px;background:none;border-top:1.6px solid rgba(25,25,23,.36);border-right:1.6px solid rgba(25,25,23,.36);margin:0}
.prkh>.prkx::after{display:none}
.prkb{display:none}}

@media(max-width:600px){}

@media(max-width:600px){
.prkh{grid-template-columns:26px 18px minmax(0,1fr) 58px 14px;gap:0 9px}
.prkh>.prkv{display:block;grid-column:1;justify-self:start;align-self:center;text-align:left;font-size:11px;font-weight:600;padding:0}
.prkh>.prkn{grid-column:2;justify-self:end}
.prkh>.prkm{grid-column:3}
.prkh>.rat{grid-column:4}
.prkh>.prkx{grid-column:5}
.mvm{display:none}}

.idxbtn{display:inline-flex;align-items:center;gap:7px;margin-top:18px;min-height:36px;padding:0 14px;border:1px solid rgba(25,25,23,.18);border-radius:18px;font-size:13px;font-weight:600;letter-spacing:-.012em;color:var(--mut2);background:#FFFDF7;transition:background .14s,color .14s}
.idxbtn::before{content:"?";display:grid;place-items:center;width:16px;height:16px;border-radius:50%;background:rgba(25,25,23,.1);font-size:10px;font-weight:700;color:var(--ink)}
.idxbtn:hover{background:rgba(25,25,23,.04);color:var(--ink)}
.idxm{display:block}
.idxm .rkpanel{max-height:72vh}
.rkph.idxh{grid-template-columns:minmax(0,1fr) auto}
.idxp{font-family:var(--serif);font-size:16px;line-height:1.62;color:var(--ink);margin:18px 0 6px;text-wrap:pretty}
@media(min-width:601px){
.idxm .rkscrim{background:rgba(25,25,23,.36)}
.idxm .rkpanel{left:50%;bottom:auto;top:50%;transform:translate(-50%,-50%);width:min(560px,92vw);border-radius:12px;animation:none}
.idxm .rkgrab{display:none}
.idxm .rkph{padding:18px 24px 15px}
.idxm .rkpb{padding:0 24px 26px}}

@media(min-width:601px){}
.pl>i{font-style:normal;font-size:11.5px;color:var(--mut);margin-bottom:9px}
@media(min-width:601px){}
@media(max-width:600px){}
@media(max-width:600px){}

.rktn{font-size:24px}
@media(max-width:600px){.rktn{font-size:20px}}/* ===== selectors cycle the position palette ===== */


:root{--sel1:#F9B3C4;--sel2:#A2E3D8;--sel3:#AECDFB;--sel4:#F8CFA4;--sel5:#CFD6A8;--sel6:#D9B7FB}
.oddsx .mk button:nth-child(1){--mkc:#F0C64B}
.oddsx .mk button:nth-child(2){--mkc:var(--sel2)}
.oddsx .mk button:nth-child(3){--mkc:var(--sel3)}
.oddsx .mk button:nth-child(4){--mkc:var(--sel4)}
.oddsx .mk button:nth-child(5){--mkc:var(--sel5)}/* your row's figure wears the live market's colour */

.oddsx.mk0 .obr.you .obp b{background:linear-gradient(#F0C64B,#F0C64B) 0 62%/100% 52% no-repeat}
.oddsx.mk1 .obr.you .obp b{background:linear-gradient(var(--sel2),var(--sel2)) 0 62%/100% 52% no-repeat}
.oddsx.mk2 .obr.you .obp b{background:linear-gradient(var(--sel3),var(--sel3)) 0 62%/100% 52% no-repeat}
.oddsx.mk3 .obr.you .obp b{background:linear-gradient(var(--sel4),var(--sel4)) 0 62%/100% 52% no-repeat}
.oddsx.mk4 .obr.you .obp b{background:linear-gradient(var(--sel5),var(--sel5)) 0 62%/100% 52% no-repeat}/* every other selector group cycles the same way */
.scb button.on:nth-child(6n+1),.scb button.on:nth-child(6n+1):hover{background:var(--sel1)}
.scb button.on:nth-child(6n+2),.scb button.on:nth-child(6n+2):hover{background:var(--sel2)}
.scb button.on:nth-child(6n+3),.scb button.on:nth-child(6n+3):hover{background:var(--sel3)}
.scb button.on:nth-child(6n+4),.scb button.on:nth-child(6n+4):hover{background:var(--sel4)}
.scb button.on:nth-child(6n+5),.scb button.on:nth-child(6n+5):hover{background:var(--sel5)}
.scb button.on:nth-child(6n+6),.scb button.on:nth-child(6n+6):hover{background:var(--sel6)}
.chips .chip.on:nth-child(6n+1){background:var(--sel1)}
.chips .chip.on:nth-child(6n+2){background:var(--sel2)}
.chips .chip.on:nth-child(6n+3){background:var(--sel3)}
.chips .chip.on:nth-child(6n+4){background:var(--sel4)}
.chips .chip.on:nth-child(6n+5){background:var(--sel5)}
.chips .chip.on:nth-child(6n+6){background:var(--sel6)}
.tiles[data-tiles]>button.on:nth-child(6n+1){background:var(--sel1)!important}
.tiles[data-tiles]>button.on:nth-child(6n+2){background:var(--sel2)!important}
.tiles[data-tiles]>button.on:nth-child(6n+3){background:var(--sel3)!important}
.tiles[data-tiles]>button.on:nth-child(6n+4){background:var(--sel4)!important}
.tiles[data-tiles]>button.on:nth-child(6n+5){background:var(--sel5)!important}
.tiles[data-tiles]>button.on:nth-child(6n+6){background:var(--sel6)!important}

.oddsx .obr.you{background:none}/* nav wears the same cycle: gold first, then the position palette */


.deskn a.on:nth-child(1){background:#F0C64B}
.deskn a.on:nth-child(2){background:var(--sel1)}
.deskn a.on:nth-child(3){background:var(--sel2)}
.deskn a.on:nth-child(4){background:var(--sel3)}
.deskn a.on:nth-child(5){background:var(--sel4)}
.deskn a.on:nth-child(6){background:var(--sel5)}
.deskn a.on:nth-child(7){background:var(--sel6)}
.tabbar button.on::before{background:var(--sel6)}/* ===== the Go to sheet ===== */


.mpanel{max-height:88vh;display:flex;flex-direction:column}
.mgroup h3{font-family:var(--cond);font-size:19px;font-weight:700;letter-spacing:.042em;text-transform:uppercase;color:var(--ink);margin:0 0 5px;padding-bottom:7px;border-bottom:1.5px solid var(--gc)}
@media(min-width:701px){
.mscrim{background:rgba(25,25,23,.34)}
.mpanel{left:50%;right:auto;bottom:auto;top:50%;transform:translate(-50%,-50%);width:min(880px,92vw);max-height:82vh;border-radius:12px}
.mgrab{display:none}
.mbody{padding:20px 24px 26px}
.mgroups{grid-template-columns:repeat(3,1fr);gap:0 28px;align-items:start}
.mgroup+.mgroup{padding-left:28px;border-left:1px solid var(--hr)}}

@media(min-width:701px){
.mgroups{gap:0 26px}
.mbody{padding:18px 24px 22px}}/* ===== Go to: a centred modal at every width ===== */


.moresheet{position:fixed;inset:0;z-index:70}
.moresheet[hidden]{display:none}
.mscrim{position:absolute;inset:0;background:rgba(25,25,23,.38)}
.mpanel{position:absolute!important;left:50%!important;top:50%!important;right:auto!important;bottom:auto!important;transform:translate(-50%,-50%)!important;
 width:min(880px,calc(100vw - 32px));max-height:min(84vh,720px);display:flex;flex-direction:column;
 background:var(--paper);border-radius:12px;box-shadow:0 24px 70px rgba(25,25,23,.3);overflow:hidden;animation:mpop .16s ease-out}
@keyframes mpop{from{transform:translate(-50%,-48%) scale(.98);opacity:0}to{transform:translate(-50%,-50%) scale(1);opacity:1}}
.mgrab{display:none!important}
.mbody{overflow-y:auto;-webkit-overflow-scrolling:touch;padding:18px 22px 22px}
.mgroups{display:grid;grid-template-columns:repeat(3,1fr);gap:0 24px;align-items:start}
@media(max-width:700px){
.mpanel{width:calc(100vw - 28px);max-height:82vh}
.mbody{padding:16px 18px 20px}
.mgroups{grid-template-columns:1fr;gap:20px}
.mgroup+.mgroup{padding-left:0;border-left:0}}/* Go to: centre with inset+margin so no transform rule can fight it */


.moresheet .mpanel,.moresheet.up .mpanel{position:absolute;inset:0;left:0;right:0;top:0;bottom:0;margin:auto;transform:none;
 width:min(880px,calc(100vw - 32px));height:max-content;max-height:min(84vh,720px);animation:none}
@media(max-width:700px){
.moresheet .mpanel,.moresheet.up .mpanel{width:calc(100vw - 28px);max-height:82vh}}

.moresheet .mpanel,.moresheet.up .mpanel{width:min(720px,76vw);max-height:min(70vh,660px)}
/* the contents index wants the width: at 80vw the two columns squeeze
   "Power Rankings" and "Season Preview" onto two lines each */
@media(max-width:700px){.moresheet .mpanel,.moresheet.up .mpanel{width:calc(100vw - 26px);max-height:80vh}}

.prose.gprev{margin:16px 0 0;font-size:15.5px;max-width:70ch}
.prose.gprev.post{margin-top:14px;padding-top:13px;border-top:1px solid var(--hr)}
@media(max-width:600px){.prose.gprev{font-size:15px}}

.mgroup+.mgroup{padding-left:0;border-left:0}
@media(min-width:701px){.mgroups{gap:0 30px}.mgroup+.mgroup{padding-left:0;border-left:0}}

.mclose{position:absolute;top:14px;right:16px;z-index:2;width:30px;height:30px;border-radius:50%;background:rgba(25,25,23,.06)}
.mclose::before,.mclose::after{content:"";position:absolute;left:50%;top:50%;width:13px;height:1.6px;background:var(--ink);margin:-.8px 0 0 -6.5px}
.mclose::before{transform:rotate(45deg)}
.mclose::after{transform:rotate(-45deg)}
.mclose:hover{background:rgba(25,25,23,.1)}
.moresheet .mbody{padding-top:22px}

.pgt{font-family:var(--cond);font-size:15px;font-weight:700;letter-spacing:.02em;text-transform:uppercase}
@media(max-width:600px){.pgt{font-size:14px}}

.pgt{font-size:18px;letter-spacing:.015em}
@media(max-width:600px){.pgt{font-size:16px}}/* Against the median. One diverging bar a position, the league median standing
   as the rule down the centre. This block had accreted five rounds of overrides
   on top of each other; it is deliberately written once, in full, here.
   The axis label is absolutely centred rather than laid out by space-between so
   it sits on the rule itself and not merely between two end labels. */


.needs{margin-top:14px;max-width:620px}
.nhd,.nax,.nrow{display:grid;grid-template-columns:34px minmax(0,1fr) 56px;gap:0 14px}
.nhd,.nax{font-size:11.5px;font-weight:500;color:var(--mut2)}
.nhd .nsp,.nax .nsp{grid-column:2;position:relative;display:flex;justify-content:space-between;align-items:baseline}
.nhd .nsp i,.nax .nsp i{font-style:normal}
.nhd{padding-bottom:9px}
.nax{padding-top:10px;border-top:1px solid var(--hr)}
.nax .nsp i{position:absolute;left:50%;transform:translateX(-50%);white-space:nowrap}

.nrow{align-items:center;height:42px;border-top:1px solid var(--hr)}
.nk{font-size:10px;font-weight:700;text-align:center;border-radius:3px;padding:4px 0;color:rgba(25,25,23,.7)}
.nk.p-QB{background:#F9B3C4}.nk.p-RB{background:#A2E3D8}.nk.p-WR{background:#AECDFB}.nk.p-TE{background:#F8CFA4}/* No clipping: the bars are square and anchored at 50%, so they cannot reach
   past the track, and the median rule needs to escape it. Held to the row's
   full 42px it runs unbroken down the chart as a real axis — inside the track
   it was invisible, every bar edge landing on exactly the same pixel. */


.ntrack{position:relative;height:12px;background:rgba(25,25,23,.055)}
.ntrack::before{content:"";position:absolute;left:50%;top:-15px;bottom:-15px;width:1.5px;margin-left:-.75px;background:rgba(25,25,23,.26);z-index:1}
.ntrack i{position:absolute;top:0;bottom:0;border-radius:0}
.ntrack i.pos{background:var(--up);opacity:.78}
.ntrack i.neg{background:var(--dn);opacity:.72}

.nv{font-family:var(--cond);font-size:19px;font-weight:700;text-align:right;letter-spacing:.01em}
.nv.pos{color:var(--up)}
.nv.neg{color:var(--dn)}

/* the heading and its dek stop fitting on one line at phone width */
@media(max-width:600px){
.needs{max-width:none}
.nhd,.nax,.nrow{grid-template-columns:30px minmax(0,1fr) 48px;gap:0 10px}
.nv{font-size:17px}}/* close calls — a decision card per call */


.ccs{display:grid;gap:12px;margin-top:14px;max-width:760px}
.cc{background:#FFFDF7;border:1px solid rgba(25,25,23,.11);border-radius:8px;padding:14px 16px 15px}
.cch{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px}
.ccslot{font-family:var(--cond);font-size:13px;font-weight:700;letter-spacing:.03em;text-transform:uppercase;border-radius:3px;padding:3px 9px}
.ccslot.p-QB,.ccslot.p-SF{background:#F9B3C4}.ccslot.p-RB{background:#A2E3D8}.ccslot.p-WR{background:#AECDFB}.ccslot.p-TE{background:#F8CFA4}.ccslot.p-FLEX{background:#CFD6A8}.ccslot.p-K{background:#D9B7FB}.ccslot.p-DST{background:#C4CBD6}
.ccd{font-size:11.5px;color:var(--mut)}
.ccduo{display:grid;border-top:1px solid var(--hr)}
.ccp{display:grid;grid-template-columns:32px minmax(0,1fr) 54px 44px;gap:0 11px;align-items:center;height:52px;border-bottom:1px solid var(--hr)}
.ccp:last-child{border-bottom:0}
.ccp .face{width:32px;height:32px}
.ccw{min-width:0}
.ccw b{display:block;font-size:14.5px;font-weight:600;letter-spacing:-.016em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ccw em{display:block;font-style:normal;font-size:11px;color:var(--mut);margin-top:3px}
.ccf{font-family:var(--cond);font-size:22px;font-weight:700;text-align:right;letter-spacing:.01em;color:var(--mut2)}
.ccp.win .ccf{color:var(--ink)}
.cctag{font-size:9.5px;font-weight:700;letter-spacing:.03em;text-transform:uppercase;text-align:center;border-radius:3px;padding:3px 0;background:var(--hl);color:var(--ink)}
.cctag.sit{background:rgba(25,25,23,.07);color:var(--mut)}
.ccp:not(.win) .ccw b{color:var(--mut2)}
.ccv{display:grid;grid-template-columns:1fr 1fr;gap:0;margin-top:12px;border-top:1px solid var(--hr);padding-top:11px}
.ccv div{padding-right:16px;border-right:1px solid var(--hr)}
.ccv div:last-child{padding:0 0 0 16px;border-right:0}
.ccv i{font-style:normal;display:block;font-size:10.5px;color:var(--mut);margin-bottom:5px}
.ccv b{font-size:14px;font-weight:600;letter-spacing:-.016em}
.ccv.split b{color:var(--dn)}
.ccwhy{font-family:var(--serif);font-size:14.5px;line-height:1.55;color:var(--body);margin:12px 0 0;text-wrap:pretty}
@media(max-width:600px){
.ccp{grid-template-columns:30px minmax(0,1fr) 48px 40px;gap:0 9px;height:50px}
.ccf{font-size:20px}
.ccwhy{font-size:14px}}/* waivers: the week's moves as decision cards *//* the wire */




.wire{display:grid;gap:0;margin-top:12px;max-width:820px}
.war{display:grid;grid-template-columns:34px minmax(0,1fr) 62px 56px 56px 66px;gap:0 12px;align-items:center}
.war .face{width:34px;height:34px}
@media(max-width:600px){
.war{grid-template-columns:32px minmax(0,1fr) 54px;gap:8px 10px;grid-template-areas:"f n v" ". s s"}
.war .face{grid-area:f}}/* waivers on the deck grammar */


.pdeck.moves .pgrp+.pgrp{margin-top:14px}
.pdhd.w2{grid-template-columns:minmax(0,1fr) 64px}
.pdr.q .pdn{color:var(--mut2)}
.pdr.q .pdv{color:var(--mut)}
.pdeck.wire .pgrp+.pgrp{margin-top:16px}
.pdv.q{color:var(--mut)}
@media(max-width:600px){}/* trades on the deck grammar */


.pdeck.recs .pgrp+.pgrp,.pdeck.vchart .pgrp+.pgrp{margin-top:16px}
.pdv.val{font-family:var(--cond);font-size:21px;font-weight:700;color:var(--ink)}
.pdr .pdk.up{color:var(--up)}.pdr .pdk.dn{color:var(--dn)}
@media(max-width:600px){}/* trade calculator on the deck grammar */


.calc{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:14px}
.tside{min-width:0}
.pgt.t-you{background:var(--hl)}
.pgt.t-them{background:#C7B5E2}
.tsel{display:block;margin:10px 0 0}
.tsel select{font:inherit;font-size:13px;font-weight:600;letter-spacing:-.012em;color:var(--ink);background:#FFFDF7;border:1px solid rgba(25,25,23,.16);border-radius:5px;padding:7px 30px 7px 11px;min-height:36px;width:100%;-webkit-appearance:none;appearance:none;
 background-image:linear-gradient(45deg,transparent 50%,var(--ink) 50%),linear-gradient(135deg,var(--ink) 50%,transparent 50%);background-position:calc(100% - 17px) 50%,calc(100% - 12px) 50%;background-size:5px 5px;background-repeat:no-repeat;cursor:pointer}
.tpgs{max-height:420px;overflow-y:auto}
.pdr.tpick{width:100%;text-align:left;background:none;cursor:pointer}
.pdr.tpick:hover{background:rgba(25,25,23,.03)}
.pdr.tpick .tmark{display:block;width:18px;height:18px;margin-left:auto;border:1.5px solid rgba(25,25,23,.24);border-radius:4px}
.pdr.tpick.on .tmark{background:var(--ink);border-color:var(--ink);position:relative}
.pdr.tpick.on .tmark::after{content:"";position:absolute;left:5px;top:2px;width:5px;height:9px;border:solid var(--paper);border-width:0 2px 2px 0;transform:rotate(45deg)}
.pdr.tpick.on{background:rgba(255,232,107,.16)}
.pdr.tpick.on .pdn{font-weight:700}/* the verdict */

.tverd{display:flex;margin-top:20px;padding:15px 0 0;border-top:1px solid var(--hr)}
.tvc{flex:1;padding:0 20px;border-left:1px solid var(--hr);display:grid;gap:6px;align-content:start;min-width:0}
.tvc:first-child{border-left:0}
.tvc i{font-style:normal;font-size:11px;color:var(--mut)}
.tvc b{font-family:var(--cond);font-size:26px;font-weight:700;line-height:1;letter-spacing:.01em}
.tvc b.up{color:var(--up)}.tvc b.dn{color:var(--dn)}
.tvc em{font-style:normal;font-size:10.5px;color:var(--fnt)}
.tverd.idle b{color:rgba(25,25,23,.3)}
@media(max-width:700px){
.calc{grid-template-columns:1fr;gap:18px}
.tpgs{max-height:320px}
.tverd{flex-wrap:wrap;padding:12px 0 0}
.tvc{flex:1 1 45%;padding:8px 14px}
.tvc:nth-child(3){flex-basis:100%;border-left:0;border-top:1px solid var(--hr);padding-top:12px;margin-top:4px}
.tvc b{font-size:22px}}/* the picker row: five cells, one line */


.pdr.tpick{display:grid!important;grid-template-columns:34px minmax(0,1fr) 52px 52px 22px!important;gap:0 12px!important;height:58px!important;padding:0 14px!important;align-items:center}
.pdr.tpick .face{width:34px;height:34px}
.pdr.tpick .pdn{font-size:14.5px}
.pdr.tpick .pdm{font-size:11px;margin-top:3px}
.pdr.tpick .pdv{font-size:19px;text-align:right}
.pdr.tpick .pdv.val{font-family:var(--cond);font-size:19px}
.pdr.tpick .pdk{display:flex;justify-content:flex-end}
.pdr.tpick .tmark{margin:0;width:19px;height:19px}
.pdhd.wtc{display:grid;grid-template-columns:52px 52px 22px;gap:0 12px;justify-content:end}
.pdhd.wtc span{text-align:right}
@media(max-width:600px){
.pdr.tpick{grid-template-columns:32px minmax(0,1fr) 48px 46px 20px!important;gap:0 10px!important;padding:0 12px!important;height:56px!important}}

.sect.tcalc{margin-top:8px}
.sect.tcalc .sh h4{font-size:24px;letter-spacing:-.026em}
@media(max-width:600px){.sect.tcalc .sh h4{font-size:21px}}
[data-player]{cursor:pointer}
[data-player]:hover{background:rgba(25,25,23,.03)}
@media(max-width:600px){}/* game log as a chart */
.gw{font-family:var(--cond);font-size:14px;font-weight:700;color:rgba(25,25,23,.42);line-height:1}
.go{font-size:10.5px;color:var(--fnt);line-height:1;white-space:nowrap}
@media(max-width:600px){
.gw{font-size:13px}
.go{font-size:9.5px}}/* game log: a plain table */


/* The game log. Rewritten as one block: it had forty-five rules across ten
   of them, five of which were the same @media(max-width:600px) restyling the
   same four columns in sequence — a boxed grid with a filled header and zebra
   striping, which is a treatment this site uses nowhere else. The card around
   it is hairlines and open space, so the table is now hairlines and open
   space, and the head wears the card's own label style rather than a fifth
   one invented here. */
.gtwrap{margin-top:10px}
table.gt{border-collapse:collapse;width:100%;table-layout:fixed}
table.gt th,table.gt td{border:0;padding:9px 8px;text-align:left;vertical-align:baseline}
table.gt th:first-child,table.gt td:first-child{padding-left:0}
table.gt th:last-child,table.gt td:last-child{padding-right:0}
table.gt th{font-family:var(--sans);font-size:11.5px;font-weight:400;letter-spacing:normal;
 text-transform:none;color:var(--fnt);padding-bottom:7px;border-bottom:1px solid var(--hr)}
table.gt td{font-size:13px;color:var(--mut2);border-bottom:1px solid var(--hr)}
table.gt tbody tr:last-child td{border-bottom:0}
/* the week and the score are figures, and figures on this card are condensed */
table.gt th:first-child,table.gt td:first-child{width:34px}
table.gt th:nth-child(2),table.gt td:nth-child(2){width:60px}
table.gt th:nth-child(3),table.gt td:nth-child(3){width:52px}
/* only the score is a figure. The week is a marker and the opponent is a name,
   so setting all three in condensed bold gave the row three headlines. */
table.gt td:first-child{font-family:var(--cond);font-size:14px;font-weight:700;
 letter-spacing:.01em;color:var(--fnt)}
table.gt td.n{font-family:var(--cond);font-size:16px;font-weight:700;letter-spacing:.01em;
 text-align:right;color:var(--ink)}
table.gt th.n{text-align:right}
/* green when he beat the projection, red when he missed — on the figure only.
   The washed row behind it was doing the same job twice and turning a card
   made of hairlines into a stack of coloured bands. */
table.gt tbody tr.up td.n{color:var(--up)}
table.gt tbody tr.dn td.n{color:var(--dn)}
/* the stat line is the one column allowed to wrap, and the only one that ever
   needs to — it is prose about the afternoon, not a figure */
table.gt td:last-child{white-space:normal;overflow-wrap:anywhere;line-height:1.4}
@media(max-width:600px){
table.gt th,table.gt td{padding:8px 6px}
table.gt td{font-size:12.5px}
table.gt th:first-child,table.gt td:first-child{width:26px}
table.gt th:nth-child(2),table.gt td:nth-child(2){width:50px}
table.gt th:nth-child(3),table.gt td:nth-child(3){width:44px}
table.gt td:first-child{font-size:13px}
table.gt td.n{font-size:15px}}/* ===== the season preview as a magazine ===== */


.mag .ednote{margin-top:22px;background:rgba(255,232,107,.16);border-radius:6px;max-width:760px;overflow:hidden}
.mag .edt{display:flex;align-items:center;justify-content:space-between;gap:14px;width:100%;
  padding:13px 16px;text-align:left;cursor:pointer}
.mag .edh{font-size:13.5px;font-weight:700;letter-spacing:-.018em}
.mag .edx{flex:none;font-size:11.5px;color:var(--mut);white-space:nowrap}
.mag .edx i{font-style:normal;font-family:var(--mono);font-size:11px;letter-spacing:-.04em;color:var(--ink)}
.mag .edb{padding:0 16px 14px}
.mag .ednote .prose p{font-size:14.5px;line-height:1.6}
.magsec{margin-top:42px;max-width:900px}
.mh1{font-size:38px;font-weight:700;letter-spacing:-.034em;line-height:1.05;margin:0;max-width:20ch}
.mdek{font-family:var(--serif);font-size:18px;line-height:1.5;color:var(--mut2);margin:14px 0 0;max-width:56ch;text-wrap:pretty}
.mh2{font-size:13px;font-weight:600;color:var(--mut);margin:0 0 14px;padding-bottom:9px;border-bottom:2px solid var(--ink)}
.mint{font-family:var(--serif);font-size:15px;line-height:1.6;color:var(--mut2);margin:0 0 20px;max-width:66ch;text-wrap:pretty}/* the eight *//* Named .feat until it turned out reading.js has its own .feat, from a second
   SEC.preview that this file overwrites at build time — dead code whose rules
   were still landing here, giving every capsule two rules and putting the team
   line inline with the headline. The magazine's capsule is .mfeat now. */


.mfeats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 34px}
.mfeat{padding:16px 0;border-top:1px solid var(--hr)}
.mfeat .mft{font-size:12px;font-weight:600;color:var(--mut2)}
.mfeat .mft em{font-style:normal;font-weight:400;color:var(--fnt);margin-left:6px}
.mfeat h5{font-size:19px;font-weight:700;letter-spacing:-.024em;margin:7px 0 8px}
.mfeat .why{font-family:var(--serif);font-size:14.5px;line-height:1.55;color:var(--body);margin:0;text-wrap:pretty}
.mfeat.you .mft{color:var(--ink)}
.mfeat.you h5{background:linear-gradient(var(--hl),var(--hl)) 0 68%/100% 38% no-repeat;display:inline;padding:0 4px;margin-left:-4px;box-decoration-break:clone;-webkit-box-decoration-break:clone}/* burning questions */

.bqs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 34px}
.bq{padding:16px 0;border-top:1px solid var(--hr)}
.bqt{font-size:12px;font-weight:600;color:var(--mut2)}
.bq h5{font-size:17px;font-weight:700;letter-spacing:-.022em;margin:7px 0 8px}
.bq p{font-family:var(--serif);font-size:14.5px;line-height:1.55;color:var(--body);margin:0;text-wrap:pretty}/* all-league */

.alduo{display:grid;grid-template-columns:1fr 1fr;gap:0 40px}
.alh{font-size:12px;font-weight:600;color:var(--mut);margin:0 0 8px;padding-bottom:7px;border-bottom:1px solid var(--hr2)}
.alr{display:grid;grid-template-columns:52px minmax(0,1fr) 78px 46px;gap:0 12px;align-items:center;height:44px;border-bottom:1px solid var(--hr)}
.als{font-size:9.5px;font-weight:700;text-align:center;border-radius:3px;padding:4px 0;color:rgba(25,25,23,.7);background:rgba(25,25,23,.07)}
.als.p-QB,.als.p-SF{background:#F9B3C4}
.als.p-RB{background:#A2E3D8}.als.p-WR{background:#AECDFB}.als.p-TE{background:#F8CFA4}
.als.p-FLEX{background:#CFD6A8}.als.p-K{background:#D9B7FB}.als.p-DST{background:#C4CBD6}
.aln{font-size:14px;font-weight:600;letter-spacing:-.016em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.alo{font-size:11.5px;color:var(--mut);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.alo.you{color:var(--ink);font-weight:600}
.alp{font-family:var(--cond);font-size:18px;font-weight:700;text-align:right}/* superlatives */

.sups{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 34px}
.sup{padding:14px 0;border-top:1px solid var(--hr)}
.sup i{font-style:normal;display:block;font-size:11.5px;color:var(--mut)}
.sup b{display:block;font-size:16px;font-weight:700;letter-spacing:-.02em;margin:5px 0 6px}
.sup p{font-family:var(--serif);font-size:14px;line-height:1.5;color:var(--mut2);margin:0;text-wrap:pretty}/* storylines + bold predictions */

.stories,.bolds{display:grid;gap:0;max-width:760px}
.story,.bold{display:grid;grid-template-columns:32px minmax(0,1fr);gap:0 14px;padding:16px 0;border-top:1px solid var(--hr)}
.stn,.bn{font-family:var(--cond);font-size:26px;font-weight:700;color:rgba(25,25,23,.2);line-height:1}
.story h5,.bold h5{font-size:17px;font-weight:700;letter-spacing:-.022em;margin:0 0 8px}
.story p,.bold p{font-family:var(--serif);font-size:14.5px;line-height:1.55;color:var(--body);margin:0;text-wrap:pretty}/* priced predictions reuse the props table */

.ptbl.preds .pth,.ptbl.preds .ptr{grid-template-columns:minmax(0,1fr) 72px 72px 62px}
.ptbl.preds .ptn{white-space:normal;font-size:14px;font-weight:500;letter-spacing:-.012em;line-height:1.35}/* ballot */

.ballot{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0}
.bal{padding:14px 18px;border-left:1px solid var(--hr);border-top:1px solid var(--hr)}
.bal:nth-child(3n+1){padding-left:0;border-left:0}
.bal:nth-child(-n+3){border-top:0}
.bal i{font-style:normal;display:block;font-size:11px;color:var(--mut);margin-bottom:6px}
.bal b{font-size:16px;font-weight:700;letter-spacing:-.02em}
@media(max-width:760px){
.mfeats,.bqs,.sups,.alduo{grid-template-columns:1fr;gap:0}
.ballot{grid-template-columns:1fr 1fr}
.bal:nth-child(3n+1){padding-left:18px;border-left:1px solid var(--hr)}
.bal:nth-child(odd){padding-left:0;border-left:0}
.bal:nth-child(-n+2){border-top:0}
.bal:nth-child(3){border-top:1px solid var(--hr)}}/* ===== The preview on a phone =====
   Contents, then a lighter editor's note, then the sections. The note was a
   933px tinted block sitting above the cover story — a footnote given the
   weight of a lede. The ballot's two columns tore because one answer runs to
   three lines and its neighbour to one. The priced table left its odds figure
   floating mid-row with nothing to say what it was. *//* the masthead already rules off above this, so no second line */


.mtoc{margin-top:18px;max-width:520px}
.mtoct{display:flex;align-items:baseline;justify-content:space-between;gap:12px;width:100%;
  padding:6px 0 8px;text-align:left;cursor:pointer}
.mtoch{font-family:var(--cond);font-size:17px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--ink)}/* the fold marker is a chevron that turns, not a word */

.fldr{display:flex;align-items:center;gap:7px;flex:none}
.chev{width:10px;height:6px;flex:none;fill:none;stroke:var(--mut);stroke-width:1.5;
  stroke-linecap:round;stroke-linejoin:round;transition:transform .18s ease}
[aria-expanded="true"] .chev{transform:rotate(180deg)}
button:hover .chev{stroke:var(--ink)}
.mtocl{list-style:none;margin:0;padding:0}
.mtocl li{border-top:1px solid var(--hr)}
.mtocl button{display:grid;grid-template-columns:26px minmax(0,1fr);gap:0 10px;align-items:baseline;
  width:100%;padding:10px 0;text-align:left;color:var(--ink);cursor:pointer}
.mtocl button:hover span{box-shadow:inset 0 -.1em 0 var(--hl)}
.mtocl i{font-style:normal;font-family:var(--mono);font-size:11px;letter-spacing:-.04em;color:var(--fnt)}
.mtocl span{font-size:14.5px;font-weight:500;letter-spacing:-.014em;text-wrap:pretty}/* The cover story is the lede, so it sits on its own leaf. It used to carry
   the class .cover, which is a 46px condensed heading style belonging to the
   dead SEC.preview in reading.js — the whole section was inheriting weight 700,
   which is why the body copy read bold. */


.mcover{background:#FFFDF7;border:1px solid rgba(25,25,23,.11);border-radius:8px;
  padding:24px 26px 26px;box-shadow:0 1px 1px rgba(25,25,23,.04)}
.mcover .mh1{max-width:22ch}
.mcover .mcol{max-width:62ch}

@media(max-width:600px){/* the note is a note */

.mag .ednote{margin-top:16px;border-radius:4px}
.mag .edt{padding:12px 13px}
.mag .edb{padding:0 13px 12px}
.mag .edh{font-size:12.5px}
.mag .ednote .prose p{font-size:14px;line-height:1.55;margin-bottom:11px}
.mtoc{margin-top:14px}
.mtocl button{padding:11px 0}
.mtocl span{font-size:14px}/* full bleed on a phone: the card was inset inside the page gutter, so the
   lede read on a narrower measure than everything under it */

.mcover{margin:0 calc(var(--pad)*-1);padding:22px var(--pad) 24px;border-radius:0;border-left:0;border-right:0}
.mag .mcover .mcol{font-size:15px;line-height:1.58}/* stacked, the two all-league teams had no gap at all between them, so the
   second heading sat on the last row of the first */


.mag .alduo{row-gap:26px}/* the ballot and the superlatives name players; give them a face and a pill
   like everywhere else, and keep the spacing the plain <b> had */

.bal .nmrow,.sup .nmrow{justify-content:flex-start;margin-top:4px}
.bal .nmtail,.sup .nmtail{margin-top:4px}
.sup .nmrow{margin:5px 0 6px}
.sup .nmtail{margin:-2px 0 6px}/* reading matter comes down a step; it is a long sit on a phone */


.mag .prose,.mcol{font-size:15.5px;line-height:1.6}
.mdek{font-size:15.5px}
.mint{font-size:14.5px;margin-bottom:16px}
.mfeat .why,.bq p,.story p,.bold p{font-size:14.5px;line-height:1.5}/* the ballot stops tearing: label above answer, one per row */


.ballot{grid-template-columns:1fr}
.bal,.bal:nth-child(3n+1),.bal:nth-child(odd){padding:11px 0;border-left:0}
.bal:nth-child(n){border-top:1px solid var(--hr)}
.bal:first-child{border-top:0}
.bal i{margin-bottom:3px}
.bal b{font-size:15.5px}/* the priced table: the call, the chance, and an odds figure that says so */


.mag .flb{display:inline;font-style:normal;font-size:10.5px;font-weight:400;color:var(--fnt);margin-right:4px}
.ptbl.preds .pnum.ink{text-align:left;font-size:13px;color:var(--mut2)}}

@media(max-width:600px){
.magsec{margin-top:42px}
.mh1{font-size:29px}
.mdek{font-size:16px}
.mfeat h5,.bq h5,.story h5,.bold h5{font-size:16px}
.ptbl.preds .pth,.ptbl.preds .ptr{grid-template-columns:minmax(0,1fr) 62px 56px;gap:0 10px}
.ptbl.preds .pth span:nth-child(4),.ptbl.preds .ptr .pst{display:none}
.alr{grid-template-columns:46px minmax(0,1fr) 62px 42px;gap:0 10px}}

/* ===== Props on phones =====
   One block, one shape, replacing the four that had grown on top of each other.
   Every row is two lines: the name and the one figure that matters on the
   first, the supporting figures on a three-slot line under it. Those figures
   sit in the same three tracks the whole page down, and the headline figure
   keeps one right-hand edge, so the eye has a column to run along instead of
   four. Each number says what it is from its own markup (.flb), which is what
   lets the table head go rather than faking it with padding. */
@media(max-width:600px){
.propx .pcards{gap:10px}
.propx .pcard{padding:14px 15px 16px}
.propx .pch h4{font-size:14.5px}
.propx .pnote{font-size:13.5px}
.propx .flb{display:inline;font-style:normal;font-weight:400;font-size:10.5px;color:var(--fnt);margin-right:4px}/* The index. It reads as the masthead's second line rather than a widget
   parked under it: type on the page's own ground, the current section marked
   the way the tab bar marks the current tab, and no box around any of it. The
   rail runs wider than the screen, so the right edge fades to say so. */


.pnav{display:block;position:sticky;top:var(--bar);z-index:20;
  margin:14px calc(var(--pad)*-1) 0;
  background:rgba(250,250,246,.94);backdrop-filter:blur(8px);
  border-bottom:1px solid var(--hr2)}
.pnav .pnr{display:flex;gap:2px;overflow-x:auto;scrollbar-width:none;padding:0 var(--pad)}
.pnav .pnr::-webkit-scrollbar{display:none}
.pnav button{flex:none;min-height:40px;padding:0 10px;font-size:12.5px;font-weight:500;
  letter-spacing:-.008em;color:var(--mut);white-space:nowrap;
  transition:color .14s,box-shadow .14s}
.pnav button:first-child{padding-left:0}
.pnav button:last-child{padding-right:0}
.pnav button.on{color:var(--ink);font-weight:600;box-shadow:inset 0 -3px 0 var(--pmk,var(--hl))}
.pnav::after{content:"";position:absolute;top:0;bottom:1px;right:0;width:30px;pointer-events:none;
  background:linear-gradient(90deg,rgba(250,250,246,0),rgba(250,250,246,.96));
  opacity:1;transition:opacity .14s}/* nothing further to the right — stop shading the last section's name */

.pnav.end::after{opacity:0}
.propx .pcards{margin-top:14px}/* the card head already rules itself off; the first row must not rule again */


.propx .ptbl .pth+.ptr{border-top:0}/* the prop lists: the call leads, the figures follow, and the pill only
   appears once it has something to say */


.propx .prow{grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;
  grid-template-areas:"lab lab big" "od od st";
  gap:8px 12px;min-height:0;padding:12px 0 13px;align-items:start}
.propx .plab{grid-area:lab;font-size:14px;line-height:1.4}
.propx .plab em{margin-top:5px}
.propx .pchance{grid-area:big;justify-self:end;text-align:right;font-size:20px}
.propx .podds{grid-area:od;justify-self:start;text-align:left;font-size:12.5px;color:var(--mut2)}
.propx .pst{grid-area:st;justify-self:end;align-self:center;width:62px;margin:0}
.propx .prow.open .pst{display:none}/* the tables: head off, name and headline on line one, three labelled
   figures on line two */


.propx .ptbl .pth{display:none}
.propx .ptbl .ptr{grid-template-columns:repeat(3,minmax(0,1fr));
  grid-template-areas:"nm nm big" "m1 m2 m3";
  gap:7px 10px;padding:12px 0 13px;min-height:0;align-items:start}
.propx .ptbl .pnum,.propx .ptbl .pbig,.propx .ptbl .pmv{white-space:nowrap}
.propx .ptn{grid-area:nm;font-size:14px;white-space:normal;line-height:1.3}
.propx .pbig{grid-area:big;justify-self:end;font-size:20px}
.propx .m1{grid-area:m1}
.propx .m2{grid-area:m2}
.propx .m3{grid-area:m3}
.propx .ptbl .m1,.propx .ptbl .m2,.propx .ptbl .m3{justify-self:start;text-align:left;font-size:12.5px;color:var(--mut2)}/* the opening board prices the team; there is no percentage to lead with, so
   the price itself takes the headline slot */

.propx .ptbl.op .pnum.ink{grid-area:big;justify-self:end;font-size:16px;font-weight:600;color:var(--ink)}
.propx .ptbl.wl .ptn{font-size:13.5px}
.propx .ptbl.wl .ptn .pat{font-size:10.5px;margin:0 2px}
.propx .ptr.you{margin:0;padding:12px 0 13px}
.propx .ptr.you::before{left:-15px;right:-15px}}

/* Priced predictions on the Season Preview borrow these rows. They kept the
   shape the old props block gave them; it is spelled out here now that the
   props rules answer only to .propx. */
@media(max-width:600px){
.ptbl.preds .pth{display:none}
.ptbl.preds .ptr{grid-template-columns:minmax(0,1fr) auto;gap:0 10px;padding:12px 0 13px;min-height:0}
.ptbl.preds .ptr>*{white-space:nowrap}
.ptbl.preds .ptn{grid-area:1/1/2/2;font-size:14px;white-space:normal}
.ptbl.preds .pbig{grid-area:1/2/2/3;justify-self:end;font-size:20px}
.ptbl.preds .ptr.you{margin:0;padding:12px 0 13px}}.ptbl .pth,.ptbl .ptr{width:100%}/* figures in ink; the marker marks your row, colour is not decoration */


.pbig,.pchance{color:var(--ink)!important}/* your row's tint spans the whole card */


.ptr.you,.prow.you{position:relative;background:none}
.ptr.you>*,.prow.you>*{position:relative;z-index:1}

@media(max-width:600px){/* Their December: three columns will not fit a phone, so the owner drops
   onto its own line under the player rather than colliding with the name */

.sched .th,.sched .tr{grid-template-columns:minmax(0,1fr) minmax(0,0.85fr)}
.sched.own .th{grid-template-columns:minmax(0,1fr) minmax(0,0.85fr)}
.sched.own .th span.own,.sched.own .th span:nth-child(2){display:none}
.sched.own .tr{grid-template-columns:minmax(0,1fr) minmax(0,0.85fr);
               grid-template-areas:"nm rank" "own rank";row-gap:3px;align-items:start}
.sched .tr{align-items:start}
.sched .tr>.qt.ra{padding-top:1px;line-height:1.35}
.sched .nm{align-items:flex-start}
.sched .nm .face.sm{margin-top:1px}/* names wrap rather than truncate — rows here are already two lines */

.sched .nm .pn{white-space:normal;overflow:visible;text-overflow:clip;line-height:1.3}
.sched.own .tr>.nm{grid-area:nm}
.sched.own .tr>.qt.own{grid-area:own;text-align:left;font-size:11.5px;color:var(--fnt);padding-left:30px}
.sched.own .tr>.qt.ra{grid-area:rank}}

/* the bracket labels its own rounds, so the section carries no heading */


.sect.brks{padding-top:0}/* Playoffs headline odds. The old tiles were four tinted chips whose tint
   restated the number printed on them — and at 33% vs 31% the two swatches were
   indistinguishable. The bar length is the probability, so the colour earns its
   place, and the figures are set in the condensed face like the other display
   numerals on the page. Scoped to .ptiles so the Recap rail tiles and the odds
   market switcher are untouched. */


.ptiles{grid-template-columns:repeat(4,1fr);gap:14px}
.ptiles>div{background:none;min-height:0;padding:0;text-align:left;border:0;border-radius:0}
.ptiles b{font-family:var(--cond);font-size:31px;font-weight:700;letter-spacing:.006em;line-height:.94}
.ptiles .tbar{display:block;height:5px;margin-top:9px;border-radius:2px;background:rgba(25,25,23,.09);overflow:hidden}
.ptiles .tbar em{display:block;height:100%;background:var(--hls);border-radius:2px}
.ptiles>div.hi .tbar em{background:var(--ink)}
.ptiles>div.neg .tbar em{background:rgba(25,25,23,.3)}
.ptiles>div.neg b{color:var(--mut)}
.ptiles span{display:block;font-size:11px;color:var(--mut2);margin-top:8px;letter-spacing:-.005em}
@media(max-width:600px){
.ptiles{gap:10px}
.ptiles b{font-size:27px}
.ptiles span{font-size:10.5px;margin-top:7px}}

@media(max-width:600px){/* Odds board: let a long team name wrap rather than truncate. "Joe Fuck and
   Troy Gayman" needs 180px in a 134px cell, and the team name is the one thing
   in the row you cannot afford to lose. Inline flow rather than flex, so the
   record trails the last line of the name instead of being pushed below it. */

.oddsx .fnm{display:block;line-height:1.2}
.oddsx .fnm>span.tt{display:inline;white-space:normal;overflow:visible;text-overflow:clip}
.oddsx .fnm em.wl{display:inline;margin-left:8px;white-space:nowrap}
.oddsx .obr{align-items:center}/* the market column is tabular figures — align them so the column reads as a
   column. Centred, "8.6%" sat to the right of "20.6%". */

.oddsx .obp{text-align:right}}/* ===== More sheet: a contents page =====
   Two dense numbered columns per group so all of it is visible without
   scrolling inside a bottom sheet. Replaces the 2-up tile grid. */


.ctl{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}
.ctr{display:flex;align-items:baseline;gap:6px;min-height:38px;padding:7px 0;
  border-bottom:1px solid var(--hr);text-decoration:none;color:var(--ink);
  font-size:14.5px;font-weight:500;letter-spacing:-.015em;line-height:1.2}
.ctr i{font-style:normal;font-family:var(--cond);font-size:12px;color:rgba(25,25,23,.22);
  flex:none;min-width:13px}
.ctr span{min-width:0}
.ctr:active{background:rgba(25,25,23,.04)}
.ctr.on{font-weight:700}
.ctr.on span{box-shadow:inset 0 -.14em 0 var(--hl)}
.ctr.on i{color:var(--mut)}
.ctr.ext{color:var(--acc)}
.ctr.ext span::after{content:" \2197";font-size:.8em;color:var(--fnt)}
@media(max-width:380px){.ctl{gap:0 11px}.ctr{font-size:13.5px}}

@media(max-width:600px){/* The More sheet rises from the bottom like the player card, instead of
   sitting in the middle of the screen. The stylesheet had been forcing it to
   centre at every width — "centre with inset+margin so no transform rule can
   fight it" — which overrode its own bottom-sheet base. Same breakpoint and
   same rkup animation as .pmpanel so the two read as one gesture. */

.moresheet .mpanel,.moresheet.up .mpanel{
  position:fixed!important;inset:auto 0 0 0!important;margin:0!important;
  width:100%!important;max-width:none!important;max-height:86vh!important;
  border-radius:16px 16px 0 0!important}/* transform:none!important and animation:rkup!important were both here.
     Between them they made the sheet un-animatable: an !important transform
     outranks any animation or transition, and the forced keyframe fought the
     transition that actually drives open/close. The slide now lives in one
     place, at the end of this file. */
  
.mgrab{display:block!important}
.mclose{top:15px;right:14px}
.moresheet .mbody{padding-top:26px}}
@media(min-width:701px){/* the groups are already three columns up here — one column inside each */

.ctl{grid-template-columns:1fr}}/* a:hover (0,1,1) outranks .ctr (0,1,0), so tapping a More-sheet entry turned
   it link-blue. Same trap the old .mtile was in. */


.ctr:hover,.ctr:active,.ctr:focus{color:var(--ink)}
.ctr.ext:hover,.ctr.ext:active,.ctr.ext:focus{color:var(--acc)}/* Every market — the seed-table grid from Playoffs, five columns instead of eight */


.oddsx .sect .sdt.oddsgrid{margin-top:14px}
.oddsx .sdt.oddsgrid .sdh,.oddsx .sdt.oddsgrid .sdr{grid-template-columns:minmax(0,1fr) repeat(4,minmax(0,52px));gap:4px}/* The five market heads sort the board. A caret used to sit beside every one
   at rest at 8px and .32 opacity, which at that size is not a caret but a
   speck of dirt after each word. Only the live column is marked now, and it is
   marked the way every other sort control in the app is: ink, and a rule in
   the highlight underneath. The caret survives there alone, big enough to
   actually read, because that is the one place direction means anything. */

.oddsx .sdt.oddsgrid .sdh{padding-bottom:7px}
.oddsx .sdt.oddsgrid .sdh span{padding-bottom:0}
.oddsx .sdt.oddsgrid .sdh span:first-child{font-size:11px;font-weight:500;color:var(--mut)}
.oddsx .sdt.oddsgrid .sdh .gsort{display:flex;align-items:center;justify-content:center;gap:3px;
  width:100%;min-height:32px;padding:0 2px;font-size:11px;font-weight:500;color:var(--mut);
  letter-spacing:.01em;cursor:pointer;transition:color var(--d-state) var(--e-out)}
.oddsx .sdt.oddsgrid .sdh .gsort .ga{display:none;font-style:normal;font-size:9px;line-height:1;
  transition:transform var(--d-state) var(--e-out)}
.oddsx .sdt.oddsgrid .sdh .gsort:hover{color:var(--ink)}
.oddsx .sdt.oddsgrid .sdh .gsort.on{color:var(--ink);font-weight:700;
  box-shadow:inset 0 -2px 0 var(--hls)}
.oddsx .sdt.oddsgrid .sdh .gsort.on .ga{display:block;opacity:.5}
.oddsx .sdt.oddsgrid .sdh .gsort.asc .ga{transform:rotate(180deg)}
.oddsx .sdt.oddsgrid .sdh .gsort:focus-visible{outline:2px solid var(--acc);outline-offset:-1px}
.oddsx .sdt.oddsgrid .sdr .nm{font-size:14.5px}
.oddsx .sdt.oddsgrid .bc{color:var(--mut2)}
.oddsx .sdt.oddsgrid .bc.on{color:var(--ink);font-weight:500}
/* On a phone the grid is the board: the owner column only ever holds a first
   name, so it takes a fixed track and the five figures share everything left
   over rather than sitting in 46px slots with 10.5px type. */
@media(max-width:760px){
.oddsx .sdt.oddsgrid .sdr .bc{font-size:12.5px;padding:10px 0;border-radius:4px}}
@media(max-width:600px){
.oddsx .sdt.oddsgrid .sdh,.oddsx .sdt.oddsgrid .sdr{grid-template-columns:minmax(0,62px) repeat(4,minmax(0,1fr));gap:3px}
.oddsx .sdt.oddsgrid .sdr .nm{font-size:14px}
.oddsx .sdt.oddsgrid .sdh .gsort{padding:0 1px;gap:1px}}/* the grid follows straight on from the board — no heavy rule between them */


.oddsx .sect.gridsec{border-top:0;padding-top:0}/* the small muted per-cent mark the rest of the page uses beside a figure */


.oddsx .sdt.oddsgrid .bc i{font-style:normal;font-size:.82em;color:var(--fnt);margin-left:.5px}
.oddsx .sdt.oddsgrid .bc.on i{color:var(--mut)}/* ===== Rosters: give the name the room the numbers were taking =====
   The row ran 32px / 95px / 96px / 56px, so a four-character figure had as
   much width as the player. 39 of 140 roster rows across the eight teams were
   truncating the name — Saquon Barkley, Patrick Mahomes, Christian McCaffrey —
   on the page whose whole job is identifying players. Scoped to .pdeck.roster
   so the six other decks built on .pdr are untouched. */


.pdeck.roster .pdr{grid-template-columns:38px minmax(0,1fr) 64px 58px;height:auto;min-height:64px;
  padding-top:9px;padding-bottom:9px}
.pdeck.roster .pdn{white-space:normal;overflow:visible;text-overflow:clip;line-height:1.2}
.pdeck.roster .pdhd{display:flex;gap:0 14px;white-space:nowrap}
@media(max-width:600px){
.pdeck.roster .pdr{grid-template-columns:32px minmax(0,1fr) 54px 50px;gap:0 10px;min-height:60px}/* This head is flex, not grid, so the grid tracks above never applied and each
   label sized to its own text. Give the two labels the row's real column widths
   and the same right padding, and they sit over their figures. */

.pdeck.roster .pdhd{gap:0 10px;padding-right:12px}/* head and figure share a centre, so both are centred in the same track */

.pdeck.roster .pdhd span{text-align:center}
.pdeck.roster .pdr .pdv,.pdeck.roster .pdr .pdk{text-align:center}
.pdeck.roster .pdhd span:first-child{width:54px}
.pdeck.roster .pdhd span:last-child{width:50px}}/* ===== Rosters: the market =====
   Every team's surplus and deficit against the league median, all eight at
   once. Same diverging colours core's dtint uses for movement, on a wider
   scale because this data runs past 15 points rather than 5. */


.mkt{margin-top:14px}
.mkth,.mktr{display:grid;grid-template-columns:minmax(0,1fr) repeat(4,minmax(0,52px)) 58px;gap:4px;align-items:center}
.mkth{padding-bottom:8px;border-bottom:1px solid var(--hr2)}
.mkth .mksort{font-size:11px;font-weight:500;color:var(--mut);text-align:center;
  min-height:32px;padding:0 4px;border-radius:3px;cursor:pointer;letter-spacing:.01em}
.mkth .mksort.tm{text-align:left;font-weight:400;color:var(--mut);padding-left:0}
.mkth .mksort:hover{color:var(--ink);background:none}
.mkth .mksort.on{color:var(--ink);font-weight:700;box-shadow:inset 0 -2px 0 var(--gc,var(--hls))}
.mkth .mksort.tm.on{box-shadow:none}
.mkth .mksort.tm.on{font-weight:400;color:var(--mut)}
.mkth .mksort:focus-visible{outline:2px solid var(--acc);outline-offset:-1px}
.mktr{width:100%;text-align:left;padding:8px 0;border-bottom:1px solid var(--hr)}
.mktr:last-of-type{border-bottom:0}
.mktn{font-size:15.5px;font-weight:600;letter-spacing:-.018em;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mktr.you .mktn{font-weight:700}
.mktr.you .mktn span{box-shadow:inset 0 -.14em 0 var(--hl)}
.mktr.sel{background:rgba(25,25,23,.04)}
.mktr:hover{background:rgba(25,25,23,.025)}/* Rank and figure both, always. The rank used to be printed in the same red or
   green as the tint behind it, so a cell said "below the median" twice and said
   nothing about which of the two numbers was the rank; and the figure was only
   reachable by hovering or by tapping a cell, which is not discoverable and is
   not available at all on a phone. The numeral is ink and reads as a rank; the
   colour behind it is the only thing carrying above-or-below. */

.mktc{text-align:center;padding:6px 0 7px;border-radius:4px}
.mktc b{display:block;font-family:var(--cond);font-size:16px;font-weight:700;
  letter-spacing:.01em;line-height:1;color:var(--ink)}
.mktc em{display:block;font-style:normal;font-variant-numeric:tabular-nums;font-size:9.5px;
  letter-spacing:-.04em;line-height:1;margin-top:4px}
.mktc.up em{color:#155F2E}.mktc.dn em{color:#9E2323}.mktc.z em{color:var(--fnt)}
.mktc.first b{box-shadow:inset 0 -.4em 0 var(--hl)}/* ===== Who to trade with: a ranked ledger ===== */


.tfl{margin-top:13px;border-top:1px solid var(--hr)}
.tfr{display:grid;grid-template-columns:26px minmax(0,1fr) auto;align-items:center;
  gap:0 12px;padding:12px 0;border-bottom:1px solid var(--hr)}
.tfrk{font-family:var(--cond);font-size:15px;font-weight:700;color:var(--fnt);
  text-align:center;align-self:start;padding-top:2px}
.tfr.top .tfrk{color:var(--ink)}
.tfrm{min-width:0}
.tfrn{display:block;font-size:16px;font-weight:600;letter-spacing:-.018em}
.tfrs{display:flex;align-items:center;flex-wrap:wrap;gap:5px;margin-top:7px}
.tfrs i{font-style:normal;font-size:10.5px;color:var(--mut)}
.tfrs i:not(:first-child){margin-left:7px}
.tfrs em.slot{font-style:normal;font-family:var(--sans);font-size:10.5px;font-weight:600;
  padding:2px 5px;border-radius:3px;color:var(--mut);background:rgba(25,25,23,.06)}
.tfrv{font-family:var(--cond);font-size:23px;font-weight:700;line-height:1;text-align:right}
.tfrv i{display:block;font-family:var(--sans);font-style:normal;font-size:13px;
  font-weight:400;color:var(--mut);margin-top:6px;letter-spacing:.01em}
.tfr.tfone .tfrv,.tfr.tfone .tfrn{color:var(--mut2)}
@media(max-width:600px){
.mkth,.mktr{grid-template-columns:minmax(0,1fr) repeat(4,minmax(0,44px)) 50px;gap:3px}
.mktn{font-size:15px}
.mktc b{font-size:15px}.mktc em{font-size:9px}}

@media(min-width:760px){/* do not let the name column stretch the matrix into a thin ribbon */

.mkth,.mktr{grid-template-columns:minmax(0,260px) repeat(4,72px) 84px;gap:8px;max-width:700px}
.mktc{font-size:13px;padding:11px 0}
.mktn{font-size:16.5px}
.tfl{max-width:600px}}/* the row sum sits apart from the four positions it adds up — a gap does it.
   A box-shadow separator here painted a short rounded bar beside every cell
   rather than a rule, because the spread shrank it below the cell height. */


.mktt{margin-left:9px}
.mkth .mksort.tot{margin-left:9px}
@media(max-width:600px){.mktt{margin-left:7px}.mkth .mksort.tot{margin-left:7px;font-size:10.5px;padding:0 2px}}/* The dividers are 1px grid gaps showing the panel colour behind the cells,
   not borders on the cells. auto-fit means the column count changes with the
   space available — three on a phone, two in the desktop modal's left column,
   four when it is wide — so any rule that counts children (":nth-child(3n+1)")
   is wrong at two of those widths and leaves stray edges. A gap cannot be
   wrong: it falls wherever the grid actually breaks. *//* the model rank, riding on the value figure in the chart row *//* the figure names itself, the way the ppg column does, so switching the sort
   never leaves you guessing which of the two numbers you are reading */




.vcx .vv u{text-decoration:none;display:block;font-family:var(--sans);font-size:9.5px;
  font-weight:500;color:var(--mut);letter-spacing:0;margin-top:4px}/* ============================================================
   SIMULATION  (.simx)
   ============================================================ *//* Seed above, button below. The seed is what makes a run reproducible, so it
   belongs with the control that starts one rather than buried in the footnote —
   it just needs air around it to stop reading as a stray value. */



.simseedline{font-family:var(--mono);font-size:11px;color:var(--mut2);
  letter-spacing:-.03em;margin:22px 0 0;text-align:left}
.simseedline b{font-weight:500;color:var(--ink)}
.simbar{display:flex;align-items:center;gap:14px;margin:9px 0 0}
.simrun{appearance:none;border:0;cursor:pointer;background:var(--ink);color:#FAFAF6;
  font-family:var(--cond);font-size:16px;font-weight:700;letter-spacing:.03em;text-transform:uppercase;
  border-radius:6px;padding:13px 22px;min-height:46px}
.simrun:active{transform:translateY(1px)}

.simtabs{display:flex;gap:0;background:none;border-radius:0;padding:0;margin:14px 0 0;
  box-shadow:inset 0 -1px 0 var(--hr)}
.simtab{flex:1;appearance:none;border:0;background:none;cursor:pointer;font-size:13.5px;font-weight:600;
  color:var(--mut);border-radius:0;padding:10px 8px;min-height:38px}
.simtab.on{background:none;color:var(--ink);font-weight:700;box-shadow:inset 0 -2px 0 var(--ink)}/* final standings */


.simtbl{margin-top:14px}
.simhd,.simr{display:grid;grid-template-columns:34px minmax(0,1fr) 58px 56px;gap:0 10px;align-items:center}
.simhd{font-size:10.5px;color:var(--mut);padding-bottom:9px;border-bottom:1px solid var(--hr)}
.simhd span:nth-child(3),.simhd span:nth-child(4){text-align:right}
.simr{height:46px;border-bottom:1px solid var(--hr)}
.simr.you{background:rgba(255,232,107,.16)}
.simseed{font-family:var(--mono);font-size:12px;color:var(--mut2);text-align:center}
.simr.inn .simseed{color:var(--ink)}
.simteam{font-size:15px;font-weight:600;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.simteam em{font-style:normal;font-family:var(--cond);font-size:12.5px;font-weight:700;letter-spacing:.05em;
  text-transform:uppercase;background:rgba(25,25,23,.08);color:var(--mut);border-radius:3px;padding:2px 6px 1px;margin-left:8px}
.simteam em.q{background:rgba(31,122,61,.13);color:var(--up)}
.simr.inn .simteam em{background:var(--hl);color:var(--ink)}
.simrec{font-family:var(--cond);font-size:19px;font-weight:700;text-align:right}
.simpf{font-family:var(--mono);font-size:12px;color:var(--mut2);text-align:right;letter-spacing:-.03em}/* bracket */
/* The week is a small pill — the same grey the GP pill on Scoring Leaders and
   the ledger pills on the player card wear, so it reads as a marker rather
   than as a second heading over the game label below it. */
.simbl{width:fit-content;margin:0 0 10px;font-family:var(--sans);font-size:10px;
  font-weight:400;letter-spacing:.04em;line-height:1.5;text-transform:uppercase;
  color:var(--mut);padding:2px 9px;border-radius:4px;background:rgba(25,25,23,.055)}/* Tale of the tape. The card splits down the middle, one team a side, and the
   two figures sit level so the comparison is the card itself rather than
   something read line by line. The winning half takes the gold and its figure
   takes a gold rule. The round title is set large and centred across the top —
   it is the only label on the board and it should carry. */

/* The card is the two halves, not the whole block. The round label used to sit
   inside the box as a banded header; it is a label about the game, not part of
   it, so it floats above with nothing behind it and .simduo carries the fill
   and the lift. */
.simg{border:0;background:none;padding:0;margin-bottom:0}
/* Sentence case, not caps. WEEK 15 above it is already a small-caps label, and
   two of those stacked seven pixels apart read as one confused heading — which
   is the whole reason the week and the game looked like they were competing.
   The week stays the caps label; this is a caption over its own card. */
.simgl{display:block;font-family:var(--sans);font-size:12.5px;font-weight:600;
  letter-spacing:-.005em;text-transform:none;color:var(--mut2);text-align:center;
  padding:0 2px 7px;margin:0}
/* the labels arrive lowercase from the feed ("final", "semifinal · 1 seed");
   capitalised here so the data does not have to care about presentation */
.simgl::first-letter{text-transform:uppercase}
.simduo{display:grid;grid-template-columns:1fr 1fr;background:#FFFDF7;
  border-radius:10px;overflow:hidden;box-shadow:var(--cardsh)}
.simhalf{padding:12px 10px 13px;text-align:center;min-width:0}
.simhalf+.simhalf{border-left:1px solid var(--hr)}
.simhalf.w{background:linear-gradient(180deg,rgba(255,232,107,.20),rgba(255,216,77,.30))}
.simhn{display:block;font-size:12.5px;font-weight:600;color:var(--mut2);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:5px}
.simhalf.w .simhn{color:var(--ink)}
.simhn.simsrc{font-style:italic;font-weight:400;font-size:11px;color:var(--fnt)}
.simhs{display:inline-block;font-family:var(--cond);font-size:26px;font-weight:700;
  line-height:1;letter-spacing:.01em;color:var(--fnt)}
.simhalf.w .simhs{color:var(--ink);box-shadow:inset 0 -.13em 0 #F0C64B}
.simhk{display:block;font-family:var(--mono);font-size:9.5px;color:var(--fnt);
  margin-top:7px;letter-spacing:-.03em}
.simhalf.w .simhk{color:var(--mut2)}/* the final is the point of the board */


.simrd.fin .simgl{color:var(--ink)}

.simrd.fin .simhalf{padding:15px 10px 16px}
.simrd.fin .simhs{font-size:32px}
.simrd.fin .simhn{font-size:13.5px}/* gold, and the one place on the site that gets a gradient — both stops are
   house tokens, so it is the highlight yellow deepened rather than a new
   colour. Ink on gold, which carries more contrast than the paper it sits on. */

.simchamp{display:flex;align-items:baseline;gap:14px;margin-top:10px;padding:15px 16px;
  background:linear-gradient(180deg,var(--hl),var(--hls));color:var(--ink);
  border-radius:8px;box-shadow:inset 0 0 0 1px rgba(140,105,20,.28)}
.simchamp span{font-size:11px;letter-spacing:.08em;text-transform:uppercase;opacity:.62}
.simchamp b{font-family:var(--cond);font-size:27px;font-weight:700;letter-spacing:.01em;margin-left:auto}/* every week */
.simwl{font-size:11px;font-weight:600;color:var(--mut);margin:0 0 8px;letter-spacing:.02em;text-transform:uppercase}/* The week's games and the standings under them are one table read two ways,
   so they are measured the same: same row height, same left edge, same name
   size and weight, same figure. They had been four separate measurements —
   names 12 against 14, figures 15 against 19, rows 33 against 40, and the game
   rows bled ten pixels outside the column the standings sat in, so nothing
   lined up with anything. Difference between winner and loser is carried by
   colour, which is the one axis that should differ. */

.simgm{display:grid;grid-template-columns:minmax(0,1fr) 18px minmax(0,1fr);align-items:center;
  gap:0 6px;height:46px;padding:0;border-top:1px solid var(--hr)}
.simgm.you{background:rgba(255,232,107,.16);margin:0;padding:0;border-radius:0;border-top-color:transparent}
.simgs{display:flex;align-items:baseline;gap:9px;min-width:0;color:var(--mut2)}
.simgs:last-of-type{justify-content:flex-end}
.simgs.w{color:var(--ink)}
.simgs i{font-style:normal;font-size:14px;font-weight:500;min-width:0;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.simgs.w i{font-weight:600}
.simgs b{font-family:var(--cond);font-size:19px;font-weight:700;
  letter-spacing:.01em;white-space:nowrap}
.simvs{font-size:10px;color:var(--fnt);text-align:center}/* long run */


.simo{margin-top:14px}
.simorow{display:grid;grid-template-columns:minmax(0,86px) minmax(0,1fr) 52px;gap:0 12px;
  align-items:center;padding:12px 0;border-top:1px solid var(--hr)}
.simorow.you{background:rgba(255,232,107,.16);margin:0 -10px;padding:12px 10px;border-radius:4px}
.simon{font-size:14.5px;font-weight:600;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.simob{height:10px;background:rgba(25,25,23,.055)}
.simob i{display:block;height:100%;background:var(--hl)}
.simorow.you .simob i{background:var(--ink)}
.simov{font-family:var(--cond);font-size:19px;font-weight:700;text-align:right;white-space:nowrap}
.simov i{font-style:normal;font-family:var(--sans);font-size:10px;font-weight:500;color:var(--mut);margin-left:2px}
.simoq{grid-column:2/4;font-size:11px;color:var(--mut);margin-top:-4px}
.simfit{margin-top:26px}

@media(max-width:600px){
.simbar{flex-wrap:wrap;gap:10px}
.simrun{flex:1 0 100%}
.simhd,.simr{grid-template-columns:28px minmax(0,1fr) 52px 48px;gap:0 8px}
.simteam{font-size:14px}
.simteam em{margin-left:6px;padding:2px 5px 1px}
.simgm{grid-template-columns:minmax(0,1fr) 16px minmax(0,1fr)}
.simorow{grid-template-columns:minmax(0,74px) minmax(0,1fr) 46px;gap:0 10px}}

/* Section heads: the title and its dek share a baseline row on a wide screen,
   but at phone width a three- or four-word title wraps and the dek is left
   hanging off the first line of it. Stack them instead. This was being patched
   per page (.medsec); it belongs to every section head. */
@media(max-width:600px){
.sh{display:block}
.sh>span{display:block;margin-top:3px}}/* =========================================================================
   THE PRESEASON ISSUE
   Six block kinds and nothing else. Every one of them is the same furniture
   the rest of the site uses, so a data file can only ever produce a page that
   already matches. See src/preseason.js for the contract.
   ========================================================================= */


.piprose{margin-top:13px}
.piprose p{font-family:var(--serif);font-size:16.5px;line-height:1.6;color:var(--ink);
  margin:0 0 16px;max-width:var(--measure);text-wrap:pretty}
.piprose p:last-child{margin-bottom:0}

.pilist{margin-top:12px;border-top:1px solid var(--hr)}
.pirow{display:grid;grid-template-columns:26px minmax(0,1fr) auto;gap:0 12px;
  align-items:center;padding:12px 0}
.pirow+.pirb{padding-bottom:12px}
.pilist>.pirow:not(:first-child){border-top:1px solid var(--hr)}
.pirk{font-family:var(--cond);font-size:15px;font-weight:700;color:var(--fnt);text-align:center}
.pirm{min-width:0}
.pirn{display:block;font-size:16px;font-weight:600;letter-spacing:-.018em}
.pirmeta{display:block;font-size:12.5px;color:var(--mut);margin-top:4px}
.pirv{font-family:var(--cond);font-size:22px;font-weight:700;line-height:1;text-align:right}
.pirv i{font-style:normal;font-family:var(--sans);font-size:12px;font-weight:400;
  color:var(--mut);margin-left:3px}
.pirb{font-family:var(--serif);font-size:14.5px;line-height:1.5;color:var(--mut2);
  margin:0 0 0 38px;padding-bottom:2px;max-width:var(--measure);text-wrap:pretty}

.dtab{margin-top:12px}
.dtr{display:grid;grid-template-columns:minmax(0,1.6fr) repeat(calc(var(--pn,3) - 1),minmax(0,1fr));
  gap:0 12px;padding:11px 0;border-top:1px solid var(--hr);align-items:baseline}
.dtr>span:not(:first-child){text-align:right;font-family:var(--cond);font-size:17px;font-weight:700}
.dtr>span:first-child{font-size:15px;font-weight:500;min-width:0;overflow:hidden;text-overflow:ellipsis}
.dth{border-top:0;border-bottom:2px solid var(--ink);padding-top:0}
.dth>span{font-size:11px!important;font-weight:500!important;font-family:var(--sans)!important;
  color:var(--mut)}

.piq{margin:18px 0 0;padding:0 0 0 15px;border-left:3px solid var(--gc,var(--hls));
  max-width:var(--measure)}
.piq p{font-family:var(--serif);font-size:19px;line-height:1.45;color:var(--ink);margin:0;
  text-wrap:pretty}
.piq cite{display:block;font-style:normal;font-size:12.5px;color:var(--mut);margin-top:9px}

.picall{margin:16px 0 0;padding:10px 0 11px 13px;font-size:13.5px;line-height:1.5;
  color:var(--mut2);border-left:3px solid var(--gc,var(--hls));max-width:var(--measure)}
.picall b{font-family:var(--cond);font-size:13px;font-weight:700;letter-spacing:0.045em;
  text-transform:uppercase;color:var(--ink);margin-right:9px}/* ===== Schedule: the season at a glance ===== *//* Fourteen identical rows carrying one number each gave no sense of the shape
   of the season. The ribbon is that shape; the month rules give the list a
   rhythm; the meter under each row means 58 and 82 no longer look alike. */



.schrib{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:3px;
  margin-top:18px;padding-bottom:2px;max-width:560px}
.schrb{display:grid;justify-items:center;gap:5px;padding:0;cursor:pointer}
.schrt{display:block;width:100%;height:38px;border-radius:2px;
  background:rgba(25,25,23,.05);position:relative;overflow:hidden}
.schrt i{position:absolute;left:0;right:0;bottom:0;display:block;border-radius:2px}
.schrn{font-variant-numeric:tabular-nums;font-size:9.5px;letter-spacing:-.012em;color:var(--fnt)}
.schrb.now .schrt{box-shadow:inset 0 0 0 1.5px var(--ink)}
.schrb.now .schrn{color:var(--ink);font-weight:600}
.schrb:hover .schrt{box-shadow:inset 0 0 0 1.5px rgba(25,25,23,.3)}

.schmo{font-family:var(--cond);font-size:12.5px;font-weight:700;letter-spacing:.05em;
  text-transform:uppercase;color:var(--mut);margin:22px 0 8px;padding-bottom:5px;
  border-bottom:2px solid var(--gc,var(--hls))}
.wkcs2>.schmo:first-child{margin-top:6px}

.wkcm{position:absolute;left:0;right:0;bottom:0;height:3px;
  background:rgba(25,25,23,.06);border-radius:0 0 7px 7px;overflow:hidden}
.wkcm i{display:block;height:100%;background:var(--hls);border-radius:0 2px 2px 0}
.wkc.now .wkcm i{background:var(--ink)}/* ---- the season plan: a dated ledger ---- */


.wplan{list-style:none;margin:14px 0 0;padding:0;border-top:1px solid var(--hr)}
.wpl{display:grid;grid-template-columns:74px minmax(0,1fr) auto;gap:0 16px;
  align-items:start;padding:14px 0;border-bottom:1px solid var(--hr)}
.wplw{font-family:var(--cond);font-size:14px;font-weight:700;letter-spacing:.01em;
  color:var(--ink);background:var(--gtint,rgba(25,25,23,.06));
  padding:4px 8px;border-radius:3px;justify-self:start;white-space:nowrap}
.wplb{min-width:0}
.wplt{font-size:15.5px;font-weight:600;letter-spacing:-.012em;line-height:1.3;margin:0}
.wpld{font-size:12.5px;color:var(--mut);margin:5px 0 0}
.wply{font-family:var(--serif);font-size:14.5px;line-height:1.5;color:var(--mut2);
  margin:7px 0 0;text-wrap:pretty}
.wpls{font-family:var(--cond);font-size:13px;font-weight:700;letter-spacing:0.045em;
  text-transform:uppercase;padding:3px 7px;border-radius:3px;white-space:nowrap;
  color:var(--mut);background:rgba(25,25,23,.05)}
.wpls.s-done{color:var(--up);background:rgba(31,122,61,.13)}
.wpls.s-dead{color:var(--fnt);background:rgba(25,25,23,.04)}
.wpl.done .wplt{color:var(--mut)}
@media(max-width:600px){
.wpl{grid-template-columns:minmax(0,1fr) auto;gap:0 12px}
.wplw{grid-column:1;margin-bottom:7px}
.wplb{grid-column:1/-1}
.wpls{grid-column:2;grid-row:1;justify-self:end}}/* the board */


.wvlist{margin-top:14px}
.wvr{display:grid;grid-template-columns:38px minmax(0,1fr) 58px 46px 52px;
  gap:0 11px;align-items:center;padding:11px 0 10px;border-top:1px solid var(--hr)}
.wvr .face{width:38px;height:38px}
.wvrk{font-variant-numeric:tabular-nums;font-size:11.5px;color:var(--mut2);text-align:center;letter-spacing:-.012em}
.wvn{min-width:0;display:grid;gap:3px}
.wvnm{font-size:15px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wvm{display:flex;align-items:center;gap:7px;min-width:0}
.wvmt{font-size:12px;color:var(--mut);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wvv,.wvp{font-family:var(--cond);font-size:21px;font-weight:700;text-align:right;line-height:1;white-space:nowrap}
.wvv i,.wvp i{font-style:normal;display:block;font-family:var(--sans);font-size:9.5px;
  font-weight:500;color:var(--mut);margin-top:4px;letter-spacing:0}
.wvp{color:var(--mut2);padding-right:10px}
.wvvd{font-family:var(--cond);font-size:12.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;
  border-radius:3px;padding:4px 0 3px;white-space:nowrap;min-width:0;
  text-align:center;justify-self:stretch}
.wvvd.v-claim{background:rgba(31,122,61,.15);color:var(--up)}
.wvvd.v-stash{background:var(--hl);color:var(--ink)}
.wvvd.v-stream{background:rgba(25,25,23,.07);color:var(--mut)}
 /* transparent read as a rendering failure sitting in a row of filled chips —
    quiet is the intent, invisible is not */
.wvvd.v-pass{background:rgba(25,25,23,.045);color:var(--fnt);
 box-shadow:inset 0 0 0 1px rgba(25,25,23,.09)}
.wvb{font-family:var(--serif);font-size:14.5px;line-height:1.5;color:var(--mut2);
  margin:0 0 4px;padding:0 0 10px 49px}
/* the call */


/* the call, the rolling-order line and the drop list: superseded by the
   verdict-grouped board below. One definition, not two. */

@media(max-width:600px){
.wvr{grid-template-columns:34px minmax(0,1fr) 56px 50px;gap:0 9px}
.wvr .wvv{padding-right:9px}
.wvr .face{width:36px;height:36px}/* the weekly projection is the first thing to go when the row runs out of room:
   the board is ranked on value, and the projection is printed again downstream */

.wvr .wvp{display:none}
.wvb{padding-left:43px;font-size:14px}
.wvfor.row{margin-left:43px}
.wvv{font-size:20px}
.wvcv{font-size:18px}}/* The position pill. There was no base rule for this: every component that
   used one re-declared font-style/family/weight from scratch, eleven times
   over, so a new component that reached for .slot got a browser-default
   italic <em>. Every one of those declarations is more specific than this and
   still wins, so this only catches what they missed. */


em.slot{font-style:normal;font-family:var(--sans);font-weight:600}/* ============================================================
   STOCK  (.stkx)
   ============================================================ */


.stkintro{margin-top:16px}/* deliberately not .sect: that carries its own heavy top rule, and the
   coloured rail below is this page's divider — two would read as a mistake */

.stkdek{font-size:14px;color:var(--mut);margin:11px 0 0;line-height:1.45;max-width:56ch}
.stklist{margin-top:12px}
.stkr{display:grid;grid-template-columns:38px minmax(0,1fr) auto 62px;gap:0 11px;
  align-items:center;padding:11px 0 10px;border-top:1px solid var(--hr)}
.stkr .face{width:38px;height:38px}
.stkn{min-width:0;display:grid;gap:3px}
.stknm{font-size:15px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.stkm{display:flex;align-items:center;gap:7px;min-width:0}
.stkmt{font-size:12px;color:var(--mut);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.stkd{font-family:var(--cond);font-size:17px;font-weight:700;white-space:nowrap;
  border-radius:3px;padding:3px 7px 2px}
.stkd.up{background:rgba(31,122,61,.13);color:var(--up)}
.stkd.dn{background:rgba(201,48,48,.11);color:var(--dn)}
.stkd.z{color:var(--mut)}
.stkv{font-family:var(--cond);font-size:18px;font-weight:700;text-align:right;line-height:1;white-space:nowrap}
.stkv i{font-style:normal;display:block;font-family:var(--sans);font-size:9.5px;font-weight:500;
  color:var(--mut);margin-top:4px}
.stkb{font-family:var(--serif);font-size:14.5px;line-height:1.5;color:var(--mut2);
  margin:0 0 4px;padding:0 0 10px 49px}/* breakouts *//* minmax(0,1fr) rather than the implicit auto track: an auto track refuses to
   shrink below its content's min-content width, so one nowrap descendant blows
   the whole card out past the viewport */



.stkbo{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;margin-top:14px}
.stkc{border:1px solid rgba(25,25,23,.11);border-radius:9px;padding:14px 15px 15px;background:#FFFDF7}
.stkch{display:grid;grid-template-columns:40px minmax(0,1fr) auto;gap:0 11px;align-items:center}
.stkch .face{width:40px;height:40px}
.stkconf{font-family:var(--cond);font-size:12.5px;font-weight:700;letter-spacing:0.045em;text-transform:uppercase;
  border-radius:3px;padding:4px 8px 3px;white-space:nowrap}
.stkconf.c-high{background:rgba(31,122,61,.14);color:var(--up)}
.stkconf.c-medium{background:var(--hl);color:var(--ink)}
.stkconf.c-low{background:rgba(25,25,23,.07);color:var(--mut)}
.stkth{font-family:var(--serif);font-size:15.5px;line-height:1.5;margin:13px 0 0}
.stkw{margin-top:13px;padding-top:12px;border-top:1px solid var(--hr)}
.stkw p{font-size:14.5px;line-height:1.45;margin:0}
.stkwl{display:block;font-family:var(--cond);font-size:13px;font-weight:700;letter-spacing:0.045em;
  text-transform:uppercase;color:var(--mut);margin-bottom:5px}
.stkw.strike{border-top-color:rgba(25,25,23,.2)}
.stkw.strike .stkwl{color:var(--up)}
.stkwin{display:flex;align-items:baseline;gap:9px;font-family:var(--cond);font-size:15px;font-weight:700;
  margin:13px 0 0}
.stkwin span{font-family:var(--sans);font-size:10.5px;font-weight:500;letter-spacing:.04em;
  text-transform:uppercase;color:var(--mut)}

@media(max-width:600px){
.stkr{grid-template-columns:36px minmax(0,1fr) auto 54px;gap:0 9px}
.stkr .face{width:36px;height:36px}
.stkb{padding-left:45px;font-size:14px}
.stkv{font-size:16px}
.stkd{font-size:15px}}/* a name that still will not fit ends in an ellipsis rather than a hard cut */

.pdn{overflow:hidden;text-overflow:ellipsis}/* ============================================================
   MOTION
   ------------------------------------------------------------
   The house is a printed ledger: flat fields, hairlines, no
   shadows, figures set in condensed type. So the motion has to
   behave like ink and paper — things settle, nothing bounces,
   nothing overshoots. No springs anywhere, deliberately: a
   spring's overshoot is the one gesture this visual language
   cannot make.

   Curves and timings are not invented here. They follow current
   practice (Kowalski, animations.dev): a strong ease-out rather
   than the built-in one, which is too soft to read as a
   response; an iOS drawer curve for the sheets; never ease-in
   for UI, which starts slow and feels broken.

   Only transform, opacity and clip-path are animated. Those
   three skip layout and paint. Nothing here animates a width, a
   height or a margin.
   ============================================================ */


:root{
  /* durations, by how often the thing is triggered */
  --d-press:140ms;   /* many times a minute — must not be felt as time */
  --d-state:200ms;   /* tabs, chips, filters */
  --d-sheet:320ms;   /* modals and drawers, the slowest thing allowed */
  --d-draw:340ms;    /* a figure drawing itself in, once per page */

  /* a strong ease-out: fast departure, soft landing. The built-in
     ease-out is too gentle to register as a reply to a tap. */
  --e-out:cubic-bezier(.23,1,.32,1);
  /* on-screen movement that starts and ends on screen */
  --e-move:cubic-bezier(.77,0,.175,1);
  /* the drawer curve — long tail, no overshoot */
  --e-sheet:cubic-bezier(.32,.72,0,1);
}/* ---- 1. Feedback -------------------------------------------
   The press. Every control the thumb can land on answers it.
   Hover is gated behind a real pointer: on a phone :hover
   sticks after a tap and leaves controls looking half-pressed. */


.mk button,.vseg,.vchip,.vclr,.simtab,.simrun,.hubc,.chip,.idxbtn,
.tiles>button,.tpick,.pdr,.pl,.ctr,.mclose,
.wvr,.stkr,.stkch,.wvcp,.gsort,.mksort,.mtoct,.simg,
#tabbar a,#deskn a,#more-t,#more-d{
  -webkit-tap-highlight-color:transparent;
  transition:transform var(--d-press) var(--e-out),
             background-color var(--d-press) var(--e-out),
             color var(--d-press) var(--e-out),
             opacity var(--d-press) var(--e-out);
}
.mk button:active,.vseg:active,.vchip:active,.simtab:active,.simrun:active,
.hubc:active,.chip:active,.idxbtn:active,.tiles>button:active,.tpick:active,
.ctr:active,.mclose:active,.mtoct:active{transform:scale(.97)}/* rows are wide: a full-width scale reads as a wobble, so they dim instead */

.pdr:active,.pl:active,.wvr:active,.stkr:active,
.stkch:active,.wvcp:active,.simg:active{background-color:rgba(25,25,23,.05)}/* ---- 2. Continuity: the route change -----------------------
   The app replaces #root wholesale on every navigation, which is
   precisely the case the View Transitions API exists for. It is
   Baseline as of October 2025 and feature-detected in core.js,
   so a browser without it simply navigates as before.
   Only the page body crosses; the masthead and the tab bar are
   named separately so they stay put and the tab underline
   travels rather than blinking. *//* NOT on #root. An element with a view-transition-name becomes a stacking
   context AND a containing block for fixed-position descendants — which
   silently broke every overlay rendered inside the page: the Power Rankings
   sheet and the Start/Sit swap are position:fixed inside #root, so they were
   re-anchored to #root and trapped beneath the tab bar. Naming the two things
   that must NOT travel instead leaves everything else in the default `root`
   snapshot, which is the page, and #root stays an ordinary block. */



.mast{view-transition-name:mast}
#tabbar{view-transition-name:tabs}/* Asymmetric, and blurred on the way out. A straight crossfade between two
   text-dense editorial pages reads as double vision — two headlines legible
   at once in the middle of the dissolve. The outgoing page leaves faster than
   the incoming arrives and takes a 3px blur with it, which is the standard
   trick for bridging a crossfade: the departing state stops being readable
   almost immediately, so only one page is ever competing for the eye.
   Blur is kept small; it is expensive above about 20px in Safari. */

::view-transition-old(root){animation:pageOut 170ms var(--e-out) both}
::view-transition-new(root){animation:pageIn 280ms var(--e-out) 70ms both}
@keyframes pageOut{to{opacity:0;filter:blur(3px);transform:translateY(-3px)}}
/* No translate on the way in any more. The blocks below carry the movement,
   and doing it in both places stacked two rises into one arrival. */
@keyframes pageIn{from{opacity:0;filter:blur(2px)}
  to{opacity:1;filter:blur(0)}}

/* The crossfade moves one page aside for another, which is the right gesture
   between pages but leaves the arriving one feeling like a cut: the whole
   thing is simply there. Its blocks now settle in sequence underneath it, so
   the page assembles. Short, small, and capped at four steps — past that a
   long page trickles instead of arriving. Route changes only: .mo-in is put
   on #root for one paint and never on an in-page re-render. */
/* backwards, not both. A forwards fill holds the synthesised end value, and
   an identity matrix is still a transform — which would make every page block
   a containing block for the position:fixed overlays inside it (the Power
   Rankings sheet, the Start/Sit swap) for the life of the page. Backwards
   covers the delay and then hands the element back to its own styles. */
.mo-in>.sheet>*{animation:pageBlock 300ms var(--e-out) backwards}
.mo-in>.sheet>*:nth-child(2){animation-delay:50ms}
.mo-in>.sheet>*:nth-child(3){animation-delay:90ms}
.mo-in>.sheet>*:nth-child(4){animation-delay:120ms}
.mo-in>.sheet>*:nth-child(n+5){animation-delay:145ms}
@keyframes pageBlock{from{opacity:0;transform:translateY(9px)}}
@keyframes scrimIn{to{opacity:1}}
@keyframes sheetUp{from{transform:translateY(100%)}to{transform:translateY(0)}}
.mpanel{transition:transform var(--d-sheet) var(--e-sheet),opacity var(--d-state) var(--e-out)}
.mscrim{transition:opacity var(--d-state) var(--e-out)}/* ---- 4. Hierarchy: figures drawing themselves --------------
   Bars wipe rather than stretch. A clip-path inset reveals the
   bar that is already there at its final size, so the fill
   reads as ink arriving rather than a box being pulled — and
   the diverging bars on the median charts wipe outward from the
   centre rule, in the direction the number actually points.
   Runs once, on a genuine route change only: #root carries
   .mo-in for one paint, never on an in-page re-render. */


.mo-in .ntrack i.pos,.mo-in .simob i,.mo-in .wbar i{
  animation:wipeR var(--d-draw) var(--e-out) both}
.mo-in .ntrack i.neg{animation:wipeL var(--d-draw) var(--e-out) both}
@keyframes wipeR{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0)}}
@keyframes wipeL{from{clip-path:inset(0 0 0 100%)}to{clip-path:inset(0)}}/* Rows and cards settle in sequence. The step is 35ms — inside the 30–80ms
   band where a cascade reads as one movement rather than a queue — and the
   index is capped at eight so a long list finishes in under half a second
   instead of trickling. The index is carried on the element as --i rather
   than spelled out in nth-child rules, so it stays correct at any length. */


.mo-in .hubc,.mo-in .simr,.mo-in .simorow,.mo-in .stkc{
  animation:settle var(--d-state) var(--e-out) both;
  animation-delay:calc(min(var(--i,0),8) * 35ms)}
@keyframes settle{from{opacity:0;transform:translateY(6px)}}/* ---- 5. Filtering ------------------------------------------
   The value chart filters in place rather than re-rendering, so
   a row that survives the filter should not blink. */


.vcx .vrow{transition:opacity var(--d-press) var(--e-out)}

/* ---- 6. Reduced motion -------------------------------------
   Not a blanket kill: the interface still answers a press and
   still crossfades, it simply stops moving through space. */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;
    animation-iteration-count:1!important;transition-duration:.01ms!important}
  ::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){
    animation:none!important}
  .mo-in .ntrack i.pos,.mo-in .ntrack i.neg,.mo-in .simob i,
  .mo-in .wbar i{clip-path:none!important}
  .mo-in .hubc,.mo-in .simr,.mo-in .simorow,.mo-in .stkc{
    opacity:1!important;transform:none!important}}/* ============================================================
   TAP TARGETS
   The column heads in the dense tables — sort controls on Odds
   and Rosters — are 26px tall. They cannot simply grow: their
   height is the table's header row, and enlarging it pushes the
   data down on every screen. So the hit area grows instead of
   the control: an invisible 40px band, centred on the label,
   that costs no layout. The visible design is unchanged.
   ============================================================ */


.oddsx .sdt.oddsgrid .sdh .gsort,.mkth .mksort{position:relative}
.oddsx .sdt.oddsgrid .sdh .gsort::after,.mkth .mksort::after{
  content:"";position:absolute;left:0;right:0;top:50%;
  transform:translateY(-50%);height:40px}/* these have room to grow, so they do */


.vseg{min-height:34px}
.vchip{min-height:34px}
.idxbtn{min-height:40px}
.mtoct{min-height:44px}/* the issue's power-rankings read */


.isrk{margin-top:14px}
.isrki{padding:18px 0 20px;border-top:1px solid var(--hr)}
.isrki.you{background:rgba(255,232,107,.14);margin:0 -12px;padding:18px 12px 20px;border-radius:5px}
.isrkh{display:flex;align-items:baseline;gap:11px}
.isrkn{font-family:var(--cond);font-size:26px;font-weight:700;line-height:1;color:var(--mut2);min-width:26px}
.isrki.you .isrkn{color:var(--ink)}
.isrkh h5{font-size:20px;font-weight:700;letter-spacing:-.018em;margin:0}
.isrkq{font-size:15.5px;font-weight:600;line-height:1.4;margin:10px 0 0;color:var(--mut2)}
.isrkp{margin-top:11px}
.isrkp p{font-size:15.5px}
@media(max-width:600px){
.isrkn{font-size:22px;min-width:22px}
.isrkh h5{font-size:18px}
.isrkq,.isrkp p{font-size:15px}}

/* ============================================================
   HOVER ON TOUCH
   On a phone :hover latches after a tap and does not clear until
   something else is tapped, so a row you visited a minute ago is
   still sitting there looking half-pressed. Every control now
   answers a press with :active, which makes the hover state
   redundant on touch rather than merely wrong. Neutralised only
   where it paints a background — selected states are more
   specific and survive.
   ============================================================ */
@media(hover:none){
.mk button:hover,.vseg:hover,.vchip:hover,.simtab:hover,
.mkth .mksort:hover,.oddsx .sdt.oddsgrid .sdh .gsort:hover,.idxbtn:hover,
.tpick:hover,.pdr:hover,.pl:hover,.tiles>button:hover,.hubc:hover,.wvr:hover,.stkr:hover,.ctr:hover{
  background-color:transparent}}

/* The More sheet, as an actual sheet. It was travelling 12px and fading in
   from 0.6 opacity — which reads as a flicker, not a pull-up. Below the
   breakpoint where it becomes a centred desktop dialog (701px) it now slides
   its own full height on the same curve and duration as the player card, so
   the two sheets on this site read as one gesture. */
/* Breakpoint matches the block above that turns this into a bottom sheet
   (600px), not the 701px where the desktop dialog begins — between the two it
   is still a centred dialog and must not slide.

   These carry !important reluctantly. An earlier block declares "a centred
   modal at every width" and pins the panel with transform:translate(-50%,-50%)
   !important, unscoped; nothing without !important can move the panel at any
   width. Overriding weight with weight is the wrong long-term answer — the
   right one is that this file should not hold four generations of this sheet
   at once — but it is the correct surgical fix tonight. */
@media(max-width:600px){
.moresheet .mpanel{transform:translateY(100%)!important;opacity:1;
  transition:transform var(--d-sheet) var(--e-sheet)}
.moresheet.up .mpanel{transform:translateY(0)!important;opacity:1}
.mscrim{transition:opacity var(--d-state) var(--e-out)}}
@keyframes sheetDown{to{transform:translateY(100%)}}
/* explicit from: replacing scrimIn also drops its forwards fill, so an
   open-ended `to` would animate from the base opacity:0 to 0 — invisible,
   and the page behind would snap back to full brightness instantly while
   the card was still on its way out */
@keyframes scrimOut{from{opacity:1}to{opacity:0}}/* the More sheet's handle, given the same hit area as the player card's */

.mgrab{position:relative;cursor:grab}
.mgrab::after{content:"";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:120px;height:44px}
.mgrab:active{cursor:grabbing}/* ---- Power Rankings sheets, on the house terms --------------------------
   The team card was rising 24px and fading from 0.6 opacity — the same weak
   nudge the More sheet had, and visibly a different gesture from the player
   card opened from the same page. It now travels its own height on the same
   curve. The IDX explainer is a centred dialog, not a sheet, so it scales
   from 0.97 instead: nothing appears from nothing, and nothing centred should
   slide in from an edge it is not attached to. */


.rksheet:not(.idxm) .rkpanel{animation:sheetUp var(--d-sheet) var(--e-sheet)!important}
.rksheet:not(.idxm) .rkscrim{opacity:0;animation:scrimIn var(--d-sheet) var(--e-out) forwards}
.rksheet.rkout:not(.idxm) .rkpanel{animation:sheetDown 240ms cubic-bezier(.4,0,1,1) forwards!important}
.rksheet.rkout:not(.idxm) .rkscrim{animation:scrimOut 220ms var(--e-out) forwards!important}

.idxm .rkscrim{opacity:0;animation:scrimIn var(--d-state) var(--e-out) forwards}
/* The IDX explainer only centres at 601px and up — below that it is a bottom
   sheet like everything else. It was being given the centred-dialog keyframes
   at every width, so on a phone the translate(-50%,-50%) in them threw it
   half its own size up and to the left mid-animation. Each width now gets the
   gesture that matches how it is actually laid out. */
@media(max-width:600px){
.idxm .rkpanel{animation:sheetUp var(--d-sheet) var(--e-sheet)!important}
.idxm.rkout .rkpanel{animation:sheetDown 240ms cubic-bezier(.4,0,1,1) forwards!important}}
@media(min-width:601px){
.idxm .rkpanel{animation:dlgIn var(--d-state) var(--e-out)!important}
@keyframes dlgIn{from{opacity:0;transform:translate(-50%,-50%) scale(.97)}
  to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
.idxm.rkout .rkpanel{animation:dlgOut 160ms var(--e-out) forwards!important}}
@keyframes dlgOut{from{opacity:1;transform:translate(-50%,-50%) scale(1)}
  to{opacity:0;transform:translate(-50%,-50%) scale(.98)}}
.idxm.rkout .rkscrim{animation:scrimOut 160ms var(--e-out) forwards!important}/* the handle, with a control's hit area */


.rkgrab{position:relative;cursor:grab}
.rkgrab::after{content:"";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:120px;height:44px}
.rkgrab:active{cursor:grabbing}

@media(prefers-reduced-motion:reduce){
.rksheet .rkpanel,.rksheet .rkscrim{animation:none!important;opacity:1!important}}/* ---- Start/Sit swap sheet ----------------------------------------------
   The last overlay without motion. Below 760px it is a bottom sheet and
   behaves like every other one here; at and above that it centres, so it
   scales instead of sliding. The scrim lives on .lmodal itself rather than on
   a child, so it is the background-color that fades. */


.lgrab{width:38px;height:4px;border-radius:2px;background:rgba(25,25,23,.18);
  margin:-6px auto 10px;flex:none;position:relative;cursor:grab}
.lgrab::after{content:"";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:120px;height:44px}
.lgrab:active{cursor:grabbing}
.lmodal{animation:scrimBg var(--d-state) var(--e-out)}
@keyframes scrimBg{from{background-color:rgba(25,25,23,0)}}
.lmodal.lout{animation:scrimBgOut 200ms var(--e-out) forwards}
@keyframes scrimBgOut{to{background-color:rgba(25,25,23,0)}}

@media(max-width:759px){
.lcard{animation:sheetUp var(--d-sheet) var(--e-sheet)}
.lmodal.lout .lcard{animation:sheetDown 235ms cubic-bezier(.4,0,1,1) forwards}}
@media(min-width:760px){
.lgrab{display:none}
.lcard{animation:dlgPop var(--d-state) var(--e-out)}
@keyframes dlgPop{from{opacity:0;transform:scale(.97)}to{opacity:1;transform:scale(1)}}
.lmodal.lout .lcard{animation:dlgPopOut 160ms var(--e-out) forwards}
@keyframes dlgPopOut{to{opacity:0;transform:scale(.98)}}}
@media(prefers-reduced-motion:reduce){
.lmodal,.lcard,.lmodal.lout,.lmodal.lout .lcard{animation:none!important}}/* ---- Risers and fallers rows -------------------------------------------
   Now that these are .vmv they no longer inherit the luck-index treatment.
   What they need in its place: the named grid areas turned off (they have no
   leading rank cell, so the areas shifted every column one place across), the
   delta shown on a phone (the mobile rule hides .vd for the main list, where
   there is a fifth column for it), and the two figures set in the same
   condensed face as the chart above them. */


.vrow.vmv{grid-template-areas:none;grid-template-columns:34px minmax(0,1fr) 56px 52px;gap:0 10px}/* ---- The masthead, when a sheet takes the screen ------------------------
   It was not fading out — it was jumping. The masthead is position:sticky,
   and locking the page (html.pmlock / html.rklock set overflow:hidden) takes
   away the scroll container sticky depends on, so it snapped to wherever it
   happens to sit in the document: 600px up, if you were 600px down the value
   chart. That read as a glitch because it was one.

   Pinning it while locked holds it exactly where it already was — sticky at
   top:0 and fixed at top:0 are the same pixel — so nothing moves at the
   moment of the switch. The transition then carries it up and out under the
   scrim, and back down when the sheet closes.
   ------------------------------------------------------------------------ *//* It travels out at full opacity — no fade. Which means it has to actually
   clear the top edge on its own, rather than being hidden part-way by going
   transparent. The masthead sits at top:0, so its own height is exactly the
   distance it needs. The bars below it start at --bar and have to cover that
   as well, or their lower half stays on screen under the scrim. */



.mast{transition:transform var(--d-sheet) var(--e-out)}html.rklock .mast{
  position:fixed;top:0;left:0;right:0;
  transform:translateY(-100%)}/* The masthead is not the only one. Every position:sticky bar on the page has
   the same failure when the scroll container goes: the value chart's toolbar
   jumped from top:56 to top:-527, and the props page's section rail does the
   same. They are pinned and carried out on the same curve, a beat behind, so
   the chrome peels away top-down instead of all at once.
   .vbar is only sticky on a phone, so only there is it pinned. */

.vbar,.pnav{transition:transform var(--d-sheet) var(--e-out) 40ms}html.rklock .pnav{
  position:fixed;top:var(--bar);left:0;right:0;margin:0;
  transform:translateY(calc(-100% - var(--bar)))}
@media(max-width:600px){html.rklock .vbar{
  position:fixed;top:var(--bar);left:0;right:0;margin:0;
  transform:translateY(calc(-100% - var(--bar)))}}

@media(prefers-reduced-motion:reduce){/* the travel is the whole effect now, so it stays — it just arrives at once */

.mast,.vbar,.pnav{transition:none}}/* ---- Value chart rows, on My Team's measurements ----------------------
   Not a rebuild of the markup — the same .vrow the hub and the odds movers
   share — but the face, the name, the meta line and the figure are set to the
   values the roster deck actually renders, taken off it rather than guessed:
   face 38/32, name 14.5px 600 at -.015em, meta 12px in --mut, and the figure
   in Söhne Schmal at 19px 700. The figure was the furthest off: mono, 15.5px,
   weight 600.

   Scoped to .sheet.vcx — on this page that class sits on the sheet itself,
   while the hub and odds wrap their rows in an inner `<div class="vcx">`, so
   this reaches the chart and not them. `:not(.vmv)` keeps it off the risers and
   fallers rows below, which carry no leading rank cell.
   ------------------------------------------------------------------------ */


.sheet.vcx{--vcols:34px 38px minmax(0,1fr) 78px 62px}
.sheet.vcx .vrow:not(.vmv),.sheet.vcx .vhd{grid-template-columns:var(--vcols);
  grid-template-areas:none}/* The metric names itself once, here, instead of on all 154 rows. It still
   changes with the sort — that was the point of labelling the figure — but a
   word repeated down the whole column was reading as texture, not as a label. */


.sheet.vcx .vhd{display:grid;gap:0 12px;align-items:end;
  margin-top:0;padding:8px 0 9px;border-bottom:1px solid var(--hr)}
.sheet.vcx .vhd span{font-size:10.5px;color:var(--mut);letter-spacing:0}
.sheet.vcx .vhd span:nth-child(4),.sheet.vcx .vhd span:nth-child(5){text-align:right}
.sheet.vcx .vrow:not(.vmv)>*{grid-area:auto}
.sheet.vcx .vrow:not(.vmv) .face{width:38px;height:38px}
.sheet.vcx .vrow:not(.vmv) .vn{font-size:15.5px;font-weight:600;letter-spacing:-.015em}
.sheet.vcx .vrow:not(.vmv) .vmt{font-size:12px;color:var(--mut)}
.sheet.vcx .vrow:not(.vmv) .vv{align-self:center;text-align:right}
.sheet.vcx .vrow:not(.vmv) .vv b{font-family:var(--cond);font-size:21px;font-weight:700;
  letter-spacing:.01em}
.sheet.vcx .vrow:not(.vmv) .vd{display:block;font-family:var(--cond);font-size:18px;
  font-weight:700;letter-spacing:.01em;text-align:right;white-space:nowrap}
.sheet.vcx .vrow:not(.vmv) .vd.z{color:var(--fnt)}

@media(max-width:600px){/* five columns on a phone leaves the name 139px, which takes the longest name
   in the league ("Christian McCaffrey") with a little to spare */

.sheet.vcx{--vcols:22px 32px minmax(0,1fr) 62px 48px}
.sheet.vcx .vrow:not(.vmv),.sheet.vcx .vhd{gap:0 8px}
.sheet.vcx .vrow:not(.vmv) .face{width:32px;height:32px}
.sheet.vcx .vrow:not(.vmv) .vn{font-size:14.5px}
.sheet.vcx .vrow:not(.vmv) .vv b{font-size:20px}
.sheet.vcx .vrow:not(.vmv) .vd{font-size:16px}}/* ---- your players, in the chart ----------------------------------------
   The marker was painted across the whole .vv block — correct while that was
   a single right-aligned number, wrong the moment a label went underneath it:
   the band then landed in the gap between figure and label and ran the full
   column width, well left of the digits. It now sits on the figure itself, so
   it is the length of the number and nothing else.

   A band was the wrong instrument twice over. It cut across the numerals at an
   arbitrary height, and it was yellow sitting on an already-yellow row wash —
   which left your own players looking muddier than everyone else's, the exact
   opposite of the point. This uses the emphasis idiom the rest of the site
   already uses for a figure that matters (the winning score in the bracket,
   the leading stat on a team card): a rule under the number, clear of the
   descenders, plus the weight going up. Nothing overlaps the digits. */


.sheet.vcx .vv b{font-weight:inherit}
.sheet.vcx .vrow.you .vv{background:none;padding:0;margin-right:0}
.sheet.vcx .vrow.you .vv b{font-weight:700;
  box-shadow:inset 0 -.16em 0 var(--hl);padding:0 2px;margin-right:-2px}
.sheet.vcx .vrow.you .vv u{color:var(--mut2)}/* ---- Risers and fallers rows -------------------------------------------
   Now that these are .vmv they no longer inherit the luck-index treatment.
   What they need in its place: the named grid areas turned off (they have no
   leading rank cell, so the areas shifted every column one place across), the
   delta shown on a phone (the mobile rule hides .vd for the main list, where
   there is a fifth column for it), and the two figures set in the same
   condensed face as the chart above them. */


.vrow.vmv{grid-template-areas:none;grid-template-columns:34px minmax(0,1fr) 56px 52px;gap:0 10px}
.vrow.vmv>*{grid-area:auto}
.vrow.vmv .vn{font-size:14.5px;font-weight:600;letter-spacing:-.015em}
.vrow.vmv .vmt{font-size:12px;color:var(--mut)}
.vrow.vmv .vv{align-self:center;text-align:right;
  font-family:var(--cond);font-size:19px;font-weight:700;letter-spacing:.01em;color:var(--ink)}
.vrow.vmv .vd{display:block;text-align:right;white-space:nowrap;
  font-family:var(--cond);font-size:18px;font-weight:700;letter-spacing:.01em}/* ---- The masthead, when a sheet takes the screen ------------------------
   It was not fading out — it was jumping. The masthead is position:sticky,
   and locking the page (html.pmlock / html.rklock set overflow:hidden) takes
   away the scroll container sticky depends on, so it snapped to wherever it
   happens to sit in the document: 600px up, if you were 600px down the value
   chart. That read as a glitch because it was one.

   Pinning it while locked holds it exactly where it already was — sticky at
   top:0 and fixed at top:0 are the same pixel — so nothing moves at the
   moment of the switch. The transition then carries it up and out under the
   scrim, and back down when the sheet closes.
   ------------------------------------------------------------------------ *//* It travels out at full opacity — no fade. Which means it has to actually
   clear the top edge on its own, rather than being hidden part-way by going
   transparent. The masthead sits at top:0, so its own height is exactly the
   distance it needs. The bars below it start at --bar and have to cover that
   as well, or their lower half stays on screen under the scrim. */



.mast{transition:transform var(--d-sheet) var(--e-out)}html.rklock .mast{
  position:fixed;top:0;left:0;right:0;
  transform:translateY(-100%)}/* The masthead is not the only one. Every position:sticky bar on the page has
   the same failure when the scroll container goes: the value chart's toolbar
   jumped from top:56 to top:-527, and the props page's section rail does the
   same. They are pinned and carried out on the same curve, a beat behind, so
   the chrome peels away top-down instead of all at once.
   .vbar is only sticky on a phone, so only there is it pinned. */

.vbar,.pnav{transition:transform var(--d-sheet) var(--e-out) 40ms}html.rklock .pnav{
  position:fixed;top:var(--bar);left:0;right:0;margin:0;
  transform:translateY(calc(-100% - var(--bar)))}
@media(max-width:600px){html.rklock .vbar{
  position:fixed;top:var(--bar);left:0;right:0;margin:0;
  transform:translateY(calc(-100% - var(--bar)))}}

@media(prefers-reduced-motion:reduce){/* the travel is the whole effect now, so it stays — it just arrives at once */

.mast,.vbar,.pnav{transition:none}}

/* A row in flight during a re-sort. Opaque, so crossing rows occlude instead
   of showing through one another, and on its own layer so the compositor can
   move it without repainting. The rows that mark themselves — .vrow.you — do
   it with a ::before that paints above this, so their wash survives. */
/* No will-change and no backface-visibility. Both force the row onto its own
   compositor layer, and promotion re-rasterises the text from subpixel to
   greyscale antialiasing — so the type visibly changed weight when the move
   began and changed back when it ended. The browser promotes for an animated
   transform on its own, for exactly as long as it needs to. What is worth
   keeping is the opaque ground: crossing rows must not show through one
   another, and greyscale antialiasing over an opaque colour is near enough to
   invisible. */

/* The list settling after a re-sort. One animation on one element — not 154 —
   so it costs nothing and cannot produce rows sliding through one another.
   It starts at 0.35 rather than 0: the list does not reappear from nothing,
   it resolves. */
@keyframes listSettle{from{opacity:.35;transform:translateY(5px)}}
@media(prefers-reduced-motion:reduce){}/* The board's rows, wrapped so the settle has one element to animate. A plain
   block, not display:contents — a contents box generates nothing to animate,
   and the parent here is an ordinary block, so a wrapper changes no layout. */

.obl{display:block}/* ---- The needle finding its reading -----------------------------------
   A gauge that is simply drawn pointing somewhere states a number; one that
   swings to it shows you where it sat and where it settled. It sweeps up from
   zero on the same curve the figure counts on, so the two arrive together.

   No overshoot. A real needle would bounce, and a spring is the obvious reach
   here, but this whole interface is flat printed stock — a needle that wobbles
   would be the one thing on the page pretending to be a physical object. */


.ndl .ndlarm{transform-box:view-box;transform-origin:110px 112px;
  animation:ndlSwing 780ms cubic-bezier(.23,1,.32,1) both}
@keyframes ndlSwing{from{transform:rotate(var(--swing,-90deg))}to{transform:rotate(0)}}
@media(prefers-reduced-motion:reduce){.ndl .ndlarm{animation:none}}/* ---- Better on the wire (Start/Sit) ------------------------------------
   A roster move, not a lineup tweak, so it reads as a proposal: who, what he
   gains you, who he replaces and who goes to make room. */


.upl{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;margin-top:14px}
.upc{border:1px solid rgba(25,25,23,.11);border-radius:9px;padding:14px 15px 15px;background:#FFFDF7}
.uph{display:grid;grid-template-columns:40px minmax(0,1fr) auto;gap:0 11px;align-items:center;cursor:pointer}
.uph .face{width:40px;height:40px}
.upn{min-width:0;display:grid;gap:3px}
.upnm{font-size:16px;font-weight:700;letter-spacing:-.015em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.upm{display:flex;align-items:center;gap:7px;min-width:0}
.upm em.slot{font-size:10px;padding:2px 5px;border-radius:3px;margin:0;flex:none}
.upmt{font-size:12px;color:var(--mut);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.upg{font-family:var(--cond);font-size:21px;font-weight:700;letter-spacing:.01em;
  color:var(--up);text-align:right;white-space:nowrap;line-height:1}
.upg i{font-style:normal;display:block;font-family:var(--sans);font-size:9.5px;font-weight:500;
  color:var(--mut);margin-top:4px;letter-spacing:0}/* the swap itself, stated plainly */


.upsw{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:0 9px;align-items:baseline;
  margin-top:13px;padding-top:12px;border-top:1px solid var(--hr)}
.upsl{font-size:11.5px;color:var(--mut);white-space:nowrap}
.upo{font-size:14.5px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.upn2{font-variant-numeric:tabular-nums;font-size:11.5px;color:var(--mut2);letter-spacing:-.012em;white-space:nowrap}

.updr{display:flex;align-items:baseline;gap:9px;font-size:14.5px;font-weight:600;margin:11px 0 0}
.updr span{font-family:var(--cond);font-size:13px;font-weight:700;letter-spacing:0.045em;
  text-transform:uppercase;color:var(--dn)}/* room for a real argument: several paragraphs, set like the site's prose */

.upwhy{margin:11px 0 0}
.upwhy p{font-family:var(--serif);font-size:15px;line-height:1.55;color:var(--mut2);margin:0}
.upwhy p+p{margin-top:9px}
.upsrc{font-family:var(--sans)!important;font-size:11.5px!important;line-height:1.4!important;
  color:var(--fnt)!important;margin-top:9px!important}
.uprisk{font-size:13.5px;line-height:1.45;margin:10px 0 0;padding-top:10px;border-top:1px solid var(--hr)}
.uprisk span{display:block;font-family:var(--cond);font-size:13px;font-weight:700;letter-spacing:0.045em;
  text-transform:uppercase;color:var(--mut);margin-bottom:4px}

@media(max-width:600px){
.uph{grid-template-columns:36px minmax(0,1fr) auto;gap:0 10px}
.uph .face{width:36px;height:36px}
.upnm{font-size:15px}
.upg{font-size:19px}
.upsw{grid-template-columns:minmax(0,1fr) auto;row-gap:4px}
.upsl{grid-column:1/-1}}/* ---- Simulation: the staged run ---------------------------------------- */


.simidle{font-family:var(--serif);font-size:15.5px;line-height:1.5;color:var(--mut2);
  margin:14px 0 0;max-width:54ch}
.simrun.ghost{background:none;color:var(--mut2);border:1px solid rgba(25,25,23,.2)}
.simrun.dead{cursor:default;opacity:.6;display:grid;place-items:center}/* how far through the season the reveal is */


.simprog{height:3px;background:rgba(25,25,23,.09);margin-top:18px;border-radius:2px;overflow:hidden}
.simprog i{display:block;height:100%;background:var(--ink);
  transition:width var(--d-state) linear}
.simstep{font-size:21px;font-weight:700;letter-spacing:-.028em;line-height:1.1;margin:16px 0 0;min-height:23px}/* the week landing */


.simnow{margin-top:14px;min-height:150px}
@keyframes weekIn{from{opacity:0;transform:translateY(6px)}}
.simnow.inw{animation:weekIn 200ms var(--e-out) both}/* ---- the performing phases hold one screen ----------------------------
   Nothing here is decoration. While the season is being played the whole act —
   progress, the week, the ladder — has to sit inside one viewport, or the rows
   that are changing seed are below the fold and the performance is happening
   somewhere the reader is not. These are the measurements that buy that:
   tighter gaps, a shorter game row, a shorter standings row. The page goes
   back to its ordinary spacing the moment the run is over. */


.simx[data-phase="season"] .simprog,
.simx[data-phase="regDone"] .simprog{margin-top:10px}
.simx[data-phase="season"] .simseedline,
.simx[data-phase="regDone"] .simseedline{margin-top:14px}
.simx[data-phase="season"] .simstep,
.simx[data-phase="regDone"] .simstep{margin-top:7px}
.simx[data-phase="season"] .simnow,
.simx[data-phase="regDone"] .simnow{margin-top:8px;min-height:152px}/* the two blocks are the same table read two ways, but they are still two
   blocks — four pixels apart they read as one run-on list */


.simx[data-phase="season"] .simtbl,
.simx[data-phase="regDone"] .simtbl{margin-top:15px}
.simx[data-phase="season"] .simr,
.simx[data-phase="regDone"] .simr{height:38px}
.simx[data-phase="season"] .simgm,
.simx[data-phase="regDone"] .simgm{height:38px}
.simx[data-phase="post"] .simtree,
.simx[data-phase="postDone"] .simtree{margin-top:8px}/* The card manages its own edges now — the header band and each half carry
   the padding, so anything set here just insets the whole thing and leaves a
   white margin inside the border. The rules that used to live here did exactly
   that, and they also addressed .simgt, which the split card no longer has. */

.simx[data-phase="post"] .simhalf,
.simx[data-phase="postDone"] .simhalf{padding:11px 10px 12px}
.simx[data-phase="post"] .simrd.fin .simhalf,
.simx[data-phase="postDone"] .simrd.fin .simhalf{padding:14px 10px 15px}/* the finish, carried across the swap so the bracket is not orphaned */


.simcarry{font-family:var(--serif);font-size:15.5px;line-height:1.45;color:var(--mut2);
  margin:16px 0 0}
.simcarry b{font-weight:600;color:var(--ink)}

/* The cue goes on the seed, not the row. In an eight-team league decided on
   points-for tiebreaks nearly every team changes seed nearly every week, so
   flashing whole rows is a strobe that says nothing. Flashing the one number
   that changed is quiet enough to fire eight times at once and still reads as
   information. Nothing moves — the row does not shift by a pixel. */
@keyframes simSeed{from{background:var(--hl);color:var(--ink)}}
.simmoved .simseed{border-radius:4px;padding:3px 0;animation:simSeed 420ms var(--e-out)}
@media(prefers-reduced-motion:reduce){.simmoved .simseed{animation:none}}/* ---- the bracket, as a bracket -----------------------------------------
   The tree is drawn empty first — every connector present, every slot named by
   where it comes from — and then the rounds fill in. That is what makes it read
   as a bracket rather than as three lists of games stacked by week. Rounds sit
   top to bottom because a phone is tall, not wide; the connectors do the work
   that left-to-right does on paper.

   The 25% / 75% figures are the centres of a two-column round. The 10px gap
   throws them off by 2.5px, which is under a line's width and does not read. */


.simtree{margin-top:10px}
.simtree .simbl{margin:24px 0 10px}
.simtree .simbl:first-child{margin-top:0}
.simtree .simbl+.simrd{margin-bottom:0}
.simrd{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.simrd.fin{grid-template-columns:minmax(0,1fr)}
.simrd .simg{margin-bottom:0}/* the playoffs board reuses this tree with probabilities in place of points *//* A greyed-out score is right in the simulation: that game was played and that
   number lost. These are probabilities, and 47.2 against 52.8 is a coin flip —
   dimming one side says it already lost. Both halves read; the winner still
   takes the gold and the rule. */



.simprob .simgl{color:var(--ink)}
.simprob .simhs{color:var(--mut2)}
.simprob .simhn{color:var(--ink)}
.simprob .simhk{color:var(--mut)}/* the gold field and the rule under the figure are what mark the favourite —
   the type does not also have to be dimmed to say it */

.simprob .simhalf.w .simhs{color:var(--ink)}
.simrd.one{grid-template-columns:minmax(0,1fr)}
.simhs i{font-style:normal;font-family:var(--sans);font-size:12px;font-weight:400;
  color:var(--mut);margin-left:1px}
.simhalf.w .simhs i{color:var(--mut2)}
/* The teams that sit this round out. Led by its own label, and each team wears
   its seed in the same grey pill the week marker above it uses — so the line
   reads as a fourth thing on the board rather than as a stray row of names. */
.simbye{display:flex;align-items:center;flex-wrap:wrap;gap:4px 12px;margin:12px 0 0;
  font-size:12.5px;color:var(--mut2)}
.simbye i{font-style:normal;font-size:12.5px;color:var(--fnt)}
.simbye span{display:inline-flex;align-items:center;gap:6px}
.simbye b{font-family:var(--sans);font-size:10px;font-weight:400;letter-spacing:.04em;
  line-height:1.5;color:var(--mut);padding:2px 7px;border-radius:4px;
  background:rgba(25,25,23,.055)}
.simrd3{margin-top:10px}

.simjoin{display:none}
.simjoin::before,.simjoin::after{content:"";position:absolute;background:var(--hr2)}/* one game feeding the round below: a straight drop under the left column */

.simjoin.s::before{left:25%;top:0;bottom:0;width:1px}
.simjoin.s::after{display:none}/* two games merging into one: stubs, a crossbar, then a drop to centre */

.simjoin.m i{position:absolute;top:0;height:10px;width:1px;background:var(--hr2)}
.simjoin.m i:nth-child(1){left:25%}
.simjoin.m i:nth-child(2){left:75%}
.simjoin.m::before{left:25%;right:25%;top:10px;height:1px}
.simjoin.m::after{left:50%;top:10px;bottom:0;width:1px}/* a slot waiting on a game that has not been played */
.simsrc{font-size:13px;color:var(--mut);font-style:italic}/* the whole card lifts when its round is played */


.simg{transition:opacity var(--d-state) var(--e-out)}/* every regular-season game, once the run is over */


.simlog{margin-top:6px}
.simlw{margin-bottom:16px}
.simlw:last-child{margin-bottom:0}/* a round not yet played sits quiet until it is *//* the connectors stay at full strength — they are the scaffold, and a printed
   bracket has its lines before it has its results. Only the cards wait. */



.simtree .simg{opacity:.42}
.simtree .simg.on{opacity:1}/* the round that is playing lights up: a gold ring, ink figures, and no winner
   marked until the counting stops */


.simtree .simg.live .simduo{background:#FFFDF2;
  box-shadow:0 0 0 2px var(--hls),0 2px 14px rgba(214,166,25,.22)}
.simtree .simg.live .simgl{color:var(--ink);font-weight:600}
@media(prefers-reduced-motion:reduce){
 .simtree .simg.live .simduo{box-shadow:0 0 0 2px var(--hls)}}

@media(prefers-reduced-motion:reduce){
.simnow.inw{animation:none}
.simprog i{transition:none}}/* ============================================================
   DRAFT REVIEW  (.drx)
   The report's own 50KB stylesheet is not loaded. Its markup is parsed and
   re-emitted as the app's components, so everything below is house furniture
   rather than a skin over someone else's document. Coral is this page's accent
   because Reading is the coral group in the nav.
   ============================================================ */


.drx{--dra:#E9A189}
.drx .drintro{font-family:var(--serif);font-size:17px;line-height:1.5;color:var(--mut2);
  margin:12px 0 0;max-width:var(--measure)}
.drx .drlead{font-family:var(--serif);font-size:16.5px;line-height:1.5;color:var(--ink);
  margin:14px 0 0;max-width:var(--measure)}/* contents */


.drtoc{margin-top:42px;padding-top:16px;border-top:1px solid var(--ink)}
.drtoch{font-family:var(--cond);font-size:14px;font-weight:700;letter-spacing:0.065em;
  text-transform:uppercase;color:var(--mut);margin:0 0 8px}
.drtocl{list-style:none;margin:0;padding:0;display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:0 24px}
.drtocl a{display:flex;align-items:baseline;gap:10px;padding:9px 0;
  border-bottom:1px solid var(--hr);color:var(--ink);text-decoration:none}
.drtocl i{font-style:normal;font-family:var(--cond);font-size:11.5px;font-weight:700;
  letter-spacing:.05em;color:var(--dra,#F5A98C);flex:none;width:20px}
.drtocl span{font-size:14.5px;font-weight:500;letter-spacing:-.012em}
.drtocl a:hover span{box-shadow:inset 0 -1px 0 var(--ink)}
.drtocn{margin-top:12px}/* every pick, as player rows */


.drpl{margin-top:12px}
.drplr{display:flex;align-items:center;gap:11px;height:52px;
  border-bottom:1px solid var(--hr);cursor:pointer}
.drplr:last-child{border-bottom:0}
.drplr:hover{background:rgba(25,25,23,.025)}
.drpln{flex:none;width:34px;font-variant-numeric:tabular-nums;font-size:11px;color:var(--fnt);
  letter-spacing:-.03em}
.drplr .face{width:32px;height:32px;flex:none}
.drplw{flex:1;min-width:0}
.drplp{display:block;font-size:14.5px;font-weight:600;letter-spacing:-.015em;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.drplm{display:block;font-size:11.5px;color:var(--mut);margin-top:2px}/* ---- the report body ---- */


.drbody{margin-top:42px}
.drsec{padding-top:30px;margin-top:30px;border-top:1px solid var(--hr2)}
.drsec:first-child{border-top:0;margin-top:0;padding-top:0}
.drsh{display:flex;align-items:baseline;gap:11px;margin:0 0 7px;
  position:relative;padding-top:15px}
.drsh::before{content:"";position:absolute;left:0;top:0;width:32px;height:3px;
  background:var(--dra);border-radius:2px}
.drshn{font-family:var(--cond);font-size:13px;font-weight:700;letter-spacing:.06em;
  color:var(--dra);flex:none}
.drsh h2{font-family:var(--cond);font-size:26px;font-weight:700;letter-spacing:-.01em;
  line-height:1.1;margin:0}
.drdek{font-family:var(--serif);font-size:15.5px;line-height:1.45;color:var(--mut2);
  margin:0 0 18px;max-width:var(--measure)}

.drbd p{font-family:var(--serif);font-size:15.5px;line-height:1.55;color:var(--ink);
  margin:0 0 13px;max-width:var(--measure)}
.drbd p:last-child{margin-bottom:0}
.drbd strong{font-weight:600}
.drh2,.drh3{font-size:16px;font-weight:700;letter-spacing:-.018em;margin:24px 0 9px}
.drh4{font-size:14.5px;font-weight:600;letter-spacing:-.015em;margin:18px 0 6px}
.drlead{font-size:16.5px}
.drnoteline{font-family:var(--sans)!important;font-size:12.5px!important;
  color:var(--mut)!important;line-height:1.5!important}
.drsrc{font-family:var(--sans)!important;font-size:11.5px!important;color:var(--mut)!important;
  line-height:1.55!important;margin-top:18px!important;padding-top:12px;
  border-top:1px solid var(--hr)}
.drpos{font-family:var(--cond);font-size:12.5px;font-weight:700;letter-spacing:.05em;
  text-transform:uppercase;color:var(--mut);margin-right:5px}
.drup{color:var(--up);font-weight:600}
.drdn{color:var(--dn);font-weight:600}
.drfl{font-variant-numeric:tabular-nums;font-size:11.5px;color:var(--fnt);letter-spacing:-.012em}/* the pull quote */


.drcall{margin:18px 0;padding:0 0 0 15px;border-left:2px solid var(--hl)}
.drcall p{margin-bottom:10px}
.drcall p:last-child{margin-bottom:0}/* tables, in the house grammar */


.drtw{margin:16px 0 18px}
.drtw.in{margin:12px 0 14px}
.drtc{font-size:11px;color:var(--mut);margin:0 0 8px;max-width:none!important}
.drts{overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:thin}
.drt{border-collapse:collapse;width:100%}
.drt th{font-size:10.5px;font-weight:500;color:var(--mut);text-align:right;
  padding:0 10px 8px;border-bottom:1px solid var(--hr);white-space:nowrap}
.drt td{padding:8px 10px;border-bottom:1px solid var(--hr);text-align:right;
  font-family:var(--cond);font-size:16px;font-weight:700;letter-spacing:.01em;
  white-space:nowrap;font-variant-numeric:tabular-nums}
.drt th.l,.drt td.l{text-align:left;font-family:var(--sans);font-size:14px;
  font-weight:500;letter-spacing:-.012em}
.drt th:first-child,.drt td:first-child{padding-left:0}
.drt th:last-child,.drt td:last-child{padding-right:0}
.drt tbody tr:last-child td{border-bottom:0}
.drt tr.you td{background:rgba(255,232,107,.16)}
.drt tr.you td.l{font-weight:700}
.drt tr.tot td{border-top:1px solid var(--ink)}
.drt td.bc{width:92px;min-width:92px}
.drbar{display:block;height:6px;border-radius:3px;background:rgba(25,25,23,.08);overflow:hidden}
.drbar i{display:block;height:100%;background:var(--hls);border-radius:3px}
.drt tr.you .drbar i{background:var(--ink)}/* a week's game */


.drgm{border:1px solid rgba(25,25,23,.11);border-radius:9px;background:#FFFDF7;
  padding:12px 13px 13px;margin:0 0 10px}
.drgm.good{border-color:rgba(31,122,61,.3)}
.drgm.bad{border-color:rgba(201,48,48,.28)}
.drgmh{display:flex;align-items:baseline;gap:10px;margin-bottom:9px}
.drgmw{font-family:var(--cond);font-size:13px;font-weight:700;letter-spacing:0.065em;
  text-transform:uppercase;color:var(--mut);flex:none}
.drgmv{flex:1;font-size:14.5px;font-weight:600;letter-spacing:-.015em;min-width:0;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.drgmp{flex:none;font-family:var(--cond);font-size:19px;font-weight:700;letter-spacing:.01em}
.drgmb{height:6px;border-radius:3px;background:rgba(25,25,23,.08);overflow:hidden}
.drgmb i{display:block;height:100%;background:var(--hls);border-radius:3px}
.drgm.good .drgmb i{background:var(--up)}
.drgm.bad .drgmb i{background:var(--dn)}
.drgms{font-family:var(--sans)!important;font-variant-numeric:tabular-nums;font-size:11px!important;color:var(--mut)!important;
  margin:8px 0 0!important;letter-spacing:-.03em}
.drgmy{font-family:var(--sans)!important;font-size:12px!important;color:var(--mut)!important;
  margin:6px 0 0!important}
.drgm p{margin-top:10px}/* a pick, written up */


.drpn{border-top:1px solid var(--hr);padding:14px 0 4px;cursor:pointer}
.drpn:first-child{border-top:0}
.drpnh{display:flex;align-items:center;gap:11px;margin-bottom:10px}
.drpn .face{width:36px;height:36px;flex:none}
.drpnw{flex:1;min-width:0}
.drpnn{display:block;font-size:15px;font-weight:700;letter-spacing:-.016em;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.drpnm{display:block;font-size:11.5px;color:var(--mut);margin-top:2px}
.drpnv{flex:none;font-style:normal;font-family:var(--cond);font-size:12.5px;font-weight:700;
  letter-spacing:.05em;text-transform:uppercase;padding:4px 7px;border-radius:3px;
  background:rgba(25,25,23,.06);color:var(--mut2);white-space:nowrap}
.drpnv.good{background:rgba(31,122,61,.13);color:var(--up)}
.drpnv.bad{background:rgba(201,48,48,.11);color:var(--dn)}
.drpnv.warn{background:rgba(248,207,164,.5);color:var(--ink)}/* a ranking slot */


.drrk{display:flex;gap:13px;border-top:1px solid var(--hr);padding:15px 0 5px}
.drrk:first-child{border-top:0}
.drrkn{flex:none;width:26px;font-family:var(--cond);font-size:24px;font-weight:700;
  color:rgba(25,25,23,.22);line-height:1}
.drrkb{flex:1;min-width:0}
.drrkt{font-family:var(--sans)!important;font-size:15px!important;font-weight:700!important;
  letter-spacing:-.016em;margin:0 0 3px!important;color:var(--ink)!important}
.drrks{font-family:var(--sans)!important;font-variant-numeric:tabular-nums;font-size:11px!important;color:var(--mut)!important;
  letter-spacing:-.03em;margin:0 0 8px!important}
.drrki{font-family:var(--serif)!important;font-size:15px!important;color:var(--ink)!important;
  margin:0 0 10px!important}/* callout cards */


.drcard{border:1px solid rgba(25,25,23,.11);border-radius:8px;background:#FFFDF7;
  padding:13px 14px;margin:0 0 9px}
.drcardh{font-family:var(--sans)!important;font-size:14.5px!important;margin:0 0 7px!important;
  display:flex;align-items:center;gap:9px;flex-wrap:wrap;color:var(--ink)!important}
.drcardh b{font-weight:600;letter-spacing:-.015em}
.drcard p{font-family:var(--sans)!important;font-size:13.5px!important;line-height:1.5!important;
  color:var(--mut2)!important;margin:0!important;max-width:none!important}
.drchip{font-style:normal;font-family:var(--cond);font-size:12.5px;font-weight:700;
  letter-spacing:0.045em;text-transform:uppercase;padding:4px 7px;border-radius:3px;
  background:rgba(25,25,23,.07);color:var(--mut2);white-space:nowrap}
.drchip.good{background:rgba(31,122,61,.13);color:var(--up)}
.drchip.bad{background:rgba(201,48,48,.11);color:var(--dn)}
.drchip.warn{background:var(--hl);color:var(--ink)}/* disclosures */


.drdet{border-top:1px solid var(--hr);padding:12px 0}
.drdet summary{cursor:pointer;font-size:14px;font-weight:600;letter-spacing:-.012em;list-style:none}
.drdet summary::-webkit-details-marker{display:none}
.drdet summary::after{content:"+";float:right;color:var(--mut);font-weight:400}
.drdet[open] summary::after{content:"–"}
.drdet>*:not(summary){margin-top:11px}

.drnote{margin-top:28px}

@media(max-width:600px){
.drsh h2{font-size:22px}
.drbd p,.drdek{font-size:15px}
.drtocl{grid-template-columns:minmax(0,1fr);gap:0}
.drplr{height:50px}
.drt td{font-size:15px}}/* ============================================================
   JACOBS WATCH / SITUATIONS  (.sitx)
   Rebuilt in the language the rest of the site now uses: figures in a hairline
   panel, one bar scale per block, rows of a single height, and the accent kept
   to where it means something. Coral because this lives under Reading.
   ============================================================ */


.sitx{--sita:#E9A189}

/* The head is the only thing on this page with rules of its own: no other page
   puts a headshot beside its title. Everything below it is a component the
   site already had — .ptiles from Playoffs, .stkc from Stock, .tbl from
   everywhere — because a situation page is a claim, its reasoning and what to
   do about it, which is what those already are. */
.sitx .sithr{display:flex;align-items:center;gap:14px}
.sitx .sithr>.face{flex:none;width:54px;height:54px}
.sitx .sithn{min-width:0}
.sitx .sithn .phk{margin:0 0 3px}
.sitx .sithn .hed{margin:0}
.sitx .sithd .phd{margin-top:14px}
.sitx .situpd{font-size:11.5px;color:var(--fnt);margin:12px 0 0}

/* A card's header carries a figure and a name, where Stock's carries a face
   and a name. The figure is the probability on a scenario and the year on a
   precedent — both are the thing you scan the stack for. */
.sitx .sitsh{display:flex;align-items:baseline;flex-wrap:wrap;gap:6px 11px}
.sitx .sitsp{flex:none;font-family:var(--cond);font-size:25px;font-weight:700;
  letter-spacing:.01em;line-height:1;color:var(--ink)}
.sitx .sitsp i{font-style:normal;font-size:12.5px;margin-left:1px;color:var(--mut)}
.sitx .sitpy{color:var(--fnt)}
.sitx .sitsh h5{flex:1 1 auto;min-width:0;font-size:16px;font-weight:600;
  letter-spacing:-.018em;line-height:1.25;margin:0}
.sitx .stkc .wbar{max-width:340px}

/* the chronology: a date column and the event, in the site's own table */
.sitx .sittl .th,.sitx .sittl .tr{grid-template-columns:108px minmax(0,1fr);
  gap:0 16px;align-items:baseline}
.sitx .sittl .th span:first-child,.sitx .sittl .num{text-align:left}
.sitx .sittl .num{font-family:var(--cond);font-size:14px;font-weight:700;
  letter-spacing:.04em;text-transform:uppercase;color:var(--fnt)}
.sitx .sittl .tr{padding:12px 0}
.sitx .sitev{font-family:var(--serif);font-size:15px;line-height:1.55;color:var(--body);text-wrap:pretty}

.sitx .sitpro p{font-family:var(--serif);font-size:15.5px;line-height:1.6;
  color:var(--body);margin:0 0 14px;max-width:var(--measure);text-wrap:pretty}
.sitx .sitpro p:last-child{margin-bottom:0}

@media(max-width:600px){
.sitx .sithr>.face{width:48px;height:48px}
.sitx .sittl .th,.sitx .sittl .tr{grid-template-columns:82px minmax(0,1fr);gap:0 12px}}/* ============================================================
   READING PAGE KIT  (.phx / .figs / .sh2)
   One head and one figure treatment for Schedule, Props, Manual and Jacobs
   Watch. They each had their own before, and Schedule and Props carried a
   second figure grammar — a bare strip on hairline dividers — competing with
   the panelled grid used everywhere else in the app.
   ============================================================ */


.phx{padding-bottom:14px;max-width:820px}
.phx .hed{margin:0}
.phd{font-family:var(--serif);font-size:16.5px;line-height:1.5;color:var(--mut2);
  margin:10px 0 0;max-width:var(--measure);text-wrap:pretty}
.figs{display:grid;grid-template-columns:repeat(var(--n,3),minmax(0,1fr));gap:1px;
  margin-top:18px;background:var(--hr);box-shadow:var(--cardsh);
  border-radius:8px;overflow:hidden}
.figc{background:#FFFDF7;padding:13px 15px 14px;min-width:0}
.figc i{font-style:normal;display:block;font-size:11px;color:var(--mut);
  margin-bottom:7px;letter-spacing:-.005em;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.figc b{display:flex;align-items:baseline;gap:6px;font-family:var(--cond);
  font-size:27px;font-weight:700;letter-spacing:.01em;line-height:1}
.figc b em{font-style:normal;font-family:var(--sans);font-size:12px;
  font-weight:400;color:var(--mut)}

.sh2{position:relative;padding-top:13px}
.sh2::before{content:"";position:absolute;left:0;top:0;width:30px;height:3px;
  border-radius:2px;background:var(--pc,#E9A189)}
@media(max-width:600px){
.phx{padding-bottom:15px}
.phd{font-size:15.5px}/* Three across is fine for the figures these pages actually carry — a price, a
   record, a percentage — once the cell is allowed to be narrow. Forcing two
   with !important was what left every three-figure page with a lone cell
   stranded on a row of its own. Four still folds to two: that is what --n
   already says. An odd last cell in a two-column strip takes the whole row
   rather than leaving the panel colour showing through as a grey hole. */

.figc{padding:11px 12px 12px}
.figc i{font-size:10.5px;margin-bottom:6px;white-space:normal;overflow:visible;
  text-overflow:clip;line-height:1.25}
.figc b{font-size:23px;gap:4px}
.figc b em{font-size:11px}
.figs[style*="--n:1"],.figs[style*="--n:2"]{grid-template-columns:repeat(2,minmax(0,1fr))}
.figc:last-child:nth-child(odd){grid-column:1/-1}
.figs[style*="--n:3"] .figc:last-child:nth-child(odd){grid-column:auto}}
/* ---- suggested deals ------------------------------------------------------
   A row is a button because it does something: it fills the calculator above.
   The figure strip borrows the verdict's grammar -- figure over caption --
   so the numbers you land on read the same as the ones you left. */
.tdl{display:grid;gap:10px;margin-top:16px}
.tdr{display:grid;gap:9px;width:100%;text-align:left;font:inherit;cursor:pointer;
 background:#FFFDF7;border:1px solid rgba(25,25,23,.11);border-radius:9px;padding:12px 13px 11px}
.tdr:hover{border-color:rgba(25,25,23,.22)}
.tdr.tdmut{border-color:rgba(25,25,23,.26);box-shadow:inset 3px 0 0 var(--hls)}
.tdr.tdcold{opacity:.5;cursor:default}
.tdrh{display:flex;align-items:center;gap:9px}
.tdrn{font-family:var(--cond);font-size:19px;font-weight:700;letter-spacing:-.01em;color:var(--ink)}
.tdrb{font-family:var(--cond);font-size:10.5px;font-weight:700;letter-spacing:.07em;
 text-transform:uppercase;color:var(--ink);background:var(--hl);
 border-radius:3px;padding:3px 7px;font-style:normal}
.tdrp{display:grid;gap:5px}
.tdrl{display:flex;align-items:center;gap:6px;flex-wrap:wrap;min-height:22px}
.tdrl>i{font-family:var(--cond);font-size:10.5px;font-weight:700;letter-spacing:.08em;
 text-transform:uppercase;color:var(--fnt);font-style:normal;width:34px;flex:none}
.tdrl>span{font-size:13.5px;font-weight:600;color:var(--ink);margin-right:4px}
.tdrl em.slot{margin-right:-2px}
.tdrv{display:grid;grid-template-columns:repeat(3,1fr);gap:0 10px;
 padding-top:9px;border-top:1px solid var(--hr)}
.tdrv>b{font-family:var(--cond);font-size:20px;font-weight:700;line-height:1;
 letter-spacing:-.01em;grid-row:1}
.tdrv>b.up{color:var(--up)}
.tdrv>b.dn{color:var(--dn)}
.tdrv>b.z{color:var(--fnt)}
.tdrv>b.tdrc{color:var(--ink);font-size:16px;align-self:end}
.tdrv>i{grid-row:2;font-variant-numeric:tabular-nums;font-size:9.5px;font-style:normal;
 letter-spacing:-.01em;color:var(--fnt);margin-top:4px}
.tdrw{font-family:var(--serif);font-size:13.5px;line-height:1.5;color:var(--mut2)}
@media(max-width:600px){
.tdr{padding:11px 12px 10px}
.tdrn{font-size:17px}
.tdrv>b{font-size:18px}
.tdrv>b.tdrc{font-size:14px}}

/* ---- waivers: the call, the grouped board, the bye calendar ----------
   Rolling order makes the claim an asset, so the call is a card and the
   board is a set of groups rather than one long price-sorted list. */
.wvcall{margin-top:12px;border:1px solid var(--hr2);border-radius:11px;
 background:var(--card,#FFFDF7);padding:14px 15px 15px;
 border-top:3px solid var(--mut2)}
.wvcall.wvgo{border-top-color:var(--up)}
.wvcall.wvhold{border-top-color:var(--mut2)}
.wvcall.wvfree{border-top-color:var(--hls)}
.wvch{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.wvcv{font-family:var(--cond);font-size:20px;font-weight:700;letter-spacing:.02em;
 text-transform:uppercase}
.wvcall.wvgo .wvcv{color:var(--up)}
.wvcw{font-variant-numeric:tabular-nums;font-size:11px;color:var(--fnt);letter-spacing:-.012em}
.wvcs{font-size:13px;line-height:1.45;color:var(--mut);margin:5px 0 0}
.wvimp{display:grid;grid-template-columns:auto minmax(0,1fr) auto;
 align-items:center;gap:0 11px;margin-top:12px;padding-top:12px;
 border-top:1px solid var(--hr)}
/* nothing above it to divide from */
.wvcall>.wvimp:first-child{margin-top:0;padding-top:0;border-top:0}
.wvimp .wvn{min-width:0}
.wvdd{text-align:right;line-height:1.05}
.wvdd b{display:block;font-family:var(--cond);font-size:25px;font-weight:700}
 /* the mono face is for figures in columns, not for prose labels — at 9.5px
    doing the work of a caption it just read as cramped */
.wvdd i{display:block;font-family:var(--sans);font-size:11px;font-style:normal;
 color:var(--fnt);margin-top:3px;letter-spacing:normal}
.wvfor{font-size:12px;color:var(--mut)}
.wvfor b{font-weight:600;color:var(--ink)}
.wvfor.row{display:block;margin:2px 0 0 49px;font-size:12px}
 /* the reasoning is support, not the headline — it had been the largest and
    heaviest thing on a card whose point is the verdict at the top */
.wvcy{font-size:13px;line-height:1.5;color:var(--mut);margin:12px 0 0}
/* label left, value right, hairline between — the same rows the player card
   uses for its four readings, so the site has one way of stating a fact */
.wvled{margin:13px 0 0;border-top:1px solid var(--hr)}
.wvlr{display:grid;grid-template-columns:minmax(0,auto) minmax(0,1fr);
 align-items:baseline;gap:14px;padding:9px 0;border-bottom:1px solid var(--hr)}
.wvlr dt{font-size:12.5px;color:var(--mut);white-space:nowrap}
.wvlr dd{margin:0;text-align:right;font-size:12.5px;color:var(--ink)}
.wvlr dd b{font-weight:600}
/* the card's own border closes the last row; a rule there is a second line */
.wvlr:last-child{border-bottom:0;padding-bottom:2px}

.wvgrp{margin-top:18px}
.wvgn{font-family:var(--cond);font-size:11px;font-weight:700;letter-spacing:.08em;
 text-transform:uppercase;padding:3px 8px;border-radius:3px;
 background:rgba(25,25,23,.07);color:var(--mut2)}
.wvgn.v-claim{background:var(--hl);color:var(--ink)}
.wvgn.v-stream{background:rgba(25,25,23,.07);color:var(--mut2)}
.wvgn.v-stash{background:rgba(25,25,23,.07);color:var(--mut2)}
.wvgn.v-pass{background:transparent;color:var(--fnt);box-shadow:inset 0 0 0 1px var(--hr2)}
details.wvgrp{margin-top:18px}
details.wvgrp>summary{display:flex;align-items:baseline;gap:9px;cursor:pointer;
 list-style:none;padding:9px 0;border-top:1px solid var(--hr)}
details.wvgrp>summary::-webkit-details-marker{display:none}
details.wvgrp>summary em{font-style:normal;font-size:12px;color:var(--mut)}
details.wvgrp>summary::after{content:"";margin-left:auto;width:7px;height:7px;
 border-right:1.5px solid var(--fnt);border-bottom:1.5px solid var(--fnt);
 transform:rotate(45deg) translateY(-2px);transition:transform 160ms ease}
details.wvgrp[open]>summary::after{transform:rotate(225deg) translateY(-2px)}
.wvdl{text-align:right;line-height:1.05}
.wvdl b{display:block;font-family:var(--cond);font-size:17px;font-weight:700}
.wvdl i{display:block;font-family:var(--sans);font-size:10.5px;font-style:normal;
 color:var(--fnt);margin-top:2px;letter-spacing:normal}

.wvby{display:flex;align-items:flex-end;gap:8px;margin-top:11px}
.wvbyc{flex:1;display:flex;flex-direction:column;align-items:center;gap:5px}
.wvbyc i{display:block;width:100%;background:rgba(25,25,23,.13);border-radius:2px}
.wvbyc.warm i{background:var(--hls)}
.wvbyc.hot i{background:var(--dn)}
.wvbyc em{font-family:var(--cond);font-size:14px;font-weight:700;font-style:normal}
.wvbyc b{font-variant-numeric:tabular-nums;font-size:10px;font-weight:400;color:var(--fnt)}
@media(max-width:420px){
 .wvdl i,.wvdd i{font-size:10px}
 .wvby{gap:5px}}

/* the ranked board carries a rank column again, and the verdict rides in
   the meta line rather than taking a column of its own */
.wvr{grid-template-columns:22px 38px minmax(0,1fr) 58px 46px 52px}
.wvm .wvvd{font-family:var(--cond);font-size:9.5px;font-weight:700;letter-spacing:.07em;
 text-transform:uppercase;padding:2px 6px;border-radius:3px;flex:none}
.wvb{padding-left:71px}
.wvfor.row{margin-left:71px}
.wvds{display:grid;grid-template-columns:38px minmax(0,1fr) 52px;gap:0 11px;
 align-items:center;padding:11px 0 10px;border-top:1px solid var(--hr)}
.wvds .face{width:38px;height:38px}
@media(max-width:600px){
 .wvr{grid-template-columns:20px 34px minmax(0,1fr) 54px 48px;gap:0 8px}
 .wvb{padding-left:62px}
 .wvfor.row{margin-left:62px}
 .wvds{grid-template-columns:34px minmax(0,1fr) 48px;gap:0 9px}
 .wvds .face{width:34px;height:34px}}

/* the written week, at the top of the recap */
/* The written week ended sixteen pixels above the card grid — the last ballot
   row running straight into the first card. Every section inside the read is
   separated from the next by exactly forty-two; the read closing against the
   cards is the same kind of break, so it gets the same measure rather than a
   number picked by eye. */
.hubread{margin-top:18px;margin-bottom:42px}
.hubread .sect:first-of-type{margin-top:22px}

/* The sorted column was marked with a 2px line inset at the bottom of a 32px
   button, eight pixels above the header's own rule — two parallel lines close
   together, which read as a floating open box rather than a selected column.
   And .tm.on cancelled it outright, so sorting by Team (the default) showed no
   indicator at all. One pill, every column, in the group colour. */
.mkth .mksort.on{color:var(--gink,var(--ink));font-weight:700;box-shadow:none;
  background:var(--gtint2,rgba(25,25,23,.06));border-radius:4px}
.mkth .mksort.tm{justify-self:start;padding:0 9px;margin-left:-9px}
.mkth .mksort.tm.on{color:var(--gink,var(--ink));font-weight:700;box-shadow:none;
  background:var(--gtint2,rgba(25,25,23,.06))}
/* the odds grid's sorter carried the same floating bar — same fix */
.oddsx .sdt.oddsgrid .sdh .gsort.on{color:var(--gink,var(--ink));font-weight:700;
  box-shadow:none;background:var(--gtint2,rgba(25,25,23,.06));border-radius:4px}

/* rest-of-season tiers — a heading between groups in the ROS view, and the
   same reading as a pill on the player card */
.vtier{display:flex;align-items:baseline;gap:9px;padding:16px 0 7px;
 border-bottom:1px solid var(--hr)}
.vlist .vtier:first-child{padding-top:6px}
.vtn{font-family:var(--cond);font-size:12px;font-weight:700;letter-spacing:.09em;
 text-transform:uppercase;color:var(--gink,var(--ink))}
/* ═══════════════════════════════════════════════════════════════════════
   THE PLAYER CARD
   Rebuilt as one block. It previously carried 158 selectors across 352
   rules, 65 of them defined more than once — .pmshot .face 22 times,
   .pmshot .face img 19 — so what rendered was whichever rule won each of
   65 cascade fights. Every one of those was deleted before this was
   written. Nothing below is redefined anywhere else; keep it that way.

   The shape is label-left / figure-right, because the four readings are
   pairs and boxing them fought the content. Rows also mean a fifth and
   sixth reading (usage, wire adds) drop in without a reflow.
   ═══════════════════════════════════════════════════════════════════ */

html.pmlock,html.pmlock body{overflow:hidden}

.pmodal{position:fixed;inset:0;z-index:90}
.pmscrim{position:absolute;inset:0;background:rgba(25,25,23,.44);
 -webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);animation:scrim .2s ease}
@keyframes scrim{from{opacity:0}}
.pmpanel{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
 width:min(420px,calc(100vw - 28px));max-height:88vh;overflow-y:auto;
 -webkit-overflow-scrolling:touch;background:var(--paper);border-radius:16px;
 box-shadow:0 3px 10px rgba(25,25,23,.13),0 26px 70px rgba(25,25,23,.26)}
.pmodal.pmout .pmpanel{opacity:0;transition:opacity .16s ease}
.pmodal.pmout .pmscrim{opacity:0;transition:opacity .16s ease}

.pmgrab{display:none}
.pmclose{position:absolute;top:12px;right:12px;z-index:3;width:32px;height:32px;
 border:0;border-radius:50%;cursor:pointer;background:rgba(250,250,246,.9);
 box-shadow:0 1px 4px rgba(25,25,23,.2)}
.pmclose::before,.pmclose::after{content:"";position:absolute;left:9px;top:15px;
 width:14px;height:1.6px;background:#191917;border-radius:1px}
.pmclose::before{transform:rotate(45deg)}
.pmclose::after{transform:rotate(-45deg)}
.pmclose:focus-visible{outline:2px solid var(--hls);outline-offset:2px}

/* ---- hero -------------------------------------------------------------
   These are the values the pre-rebuild card actually resolved to, recovered
   by loading the old stylesheet and reading the computed styles off it rather
   than by re-deriving them. It had been tuned across seventeen competing
   .pmhero rules and nineteen on the image, and rebuilding it from scratch lost
   the tuning: the name came back in the condensed face, and the photograph was
   sized to the hero's full height instead of 96px, which made it oversized and
   clipped it against the top edge. */
.pmhero{position:relative;display:flex;align-items:end;gap:0 18px;
 height:132px;padding:0 18px 0 16px;overflow:hidden;
 background:#243154 center/cover no-repeat}
.pmhero::after{content:"";position:absolute;inset:0;
 background:linear-gradient(90deg,rgba(25,25,23,.42),rgba(25,25,23,.06) 62%)}
.pmshot{position:relative;z-index:2;flex:none;display:flex;align-items:flex-end;
 height:96px;margin-left:-14px;transform:translateX(-26px);line-height:0}
.pmshot .face{width:132px;height:96px;background:none;border-radius:0;
 box-shadow:none;overflow:visible;display:block}
.pmshot .face img{display:block;width:100%;height:96px;max-width:none;border-radius:0;
 object-fit:contain;object-position:50% 100%;
 /* Grown from the bottom-left corner, not the centre. With the default origin
    the 1.18 pushes the photo 15px below the hero, where overflow:hidden cuts
    the feet off, and 12px further left than it should sit. */
 transform:scale(1.18);transform-origin:0 100%}
.pmid{position:relative;z-index:2;min-width:0;padding:0 0 14px;transform:translateX(-14px)}
.pmid h2{font-family:var(--sans);font-size:29px;font-weight:700;line-height:1.05;
 letter-spacing:-.034em;color:#fff;margin:0}
.pmid h2 .nshort{display:none}
.pmid h2.long .nfull{display:none}
.pmid h2.long .nshort{display:inline}
.pmid p{font-size:14.5px;color:rgba(255,255,255,.88);margin:0}
 /* Both hero pills are one fixed height with the text centred in it, so the
    position can carry a much larger face than the tier without the two boxes
    disagreeing. Vertical padding would tie height to font size; this does not. */
.pmpos,.pmtier{display:inline-flex;align-items:center;height:21.5px;
 font-family:var(--cond);font-weight:700;font-size:12.5px;letter-spacing:.055em;
 line-height:1;padding:0 9px;border-radius:4px;
 color:#191917;vertical-align:middle;margin-bottom:4px}
.pmpos{background:rgba(250,250,246,.9);font-size:14.5px;letter-spacing:.03em;padding:0 8px}
/* the hero chip takes the position's own colour, like every other position
   chip on the site — the global p-* rules are all parent-scoped, so stated */
.pmpos.p-QB,.pmpos.p-SF{background:#F9B3C4}
.pmpos.p-RB{background:#A2E3D8}
.pmpos.p-WR{background:#AECDFB}
.pmpos.p-TE{background:#F8CFA4}
.pmpos.p-K{background:#D9B7FB}
.pmpos.p-DST{background:#C4CBD6}
.pmpos.p-FLEX{background:#CFD6A8}
.pmtier{margin-left:6px;background:var(--tier,rgba(250,250,246,.82))}

/* ---- body ---- */
.pmbody{padding:18px 18px 22px}

/* The projection. One left axis: the kicker spans the top, the figure and its
   range sit on a shared baseline beneath it, and the stat line runs to the same
   edge. Previously the label was its own right-hand column, which left three
   different alignments inside one block. */
.pmlead{display:grid;grid-template-columns:auto minmax(0,1fr);
 grid-template-areas:"kick kick" "big range";align-items:end;column-gap:28px}
.pmlead.norange{grid-template-columns:auto;grid-template-areas:"kick" "big"}
 /* the same treatment as the ledger's labels below it — one declaration, so
    the two cannot drift apart */
.pmkick{grid-area:kick;display:block;font-style:normal;margin-bottom:9px}
.pmbig{grid-area:big;font-family:var(--cond);font-size:54px;font-weight:700;
 line-height:.82;letter-spacing:-.02em}
 /* Not stretched to the card's edge — a compact component sitting beside the
    figure, with the right-hand air left as air. */
.pmpm{grid-area:range;justify-self:start;width:100%;max-width:140px;
 min-width:0;padding-bottom:2px}
.pmpm .db{height:28px}
/* the floor and ceiling figures are centred under their dots by default, which
   pushes the outer one past the card's edge when the dots sit on it. Turned in. */
.pmpm .db em{font-size:10.5px}
.pmpm .db em:nth-of-type(1){transform:translateX(-2px)}
.pmpm .db em:nth-of-type(2){transform:translateX(-100%)}

/* the ledger */
.pmled{margin:18px 0 0;border-top:1px solid var(--hr)}
.pmlr{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:baseline;
 gap:12px;padding:10px 0;border-bottom:1px solid var(--hr)}
.pmlr dt,.pmkick{font-family:var(--sans);font-size:13px;font-weight:400;
 letter-spacing:normal;text-transform:none;color:var(--mut)}
/* same face and case as the ledger labels, a shade smaller and quieter — it
   titles the block rather than labelling a row in it */
.pmkick{font-size:12.5px;color:var(--fnt)}
.pmlr dd{margin:0;text-align:right;white-space:nowrap}
.pmlr b{font-family:var(--cond);font-size:19px;font-weight:700}
/* The qualifier and the position chip are the same object in two colours: a
   pill that sits before the figure. Trailing the figure it was loose text, and
   it also pushed each number to a different x, so the column never lined up. */
.pmlr em,.pmk{display:inline-block;font-family:var(--cond);font-size:12.5px;
 font-weight:700;letter-spacing:.05em;line-height:1.45;padding:3px 9px;border-radius:4px;
 margin-right:8px;vertical-align:2px;white-space:nowrap}
.pmlr em{font-style:normal;text-transform:uppercase;color:var(--mut);
 background:rgba(25,25,23,.055);box-shadow:inset 0 0 0 1px rgba(25,25,23,.07)}
.pmk{color:#191917;background:rgba(25,25,23,.08)}
/* Every position colour in this stylesheet is scoped to a parent — .pgt.p-RB,
   .mtr .tsl.p-RB, .slot.slot.p-RB — so a bare p-RB inherits nothing. Stated
   here rather than by widening the global rules, which other pages depend on. */
.pmk.p-QB{background:#F9B3C4}.pmk.p-RB{background:#A2E3D8}
.pmk.p-WR{background:#AECDFB}.pmk.p-TE{background:#F8CFA4}
.pmk.p-K{background:#D9B7FB}.pmk.p-DST{background:#C4CBD6}
.pmk.p-FLEX{background:#CFD6A8}.pmk.p-SF{background:#F9B3C4}

/* the projected stat line */
.pmstat{font-size:13px;line-height:1.55;color:var(--mut);margin:15px 0 0}
.pmstat b{font-weight:600;color:var(--ink);font-size:13.5px}
.pmstat em{font-style:normal;font-weight:300;color:rgba(25,25,23,.22);margin:0 9px}
.pmline{margin-top:12px}

/* usage, when the feed carries it */
.pmuse{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:1px;
 margin-top:16px;background:var(--hr);border-top:1px solid var(--hr);border-bottom:1px solid var(--hr)}
.pmu{background:var(--paper);padding:10px 2px 11px;text-align:center}
.pmu i{display:block;font-style:normal;font-size:10px;color:var(--mut);margin-bottom:4px}
.pmu b{font-family:var(--cond);font-size:17px;font-weight:700}

/* the writing, and the game log */
/* Separated by air, not by rules. The ledger above already ends on a hairline
   and the label starts each block — a rule between every prose section put
   four of them down one short card. */
.pmsec{margin-top:20px}
/* The card settled on one label: sans, sentence case, quiet. This was a third
   grammar — condensed, uppercase, tracked out — shouting three times over the
   serif prose it was introducing. Same declaration as .pmlr dt and .pmkick
   below, so the three cannot drift apart again. */
.pmsec h3{font-family:var(--sans);font-size:12.5px;font-weight:400;letter-spacing:normal;
 text-transform:none;color:var(--fnt);margin:0 0 8px}
.prose.pmp{font-family:var(--serif);font-size:15px;line-height:1.56;color:var(--mut2)}
.prose.pmp p+p{margin-top:9px}

@media(max-width:600px){
 /* on a phone it is a sheet: full width, off the bottom edge */
 .pmpanel{left:0;top:auto;right:0;bottom:0;transform:none;width:100%;
  max-width:none;max-height:90vh;border-radius:16px 16px 0 0;
  animation:sheetUp .24s cubic-bezier(.2,.7,.3,1)}
 /* and it leaves the way it came. close() in player.js waits 240ms for this;
    without it the card blinked out and the wait was dead time. */
 .pmodal.pmout .pmpanel{opacity:1;transition:none;
  animation:sheetDown 240ms cubic-bezier(.4,0,1,1) forwards}
 .pmgrab{display:block;position:absolute;left:50%;top:9px;z-index:3;
  width:44px;height:4px;margin-left:-22px;border-radius:2px;background:rgba(250,250,246,.55)}
 .pmbig{font-size:46px}
 .pmbody{padding:16px 16px 22px}
}

/* ---- rest-of-season tiers, twelve of them ------------------------------
   An ordinal scale, so it is built to read as a direction rather than as
   twelve identities: a front-loaded ramp off the house gold that separates
   2.4x harder between tiers 1 and 2 than between 11 and 12, because that is
   where the difference means something. Warm the whole way down, so a tier
   never reads as a position — the nearest position colour is 62 away in RGB.
   Every step clears 6.6:1 against ink. */
.tr-1{--tier:#FFE638}.tr-2{--tier:#FFD154}.tr-3{--tier:#F6C75F}
.tr-4{--tier:#EDBF67}.tr-5{--tier:#E4B86E}.tr-6{--tier:#DBB374}
.tr-7{--tier:#D3AE79}.tr-8{--tier:#CBAA7E}.tr-9{--tier:#C2A683}
.tr-10{--tier:#BAA287}.tr-11{--tier:#B09F8D}.tr-12{--tier:#A49D95}
/* on the chart the tier heading is a chip in the same colour */
.vtn{background:var(--tier,transparent);color:var(--ink);
 padding:3px 9px;border-radius:4px;letter-spacing:.06em}
/* the previewed alternative on a week with no move — present, not urged */
.wvcall.wvnone{border-top-color:var(--hr2)}
.wvmuted{opacity:.72}
.wvcall.wvnone .wvcy{margin-top:14px}
/* streaming defense: the matchup rating as a meter in the row */
.wvds{grid-template-columns:22px 38px minmax(0,1fr) 52px 64px}
.wvmr{display:block;height:5px;border-radius:3px;background:rgba(25,25,23,.09);overflow:hidden;align-self:center}
.wvmr>i{display:block;height:100%;border-radius:3px;
 background:linear-gradient(90deg,var(--hls),var(--up))}
@media(max-width:600px){.wvds{grid-template-columns:20px 34px minmax(0,1fr) 40px 60px;gap:0 9px}}
/* streaming defense: this week's pick, then the alternates */
.wvdlead{margin-top:12px;padding:14px 15px 15px;border:1px solid var(--hr2);
 border-top:3px solid var(--gc,var(--hls));border-radius:11px;background:var(--card,#FFFDF7)}
.wvdh{display:flex;align-items:center;gap:11px}
.wvdh .face{width:44px;height:44px}
.wvdn{font-family:var(--cond);font-size:21px;font-weight:700;letter-spacing:-.012em;display:block}
.wvdfig{display:flex;gap:26px;margin-top:12px}
.wvdp b{display:block;font-family:var(--cond);font-size:27px;font-weight:700;line-height:1}
.wvdp i{display:block;font-style:normal;font-size:11px;color:var(--fnt);margin-top:4px}
.wvdlead .wvmr{margin-top:12px;height:6px}
.wvdwhy{font-family:var(--serif);font-size:14.5px;line-height:1.5;color:var(--mut2);margin:12px 0 0}
.wvdalt{font-family:var(--cond);font-size:11px;font-weight:700;letter-spacing:.09em;
 text-transform:uppercase;color:var(--fnt);margin:18px 0 2px}

/* ===== Cards: the fill and the lift, not the outline =====
   Every panel on this site was a paper-white fill inside a 1px grey outline on
   a paper background — the outline and the fill saying the same thing twice,
   and the outline usually winning the scan against the content inside it.
   One treatment, stated once, for all of them: keep the fill, drop the
   outline, and let a soft lift do the separating.

   Hover states that set border-color still win on specificity, so a card that
   was interactive still outlines itself under the cursor.

   The figure strip keeps its 1px gaps — those are its dividers, and they read
   as dividers, not as a frame — but loses the outer border like everything
   else. The bracket boxes carry the same shadow, set beside their own rules:
   there the card is .simduo, not the block around it. */
:root{--cardsh:0 1px 1px rgba(25,25,23,.04),0 6px 16px -10px rgba(25,25,23,.3)}
.rw,.pcard,.pgs,.pdtot,.h2tape,.h2duo .bstk,.oddsx .chwrap,.volc,
.wkc,.hubc,.hubm,.cc,.mcover,.stkc,.upc,.drgm,.drcard,.tdr{
 border-color:transparent;box-shadow:var(--cardsh)}

/* these two carry a coloured top edge that carries meaning — the call's
   verdict, the chip's accent — so only the three sides that say nothing go */
.bchp,.wvcall{border-left-color:transparent;border-right-color:transparent;
 border-bottom-color:transparent}
.wvcall{box-shadow:var(--cardsh)}

/* ---- The page selector's two speeds ------------------------------------
   Opening and closing were the same 320ms in both directions because only
   the base rule carried a transition; removing .up simply replayed it. They
   are split here — the sheet arrives at 340 and leaves at 420, on an
   ease-in-out rather than the sharp ease-out, which is what makes the exit
   read as settling rather than snapping.

   On a wide screen the panel is centred by transform:translate(-50%,-50%)
   !important, which nothing in this file can move. So the entrance uses the
   independent `translate` and `scale` properties, which compose with that
   transform instead of fighting it. Before this the desktop panel had no
   movement at all: it went from 60% opacity to 100% and nothing else. */
.moresheet .mscrim{transition:opacity 340ms cubic-bezier(.4,0,.2,1)}
.moresheet.up .mscrim{transition:opacity 280ms var(--e-out)}

@media(max-width:600px){
.moresheet .mpanel{transition:transform 420ms cubic-bezier(.4,0,.2,1)}
.moresheet.up .mpanel{transition:transform 340ms var(--e-sheet)}}

@media(min-width:601px){
.moresheet .mpanel{opacity:0;translate:0 12px;scale:.985;
  transition:opacity 380ms cubic-bezier(.4,0,.2,1),
             translate 420ms cubic-bezier(.4,0,.2,1),
             scale 420ms cubic-bezier(.4,0,.2,1)}
.moresheet.up .mpanel{opacity:1;translate:none;scale:1;
  transition:opacity 300ms var(--e-out),
             translate 340ms var(--e-sheet),
             scale 340ms var(--e-sheet)}}

/* ---- ROS Rank reads as a position rank --------------------------------
   The cell carries the same pill the row wears under the name, with the
   rank on it: RB4. Sized to sit on the figure column's right edge like the
   number it replaces, and it takes its colour from the position palette
   through .slot.slot.p-*, so there is no second set of position colours. */
.vv em.slot{display:inline-block;font-style:normal;font-family:var(--sans);
  font-size:11.5px;font-weight:700;letter-spacing:.02em;line-height:1;
  color:var(--ink);padding:4px 7px;border-radius:3px}
/* ===== Scenarios (added Oct 13 at Nick's request). Built on the All Games card,
   the Simulation standings table and the odds grid; only what those do not
   already carry is here. ===== */
.scnx .sh{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.scnreset{font-size:12.5px;font-weight:600;color:var(--mut2);padding:6px 10px;border-radius:5px;border:1px solid var(--frame);background:#FFFDF7;min-height:34px;white-space:nowrap}
.scnreset:hover{border-color:rgba(25,25,23,.3);color:var(--ink)}
.scnst{font-size:12.5px;color:var(--mut);margin-top:10px}
.scnprog{height:3px;background:var(--hr);border-radius:2px;overflow:hidden;margin-top:14px}
.scnprog i{display:block;height:100%;background:var(--ink);transition:width .2s linear}
.scnodds{margin-top:12px}
.scnoh,.scnor{display:grid;grid-template-columns:minmax(0,1fr) repeat(4,minmax(0,66px));gap:4px;align-items:center}
.scnoh{border-bottom:1px solid var(--hr2);padding-bottom:8px}
.scnoh span{font-size:11px;color:var(--fnt);text-align:center}
.scnoh span:first-child{text-align:left;color:var(--mut)}
.scnor{padding:5px 0;border-bottom:1px solid var(--hr)}
.scnor:last-child{border-bottom:0}
.scnor .nm{font-size:14.5px;font-weight:500;letter-spacing:-.012em;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.scnor.you .nm{font-weight:700}
.scnor.you .nm span{box-shadow:inset 0 -.14em 0 var(--hl)}
.scnc{display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:4px;padding:6px 0 5px;min-height:46px}
.scnc b{font-family:var(--mono);font-size:12.5px;font-weight:500;letter-spacing:-.04em;color:var(--ink);line-height:1.1}
.scnc b i{font-style:normal;font-size:.82em;color:var(--mut);margin-left:.5px}
.scnc em,.scnyou em{font-style:normal;font-family:var(--mono);font-size:10.5px;letter-spacing:-.04em;line-height:1.2;margin-top:2px;font-weight:500}
.scnx em.up{color:var(--up)}
.scnx em.dn{color:var(--dn)}
.scnx em.z{color:var(--fnt)}
.scntbl .simhd,.scntbl .simr{grid-template-columns:34px minmax(0,1fr) 50px 50px 48px}
.scntbl .simhd span:nth-child(5){text-align:right}
.scnyou{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;background:var(--hr);border:1px solid var(--hr);border-radius:6px;overflow:hidden;margin-top:14px}
.scnyou>div{background:#FFFDF7;padding:9px 6px 8px;text-align:center;display:flex;flex-direction:column;align-items:center}
.scnyou i{font-style:normal;font-size:11px;color:var(--mut)}
.scnyou b{font-family:var(--cond);font-size:22px;font-weight:700;line-height:1.05;margin-top:3px}
.scnyou b u{text-decoration:none;font-family:var(--sans);font-size:11px;font-weight:500;color:var(--mut);margin-left:1px}
.scnbar{display:flex;align-items:center;gap:10px;margin-top:16px;margin-bottom:16px}
.scng .mgtop{min-height:26px}
.scnclr{font-size:12px;font-weight:600;color:var(--mut);padding:4px 8px;border-radius:4px}
.scnclr:hover{color:var(--ink);background:rgba(25,25,23,.05)}
.scnduo .scnh{display:block;width:100%;cursor:pointer;transition:background .14s}
.scnduo .scnh:not(.w):hover{background:rgba(255,232,107,.12)}
.scnduo .scnh.l .simhs,.scnduo .scnh.l .simhn{opacity:.45}
.scnduo .scnh:focus-visible{outline:2px solid var(--acc);outline-offset:-2px}
.scnpts{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:10px;align-items:center;padding:10px 12px 12px;border-top:1px solid var(--hr)}
.scnpts span{font-size:11px;color:var(--fnt);text-align:center;white-space:nowrap}
.scnin{font:inherit;font-family:var(--cond);font-size:17px;font-weight:700;text-align:center;width:100%;min-width:0;height:38px;padding:0 8px;border:1px solid var(--frame);border-radius:5px;background:var(--paper);color:var(--ink)}
.scnin::placeholder{font-family:var(--sans);font-size:13px;font-weight:400;color:var(--fnt)}
.scnin:focus{outline:2px solid var(--acc);outline-offset:-1px;border-color:transparent}
.scnin.bad{border-color:var(--dn);background:rgba(201,48,48,.05)}
@media(max-width:420px){.scnoh,.scnor{grid-template-columns:minmax(0,1fr) repeat(4,minmax(0,58px));gap:3px}
.scnor .nm{font-size:13.5px}.scnc b{font-size:11.5px}.scnc em{font-size:10px}
.scnpts span{font-size:10px}}
@media(min-width:980px){.scnx{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,420px);column-gap:56px;align-items:start}
.scnx>.phx{grid-column:1/-1}
.scnx>.scnodsec{grid-column:2;grid-row:2/span 2;position:sticky;top:76px;margin-top:42px}
.scnx>.sect:not(.scnodsec){grid-column:1}
.scnx>.sect:nth-of-type(3){grid-row:2}
.scnx>.sect:nth-of-type(2){grid-row:3}}
/* ===== Simulation and Scenarios additions (Oct 20, at Nick's request) ===== */
.simlu{margin-top:14px;padding-top:12px;border-top:1px solid var(--hr)}
.simlur{display:grid;grid-template-columns:42px minmax(0,1fr) 52px;gap:0 10px;align-items:center;min-height:30px;border-bottom:1px solid var(--hr)}
.simlur:last-child{border-bottom:0}
.simlur .tsl{display:inline-grid;place-items:center;font-style:normal;font-size:9px;font-weight:600;border-radius:3px;padding:3px 0;background:rgba(25,25,23,.06);width:42px}
.simlur .tsl.p-QB,.simlur .tsl.p-SF{background:#F9B3C4}
.simlur .tsl.p-RB{background:#A2E3D8}
.simlur .tsl.p-WR{background:#AECDFB}
.simlur .tsl.p-TE{background:#F8CFA4}
.simlur .tsl.p-FLEX{background:#CFD6A8}
.simlur .tsl.p-K{background:#D9B7FB}
.simlur .tsl.p-DST{background:#C4CBD6}
.simlun{font-size:13.5px;font-weight:500;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.simlur.hole .simlun{color:var(--dn)}
.simlur b{font-family:var(--cond);font-size:17px;font-weight:700;text-align:right}
.simfin{margin-top:18px}
.simfg{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:3px}
.simfg span{display:flex;flex-direction:column;align-items:center;border-radius:4px;padding:6px 0 5px}
.simfg i{font-style:normal;font-size:10px;color:var(--mut)}
.simfg b{font-family:var(--mono);font-size:11.5px;font-weight:500;letter-spacing:-.04em}
.simys{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:var(--hr);border:1px solid var(--hr);border-radius:6px;overflow:hidden;margin-top:14px}
.simys>div{background:#FFFDF7;padding:10px 10px 11px;display:flex;flex-direction:column;gap:3px;min-width:0}
.simys i{font-style:normal;font-size:11px;color:var(--mut)}
.simys b{font-family:var(--cond);font-size:19px;font-weight:700;line-height:1.05;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.simys em{font-style:normal;font-size:11.5px;color:var(--mut2)}
.simmiss{font-size:13.5px;line-height:1.5;color:var(--mut2);margin-top:12px}
.simmiss b{color:var(--ink);font-weight:600}
@media(max-width:420px){.simys{grid-template-columns:1fr}}
.scnbar{flex-wrap:wrap}
.scnlev{display:grid;gap:14px;margin-top:12px;max-width:760px}
.scnlg .simbl{margin-bottom:8px}
.scnlh .simhs i{font-style:normal;font-family:var(--sans);font-size:11px;font-weight:500;color:var(--mut);margin-left:1px}
/* Simulation fixes (Oct 20, Nick: "UI is pretty broken"): the lineup moved out of the
   one-screen stage into each week of the recap, folded */
.simlud{margin-top:6px}
.simlud>summary{list-style:none;cursor:pointer;font-size:11px;font-weight:600;letter-spacing:.02em;text-transform:uppercase;color:var(--mut);padding:6px 0}
.simlud>summary::-webkit-details-marker{display:none}
.simlud>summary::after{content:' +';color:var(--fnt)}
.simlud[open]>summary::after{content:' \2212'}
.simlud .simlu{margin-top:2px;padding-top:4px}
.simlun i{font-style:normal;color:var(--mut)}
/* Scenarios fixes (Oct 21, Nick: "insanely broken"): the games that matter as compact rows */
.scnlev{display:block}
.scnlr{display:grid;grid-template-columns:minmax(0,1fr) 104px 104px;gap:8px;align-items:center;padding:9px 0;border-bottom:1px solid var(--hr)}
.scnlr:last-child{border-bottom:0}
.scnlr.mine .scnll b{color:var(--ink,inherit)}
.scnll{display:flex;flex-direction:column;min-width:0;line-height:1.25}
.scnll b{font-size:13px;font-weight:700}
.scnll span{font-size:12.5px;color:var(--mut);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.scnlb{display:flex;flex-direction:column;align-items:center;gap:1px;padding:6px 4px;border:1px solid var(--hr);border-radius:8px;background:transparent;font:inherit;color:inherit;cursor:pointer;min-width:0}
.scnlb span{font-size:11px;color:var(--mut);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.scnlb b{font-size:16px;font-weight:700;font-variant-numeric:tabular-nums}
.scnlb b i{font-style:normal;font-size:10px;font-weight:500;margin-left:1px}
.scnlb:hover{border-color:var(--mut)}
@media (max-width:360px){.scnlr{grid-template-columns:minmax(0,1fr) 92px 92px}}
@media(min-width:980px){.scnx>.scnodsec{grid-row:2/span 3}
.scnx>.sect.scngsec{grid-row:2}.scnx>.sect.scnlevsec{grid-row:3}.scnx>.sect.scnstsec{grid-row:4}}
/* ===== The Vision (Oct 24, at Nick's request) ===== */
.vishero{display:grid;gap:18px;margin-top:22px;align-items:end}
.vishero .vbig{display:flex;align-items:baseline;gap:12px}
.vishero .bignum i{font-style:normal;font-size:.5em;margin-left:2px}
.vishero .vlab{font-size:14px;color:var(--mut2)}
.vishero .tiles>div{background:rgba(25,25,23,.04)}
@media(min-width:760px){.vishero{grid-template-columns:auto 1fr}.vishero .tiles{max-width:none}}
.visl{margin-top:18px}
.vislh,.vislr{display:grid;grid-template-columns:70px 64px minmax(0,1fr) 78px;gap:10px;align-items:center}
.vislh{font-size:11px;color:var(--fnt);padding-bottom:6px;border-bottom:1px solid var(--hr2)}
.vislh span:last-child,.vislr .vn:last-child{text-align:right}
.vislr{min-height:40px;border-bottom:1px solid var(--hr);font-size:14px}
.vislr.top{background:rgba(255,232,107,.16)}
.vislr .vs{font-weight:600}
.vn{font-variant-numeric:tabular-nums}
.vn.dim{color:var(--mut)}
.vb{position:relative;height:22px;background:rgba(25,25,23,.05);border-radius:3px;overflow:hidden}
.vb i{position:absolute;inset:0 auto 0 0;background:var(--hls)}
.vb b{position:relative;font-size:12px;font-weight:600;line-height:22px;padding-left:7px}
.visroad{list-style:none;margin:20px 0 0;padding:0;border-left:2px solid var(--ink)}
.visroad>li{display:grid;grid-template-columns:86px minmax(0,1fr);gap:12px;padding:0 0 22px 14px;position:relative}
.visroad>li::before{content:'';position:absolute;left:-7px;top:4px;width:12px;height:12px;border-radius:50%;background:var(--hl);border:2px solid var(--ink)}
.visroad>li:last-child{padding-bottom:4px}
.visw{font-size:11px;font-weight:600;letter-spacing:.02em;text-transform:uppercase;color:var(--mut);padding-top:3px}
.visroad h5{margin:0;font-size:18px;letter-spacing:-.02em}
.vist{font-family:var(--serif);font-size:15px;line-height:1.55;color:var(--body);margin:6px 0 10px;max-width:var(--measure)}
.visn{font-size:13px;color:var(--mut2);margin:0}
.visgh,.visg{display:grid;grid-template-columns:62px minmax(0,1fr) 74px 74px;gap:8px;align-items:center}
.visgh{font-size:10.5px;color:var(--fnt);padding-bottom:4px}
.visgh i,.visgh em,.visg i,.visg em{font-style:normal;text-align:right}
.visg{min-height:32px;border-top:1px solid var(--hr);font-size:13.5px}
.visg span{color:var(--mut)}
.visg em{font-weight:600}
.visg.now{background:rgba(255,232,107,.16)}
.vischips{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.vischips span{display:inline-flex;align-items:baseline;gap:7px;padding:6px 10px;border-radius:5px;font-size:13.5px}
.vischips i{font-style:normal;font-size:12px;color:var(--mut2)}
.visfin{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:18px}
.visfin>div{background:rgba(25,25,23,.04);border-radius:5px;padding:12px}
.visfin b{display:block;font-size:24px;font-weight:700;letter-spacing:-.03em}
.visfin span{font-size:12px;color:var(--mut2)}
.vish{margin:26px 0 4px;font-size:11px;font-weight:600;letter-spacing:.02em;text-transform:uppercase;color:var(--mut)}
.visdec{margin-top:6px}
.visdr{display:grid;grid-template-columns:minmax(0,1fr) 56px 56px;gap:8px;align-items:center;min-height:40px;border-bottom:1px solid var(--hr)}
.visdr .nm{display:flex;align-items:center;gap:9px;min-width:0;font-size:14px}
.visdr .nm>span:last-child{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.visdr .vn{text-align:right}
@media(max-width:380px){.vislh,.vislr{grid-template-columns:58px 52px minmax(0,1fr) 64px;gap:6px}.visroad>li{grid-template-columns:1fr;gap:2px}.visgh,.visg{grid-template-columns:54px minmax(0,1fr) 62px 62px}}
.visgh i,.visgh em{white-space:normal;line-height:1.2}
.visx .visl,.visx .visroad,.visx .visdec,.visx .visfin,.visx .vischips{max-width:720px}
.visx .foot{max-width:720px}