/* Prop Edge Board page, v7. Design reference: design/board-v7 (built on the home page's v7 system). Tokens first, then
   components, then breakpoints.
   The home page's system carried into the tool: the capsule nav, the night arena with its one horizon light (short, so
   the bets come first), then the light body: white cards, hairlines, Instrument Sans for reading and Archivo condensed
   for every number. Cyan marks the logo, focus and the chart's handle; green means value only.
   State classes that script toggles all start with "is-" and are styled only together with their component, so a
   state can never restyle another component that happens to share a class name. */
@font-face{font-family:"Instrument Sans";src:url("fonts/InstrumentSans-Variable.ttf") format("truetype");font-weight:400 700;font-stretch:75% 100%;font-display:swap}
@font-face{font-family:"Archivo";src:url("fonts/Archivo-Variable.ttf") format("truetype");font-weight:100 900;font-stretch:62% 125%;font-display:swap}

:root{
  --night:#060910;--night-2:#0B1120;--day:#F5F7FA;--card:#FFFFFF;
  --ink:#0D1320;--ink-2:#4B566B;--ink-3:#7C869A;--line:rgba(13,19,32,.08);--line-2:rgba(13,19,32,.13);
  --ink-d:#EEF1F6;--ink-d2:#9BA5B7;--ink-d3:#687386;--line-d:rgba(255,255,255,.10);
  --cyan:#33E1FF;--cyan-day:#007A96;--pos:#0A7A4E;--pos-d:#3DD68C;--warn:#9A6100;--warn-d:#F0B44C;
  --sans:"Instrument Sans",ui-sans-serif,-apple-system,"SF Pro Text",system-ui,sans-serif;
  --num:"Archivo","Instrument Sans",ui-sans-serif,system-ui,sans-serif;
  --ease:cubic-bezier(.25,.46,.45,.94);--ease-ui:cubic-bezier(.4,0,.2,1);
  --gut:clamp(16px,3vw,40px);--r-card:24px;--r-pane:20px;
  /* the working tokens: the light body by default, the night theme swaps them */
  --page:var(--day);--surface:#FFFFFF;--surface-2:#F7F9FC;--hover:#F9FAFC;--sel:#F2F5F9;
  --t1:var(--ink);--t2:var(--ink-2);--t3:var(--ink-3);--ln:var(--line);--ln2:var(--line-2);
  --accent:var(--cyan-day);--green:var(--pos);--green-soft:rgba(10,122,78,.08);--green-line:rgba(10,122,78,.4);
  --amber:var(--warn);--amber-soft:rgba(154,97,0,.08);--solid:var(--ink);--solid-ink:#FFFFFF;
  --tough:#7A6650;--tough-soft:rgba(122,102,80,.10);   /* a tough matchup: a warm neutral, never an alarm */
  --fire:#B8431A;--fire-soft:rgba(184,67,26,.09);--fire-line:rgba(184,67,26,.45);   /* the Fire score: an ember, never value green */
  --win-top:#2BC47E;--win-bot:#0A7A4E;--off:#B9C1CE;--push:#1F2636;
  --shadow:0 1px 2px rgba(13,19,32,.04),0 18px 40px -30px rgba(13,19,32,.22);
  --frost:rgba(245,247,250,.76);color-scheme:light}
:root[data-theme="dark"]{
  --page:#070A12;--surface:#0D1321;--surface-2:#111829;--hover:rgba(255,255,255,.025);--sel:rgba(255,255,255,.05);
  --t1:var(--ink-d);--t2:var(--ink-d2);--t3:var(--ink-d3);--ln:rgba(255,255,255,.07);--ln2:rgba(255,255,255,.12);
  --accent:var(--cyan);--green:var(--pos-d);--green-soft:rgba(61,214,140,.11);--green-line:rgba(61,214,140,.5);
  --amber:var(--warn-d);--amber-soft:rgba(240,180,76,.12);--solid:var(--ink-d);--solid-ink:var(--night);
  --tough:#CDB9A2;--tough-soft:rgba(205,185,162,.12);
  --fire:#F08A5B;--fire-soft:rgba(240,138,91,.13);--fire-line:rgba(240,138,91,.5);
  --win-top:#3DD68C;--win-bot:#2AA86C;--off:#465062;--push:#E6EAF1;
  --shadow:0 1px 0 rgba(255,255,255,.03) inset,0 24px 50px -34px rgba(0,0,0,.8);
  --frost:rgba(6,9,16,.74);color-scheme:dark}
*{box-sizing:border-box}
html{background:var(--page)}
body{margin:0;color:var(--t1);background:var(--page);font:400 15px/1.55 var(--sans);-webkit-font-smoothing:antialiased;font-feature-settings:"tnum" 1;overflow-x:hidden}
button,input,select{font:inherit;color:inherit}
a{color:inherit}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:8px}
.wrap{max-width:1320px;margin:0 auto;padding:0 var(--gut)}
.num{font-family:var(--num);font-stretch:78%;font-weight:600;letter-spacing:-.01em}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.pos{color:var(--green)}
[hidden]{display:none!important}

/* the footer's lockup (the nav, the same on every page, is styled in nav.css) */
.logo{display:inline-flex;align-items:center;gap:9px;text-decoration:none;font:500 18px/1 var(--sans);letter-spacing:-.02em;flex:none}
.logo svg{width:21px;height:21px}.logo circle{fill:var(--cyan)}
.logo b{font-weight:700}.logo span{font-weight:400;margin-left:-9px}

/* ---------- the arena: the home hero's night and horizon light, cut to a band so the bets come first ---------- */
.arena{position:relative;color:var(--ink-d);background:var(--night);overflow:hidden;isolation:isolate}
.arena canvas,.arena .still{position:absolute;inset:0;width:100%;height:100%;z-index:-3}
.arena .still{background:
  radial-gradient(140% 110px at 50% 100%,var(--page) 45%,transparent 100%),
  radial-gradient(100% 170px at 50% 100%,rgba(51,225,255,.20),rgba(51,225,255,0) 80%),
  radial-gradient(70% 50% at 50% 70%,rgba(70,96,170,.32),rgba(6,9,16,0) 70%),var(--night)}
