/* ===========================================================================
   gameday.css: the featured-game template (Ross, Mary, Igor; Jay 2026-09-23).
   The matchup page shows the plans and, after the final, what each plan did and a
   link to the result. The result page carries the final, the both-sides story, the
   receipts, the box score and the timeline. Tokens only; light default, dark via
   [data-theme]. Numbers are tabular and reserve their width, so nothing moves.
   =========================================================================== */

/* ---- the fee asterisk (same as the home cards) ---- */
.fx{position:relative;z-index:2;display:inline-block;box-sizing:border-box;min-width:44px;min-height:44px;padding:0;
  margin:-16px -19px -16px -19px;border:0;background:none;color:var(--ink-3);font:600 .58em/1 var(--sans);vertical-align:super;
  opacity:.85;text-align:center;cursor:help}
.fx::after{content:attr(data-tip);position:absolute;z-index:5;bottom:calc(100% - 6px);left:50%;transform:translateX(-50%);
  width:max-content;max-width:220px;padding:7px 9px;border-radius:7px;background:var(--ink);color:var(--paper);
  font:600 11.5px/1.35 var(--sans);letter-spacing:0;text-transform:none;white-space:normal;text-align:left;
  box-shadow:0 8px 20px -8px rgba(0,0,0,.45);display:none;pointer-events:none}
.fx:hover::after,.fx:focus::after{display:block}
.fx:focus-visible{outline:2px solid var(--brand);outline-offset:-13px;border-radius:6px}

/* ---- matchup page: the settled price box ---- */
.pz-nums--done{grid-template-columns:1fr 1fr !important}
.pz-nums--done li.is-key{grid-column:1/-1}
.pz-nums--done li.is-key .v{display:flex;flex-wrap:wrap;align-items:baseline;white-space:nowrap;column-gap:0;row-gap:4px}
.pz-nums--done .pz-net{color:var(--gain)}
.pz-nums--done .s .num,.pz-nums--done .v{font-variant-numeric:tabular-nums}
.pz-open--win{background:var(--gain-soft);color:var(--gain);min-width:6.9em;justify-content:center;text-align:center}
.pz-at--done{display:block;font:500 12.5px/1.5 var(--sans);color:var(--ink-3)}
@media (max-width:620px){.pz-nums--done .pz-sep{display:none}.pz-nums--done li.is-key .v{flex-direction:column;align-items:flex-start}}

/* ---- matchup page: results teaser ---- */
.rt{margin-top:18px}
.rt .ar-final-tag{background:var(--gain);color:#fff}
.rt-btn{justify-self:end;min-height:44px}
@media (max-width:760px){.rt-btn{justify-self:stretch;text-align:center}}

/* ---- result page: scoreboard ---- */
.sb{margin-top:22px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:18px 28px;align-items:center;
  padding:18px 20px;border-radius:var(--r-lg);background:var(--paper);border:1px solid var(--line);border-top:2px solid var(--brand);
  box-shadow:var(--shadow)}
.sb-tag{display:inline-block;font:800 11px/1 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--paper);background:var(--ink);
  padding:6px 8px;border-radius:4px;margin-bottom:10px}
.sb-score{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin:0;padding:4px 0;border-bottom:1px solid var(--line)}
.sb-score:last-of-type{border-bottom:0}
.sb-team{font:700 17px/1.3 var(--sans);color:var(--ink-2)}
.sb-score b{font:800 40px/1 var(--cond);color:var(--ink-2);font-variant-numeric:tabular-nums;min-width:2.2ch;text-align:right}
.sb-score--win .sb-team{color:var(--ink);font-weight:800}
.sb-score--win b{color:var(--ink)}
.sb-at{margin:10px 0 0;font:500 12.5px/1.4 var(--sans);color:var(--ink-3)}
.ls{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
.ls th,.ls td{padding:10px 6px;text-align:center;font:600 15px/1 var(--sans);color:var(--ink-2);border-bottom:1px solid var(--line);min-width:2.6ch}
.ls thead th{font:700 11px/1 var(--sans);letter-spacing:.08em;color:var(--ink-3);text-transform:uppercase}
.ls tbody th{text-align:left;font:700 14px/1.2 var(--sans);color:var(--ink-2);white-space:nowrap}
.ls .ls-t{font:800 22px/1 var(--cond);color:var(--ink-2)}
.ls .ls-win th,.ls .ls-win td{color:var(--ink);font-weight:800}
@media (max-width:760px){.sb{grid-template-columns:1fr}.ls tbody th{font-size:13px}}

/* ---- result page: both sides ---- */
.bc{padding:20px 22px;border-radius:var(--r-lg);background:var(--paper);border:1px solid var(--line-2);border-top:2px solid var(--brand);box-shadow:var(--shadow)}
.bc-h{margin:0 0 16px;font:800 28px/1.05 var(--cond);text-transform:uppercase;color:var(--ink)}
.bc-grid--vs{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:18px;align-items:stretch}
.bc-vs{align-self:center;font:800 12px/1 var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);
  background:var(--chip);border-radius:999px;padding:8px 10px}
.bc-col{display:flex;flex-direction:column;gap:6px;min-width:0}
.bc-who{display:flex;align-items:center;gap:10px;color:var(--ink);text-decoration:none;min-height:44px}
.bc-who img{border-radius:50%;flex:none}
.bc-who b{display:block;font:800 16px/1.2 var(--sans)}
.bc-who small{display:block;font:500 12.5px/1.3 var(--sans);color:var(--ink-3)}
.bc-mkt{margin:4px 0 0;font:600 14px/1.35 var(--sans);color:var(--ink-2)}
.bc-line{margin:0;font:700 15px/1.35 var(--sans);color:var(--ink)}
.bc-net{margin:0;font:800 34px/1 var(--cond);color:var(--gain);font-variant-numeric:tabular-nums}
.bc-net small{font:600 13px/1 var(--sans);color:var(--ink-3)}
.bc-held{margin:0;font:500 13px/1.4 var(--sans);color:var(--ink-3)}
.bc-pill{align-self:flex-start;margin-top:4px;display:inline-flex;align-items:center;min-height:26px;padding:0 10px;border-radius:999px;
  font:800 11px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase}
.bc-pill--win{background:var(--gain-soft);color:var(--gain)}
.bc-pill--miss{background:var(--chip);color:var(--ink-2)}
.bc-p{margin:18px 0 0;padding-top:14px;border-top:1px dashed var(--line-2);font:500 15px/1.55 var(--sans);color:var(--ink-2)}
@media (max-width:620px){.bc-grid--vs{grid-template-columns:1fr}.bc-vs{justify-self:start}}

/* ---- result page: receipts ---- */
.rc-lede{margin:6px 0 16px;font:500 14.5px/1.55 var(--sans);color:var(--ink-2);max-width:68ch}
.rc-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));gap:16px}
.rc{padding:16px 18px;border-radius:var(--r-lg);background:var(--paper);border:1px solid var(--line);box-shadow:var(--shadow);min-width:0}
.rc-hd{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:10px;align-items:center}
.rc-av img{border-radius:50%;display:block}
.rc-t{margin:0;font:800 16px/1.2 var(--sans)}
.rc-t a{color:var(--ink);text-decoration:underline;text-underline-offset:3px}
.rc-m{margin:3px 0 0;font:600 13px/1.3 var(--sans);color:var(--ink-2)}
.rc-dl{margin:10px 0 0;display:grid;gap:0}
.rc-dl>div{display:grid;grid-template-columns:minmax(0,9em) minmax(0,1fr);gap:10px;padding:7px 0;border-bottom:1px solid var(--line)}
.rc-dl>div:last-child{border-bottom:0}
.rc-dl dt{font:600 12.5px/1.4 var(--sans);color:var(--ink-3)}
.rc-dl dd{margin:0;font:600 13.5px/1.4 var(--sans);color:var(--ink);text-align:right;font-variant-numeric:tabular-nums}
.rc-dl .rc-net{border-top:1px dashed var(--line-2)}
.rc-dl .rc-net dt{color:var(--ink);font-weight:800}
.rc-dl .rc-net dd{font:800 20px/1.1 var(--cond);color:var(--gain)}
.rc-dl .rc-dim dd{color:var(--ink-2);font-weight:500}

/* ---- sparkline (Mary C3): colours through classes, never presentation attributes ---- */
.sp-fig{margin:12px 0 0}
.sp{display:block;width:100%;aspect-ratio:320/88;height:auto;overflow:visible}
.sp *{vector-effect:non-scaling-stroke}
.sp-base{stroke:var(--line);stroke-width:1}
.sp-tip{stroke:var(--line-2);stroke-width:1;stroke-dasharray:2 3}
.sp-sell{stroke:var(--line-3);stroke-width:1.5;stroke-dasharray:4 3}
.sp-path{fill:none;stroke:var(--ink-2);stroke-width:2;stroke-linejoin:round;stroke-linecap:round}
.sp-held{fill:none;stroke:var(--ink-3);stroke-width:1.5;stroke-dasharray:3 3}
.sp-wick{stroke:var(--ink-3);stroke-width:1.5}
.sp-entry{fill:var(--paper);stroke:var(--ink);stroke-width:2}
.sp-fill{fill:var(--gain);stroke:var(--paper);stroke-width:2}
.sp-settle{fill:var(--ink-3)}
.sp-peak{fill:var(--paper);stroke:var(--ink-3);stroke-width:1.5}
.sp-lab{font:600 9px/1 var(--sans);fill:var(--ink-3)}
.sp-cap{margin:6px 0 0;font:500 12px/1.45 var(--sans);color:var(--ink-3)}