.arena .court{position:absolute;left:50%;top:60%;width:max(1500px,120vw);transform:translate(-50%,-50%) perspective(900px) rotateX(58deg);z-index:-2;opacity:.3;
  -webkit-mask-image:radial-gradient(ellipse 55% 60% at 50% 45%,#000 25%,transparent 75%);mask-image:radial-gradient(ellipse 55% 60% at 50% 45%,#000 25%,transparent 75%)}
.arena .court *{fill:none;stroke:rgba(255,255,255,.12);stroke-width:1.2;vector-effect:non-scaling-stroke}
.arena .top{position:absolute;left:0;right:0;top:0;height:45%;z-index:-1;pointer-events:none;background:linear-gradient(var(--night),rgba(6,9,16,0))}
.arena .fade{position:absolute;left:0;right:0;bottom:0;height:64px;z-index:-1;pointer-events:none;background:linear-gradient(to bottom,transparent,var(--page) 85%)}
.arena .inner{position:relative;padding-top:clamp(108px,13vh,128px);padding-bottom:72px}
.ahead{display:flex;justify-content:space-between;align-items:flex-end;gap:24px 40px;flex-wrap:wrap}
.eyebrow{display:flex;align-items:center;flex-wrap:wrap;gap:6px 10px;font-size:13px;color:var(--ink-d2);margin:0 0 12px}
.eyebrow .dot{width:6px;height:6px;border-radius:50%;background:var(--pos-d);box-shadow:0 0 0 3px rgba(61,214,140,.16)}
.eyebrow .sep{opacity:.5}
h1{font:500 clamp(2.3rem,4.2vw,3.5rem)/1.02 var(--sans);letter-spacing:-.045em;margin:0}
.tag{display:inline-flex;align-items:center;height:20px;padding:0 8px;border-radius:999px;font:600 11px/1 var(--sans);white-space:nowrap;letter-spacing:0}

/* the four numbers, on one glass slab */
.stats{display:flex;border-radius:var(--r-pane);padding:16px 4px;background:linear-gradient(180deg,rgba(17,23,37,.72),rgba(11,16,28,.82));
  border:1px solid var(--line-d);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}
.stat{padding:0 24px;border-left:1px solid var(--line-d);min-width:0}
.stat:first-child{border-left:0}
.stat .l{color:var(--ink-d2);font-size:12.5px;white-space:nowrap}
.stat .v{font:600 34px/1.1 var(--num);font-stretch:76%;letter-spacing:-.015em;white-space:nowrap;margin-top:4px}
.stat .v.pos{color:var(--pos-d)}
.stat .v small{display:inline-block;font:500 13px/1 var(--sans);color:var(--ink-d2);letter-spacing:0;white-space:nowrap}
/* the first game's time and its countdown: on one line when they fit, the countdown under the time when they don't */
.stat .v.when{white-space:normal}.stat .v.when .t{white-space:nowrap}

/* the scoreboard strip: tonight's games, each a filter */
.slate{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(212px,1fr);gap:12px;margin-top:28px;overflow-x:auto;scrollbar-width:none;padding:2px;margin-left:-2px;margin-right:-2px}
.slate::-webkit-scrollbar{display:none}
.tile{display:grid;gap:10px;align-content:start;text-align:left;padding:14px 16px 13px;border-radius:18px;cursor:pointer;color:var(--ink-d);
  background:rgba(14,20,33,.74);border:1px solid var(--line-d);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
  transition:background .25s var(--ease-ui),transform .4s var(--ease)}
.tile:hover{background:rgba(22,30,48,.78)}
.tile .m{display:flex;align-items:center;gap:8px;font:600 17px/1 var(--num);font-stretch:80%}
.tile .m .at{font:400 12px/1 var(--sans);color:var(--ink-d3)}
.tile .meta{display:flex;align-items:baseline;gap:0;font-size:12.5px;color:var(--ink-d2)}
.tile .foot{display:flex;justify-content:space-between;align-items:center;gap:8px;min-height:20px;padding-top:10px;border-top:1px solid var(--line-d)}
.tile.is-on .foot{border-color:var(--line)}
.tile .meta b{font:600 14px/1 var(--num);font-stretch:82%;color:var(--ink-d);margin-right:6px}
.tile .n{font:600 13px/1 var(--num);font-stretch:85%;color:var(--pos-d);white-space:nowrap}
.tile .n.none{color:var(--ink-d3);font-weight:500}
.tile.is-on{background:var(--ink-d);color:var(--night);border-color:transparent}
.tile.is-on .meta,.tile.is-on .m .at{color:var(--ink-2)}.tile.is-on .meta b{color:var(--night)}.tile.is-on .n{color:var(--pos)}.tile.is-on .n.none{color:var(--ink-3)}
.tag.news{background:rgba(61,214,140,.12);color:var(--pos-d);border:1px solid rgba(61,214,140,.5)}
.tag.warn{background:rgba(240,180,76,.12);color:var(--warn-d)}
.tile.is-on .tag.news{background:rgba(10,122,78,.08);color:var(--pos);border-color:rgba(10,122,78,.4)}
.tile.is-on .tag.warn{background:rgba(154,97,0,.08);color:var(--warn)}
.badge{--tc:#5B6B8C;--tt:#fff;flex:none;width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:var(--tc);color:var(--tt);
  font:700 12px/1 var(--num);font-stretch:85%;letter-spacing:.02em}
.badge.sm{width:26px;height:26px;border-radius:8px;font-size:9.5px}
/* a game line's two teams in the space of one chip, as a scoreboard reads: the away team over the home team */
.pair{flex:none;display:flex;flex-direction:column;gap:2px;width:40px;height:40px}
.pair .badge{flex:1;width:auto;height:auto;border-radius:7px;font-size:9.5px}
.fwho .pair{width:46px;height:46px}.fwho .pair .badge{width:auto;height:auto;border-radius:8px;font-size:10.5px}
.chip .pair{width:30px;height:30px;gap:1px}.chip .pair .badge{border-radius:5px;font-size:7.5px}
.nosave{display:block}
.gtiles{grid-template-columns:repeat(var(--n),1fr);margin:4px 0 12px}
:root[data-theme="dark"] .badge,.arena .badge{background:linear-gradient(160deg,color-mix(in srgb,var(--tc) 78%,#fff 0%),color-mix(in srgb,var(--tc) 52%,transparent));
  box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--tc) 60%,rgba(255,255,255,.18))}
.tile.is-on .badge{background:var(--tc);box-shadow:none}

/* ---------- the light body ---------- */
main.board{position:relative;padding-top:4px;padding-bottom:40px}
.gamenews{margin:0 0 16px;padding:16px 20px;border-radius:var(--r-pane);background:var(--surface);border:1px solid var(--ln);box-shadow:var(--shadow);font-size:14px;line-height:1.55}
.gamenews .rh{margin:0 0 6px;font-weight:600}
.gamenews ul{margin:0;padding-left:18px;color:var(--t2)}
.gamenews li.stale{color:var(--green)}
.weekready{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:0 0 16px;padding:14px 20px;border-radius:var(--r-pane);background:var(--surface);border:1px solid var(--ln);box-shadow:var(--shadow);font-size:14px;line-height:1.5}
.weekready[hidden]{display:none}
.carenote{display:block;color:var(--t2)}.carenote p{margin:0;overflow-wrap:anywhere}.carenote b{color:var(--t1);font-weight:600}
.hint a{color:var(--t1)}
.weekready a{color:var(--t1);text-decoration:none;min-width:0;overflow-wrap:anywhere}.weekready a:hover b{text-decoration:underline}

.controls{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:16px;flex-wrap:wrap}
.seg{display:inline-flex;padding:4px;border-radius:999px;background:var(--surface);border:1px solid var(--ln)}
.seg button{border:0;background:none;height:34px;padding:0 16px;border-radius:999px;color:var(--t2);font:500 14px/1 var(--sans);cursor:pointer;transition:background .2s,color .2s}
.seg button[aria-pressed="true"]{background:var(--solid);color:var(--solid-ink)}
.seg button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
/* Props | Game lines: each segment carries its count, in the numeral face */
.segs .sn{margin-left:4px;font:600 13px/1 var(--num);font-stretch:85%;opacity:.72}
.segs .sn:empty{display:none}
.filters{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-left:auto}
/* the board's own tools, in its toolbar: Alerts, Your bets and the theme, the same pills as the filters */
.tools{display:flex;gap:8px;align-items:center}
button.ctl.tool{position:relative;display:inline-flex;align-items:center;gap:8px;padding:0 16px;cursor:pointer;white-space:nowrap}
button.ctl.tool svg{width:16px;height:16px;flex:none;color:var(--t2)}
button.ctl.tool.icon{width:44px;padding:0;justify-content:center}
.count{min-width:20px;height:20px;padding:0 6px;border-radius:999px;background:var(--ln2);color:var(--t1);font:600 12px/20px var(--num);font-stretch:85%;text-align:center}
.count.hot{background:var(--solid);color:var(--solid-ink)}
.field-pill{position:relative}
.ctl{height:44px;border-radius:999px;border:1px solid var(--ln);background:var(--surface);font:500 14px/1 var(--sans);color:var(--t1);transition:border-color .2s}
.ctl:hover{border-color:var(--ln2)}
select.ctl{appearance:none;padding:0 38px 0 18px;cursor:pointer}
.field-pill.select:after{content:"";position:absolute;right:18px;top:17px;width:6px;height:6px;border-right:1.5px solid var(--t3);border-bottom:1.5px solid var(--t3);transform:rotate(45deg);pointer-events:none}
.search svg{position:absolute;left:16px;top:14px;width:16px;height:16px;color:var(--t3)}
.search input{width:200px;padding:0 16px 0 40px;font-weight:400}
.search input::placeholder{color:var(--t3)}
button.ctl{display:inline-flex;align-items:center;gap:8px;padding:0 18px;cursor:pointer}
button.ctl svg{width:15px;height:15px;color:var(--t3)}
.pop{position:absolute;right:0;top:52px;z-index:30;width:280px;border-radius:var(--r-pane);background:var(--surface);border:1px solid var(--ln);box-shadow:0 30px 60px -30px rgba(13,19,32,.35);padding:8px;display:none}
.pop.is-open{display:block}
.pop p{margin:8px 12px 8px;color:var(--t2);font-size:13px}
.pop label{display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:12px;cursor:pointer;font-size:14px}
.pop label:hover{background:var(--hover)}
.pop input{accent-color:var(--solid);width:16px;height:16px}
.pop .acts{display:flex;justify-content:space-between;border-top:1px solid var(--ln);margin-top:6px;padding:10px 12px 4px}
.link{border:0;background:none;color:var(--t2);cursor:pointer;padding:0;font-weight:600;font-size:14px;text-decoration:none}
.link:hover{color:var(--t1)}

/* the bets: one white card */
.table{background:var(--surface);border:1px solid var(--ln);border-radius:var(--r-card);overflow:clip;box-shadow:var(--shadow)}
.cols{display:grid;grid-template-columns:minmax(250px,2.2fr) minmax(170px,1.5fr) minmax(130px,1fr) 88px 88px 44px;align-items:center;column-gap:18px;padding:0 14px 0 22px}
.thead{height:46px;color:var(--t3);font-size:12.5px;font-weight:500;border-bottom:1px solid var(--ln)}
.r{text-align:right;justify-self:end}
.info{display:inline-flex;align-items:center;gap:6px;cursor:help}
.info svg{width:13px;height:13px}
.group{padding:13px 22px;display:flex;justify-content:space-between;align-items:center;gap:12px;border-bottom:1px solid var(--ln);background:var(--surface-2)}
.group .gm{display:flex;align-items:center;gap:8px;font:600 17px/1 var(--num);font-stretch:80%}
.group .gm .at{font:400 12px/1 var(--sans);color:var(--t3)}
.group .t{color:var(--t2);font-size:13px}
.row{min-height:76px;padding-top:14px;padding-bottom:14px;border-bottom:1px solid var(--ln);cursor:pointer;transition:background .2s var(--ease-ui)}
#rows>.row:last-child{border-bottom:0}
.row:hover{background:var(--hover)}
.row.is-sel{background:var(--sel)}
/* the focus ring drawn inside the row: the card clips anything past its edges, so the page-wide ring (outside the
   element) lost its sides and showed only a curved top and bottom */
.row:focus-visible{outline:2px solid var(--accent);outline-offset:-2px;border-radius:10px}
.who{display:flex;align-items:center;gap:14px;min-width:0}
/* the name keeps its line; the tags sit beside it while they fit and wrap under it when they don't (a row with an
   injury, a stale line, a thin sample and a matchup tag), so they never run into the bet cell */
.nm{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px;font-weight:500;font-size:15px;letter-spacing:-.01em;white-space:nowrap;min-width:0}
.nm .pn{overflow:hidden;text-overflow:ellipsis}
.tags{display:inline-flex;flex-wrap:wrap;gap:4px 6px}
.sub{color:var(--t3);font-size:12.5px;line-height:18px;margin-top:2px}
.bet .b1{font-weight:500;font-size:14.5px}
/* the row's context under the bet text (web/board-core.js ctxHtml): hit counts and minutes on one line, in the cell,
   shortened by its own ellipsis before it could ever push the grid; the numbers in the condensed numeral face */
.ctx{color:var(--t3);font-size:12.5px;line-height:18px;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ctx .n{font-family:var(--num);font-stretch:80%;font-weight:600;color:var(--t2)}
.ctx .sl{display:none}
.book .b1{font-weight:500;font-size:14px}
.price{font:600 22px/1 var(--num);font-stretch:78%;letter-spacing:-.01em}
.edge{font:600 22px/1 var(--num);font-stretch:78%;letter-spacing:-.01em;color:var(--green)}
/* the Fire badge under the edge (web/fire-core.js): a filled flame at 85+, an outlined one from 70 to 84 */
.edgec{display:flex;flex-direction:column;align-items:flex-end;gap:5px}
.fire{display:inline-flex;align-items:center;gap:3px;height:18px;padding:0 6px 0 5px;border-radius:999px;font:600 12px/1 var(--num);font-stretch:85%;white-space:nowrap;color:var(--fire)}
.fire svg{width:11px;height:11px;flex:none}
.fire b{font-weight:600}
.fire.is-smash{background:var(--fire-soft)}
.fire.is-strong{box-shadow:inset 0 0 0 1px var(--fire-line)}
.tag.smash{background:var(--fire-soft);color:var(--fire)}
.pricec .sub{display:none}
/* the row's prediction-market chip (members only, web/board.js chipHtml): the best venue price on the same bet, under
   the book's name; green when it pays more than the row's sportsbook price after the venue's fee. One copy in the book
   cell, one in the bet cell for the widths that put the book cell away. The name gives way (an ellipsis) before the
   price ever does, and "before fees" or "at open" wraps under them when the cell is narrow. */
.vchip{display:inline-flex;flex-wrap:wrap;align-items:baseline;column-gap:5px;max-width:100%;margin-top:4px;padding:1px 8px;border-radius:9px;
  font-size:12px;line-height:18px;color:var(--t2);box-shadow:inset 0 0 0 1px var(--ln);vertical-align:top}
.vchip .vn{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.vchip b{flex:none;white-space:nowrap;font:600 13px/18px var(--num);font-stretch:85%;color:var(--t1)}
.vchip small{flex:none;white-space:nowrap;font-size:11px;color:var(--t3)}
.vchip.beats{background:var(--green-soft);box-shadow:none;color:var(--green)}
.vchip.beats b{color:var(--green)}
.vchip.m{display:none}
.tag.new{background:var(--green-soft);color:var(--green)}
.tag.news,.board .tag.news,.focus .tag.news,.sheet .tag.news{background:var(--green-soft);color:var(--green);border:1px solid var(--green-line)}
.board .tag.warn,.focus .tag.warn,.sheet .tag.warn,.tag.lost{background:var(--amber-soft);color:var(--amber)}
.tag.thin{background:transparent;color:var(--t2);border:1px solid var(--ln2)}
.tag.soft{background:var(--green-soft);color:var(--green)}      /* the matchup tags: value green at a low tint, a warm neutral */
.tag.tough{background:var(--tough-soft);color:var(--tough)}
.tag.sys{display:inline-block;line-height:20px;background:var(--surface-2);color:var(--t2);border:1px solid var(--ln2);max-width:150px;overflow:hidden;text-overflow:ellipsis}
.trk{width:38px;height:38px;border-radius:999px;border:0;background:none;color:var(--t3);cursor:pointer;display:grid;place-items:center;justify-self:end;transition:background .2s,color .2s}
.trk:hover{background:var(--sel);color:var(--t1)}
.trk[aria-pressed="true"]{color:var(--t1)}
.trk svg{width:18px;height:18px}
.trk[aria-pressed="true"] svg path,.btn[aria-pressed="true"] svg path{fill:currentColor}
.empty{padding:72px 24px;text-align:center}
.empty b{display:block;font:500 20px/1.3 var(--sans);letter-spacing:-.02em;margin-bottom:6px}
.empty span{color:var(--t2)}

/* provenance: where every number comes from, docked to the card's foot while the bets are in view */
.statusbar{position:sticky;bottom:0;z-index:2;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px 22px;padding:12px 22px;
  border-top:1px solid var(--ln);background:color-mix(in srgb,var(--surface-2) 88%,transparent);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);font-size:12.5px;color:var(--t3)}
.statusbar b{color:var(--t2);font-weight:600}
.statusbar .live{display:inline-flex;align-items:center;gap:8px;color:var(--t2)}
.statusbar .dot{width:6px;height:6px;border-radius:50%;background:var(--green);box-shadow:0 0 0 3px var(--green-soft)}
.testing{display:inline-flex;align-items:center;height:20px;font-weight:600;font-size:11px;color:var(--amber);background:var(--amber-soft);padding:0 8px;border-radius:999px;margin-right:6px}

/* the footer slab, from the home page */
footer.sitefoot{margin:0 var(--gut) var(--gut);border-radius:var(--r-pane);background:var(--night-2);color:var(--ink-d2);padding:36px clamp(20px,4vw,48px);display:grid;gap:24px;font-size:14px}
:root[data-theme="dark"] footer.sitefoot{border:1px solid var(--line-d)}
footer.sitefoot .top{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;align-items:center}
footer.sitefoot .rg{color:var(--ink-d)}footer.sitefoot .rg b{font-family:var(--num);font-stretch:85%;font-weight:600}
footer.sitefoot p{margin:0;max-width:62em;line-height:1.6}
footer.sitefoot nav{display:flex;gap:22px;flex-wrap:wrap}footer.sitefoot nav a{text-decoration:none;color:var(--ink-d)}
footer.sitefoot .logo{color:var(--ink-d)}

/* ---------- the bet view: white panes over the frosted board ---------- */
.focus{position:fixed;inset:0;z-index:60;display:none;grid-template-rows:auto minmax(0,1fr) auto;grid-template-columns:minmax(0,1fr);gap:12px;padding:14px;
  background:var(--frost);-webkit-backdrop-filter:blur(30px) saturate(140%);backdrop-filter:blur(30px) saturate(140%);view-transition-name:focus-card}
.focus.is-open{display:grid}
.pane,.fhead,.fbody>section{background:var(--surface);border:1px solid var(--ln);box-shadow:var(--shadow)}
.fhead{border-radius:var(--r-pane)}
.ticks{display:flex;gap:3px;padding:10px 20px 0}
.ticks i{flex:1;height:3px;border-radius:2px;background:var(--ln2);transition:background .3s}
.ticks i.is-done{background:var(--t3)}
.ticks i.is-on{background:var(--t1)}
.fbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 10px 10px 20px}
.crumb{color:var(--t2);display:flex;gap:12px;align-items:center;white-space:nowrap;min-width:0;overflow:hidden;font-size:13.5px}
.crumb b{color:var(--t1);font:600 16px/1 var(--num);font-stretch:82%}
.fbar .acts{display:flex;gap:8px;flex:none}
.btn{display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 16px;border-radius:999px;border:1px solid var(--ln2);background:var(--surface);
  font:500 14px/1 var(--sans);cursor:pointer;white-space:nowrap;text-decoration:none;color:var(--t1);transition:background .2s}
.btn:hover{background:var(--hover)}
.btn.icon{width:40px;padding:0;justify-content:center;color:var(--t2)}
.btn svg{width:16px;height:16px;flex:none}
.btn[aria-pressed="true"],.btn.solid{background:var(--solid);color:var(--solid-ink);border-color:transparent}
.btn.solid:hover{opacity:.9}
.fbody{min-height:0;display:grid;grid-template-columns:minmax(340px,min(29vw,420px)) minmax(0,1fr) minmax(296px,min(24vw,352px));gap:12px}
.fbody>section{min-height:0;overflow-y:auto;padding:28px;border-radius:var(--r-pane);scrollbar-width:thin}
.fbody.is-next>section{animation:inNext .4s var(--ease) both}
.fbody.is-prev>section{animation:inPrev .4s var(--ease) both}
.fbody>section:nth-child(2){animation-delay:.03s}.fbody>section:nth-child(3){animation-delay:.06s}
@keyframes inNext{from{opacity:0;transform:translateX(18px)}to{opacity:1;transform:none}}
@keyframes inPrev{from{opacity:0;transform:translateX(-18px)}to{opacity:1;transform:none}}
.fwho{display:flex;gap:12px;align-items:center;margin-bottom:22px}
.fwho .badge{width:46px;height:46px;font-size:13px;border-radius:14px}
.fwho .n{font-size:17px;font-weight:500;letter-spacing:-.015em}
.call{font:500 42px/1.04 var(--sans);letter-spacing:-.045em;margin:0 0 10px;text-wrap:balance}
.call .num{font-stretch:76%;letter-spacing:-.02em}
.call.long{font-size:36px}
.offerrow{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px 12px;margin:0 0 22px}
.offer{font-size:15px;color:var(--t2);margin:0;display:flex;align-items:baseline;gap:8px;white-space:nowrap}
.offer b{font:600 26px/1 var(--num);font-stretch:78%;color:var(--t1)}
.btn.betnow{height:42px;padding:0 18px;font-weight:600}
/* a prediction market as the headline place to bet (members only): its price in cents and what it pays after its fee,
   its link out, and the best sportsbook right under it */
.offerrow.vhead{margin-bottom:8px}
.offerrow.vhead>div{min-width:0}
.pays{margin:5px 0 0;color:var(--t2);font-size:13px;line-height:1.4}
.altbook{margin:0 0 22px;color:var(--t2);font-size:13.5px;line-height:1.45}
.altbook .tag{margin-left:6px}
.vhead .btn.betnow{max-width:100%;white-space:normal;height:auto;min-height:42px;padding:10px 18px;line-height:1.2}
.evlabel{color:var(--t2);font-size:12.5px;margin:0 0 4px}
.edgebig{font:500 84px/.95 var(--num);font-stretch:74%;letter-spacing:-.025em;color:var(--green)}
.edgebig.off{color:var(--t1)}   /* not above fair as shown (at the member's usual stake, after its fee): never green */
.edgerow{display:flex;align-items:flex-end;gap:18px;margin:0 0 22px}
.edgecap{color:var(--t2);margin:0 0 7px;font-size:13.5px;line-height:1.45;max-width:13em}
.edgecap .evl2{display:none}.edgecap:first-letter{text-transform:uppercase}
.callout{display:flex;gap:10px;padding:12px 14px;border-radius:14px;background:var(--amber-soft);margin:0 0 18px;font-size:13.5px;line-height:1.45}
.callout svg{width:16px;height:16px;flex:none;color:var(--amber);margin-top:2px}
.rotation{margin:0 0 20px;padding:13px 15px;border-radius:16px;background:var(--surface-2);border:1px solid var(--ln);font-size:13.5px;line-height:1.5}
.rotation .rh{margin:0 0 4px;font-weight:600}
.rotation ul{margin:0;padding-left:18px;color:var(--t2)}
.rotation li.thin{color:var(--t3)}
.rotation .news{margin:8px 0 0;color:var(--green)}
.rotation .inj{display:flex;gap:8px;margin:2px 0 6px;color:var(--t1)}.rotation .inj svg{width:15px;height:15px;flex:none;color:var(--amber);margin-top:3px}
h2{font:500 17px/1.3 var(--sans);letter-spacing:-.02em;margin:0 0 2px;color:var(--t1)}
.hint{color:var(--t2);font-size:13.5px;margin:0 0 16px;line-height:1.5}
table.math{width:100%;border-collapse:collapse;margin-top:8px}
.math td{padding:11px 0;border-bottom:1px solid var(--ln);vertical-align:baseline;font-size:14px}
.math td:last-child{text-align:right;font:600 17px/1 var(--num);font-stretch:80%;white-space:nowrap;padding-left:12px}
.math td .s{display:block;color:var(--t3);font-size:12.5px;margin-top:2px}
.math tr.total td{border-bottom:0;border-top:1px solid var(--ln2);font-weight:600;padding-top:13px}
.math tr.total td:last-child{color:var(--green);font-size:21px}
.math tr.total.off td:last-child{color:var(--t1)}
.size{margin:14px 0 0;color:var(--t3);font-size:13px}

.mid{display:flex;flex-direction:column;container-type:inline-size}
.readout{display:flex;align-items:baseline;gap:16px;flex-wrap:wrap;margin-bottom:4px}
.readout .p{font:500 54px/1 var(--num);font-stretch:74%;letter-spacing:-.02em}
.readout .t{color:var(--t2);flex:1;min-width:220px;font-size:14px;line-height:1.5}
.readout .t b{color:var(--t1);font-weight:600}
.stage{position:relative;flex:none;height:clamp(280px,min(34vw,56vh),580px);margin-top:6px;touch-action:none;user-select:none}
.stage svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.stage text{font-family:var(--sans)}
.stage .ax{font-family:var(--num);font-stretch:82%;font-weight:600}
.stage .handle{cursor:ew-resize}
.bars path{transform-box:fill-box;transform-origin:bottom;animation:grow .7s var(--ease) both}
@keyframes grow{from{transform:scaleY(0)}to{transform:none}}
.legend{display:flex;gap:16px;flex-wrap:wrap;color:var(--t2);font-size:13px;margin-top:10px}
.legend .drag{margin-left:auto;color:var(--t3)}
.legend i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px;vertical-align:-1px}
.tipbox{position:absolute;pointer-events:none;border-radius:12px;padding:7px 11px;font-size:12.5px;white-space:nowrap;opacity:0;transform:translate(-50%,-118%);transition:opacity .12s;z-index:2;
  background:var(--solid);color:var(--solid-ink)}

/* the player card, under the chart */
.form{flex:none;margin-top:18px;padding-top:16px;border-top:1px solid var(--ln)}
.formh{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin-bottom:10px}.formh .hint{margin:0}
.formgrid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:26px;align-items:end}
.avgs{display:grid;grid-template-columns:repeat(5,1fr);gap:6px}
.avgs div{padding:9px 0 8px;border-radius:12px;background:var(--surface-2);border:1px solid var(--ln);text-align:center}
.avgs b{display:block;font:600 19px/1.1 var(--num);font-stretch:78%;color:var(--t2)}
.avgs small{font:500 11px/1 var(--sans);color:var(--t3)}
.avgs .is-key{background:var(--solid);border-color:transparent}.avgs .is-key b{color:var(--solid-ink)}.avgs .is-key small{color:var(--solid-ink);opacity:.7}
.splits{margin:10px 0 0;color:var(--t2);font-size:12.5px;line-height:1.5}.splits b{font-weight:600;color:var(--t1)}.splits b.pos{color:var(--green)}
.l10h{display:flex;justify-content:space-between;gap:8px;color:var(--t2);font-size:12.5px;margin-bottom:8px}
.l10h .tl{display:flex;gap:10px}.l10h b{color:var(--t1);font-weight:600}
/* the strip and the minutes row under it share one left inset (the minutes row's label), so each game's minutes sits
   under its own bar */