/* ---- box score (Mary C4) ---- */
.bs-wrap{margin:14px 0 6px;overflow-x:auto;border:1px solid var(--line);border-radius:12px;background:var(--paper)}
.bs-wrap:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
.bs{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums;min-width:640px}
.bs caption{caption-side:top;text-align:left;padding:12px 14px 6px;font:800 16px/1.2 var(--sans);color:var(--ink)}
.bs caption span{font:500 12.5px/1 var(--sans);color:var(--ink-3);margin-left:6px}
.bs th,.bs td{padding:9px 8px;border-bottom:1px solid var(--line);font:500 13.5px/1.2 var(--sans);color:var(--ink-2);text-align:right;white-space:nowrap;min-width:3ch}
.bs thead th{font:700 11px/1 var(--sans);letter-spacing:.06em;color:var(--ink-3);text-transform:uppercase}
.bs th[scope=row],.bs thead th:first-child{position:sticky;left:0;z-index:1;background:var(--paper);box-shadow:1px 0 0 var(--line);
  text-align:left;width:9.5em;min-width:9.5em;white-space:normal;color:var(--ink);font-weight:700}
.bs .w5{min-width:5ch}
.bs .bs-pts{color:var(--ink);font-weight:800}
.bs .bs-grp th{position:static;background:var(--surface-2);font:700 11px/1 var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);text-align:left;box-shadow:none}
.bs tfoot th,.bs tfoot td{font-weight:800;color:var(--ink);border-bottom:0;background:var(--surface-2)}
.bs tfoot th{background:var(--surface-2)}
.bs-dnp{margin:0 0 18px}
@media (max-width:620px){.bs th[scope=row],.bs thead th:first-child{width:8em;min-width:8em}}

/* ---- team stats (Mary C5) ---- */
.ts-h{margin:26px 0 8px;font:800 20px/1.1 var(--cond);text-transform:uppercase;color:var(--ink)}
.ts{border:1px solid var(--line);border-radius:12px;background:var(--paper);padding:6px 14px}
.ts-hd,.ts-list li{display:grid;grid-template-columns:minmax(0,1fr) minmax(8.5em,1.4fr) minmax(0,1fr);align-items:center;gap:10px}
.ts-hd{margin:0;padding:8px 0;font:800 12px/1 var(--sans);letter-spacing:.08em;color:var(--ink-3);border-bottom:1px solid var(--line)}
.ts-hd span:last-child,.ts-list li b:last-child{text-align:right}
.ts-list{list-style:none;margin:0;padding:0}
.ts-list li{padding:9px 0;border-bottom:1px solid var(--line)}
.ts-list li:last-child{border-bottom:0}
.ts-list span{text-align:center;font:600 13px/1.3 var(--sans);color:var(--ink-3)}
.ts-list b{font:600 16px/1 var(--sans);color:var(--ink-2);font-variant-numeric:tabular-nums}
.ts-list b.ts-lead{color:var(--ink);font-weight:800}

/* ---- timeline (Mary C6) ---- */
.tl{list-style:none;margin:6px 0 0;padding:0;position:relative}
.tl li{display:grid;grid-template-columns:minmax(0,11.5em) minmax(0,1fr);gap:14px;padding:9px 0 9px 20px;position:relative}
.tl li::before{content:"";position:absolute;left:4px;top:0;bottom:0;width:2px;background:var(--line-2)}
.tl li::after{content:"";position:absolute;left:0;top:14px;width:10px;height:10px;border-radius:50%;background:var(--ink-3);box-shadow:0 0 0 3px var(--bg)}
.tl li.tl-fill::after{background:var(--gain)}
.tl time{font:600 13px/1.4 var(--sans);color:var(--ink-3);font-variant-numeric:tabular-nums;white-space:nowrap}
.tl span{font:600 14.5px/1.4 var(--sans);color:var(--ink)}
@media (max-width:620px){.tl li{grid-template-columns:1fr;gap:2px}}

.gm-moments{margin:8px 0 0;padding-left:1.2em}
.gm-moments li{margin:4px 0;font:500 15px/1.55 var(--sans);color:var(--ink-2)}