.form{--fml:26px}
.fbars{position:relative;height:56px;display:flex;align-items:flex-end;gap:3px;margin-bottom:18px;padding-left:var(--fml)}
.fb{flex:1;max-width:34px;height:100%;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;position:relative}
.fb i{display:block;width:100%;border-radius:4px 4px 1px 1px;background:var(--off)}
.fb.hit i{background:linear-gradient(180deg,var(--win-top),var(--win-bot))}
.fb em{position:absolute;bottom:-16px;font:600 11px/1 var(--num);font-style:normal;font-stretch:85%;color:var(--t3)}
.fb.hit em{color:var(--t2)}
.fline{position:absolute;left:var(--fml);right:0;border-top:1px dashed var(--t3);z-index:1;pointer-events:none}
.fmins{position:relative;display:flex;gap:3px;margin-top:3px;padding-left:var(--fml)}
.fmins .fl{position:absolute;left:0;top:0;width:var(--fml);font:500 11px/1 var(--sans);color:var(--t3)}
.fmins .fm{flex:1;max-width:34px;text-align:center;font:600 11px/1 var(--num);font-stretch:85%;color:var(--t3)}
.fminline{margin:8px 0 0;color:var(--t2);font-size:12.5px;line-height:1.5}
/* the matchup block, under the player card: one sentence per fact */
.matchup{flex:none;margin-top:18px;padding-top:16px;border-top:1px solid var(--ln)}
.matchup h2{margin-bottom:6px}
.matchup.gamebox{margin-top:0;padding-top:0;border-top:0}     /* a game line's middle zone: the game, nothing above it */
.matchup p{margin:0 0 4px;color:var(--t2);font-size:13.5px;line-height:1.5;overflow-wrap:anywhere}
.matchup .fine{margin:6px 0 0}
/* the Fire block, at the top of the bet view's middle zone: the number and the band, the sentence, the parts */
.fireblock{flex:none;margin:0 0 18px;padding-bottom:14px;border-bottom:1px solid var(--ln)}
.fireh{display:flex;flex-wrap:wrap;align-items:center;gap:4px 12px}
.fireh h2{margin:0}
.fnum{display:inline-flex;align-items:center;gap:4px;font:600 26px/1 var(--num);font-stretch:78%;color:var(--fire)}
.fnum svg{width:17px;height:17px;flex:none}
.fband{font-size:13px;font-weight:600;color:var(--fire)}
.fsent{margin:6px 0 8px;color:var(--t2);font-size:13.5px;line-height:1.5;overflow-wrap:anywhere}
.fparts{width:100%;border-collapse:collapse;font-size:13px;line-height:1.4}
.fparts td{padding:5px 0;border-top:1px solid var(--ln);vertical-align:top;color:var(--t2)}
.fparts td:first-child{color:var(--t1);font-weight:500;padding-right:12px}
.fparts td .s{display:block;color:var(--t3);font-weight:400;font-size:12px;margin-top:1px;overflow-wrap:anywhere}
.fparts td:nth-child(2){padding-right:12px;overflow-wrap:anywhere}
.fparts td:last-child{text-align:right;white-space:nowrap;font-family:var(--num);font-stretch:85%;font-weight:600;color:var(--t1)}
.fparts td:last-child small{color:var(--t3);font-weight:500}
.fireblock .fine{margin:8px 0 0}
/* a phone: each part on two lines, its label and points across the top, the number behind it under them */
@media (max-width:560px){
  .fparts,.fparts tbody{display:block}
  .fparts tr{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:10px;row-gap:2px;padding:6px 0;border-top:1px solid var(--ln)}
  .fparts td{border:0;padding:0}
  .fparts td:first-child{grid-column:1;grid-row:1;padding:0}
  .fparts td:last-child{grid-column:2;grid-row:1}
  .fparts td:nth-child(2){grid-column:1/-1;grid-row:2;padding:0;font-size:12.5px}
}

/* the market: every book on one scale, from the home page's dot plot */
.market{display:grid;gap:2px}
.mrow{display:grid;grid-template-columns:96px 1fr 48px;align-items:center;gap:12px;height:36px}
.mrow .bk{display:flex;flex-direction:column;justify-content:center;min-width:0;font-size:13.5px;color:var(--t2)}
.mrow .bk .bn,.mrow .bk .age{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.1}
.mrow .bk .age{font-size:11px;font-weight:400;color:var(--t3)}.mrow .bk .age.stale{color:var(--amber)}   /* quote age */
.mrow .px{text-align:right;font:600 16px/1 var(--num);font-stretch:80%}
.mrow.off .px{color:var(--t3);font-weight:500}
.mrow.best .bk{color:var(--t1);font-weight:500}.mrow.best .px{color:var(--green)}
.mrow .trk2{position:relative;height:100%}
.mrow .trk2:before{content:"";position:absolute;left:0;right:0;top:50%;height:2px;margin-top:-1px;background:var(--ln)}
.mrow .dot2{position:absolute;top:50%;width:11px;height:11px;border-radius:50%;transform:translate(-50%,-50%);background:var(--t3);transition:left 1s var(--ease)}
.mrow.better .dot2{background:var(--green)}
.mrow.best .dot2{width:13px;height:13px;box-shadow:0 0 0 4px var(--green-soft)}
/* the offer short of fair once the member's usual stake counts its fee (web/stake.js): marked, never green */
.mrow.best.off .px{color:var(--t1)}.mrow.best.off .dot2{box-shadow:0 0 0 4px var(--ln)}
.fairline{position:absolute;top:-4px;bottom:-4px;border-left:1px dashed var(--t3)}
.mhead{height:22px}.mhead .trk2:before{display:none}
.fairlbl{position:absolute;bottom:2px;transform:translateX(-50%);font-size:12px;font-weight:600;color:var(--t2);white-space:nowrap}
.mscale{display:grid;grid-template-columns:96px minmax(0,1fr) 48px;gap:12px;color:var(--t3);font-size:12px;margin:6px 0 0}
.mscale span:nth-child(2){display:flex;justify-content:space-between;gap:6px;white-space:nowrap;overflow:hidden}
.facts{color:var(--t3);font-size:12.5px;line-height:1.5;margin:16px 0 0}
#mkt .worth{margin:0 0 12px;font-size:13.5px;line-height:1.45;color:var(--t1)}   /* the worst price still worth taking */
#mkt .stake{display:flex;align-items:center;gap:10px;color:var(--t2);font-size:13px}   /* the usual stake (web/stake.js) */
#mkt .stake input{width:112px;min-width:0;height:40px;padding:0 12px;border-radius:10px;border:1px solid var(--ln2);background:var(--surface);color:var(--t1);font:600 16px/1 var(--num);font-stretch:82%}
#mkt .stake input::placeholder{color:var(--t3)}
#mkt .stakec{margin:6px 0 12px;color:var(--t3);font-size:12.5px;line-height:1.45}
.method{display:block;margin-top:20px;padding:14px 16px;border-radius:16px;text-decoration:none;color:var(--t1);background:var(--surface-2);border:1px solid var(--ln);transition:border-color .2s}
.method:hover{border-color:var(--ln2)}
.method b{display:block;font-weight:600;margin-bottom:2px;font-size:14px}
.method span{color:var(--t2);font-size:13px}
.fine{color:var(--t3);font-size:12.5px;line-height:1.55;margin:16px 0 0}
/* prediction markets (members only): the same bet as contracts, each venue after its fee */
.mtabs{display:flex;max-width:100%;margin:0 0 16px}
.mtabs button{flex:1 1 auto;min-width:0;height:30px;padding:0 12px;font-size:13px;white-space:nowrap}
.venues{display:grid;gap:4px}
.vrow{display:grid;grid-template-columns:minmax(0,1fr) auto 56px;align-items:center;gap:12px;min-height:40px}
.vrow .bk{display:flex;align-items:center;gap:6px;min-width:0;font-size:13.5px;color:var(--t2)}
.vrow .vn{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.vrow .tag{flex:none;font-size:10.5px;padding:2px 6px}
.vrow .vc{display:flex;flex-direction:column;align-items:flex-end;gap:3px}
.vrow .vc b{font:600 16px/1 var(--num);font-stretch:80%;color:var(--t1)}
.vrow .vc small{font-size:11.5px;line-height:1.1;color:var(--t3);white-space:nowrap}
.vrow .px{text-align:right;font:600 16px/1 var(--num);font-stretch:80%}
.vrow.better .px{color:var(--green)}.vrow.off .px{color:var(--t3);font-weight:500}
.pmnote{color:var(--t2);font-size:13.5px;line-height:1.5;margin:4px 0 0}
.pmgame{margin-top:16px}.pmgame .rh{font-size:12.5px;font-weight:600;color:var(--t2);margin:0 0 6px}
.pmgame ul,.pmrules ul{list-style:none;margin:0;padding:0;display:grid;gap:6px;font-size:12.5px;line-height:1.45;color:var(--t2);overflow-wrap:anywhere}
.pmrules{margin-top:14px}.pmrules ul{margin-top:8px;color:var(--t3)}
.pmrules summary{cursor:pointer;font-size:12.5px;font-weight:600;color:var(--t2)}
.pmgame b,.pmrules b{color:var(--t1);font-weight:600}
.side{display:flex;flex-direction:column}
.side .foot{margin-top:auto}

.strip{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:none;padding:1px}
.strip::-webkit-scrollbar{display:none}
.chip{flex:none;width:240px;padding:10px 12px;border-radius:16px;cursor:pointer;scroll-snap-align:center;text-align:left;display:flex;gap:10px;align-items:center;color:var(--t1);
  background:var(--surface);border:1px solid var(--ln);transition:border-color .2s}
.chip:hover{border-color:var(--ln2)}
.chip.is-on{background:var(--solid);color:var(--solid-ink);border-color:transparent}
.chip.is-on .b{color:inherit;opacity:.7}.chip.is-on .pos{color:var(--pos-d)}
:root[data-theme="dark"] .chip.is-on .pos{color:var(--pos)}
.chip .c{min-width:0;flex:1;display:block}
.chip .a{display:flex;justify-content:space-between;font-weight:500;font-size:13.5px}
.chip .a span:first-child{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-right:8px}
.chip .a .pos{font:600 15px/1 var(--num);font-stretch:80%}
.chip .b{display:block;color:var(--t3);font-size:12px;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* sheets: Alerts, Your bets, Save, Your state */
.sheet{position:fixed;inset:0;z-index:70;display:none;place-items:center;padding:16px;background:color-mix(in srgb,var(--page) 55%,transparent);
  -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
.sheet.is-open{display:grid}
.sheetcard{width:min(470px,100%);max-height:calc(100dvh - 32px);overflow:auto;padding:24px;border-radius:var(--r-card);background:var(--surface);border:1px solid var(--ln);
  box-shadow:0 40px 80px -40px rgba(13,19,32,.4);animation:rise .35s var(--ease) both}
@keyframes rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.sheetcard.mine{width:min(640px,100%)}
.sheethead{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;margin-bottom:12px}
.sheethead h2{font-size:22px;letter-spacing:-.03em;margin-bottom:4px}
.field{display:grid;gap:6px;margin-bottom:12px;color:var(--t2);font-size:13px}
.field select{width:100%}
.field input{height:44px;border-radius:14px;border:1px solid var(--ln2);background:var(--surface);padding:0 14px;font:600 18px/1 var(--num);font-stretch:82%;color:var(--t1)}
.fieldrow{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.towin{margin:2px 0 6px;color:var(--green);font-weight:600;min-height:20px}
.err{margin:0 0 10px;color:var(--amber);font-size:13px;min-height:18px}
/* the save confirmation's one line: the member's price against fair, green only when it is value */
.moment{margin:0 0 18px;color:var(--t1);font-size:15px;line-height:1.55;overflow-wrap:anywhere}.moment.pos{color:var(--green);font-weight:600}
.sheetcard .btn.betnow{width:100%;justify-content:center;margin:0}
.minesum{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:8px}
.minesum div{padding:13px 15px;border-radius:16px;background:var(--surface-2);border:1px solid var(--ln)}
.minesum small{display:block;color:var(--t2);font-size:12.5px}.minesum b{font:600 26px/1.25 var(--num);font-stretch:76%}
.minelist h3{font:500 13px/1 var(--sans);color:var(--t2);margin:18px 0 4px}
/* the Alerts panel's web push control (push.js): one sentence and, where there is something to do, one button */
.pushrow{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px 14px;margin:0 0 8px;padding:12px 14px 12px 16px;
  border-radius:16px;background:var(--surface-2);border:1px solid var(--ln);font-size:13.5px;line-height:1.5}
.pushrow[hidden]{display:none}
.pushrow p{margin:0;flex:1 1 220px;min-width:0;color:var(--t2);overflow-wrap:anywhere}
.pushrow .btn{flex:none;height:36px}
.betitem{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:13px 4px;border-bottom:1px solid var(--ln)}
.betitem:last-child{border-bottom:0}
.betitem b{font-weight:500}
.alertitem{width:100%;text-align:left;font:inherit;color:inherit;background:none;border:0;border-bottom:1px solid var(--ln);cursor:pointer;border-radius:0;transition:background .2s}
.alertitem:hover{background:var(--hover)}
.alertitem .who2{display:flex;align-items:center;gap:12px;min-width:0}
.alerttags{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end;flex:none}
.muted{color:var(--t2)}
/* Injury Alpha's card in the Alerts panel (board-core.js injuryCard): the news in one line, then each book still on its
   pre-news line, stacked so a phone never scrolls sideways */
.injcard{margin:6px 0 10px;padding:14px 16px;border-radius:16px;background:var(--surface-2);border:1px solid var(--ln);min-width:0}
.injhead{margin:0;font-size:14px;line-height:1.5;overflow-wrap:anywhere}
.injhead b{font-weight:600}
.injrows{list-style:none;margin:10px 0 0;padding:0}
.injrows li{border-top:1px solid var(--ln)}
.injrow{display:flex;flex-direction:row;flex-wrap:wrap;align-items:baseline;gap:4px 14px;padding:10px 2px;min-width:0;
  font-size:13.5px;line-height:1.45}
.injrow.go{width:100%;text-align:left;font:inherit;font-size:13.5px;color:inherit;background:none;border:0;border-radius:8px;
  cursor:pointer;transition:background .2s}
.injrow.go:hover{background:var(--hover)}
.injwho{flex:1 1 200px;min-width:0;overflow-wrap:anywhere}.injwho b{font-weight:500}
.injnums{display:flex;flex-wrap:wrap;gap:2px 12px;font-variant-numeric:tabular-nums}
.injnums .pos{font-weight:600}
.injmore{flex:1 0 100%;color:var(--t2);font-size:12.5px}
.injfoot{margin:8px 0 0;color:var(--t3);font-size:12px;line-height:1.45}
.toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,16px);padding:11px 20px;border-radius:999px;font-weight:500;font-size:14px;opacity:0;transition:all .3s var(--ease);z-index:80;pointer-events:none;
  background:var(--solid);color:var(--solid-ink)}
.toast.is-on{opacity:1;transform:translate(-50%,0)}
::view-transition-group(focus-card){animation-duration:.42s;animation-timing-function:cubic-bezier(.2,.8,.2,1)}
::view-transition-old(focus-card),::view-transition-new(focus-card){height:100%;object-fit:cover;overflow:hidden}

/* motion: reveal on load, from the home page */
.rv{opacity:0;transform:translateY(14px);transition:opacity .6s var(--ease),transform .6s var(--ease)}
.rv.is-in{opacity:1;transform:none}

/* ---------- the bet view fits the screen: on shorter laptops type and spacing scale with height, no pane scrolls ---------- */
@media (min-width:821px) and (max-height:1000px){
  .fbody>section{padding:clamp(18px,2.6vh,28px)}
  .fwho{margin-bottom:clamp(10px,1.8vh,22px)}.fwho .badge{width:42px;height:42px}
  .call{font-size:clamp(28px,4.2vh,42px);margin-bottom:6px}.call.long{font-size:clamp(25px,3.6vh,36px)}
  .offerrow{margin-bottom:clamp(10px,2vh,22px)}.btn.betnow{height:clamp(36px,4.4vh,42px)}.altbook{margin-bottom:clamp(10px,2vh,22px)}
  /* a venue headline's two price rows: their notes repeat the lines above (the payout and the best sportsbook) */
  .math tr.vprice .s,.math tr.vbook .s{display:none}.offerrow.vhead{margin-bottom:6px}.pays{margin-top:3px}
  .altbook,.pays{font-size:12.5px}.vhead .btn.betnow{min-height:clamp(36px,4.4vh,42px);padding-top:8px;padding-bottom:8px}
  .edgebig{font-size:clamp(50px,7.4vh,84px)}.edgerow{margin-bottom:clamp(10px,2vh,22px)}
  .dense .call{font-size:clamp(26px,3.7vh,38px)}.dense .edgebig{font-size:clamp(44px,6.4vh,72px)}
  .dense .math td{padding:clamp(4px,.6vh,9px) 0}.dense .size{display:none}.dense .rotation{font-size:13px;line-height:1.45}
  .callout,.rotation{margin-bottom:clamp(8px,1.4vh,18px);padding:clamp(8px,1.2vh,13px) 14px}
  .math td{padding:clamp(5px,.95vh,11px) 0}.math tr.total td{padding-top:clamp(7px,1.1vh,13px)}.size{margin-top:8px}
  .hint{margin-bottom:clamp(6px,1.3vh,16px)}.readout .p{font-size:clamp(38px,5.6vh,54px)}
  .mrow{height:clamp(27px,3.6vh,36px)}.method{margin-top:12px;padding:10px 14px}.fine{margin-top:10px}
  .form,.matchup{margin-top:clamp(10px,1.6vh,18px);padding-top:clamp(10px,1.6vh,16px)}
}
/* a laptop's height: the Fire parts keep one line each (each part's words stay as the label's title), so the chart
   keeps its room under the block */
@media (min-width:821px) and (max-height:960px){.fparts td .s{display:none}}
@media (min-width:821px) and (max-height:820px){
  .focus{padding:10px;gap:10px}
  .ticks{padding:8px 16px 0}.fbar{padding:6px 8px 8px 16px}.fbar .btn{height:36px}.fbar .btn.icon{width:36px}
  .chip{padding:7px 10px}.chip .a{font-size:13px}.chip .b{font-size:11.5px}
  .evlabel{display:none}.edgecap .evl2{display:inline}
  .math td{font-size:13.5px}.math td .s{font-size:12px;margin-top:0}.math tr:nth-child(2) .s,.math tr:nth-child(3) .s{display:none}.math tr.vbook+tr .s{display:none}.math td:last-child{font-size:16px}.size{display:none}
  .mid>.hint{display:none}.readout .t{font-size:13px}
  .mid .stage{min-height:120px}
  .fparts td{padding:3px 0}.fireblock{margin-bottom:10px;padding-bottom:10px}.fsent{margin:4px 0 6px}
  .avgs div{padding:6px 0 5px}.avgs b{font-size:16px}.fbars{height:40px}.splits{margin-top:6px}
  .mrow{height:28px}.method span{display:none}.facts{margin-top:10px}
}
@media (min-width:821px) and (max-height:700px){
  .fwho{margin-bottom:8px}.fwho .badge{width:36px;height:36px;border-radius:11px}.fwho .n{font-size:15.5px}
  .call,.dense .call{font-size:27px}.call.long{font-size:25px}.offer b{font-size:22px}.btn.betnow{height:34px}
  .edgebig,.dense .edgebig{font-size:46px}.math td{padding:4px 0}.math td .s{display:none}
  .form,.matchup{margin-top:8px;padding-top:8px}.formh{margin-bottom:6px}.matchup p{font-size:12.5px}
  .focus{grid-template-rows:auto minmax(0,1fr)}.strip{display:none}   /* the shortest laptops: flip with the arrows and the progress ticks */
}
@media (min-width:821px) and (max-height:720px){
  .fwho .sub{display:none}.offerrow,.edgerow,.altbook{margin-bottom:10px}.offerrow.vhead{margin-bottom:6px}
  .dense .rotation{padding:8px 12px;font-size:12.5px;margin-bottom:8px}.dense .math td .s{display:none}.dense h2{font-size:15.5px}
  .dense .rotation .inj{margin-bottom:3px}.dense .rotation .news{margin-top:4px}.dense .math{margin-top:2px}
}

/* ---------- responsive ---------- */
@media (min-width:1181px){.mid .stage{flex:1 1 0;height:auto;min-height:170px;max-height:580px}}
@container (max-width:520px){.formgrid{gap:14px}.avgs{gap:4px}.avgs b{font-size:16px}.readout .p{font-size:42px}}
/* the toolbar keeps one row: the tools' labels give way first, and once the row must wrap the tools keep to the right */
/* once a tool is only its icon, its count floats on its corner, so a count of 101 is never cut to "10" */
@media (max-width:1366px){.tools .label{display:none}button.ctl.tool{width:44px;padding:0;justify-content:center}
  .tool .count{position:absolute;top:-5px;right:-5px;min-width:18px;height:18px;padding:0 4px;font-size:10.5px;line-height:18px;border:1px solid var(--page)}}
@media (max-width:1180px){.controls{flex-wrap:wrap}.filters{order:3;flex-basis:100%;margin-left:0}.tools{margin-left:auto}}
@media (max-width:1280px){.cols{grid-template-columns:minmax(220px,2fr) minmax(160px,1.5fr) minmax(110px,1fr) 80px 80px 40px}.stat{padding:0 18px}}
@media (max-width:1180px){
  .ahead{flex-direction:column;align-items:stretch}.stats{width:100%}.stat{flex:1}
  .fbody{grid-template-columns:minmax(300px,360px) minmax(0,1fr);overflow-y:auto;align-content:start}.fbody>section{overflow:visible;min-height:auto}
  .fbody .side{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:0 40px}
}
/* the bet view's top bar: with the parlay button and a venue's longer Save label there is no room for the
   crumb's tag on a narrow laptop (it was clipped to 8px at 900px); the row under it carries the tag anyway */
@media (max-width:1024px){.crumb .tag{display:none}}
@media (max-width:1024px){.cols{grid-template-columns:minmax(200px,2fr) minmax(150px,1.5fr) 80px 80px 40px}.cols .book{display:none}
  .vchip.m{display:inline-flex}}
@media (max-width:820px){
  .tools .label{display:none}
  .arena .inner{padding-top:104px;padding-bottom:52px}
  .stats{display:grid;grid-template-columns:1fr 1fr;gap:16px 0;padding:16px 0}.stat{padding:0 18px}.stat:nth-child(3){border-left:0}
  .stat .v{font-size:30px}.stat .l{white-space:normal;line-height:1.3}   /* a phone's half-width cell: labels wrap */
  .slate{grid-auto-columns:minmax(196px,1fr);margin-top:20px;margin-right:calc(-1 * var(--gut));padding-right:var(--gut)}
  .filters{display:grid;grid-template-columns:1fr 1fr 1fr}.search{grid-column:1/-1}.search input{width:100%}
  .filters .ctl{width:100%}select.ctl{padding:0 30px 0 14px}.field-pill.select:after{right:14px}button.ctl{justify-content:center;padding:0 12px}
  .table{border-radius:var(--r-pane)}
  .thead{display:none}
  .row.cols{display:grid;grid-template-columns:40px minmax(0,1fr) auto;grid-template-areas:"b w e" "b t p" "b c c";column-gap:12px;row-gap:6px;padding:14px 16px;align-items:start}
  .row .who{display:contents}.row .who>.badge,.row .who>.pair{grid-area:b}.row .who>.wtext{grid-area:w;min-width:0}
  .row .nosave{display:none}
  .segs{display:flex;width:100%}.segs button{flex:1}      /* Props | Game lines: a row of its own, the full width */
  /* the bet cell dissolves into the grid: its text beside the price, its context line on a row of its own under
     both, so the line has the whole width (a row without one leaves that row empty) */
  .row .bet{display:contents}.row .bet .b1{grid-area:t;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.row .bet .sub{display:none}
  .row .bet .ctx{grid-area:c;min-width:0;margin-top:-2px}
  /* a row with a prediction-market chip gives it a line of its own under the context, the whole width */
  .row.cols.has-vc{grid-template-areas:"b w e" "b t p" "b c c" "b v v"}
  .row .bet .vchip.m{grid-area:v;justify-self:start;margin-top:0}
  .row .edgec{grid-area:e;align-self:center}.row .pricec{grid-area:p;display:flex;align-items:baseline;gap:6px}
  .row .pricec .sub{display:inline;margin:0}.row .price{font-size:17px}.row .edge{font-size:21px}
  .row .book,.row .trk{display:none}
  .nm{white-space:normal}
  .statusbar{position:static;padding:14px 16px;font-size:12px}
  .focus{grid-template-rows:auto minmax(0,1fr);padding:8px;gap:8px}
  .fbody{display:block;overflow-y:auto;border-radius:var(--r-pane)}.fbody>section{padding:22px 18px;overflow:visible;margin-bottom:8px}
  .fbody .side{display:block}
  .call{font-size:34px}.call.long{font-size:30px}.edgebig{font-size:66px}
  .stage{height:250px}.formgrid{grid-template-columns:1fr;gap:16px}
  .strip,.fbar .acts .wide,.crumb .mu,.crumb .tag{display:none}
  .fbar{padding-left:16px}
  .sheet{place-items:end center;padding:8px}.sheetcard{border-radius:24px 24px 18px 18px;padding:20px}
  .alertitem{flex-direction:column;align-items:flex-start;gap:8px}.alerttags{justify-content:flex-start;padding-left:38px}
  footer.sitefoot{margin:0 12px 12px}
}
/* the narrowest phones: the row's context in its short form ("4/5 · 7/10 · 31 min"), the season left to its title */
@media (max-width:479px){.ctx .of,.ctx .ssn{display:none}.ctx .sl{display:inline}
  .row.game .ctx{font-size:12px}}     /* a total's two pairs of three-digit numbers, on one line at 320px */
@media (max-width:420px){.fbar.vsave .crumb,.fbar.vsave #ftrack svg{display:none}
  .filters{grid-template-columns:1fr 1fr}.filters .field-pill:last-child{grid-column:1/-1}.stat{padding:0 14px}.minesum b{font-size:21px}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.rv{opacity:1;transform:none}}
@media (prefers-reduced-transparency:reduce){
  .stats,.tile,.statusbar,.focus,.sheet{-webkit-backdrop-filter:none;backdrop-filter:none}
  .stats,.tile{background:#0B1120}
  .statusbar{background:var(--surface-2)}.focus{background:var(--page)}.sheet{background:color-mix(in srgb,var(--page) 92%,transparent)}}
/* "Add to parlay" in the bet view (web/parlay.js's tray): pressed once the bet is in the parlay; its icon alone on a
   phone, so the header keeps one line */
#fparlay[aria-pressed="true"]{background:var(--t1);color:var(--surface);border-color:var(--t1)}
@media (max-width:560px){#fparlay .t{display:none}#fparlay{width:36px;padding:0;justify-content:center}}
body.has-ptray .statusbar{bottom:80px}