/* Fungo Labs theme — ESPN x The Athletic hybrid. See notes/ux-guide.html for the source spec. */
:root{
  --header:#14171C;
  --header-raised:#1E2229;
  --header-hairline:#2C313A;
  --paper:#FAF9F6;
  --surface:#FFFFFF;
  --hairline:#E6E3DC;
  --ink:#1B1E24;
  --ice:#6B7280;
  --red:#C8272C;
  --red-tint:rgba(200,39,44,0.08);
  --blue:#2F5FA8;
  --blue-tint:rgba(47,95,168,0.08);
  --radius-sm:8px;
  --radius-md:14px;
  --radius-lg:20px;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;}
html{-webkit-text-size-adjust:100%;}
html,body{margin:0;padding:0;background:var(--paper);color:var(--ink);font-family:'Source Serif 4',serif;}
/* Short pages: main grows to fill the viewport so the footer sits at the bottom. */
body{min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;}
.site-main{flex:1 0 auto;}
.sans{font-family:'Inter',sans-serif;}
.mono{font-family:'JetBrains Mono',monospace;}
a{color:inherit;text-decoration:none;touch-action:manipulation;}
img{max-width:100%;display:block;}
button{font-family:inherit;touch-action:manipulation;}

/* ---------- HEADER / TICKER / NAV ---------- */
.header-zone{background:var(--header);color:#EDEEF0;}

.ticker-band{background:var(--paper);border-top:1px solid var(--header-hairline);border-bottom:1px solid var(--hairline);}
/* No games: drop the whole band (and its line). It stays in the DOM so the 10s
   htmx refresh can still bring it back once games show up. */
.ticker-band:not(:has(.score-card)){display:none;}
.ticker-wrap{overflow:hidden;white-space:nowrap;min-width:0;cursor:grab;user-select:none;touch-action:pan-y;max-width:1280px;margin:0 auto;padding:10px 32px 6px;-webkit-mask-image:linear-gradient(to right,transparent 0,#000 40px,#000 calc(100% - 40px),transparent 100%);mask-image:linear-gradient(to right,transparent 0,#000 40px,#000 calc(100% - 40px),transparent 100%);}
.ticker-wrap, .ticker-wrap *{-webkit-user-drag:none;user-drag:none;}
.ticker-wrap.dragging{cursor:grabbing;}
.ticker-inner{display:inline-flex;align-items:flex-start;gap:10px;margin-right:10px;will-change:transform;}
.ticker-divider{align-self:stretch;width:2px;border-radius:1px;background:var(--ice);opacity:0.4;flex-shrink:0;}
/* Few enough games to fit at once: no loop, no drag - just center the cards (see ticker-carousel.js). */
.ticker-wrap.is-static{text-align:center;cursor:default;-webkit-mask-image:none;mask-image:none;}
.ticker-wrap.is-static .ticker-inner{margin-right:0;transform:none !important;}
.ticker-wrap.is-static .ticker-divider{display:none;}
.score-card{display:inline-flex;flex-direction:column;gap:4px;width:100px;background:#FFFFFF;border:1px solid var(--hairline);border-radius:var(--radius-sm);padding:8px 10px;font-family:'Inter',sans-serif;cursor:default;white-space:nowrap;vertical-align:top;}
.score-card.is-live{border-color:rgba(200,39,44,0.55);box-shadow:0 0 0 1px rgba(200,39,44,0.12),0 0 12px rgba(200,39,44,0.2);}
.score-card-team{display:flex;align-items:center;gap:6px;}
.score-card-logo{width:18px;height:18px;object-fit:contain;flex-shrink:0;}
.score-card-abbr{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;font-weight:700;font-size:11.5px;text-transform:uppercase;color:var(--ink);}
.score-card-score{font-family:'JetBrains Mono',monospace;font-weight:700;font-size:13px;color:var(--ink);}
.score-card-score.dim{color:var(--ice);}
.score-card-status{display:flex;align-items:center;gap:4px;margin-top:2px;padding-top:4px;border-top:1px solid var(--hairline);font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--ice);}
.score-card-arrow{font-size:8px;line-height:1;color:var(--red);}

nav.mainnav{display:flex;align-items:center;gap:24px;padding:14px 32px;position:sticky;top:0;background:rgba(20,23,28,0.95);backdrop-filter:blur(6px);z-index:10;}
.nav-left{display:flex;align-items:center;gap:18px;flex-shrink:0;}
.logo{font-family:'Montserrat',sans-serif;font-weight:800;font-size:22px;color:#fff;letter-spacing:0.02em;text-transform:uppercase;}

.hamburger{position:relative;}
.hamburger-btn{width:34px;height:34px;border-radius:50%;background:var(--header-raised);display:flex;align-items:center;justify-content:center;border:1px solid var(--header-hairline);color:#EDEEF0;cursor:pointer;list-style:none;}
.hamburger-btn::-webkit-details-marker{display:none;}
.hamburger-menu{position:absolute;top:calc(100% + 10px);left:0;background:var(--header-raised);border:1px solid var(--header-hairline);border-radius:var(--radius-md);padding:8px;display:flex;flex-direction:column;min-width:160px;box-shadow:0 12px 28px rgba(0,0,0,0.35);}
.hamburger-menu a{padding:9px 12px;border-radius:8px;font-family:'Inter',sans-serif;font-weight:600;font-size:14px;color:#B7BCC3;}
.hamburger-menu a:hover{background:rgba(255,255,255,0.06);color:#fff;}
.hamburger-menu a.active{color:#fff;}

/* ---------- LAYOUT ---------- */
.layout{max-width:1280px;margin:0 auto;padding:32px;display:grid;grid-template-columns:1.7fr 1fr;gap:26px;}

.ad-slot{border-radius:var(--radius-lg);border:1px dashed var(--hairline);background:var(--surface);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:26px 20px;color:var(--ice);font-family:'Inter',sans-serif;}
.ad-slot .ad-cap{font-family:'Inter',sans-serif;font-weight:700;font-size:10px;letter-spacing:0.12em;text-transform:uppercase;margin-bottom:8px;color:#9AA0A8;}
.ad-slot.leaderboard{min-height:78px;flex-direction:row;gap:14px;margin-bottom:20px;}
.ad-slot.rail-ad{min-height:240px;}

.hero-media{position:relative;aspect-ratio:16/9;border-radius:var(--radius-lg);overflow:hidden;background:linear-gradient(135deg,#DDE1E6,#C7CDD4);margin-bottom:16px;}
.hero-media .badge-live{position:absolute;top:14px;left:14px;}
.badge{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:5px 12px;font-family:'Inter',sans-serif;font-size:11px;font-weight:700;letter-spacing:0.04em;text-transform:uppercase;}
.badge-live{background:#fff;color:var(--red);}
.badge-live::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--red);box-shadow:0 0 0 0 rgba(200,39,44,.5);animation:pulse 1.6s infinite;}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(200,39,44,.4);}70%{box-shadow:0 0 0 7px rgba(200,39,44,0);}100%{box-shadow:0 0 0 0 rgba(200,39,44,0);}}

.scoreboard{background:var(--surface);border:1px solid var(--hairline);border-radius:var(--radius-lg);padding:22px 26px;margin-bottom:24px;box-shadow:0 1px 3px rgba(27,30,36,0.04);}
.sb-teams{display:flex;align-items:center;justify-content:space-between;}
.sb-team{display:flex;flex-direction:column;align-items:center;gap:6px;width:110px;}
.sb-team .name{font-family:'Source Serif 4',serif;font-weight:700;font-size:16px;}
.sb-team .record{font-family:'Inter',sans-serif;font-size:11px;color:var(--ice);}
.sb-logo{width:38px;height:38px;border-radius:50%;background:var(--paper);border:1px solid var(--hairline);}
.sb-score{font-family:'JetBrains Mono',monospace;font-weight:700;font-size:38px;}
.sb-mid{text-align:center;font-family:'Inter',sans-serif;}
.sb-mid .net{font-size:11px;color:var(--ice);letter-spacing:0.06em;text-transform:uppercase;}
.sb-mid .clock{font-family:'JetBrains Mono',monospace;font-weight:700;color:var(--red);font-size:14px;margin-top:4px;}
.sb-mid .situation{font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--ice);margin-top:2px;}

.lastplay{margin-top:14px;background:var(--blue-tint);border:1px solid rgba(47,95,168,0.25);border-radius:var(--radius-md);padding:16px 20px;display:flex;align-items:center;justify-content:space-between;font-family:'Inter',sans-serif;}
.lastplay .label{font-size:10.5px;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;color:var(--blue);margin-bottom:4px;}
.lastplay .text{font-size:14px;color:var(--ink);}
.winprob{display:flex;align-items:center;gap:8px;font-family:'JetBrains Mono',monospace;font-size:13px;font-weight:700;color:var(--blue);}

.story-title-row{padding:20px 0;border-bottom:1px solid var(--hairline);}
.story-title-row:first-child{padding-top:0;}
.story-flex{display:flex;justify-content:space-between;gap:18px;}
.story-flex a.story-link{display:flex;justify-content:space-between;gap:18px;flex:1;}
.story-title{font-family:'Source Serif 4',serif;font-weight:700;font-size:21px;line-height:1.25;margin:0 0 8px;}
.story-meta{display:flex;align-items:center;gap:10px;font-size:12.5px;color:var(--ice);font-family:'Inter',sans-serif;}
.comment-count{display:flex;align-items:center;gap:4px;font-family:'JetBrains Mono',monospace;}
.story-thumb{width:96px;height:68px;border-radius:var(--radius-sm);flex-shrink:0;background:linear-gradient(135deg,#DDE1E6,#CBD1D8);}

.native-ad{background:var(--red-tint);border-radius:var(--radius-md);padding:16px 18px;border-bottom:none !important;margin-top:14px;border:1px solid rgba(200,39,44,0.2);}
.native-ad .story-flex{align-items:center;}

.load-more-row{padding:22px 0 4px;text-align:center;}
.btn-load-more{background:var(--surface);border:1px solid var(--hairline);border-radius:999px;padding:11px 22px;font-family:'Inter',sans-serif;font-weight:700;font-size:13px;color:var(--ink);cursor:pointer;}
.btn-load-more:hover{border-color:var(--red);color:var(--red);}
.htmx-request .load-more-label{display:none;}
.load-more-spinner{display:none;font-family:'JetBrains Mono',monospace;font-size:12px;color:var(--ice);}
.htmx-request .load-more-spinner{display:inline;}

.rail{display:flex;flex-direction:column;gap:20px;}
.rail-card{background:var(--surface);border-radius:var(--radius-lg);border:1px solid var(--hairline);padding:20px;box-shadow:0 1px 3px rgba(27,30,36,0.04);}
.rail-card h3{font-family:'Inter',sans-serif;font-size:12px;color:var(--ice);letter-spacing:0.1em;text-transform:uppercase;font-weight:700;margin:0 0 14px;display:flex;justify-content:space-between;}
.rail-card h3 .see-all{color:var(--red);text-transform:none;letter-spacing:0;font-weight:600;}
.headline-item{padding:12px 0;border-bottom:1px solid var(--hairline);font-size:14.5px;line-height:1.4;font-family:'Inter',sans-serif;display:block;}
.headline-item:last-child{border-bottom:none;}

.site-footer{background:var(--surface);border-top:1px solid var(--hairline);padding:22px 32px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;}
.site-footer-logo{font-family:'Montserrat',sans-serif;font-weight:800;font-size:13px;color:var(--ink);letter-spacing:0.02em;text-transform:uppercase;}
.site-footer-copy{font-family:'Inter',sans-serif;font-size:11px;color:var(--ice);letter-spacing:0.02em;}

.empty-state{padding:40px 0;color:var(--ice);font-family:'Inter',sans-serif;font-size:14px;text-align:center;}

/* ---------- BOTTOM APP NAV (mobile only) ---------- */
.bottom-nav{
  display:none;
  position:fixed;left:0;right:0;bottom:0;z-index:20;
  background:rgba(20,23,28,0.97);backdrop-filter:blur(8px);
  border-top:1px solid var(--header-hairline);
  padding:6px 4px calc(6px + env(safe-area-inset-bottom));
}
.bn-item{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-height:48px;padding:4px 2px;color:#8B9098;font-family:'Inter',sans-serif;}
.bn-icon{display:flex;align-items:center;justify-content:center;height:20px;}
.bn-icon svg{width:20px;height:20px;}
.bn-dot{width:7px;height:7px;border-radius:50%;background:#8B9098;}
.bn-label{font-size:9.5px;font-weight:600;letter-spacing:0.02em;text-transform:uppercase;}
.bn-item.active{color:#fff;}
.bn-item.active .bn-dot{background:var(--red);}

/* ---------- PLAY / GAMES (spec: notes/game_ux_inspiration.md) ---------- */
.btn-pill{display:inline-flex;align-items:center;justify-content:center;gap:6px;border-radius:999px;padding:11px 22px;font-family:'Inter',sans-serif;font-weight:700;font-size:13px;line-height:1;border:1px solid transparent;cursor:pointer;white-space:nowrap;}
.btn-pill-primary{background:var(--red);color:#fff;}
.btn-pill-primary:hover{background:#B02227;}
.btn-pill-outline{background:var(--surface);color:var(--ink);border-color:var(--hairline);}
.btn-pill-outline:hover{border-color:var(--ink);}
.btn-pill-sm{padding:8px 14px;font-size:12px;}
.btn-pill:focus-visible,.game-icon-btn:focus-visible,.cw-clue:focus-visible,.cw-key:focus-visible{outline:2px solid var(--ink);outline-offset:2px;}

.play-hub{max-width:960px;margin:0 auto;padding:36px 32px 48px;}
.play-eyebrow{color:var(--red);font-family:'Inter',sans-serif;font-weight:700;font-size:12px;letter-spacing:0.14em;text-transform:uppercase;margin:0 0 8px;}
.play-dateline{font-family:'Source Serif 4',serif;font-weight:700;font-size:32px;line-height:1.15;margin:0 0 24px;}
.game-note{font-family:'Inter',sans-serif;font-size:14px;color:var(--ice);}
.game-note a{color:var(--red);font-weight:600;}
.game-cards{display:flex;flex-direction:column;gap:14px;}
.game-card{position:relative;display:flex;align-items:center;gap:18px;background:var(--surface);border:1px solid var(--hairline);border-left:3px solid var(--ink);border-radius:var(--radius-lg);padding:20px 22px;box-shadow:0 1px 3px rgba(27,30,36,0.04);}
.game-card:hover{border-color:#D5D1C7;border-left-color:var(--ink);}
.game-card.is-unavailable{border-left-color:var(--hairline);}
.game-card-icon{flex-shrink:0;width:44px;height:44px;border-radius:var(--radius-md);background:var(--paper);border:1px solid var(--hairline);display:flex;align-items:center;justify-content:center;color:var(--ink);}
.game-card-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px;}
.game-card-title{font-family:'Source Serif 4',serif;font-weight:700;font-size:20px;}
.game-card-desc{font-family:'Inter',sans-serif;font-size:14px;color:var(--ice);}
.game-card-meta{font-family:'JetBrains Mono',monospace;font-size:11.5px;color:var(--ice);margin-top:2px;}
.game-card.is-solved .game-card-meta{color:var(--ink);}
.game-card-meta:empty{display:none;}
.game-card-actions{display:flex;gap:8px;flex-shrink:0;}
.game-card-link::after{content:"";position:absolute;inset:0;border-radius:var(--radius-lg);}
.game-card-restart{position:relative;z-index:1;}
.game-card-restart[hidden]{display:none;}

/* Crossword */
/* Desktop: board sized to leave room for the clue column beside it (padding 64 + gap 40 + clues 300). */
.cw{--cell:min(52px,calc((100vw - 410px) / var(--cols)),calc((100vh - 280px) / var(--rows)));--cell:min(52px,calc((100vw - 410px) / var(--cols)),calc((100dvh - 280px) / var(--rows)));}
/* Shared by every game page (root element has class="game"). */
.game{--gold:#B8912F;--green:#3E7D4F;position:relative;}
.game [hidden]{display:none !important;}

.game-intro{max-width:480px;margin:0 auto;padding:64px 24px 72px;text-align:center;display:flex;flex-direction:column;align-items:center;}
.game-intro-icon{width:64px;height:64px;border-radius:var(--radius-lg);background:var(--surface);border:1px solid var(--hairline);display:flex;align-items:center;justify-content:center;color:var(--ink);margin-bottom:20px;}
.game-intro-icon svg{width:34px;height:34px;}
.game-intro-title{font-family:'Source Serif 4',serif;font-weight:700;font-size:40px;line-height:1.1;margin:0 0 28px;}
.game-intro-actions{display:flex;flex-direction:column;gap:10px;width:100%;max-width:240px;margin-bottom:32px;}
.game-intro-date{font-family:'Inter',sans-serif;font-weight:700;font-size:11px;letter-spacing:0.14em;text-transform:uppercase;color:var(--ice);}

.game-header{display:flex;align-items:center;gap:10px;height:48px;padding:0 16px;background:var(--surface);border-bottom:1px solid var(--hairline);}
.game-header-title{flex:1;font-family:'Source Serif 4',serif;font-weight:700;font-size:17px;}
.game-icon-btn{width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:transparent;border:1px solid var(--hairline);color:var(--ink);font-family:'Inter',sans-serif;font-weight:700;font-size:14px;cursor:pointer;}
.game-timer{display:flex;align-items:center;gap:6px;background:transparent;border:none;cursor:pointer;font-family:'JetBrains Mono',monospace;font-weight:700;font-size:14px;color:var(--ink);padding:6px 4px;}
.game-timer-icon{color:var(--ice);}

.cw-body{max-width:1100px;margin:0 auto;padding:24px 32px 40px;display:flex;gap:40px;justify-content:center;align-items:flex-start;}
.cw-main{display:flex;flex-direction:column;align-items:center;gap:14px;min-width:0;}

.cw-board-wrap{position:relative;}
.cw-board{display:grid;grid-template-columns:repeat(var(--cols),var(--cell));grid-auto-rows:var(--cell);padding:0 1px 1px 0;user-select:none;-webkit-user-select:none;}
/* Negative margins collapse neighbouring borders into single 1px lines. */
.cw-cell{position:relative;background:var(--surface);border:1px solid var(--ink);margin:0 -1px -1px 0;cursor:pointer;display:flex;align-items:center;justify-content:center;}
.cw-cell.is-block{background:transparent;border-color:transparent;cursor:default;}
.cw-cell.is-given{background:rgba(27,30,36,0.06);}
.cw-cell.is-word{background:rgba(184,145,47,0.14);}
.cw-cell.is-selected{background:rgba(184,145,47,0.42);}
.cw-num{position:absolute;top:1px;left:3px;font-family:'Inter',sans-serif;font-weight:600;font-size:max(8px,calc(var(--cell) * 0.24));line-height:1;color:var(--ink);}
.cw-letter{font-family:'Inter',sans-serif;font-weight:600;font-size:calc(var(--cell) * 0.56);line-height:1;color:var(--ink);margin-top:calc(var(--cell) * 0.1);}
.cw-cell.is-ok .cw-letter{color:var(--green);}
.cw-cell.is-revealed .cw-letter{color:var(--ice);}
.cw-cell.is-revealed::after{content:"";position:absolute;top:0;right:0;border-style:solid;border-width:0 7px 7px 0;border-color:transparent var(--gold) transparent transparent;}
.cw-cell.is-wrong::before{content:"";position:absolute;inset:0;background:linear-gradient(to top right,transparent calc(50% - 1px),var(--red) calc(50% - 1px),var(--red) calc(50% + 1px),transparent calc(50% + 1px));pointer-events:none;}
.cw.is-solved .cw-cell.is-word,.cw.is-solved .cw-cell.is-selected{background:var(--surface);}
.cw.is-solved .cw-cell{cursor:default;}
.cw.is-solved .cw-clue.is-active{background:none;}
.cw.is-solved .cw-clue.is-cross{border-left-color:transparent;}
.cw.is-paused .cw-board,.wdi.is-paused .wdi-grid,.ss.is-paused .ss-field,.ws.is-paused .ws-board,.rf.is-paused .rf-card{filter:blur(6px);opacity:0.35;pointer-events:none;}
.game-paused{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;}
.game-paused-title{font-family:'Source Serif 4',serif;font-weight:700;font-size:24px;}

.cw-toolbar{display:flex;gap:8px;align-items:center;justify-content:center;flex-wrap:wrap;}
.cw.is-solved .cw-menu{display:none;}
/* Above the pinned mobile dock (20), below sheets (40) and the toast (50). */
.cw-menu{position:relative;}
.cw-menu summary{list-style:none;}
.cw-menu summary::-webkit-details-marker{display:none;}
.cw-menu-list{position:absolute;top:calc(100% + 6px);left:50%;transform:translateX(-50%);z-index:30;background:var(--surface);border:1px solid var(--hairline);border-radius:var(--radius-md);padding:6px;display:flex;flex-direction:column;min-width:130px;box-shadow:0 12px 28px rgba(27,30,36,0.12);}
.cw-menu-list button{background:none;border:none;text-align:left;padding:9px 12px;border-radius:var(--radius-sm);font-family:'Inter',sans-serif;font-weight:600;font-size:13px;color:var(--ink);cursor:pointer;}
.cw-menu-list button:hover{background:var(--paper);}

/* Desktop: the dock is just the active-clue bar, shown above the board. */
/* Active-clue bar + keyboard: mobile only (desktop uses the clue lists on the right). */
.cw-dock{display:none;}
.cw-cluebar{display:flex;align-items:stretch;background:rgba(184,145,47,0.14);border-radius:var(--radius-md);min-height:48px;}
.cw-cluebar-arrow{flex-shrink:0;width:40px;background:none;border:none;font-size:24px;color:var(--ink);cursor:pointer;}
.cw-cluebar-text{flex:1;display:flex;align-items:center;gap:10px;text-align:left;background:none;border:none;padding:8px 4px;font-family:'Inter',sans-serif;font-size:14.5px;line-height:1.35;color:var(--ink);cursor:pointer;}
.cw-cluebar-num{font-family:'JetBrains Mono',monospace;font-weight:700;font-size:13px;flex-shrink:0;}
.cw-keyboard{display:none;}
.cw.is-solved .cw-dock{display:none;}

.cw-clues{flex:0 0 300px;display:flex;flex-direction:column;gap:22px;}
.cw-clue-heading{font-family:'Inter',sans-serif;font-size:12px;color:var(--ice);letter-spacing:0.1em;text-transform:uppercase;font-weight:700;margin:0 0 8px;padding-bottom:8px;border-bottom:1px solid var(--hairline);}
.cw-clue-list{list-style:none;margin:0;padding:0;}
.cw-clue{display:flex;gap:10px;width:100%;text-align:left;background:none;border:none;border-left:3px solid transparent;border-radius:0 var(--radius-sm) var(--radius-sm) 0;padding:7px 10px;font-family:'Inter',sans-serif;font-size:14px;line-height:1.4;color:var(--ink);cursor:pointer;}
.cw-clue:hover{background:var(--surface);}
.cw-clue-num{font-family:'JetBrains Mono',monospace;font-weight:700;font-size:12.5px;min-width:18px;padding-top:1px;}
.cw-clue.is-active{background:rgba(184,145,47,0.14);}
.cw-clue.is-cross{border-left-color:var(--gold);}

.game-sheet-backdrop{position:fixed;inset:0;z-index:40;background:rgba(20,23,28,0.45);display:flex;align-items:center;justify-content:center;padding:20px;}
.game-sheet{position:relative;width:100%;max-width:440px;background:var(--surface);border-radius:var(--radius-lg);padding:30px 26px 24px;box-shadow:0 24px 48px rgba(0,0,0,0.25);text-align:center;}
.game-sheet-close{position:absolute;top:10px;right:12px;width:34px;height:34px;background:none;border:none;font-size:24px;color:var(--ice);cursor:pointer;}
.game-results-title{font-family:'Source Serif 4',serif;font-weight:700;font-size:30px;line-height:1.15;margin:4px 0 6px;}
.game-results-time{font-family:'JetBrains Mono',monospace;font-weight:700;font-size:28px;margin-bottom:22px;}
.game-sheet-actions{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;}
.game-help-list{text-align:left;font-family:'Inter',sans-serif;font-size:14px;line-height:1.55;padding-left:20px;margin:14px 0 22px;}
.game-help-list li{margin-bottom:8px;}
.game-help-list kbd{font-family:'JetBrains Mono',monospace;font-size:12px;background:var(--paper);border:1px solid var(--hairline);border-radius:4px;padding:1px 5px;}

.game-toast{position:fixed;left:50%;top:132px;transform:translate(-50%,-8px);z-index:50;background:var(--ink);color:#fff;font-family:'Inter',sans-serif;font-weight:600;font-size:13px;padding:10px 16px;border-radius:var(--radius-sm);opacity:0;pointer-events:none;transition:opacity .15s,transform .15s;}
.game-toast.is-visible{opacity:1;transform:translate(-50%,0);}

/* Who Did It */
.wdi-play{max-width:560px;margin:0 auto;padding:24px 20px 40px;}
.wdi-prompt{font-family:'Source Serif 4',serif;font-weight:700;font-size:24px;line-height:1.25;text-align:center;margin:0 0 16px;}
.wdi-status{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:14px;font-family:'Inter',sans-serif;font-size:13px;color:var(--ice);}
.wdi-found [data-found]{font-family:'JetBrains Mono',monospace;font-weight:700;color:var(--ink);}
.wdi-mistakes{display:flex;align-items:center;gap:6px;}
.wdi-mistake-dot{width:10px;height:10px;border-radius:50%;border:1.5px solid var(--ice);}
.wdi-mistake-dot.is-used{background:var(--red);border-color:var(--red);}
.wdi-grid-wrap{position:relative;}
.wdi-grid{display:grid;grid-template-columns:repeat(var(--cols),minmax(0,1fr));gap:8px;}
.wdi-tile{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;min-height:76px;padding:10px 8px;background:var(--surface);border:1px solid var(--hairline);border-radius:var(--radius-md);font-family:'Inter',sans-serif;font-weight:600;font-size:14px;line-height:1.25;color:var(--ink);text-align:center;cursor:pointer;}
.wdi-tile:not(:disabled):hover{border-color:var(--ink);}
.wdi-tile:disabled{cursor:default;}
.wdi-tile:focus-visible{outline:2px solid var(--ink);outline-offset:2px;}
.wdi-stat{font-family:'JetBrains Mono',monospace;font-weight:500;font-size:12px;}
.wdi-stat:empty{display:none;}
.wdi-tile.is-correct{background:rgba(62,125,79,0.12);border-color:var(--green);color:#2C5E3A;}
.wdi-tile.is-wrong{background:var(--red-tint);border-color:var(--red);color:#9E1F23;}
/* After the game: answers that weren't picked, and everything else muted. */
.wdi-tile.is-missed{background:rgba(62,125,79,0.05);border:1.5px dashed var(--green);color:#2C5E3A;}
.wdi-tile.is-rest{background:rgba(27,30,36,0.04);color:var(--ice);}
.wdi-tile.is-shake{animation:wdi-shake .32s;}
@keyframes wdi-shake{0%,100%{transform:translateX(0);}25%{transform:translateX(-5px);}75%{transform:translateX(5px);}}
.wdi-actions{display:flex;justify-content:center;margin-top:16px;}

/* Stat Stack */
.ss-play{max-width:520px;margin:0 auto;padding:24px 20px 40px;}
.ss-prompt{font-family:'Source Serif 4',serif;font-weight:700;font-size:24px;line-height:1.25;text-align:center;margin:0 0 12px;}
.ss-status{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:10px;font-family:'Inter',sans-serif;font-size:13px;color:var(--ice);}
.ss-num{font-family:'JetBrains Mono',monospace;font-weight:700;color:var(--ink);}
.ss-field-wrap{position:relative;}
/* The field art and the position buttons share the SVG's viewBox (0 8 100 107). */
.ss-field{position:relative;aspect-ratio:100/107;}
.ss-field-art{position:absolute;inset:0;width:100%;height:100%;}
.ss-grass{fill:rgba(62,125,79,0.10);stroke:rgba(62,125,79,0.30);stroke-width:0.4;}
.ss-infield-grass{fill:rgba(62,125,79,0.12);}
.ss-dirt{fill:rgba(184,145,47,0.16);}
.ss-chalk{fill:none;stroke:var(--surface);stroke-width:0.6;}
.ss-base{fill:var(--surface);stroke:var(--hairline);stroke-width:0.3;}
.ss-spot{position:absolute;left:calc(var(--x) * 1%);top:calc((var(--y) - 8) / 1.07 * 1%);transform:translate(-50%,-50%);width:26%;max-width:128px;display:flex;flex-direction:column;align-items:center;gap:2px;padding:6px 6px 7px;background:var(--surface);border:1px solid var(--hairline);border-radius:var(--radius-sm);box-shadow:0 1px 3px rgba(27,30,36,0.06);font-family:'Inter',sans-serif;color:var(--ink);text-align:center;cursor:pointer;}
.ss-spot:hover{border-color:var(--ink);}
.ss-spot:focus-visible{outline:2px solid var(--ink);outline-offset:2px;}
.ss-spot-pos{font-weight:700;font-size:10px;letter-spacing:0.12em;color:var(--ice);}
.ss-spot-name{font-weight:600;font-size:12px;line-height:1.2;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.ss-spot:not(.is-picked) .ss-spot-name{color:var(--red);font-weight:700;}
.ss-spot-value{font-family:'JetBrains Mono',monospace;font-weight:700;font-size:12px;}
.ss-spot-value:empty{display:none;}
.ss-spot.is-correct{background:#EEF4EF;border-color:var(--green);color:#2C5E3A;}
.ss-spot.is-wrong{background:#FBEDED;border-color:var(--red);color:#9E1F23;}
.ss-spot.is-correct .ss-spot-pos,.ss-spot.is-wrong .ss-spot-pos{color:inherit;opacity:0.75;}
.ss-actions{display:flex;justify-content:center;margin-top:16px;}
.ss-pick-title{font-family:'Source Serif 4',serif;font-weight:700;font-size:24px;line-height:1.2;margin:4px 0 4px;}
.ss-pick-note{font-family:'Inter',sans-serif;font-size:13px;color:var(--ice);margin:0 0 18px;}
.ss-pick-note:empty{margin-bottom:14px;}
.ss-choices{display:flex;flex-direction:column;gap:8px;}
.ss-choice{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:52px;padding:12px 16px;background:var(--surface);border:1px solid var(--hairline);border-radius:var(--radius-md);font-family:'Inter',sans-serif;font-weight:600;font-size:15px;color:var(--ink);text-align:left;cursor:pointer;}
.ss-choice:not(:disabled):hover{border-color:var(--ink);}
.ss-choice:focus-visible{outline:2px solid var(--ink);outline-offset:2px;}
.ss-choice:disabled{cursor:default;}
.ss-choice-value{font-family:'JetBrains Mono',monospace;font-weight:700;font-size:14px;}
.ss-choice.is-revealed{color:var(--ice);}
.ss-choice.is-chosen{color:var(--ink);border-width:2px;padding:11px 15px;}
.ss-choice.is-correct{background:rgba(62,125,79,0.12);border-color:var(--green);color:#2C5E3A;}
.ss-choice.is-wrong{background:var(--red-tint);border-color:var(--red);color:#9E1F23;}
.ss-results-score{font-family:'JetBrains Mono',monospace;font-weight:700;font-size:30px;margin:2px 0 6px;}
.ss-results-detail{font-family:'Inter',sans-serif;font-size:13px;color:var(--ice);margin-bottom:22px;}

/* Word Search */
.ws-play{max-width:760px;margin:0 auto;padding:24px 20px 40px;}
.ws-main{display:flex;align-items:flex-start;gap:28px;}
.ws-main .ws-board-wrap{flex:1;min-width:0;max-width:520px;}
.ws-side{flex:0 0 200px;}
.ws-prompt{font-family:'Source Serif 4',serif;font-weight:700;font-size:24px;line-height:1.25;text-align:center;margin:0 0 12px;}
.ws-status{max-width:520px;display:flex;justify-content:space-between;align-items:center;gap:12px;min-height:22px;margin-bottom:10px;font-family:'Inter',sans-serif;font-size:13px;color:var(--ice);}
.ws-num{font-family:'JetBrains Mono',monospace;font-weight:700;color:var(--ink);}
.ws-status-left{display:flex;align-items:center;gap:10px;}
.ws-current{font-family:'JetBrains Mono',monospace;font-weight:700;font-size:14px;letter-spacing:0.08em;color:var(--ink);}
.ws-board-wrap{position:relative;}
/* touch-action:none keeps a drag on the grid from scrolling the page. */
.ws-board{position:relative;display:grid;grid-template-columns:repeat(var(--cols),minmax(0,1fr));grid-template-rows:repeat(var(--rows),minmax(0,1fr));aspect-ratio:var(--cols)/var(--rows);background:var(--surface);border:1px solid var(--hairline);border-radius:var(--radius-md);padding:0;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;cursor:pointer;}
.ws-board:focus{outline:none;}
.ws-board:focus-visible{outline:2px solid var(--ink);outline-offset:2px;}
.ws-cell{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;font-family:'Inter',sans-serif;font-weight:600;font-size:min(17px,calc((100vw - 40px) / var(--cols) * 0.55));color:var(--ink);}
.ws-cell.is-selected{font-weight:700;}
/* Hint: a gold ring around the first letter of a word still to find. */
.ws-cell.is-hint::before{content:"";position:absolute;inset:12%;border:2px solid var(--gold);border-radius:50%;pointer-events:none;}
.ws-board:focus-visible .ws-cell.is-cursor{box-shadow:inset 0 0 0 2px var(--ink);border-radius:6px;}
/* Pills over the letters, drawn in cell units (viewBox = cols x rows). */
.ws-marks{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;}
.ws-found-line,.ws-sel-line{stroke-width:0.78;stroke-linecap:round;}
.ws-sel-line{stroke:rgba(184,145,47,0.45);}
.ws-board.is-miss .ws-sel-line{stroke:rgba(200,39,44,0.3);}
.ws-board.is-miss{animation:wdi-shake .26s;}
.ws-mark-0{stroke:rgba(62,125,79,0.28);}
.ws-mark-1{stroke:rgba(47,95,168,0.22);}
.ws-mark-2{stroke:rgba(184,145,47,0.32);}
.ws-mark-3{stroke:rgba(110,90,140,0.26);}
.ws-toggle{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;margin:0 0 12px;padding:0;background:none;border:none;font-family:'Inter',sans-serif;font-weight:600;font-size:13px;color:var(--ink);text-align:left;cursor:pointer;}
.ws-toggle:focus-visible{outline:2px solid var(--ink);outline-offset:3px;border-radius:4px;}
.ws-switch{position:relative;flex-shrink:0;width:36px;height:20px;border-radius:999px;background:var(--hairline);transition:background .15s;}
.ws-switch::after{content:"";position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:var(--surface);box-shadow:0 1px 2px rgba(27,30,36,0.2);transition:transform .15s;}
.ws-toggle[aria-checked="true"] .ws-switch{background:var(--ink);}
.ws-toggle[aria-checked="true"] .ws-switch::after{transform:translateX(16px);}
.ws-words{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px;}
.ws-words.is-hidden .ws-word:not(.is-found) .ws-word-name{filter:blur(5px);user-select:none;-webkit-user-select:none;}
.ws-word{font-family:'Inter',sans-serif;font-weight:600;font-size:13px;padding:6px 12px;border:1px solid var(--hairline);border-radius:999px;background:var(--surface);color:var(--ink);}
.ws-word.is-found{color:var(--ice);text-decoration:line-through;}
.ws-word.is-found[data-mark="0"]{background:rgba(62,125,79,0.12);}
.ws-word.is-found[data-mark="1"]{background:rgba(47,95,168,0.10);}
.ws-word.is-found[data-mark="2"]{background:rgba(184,145,47,0.14);}
.ws-word.is-found[data-mark="3"]{background:rgba(110,90,140,0.12);}
.ws-actions{display:flex;justify-content:center;margin-top:16px;}
.ws-results-hints{font-family:'Inter',sans-serif;font-size:13px;color:var(--ice);margin:-14px 0 22px;}
.ws.is-done .ws-board{cursor:default;}

@media (max-width:960px){
  .cw{--cell:min(52px,calc((100vw - 324px) / var(--cols)),calc((100vh - 280px) / var(--rows)));--cell:min(52px,calc((100vw - 324px) / var(--cols)),calc((100dvh - 280px) / var(--rows)));}
  .cw-body{padding:24px 20px 40px;gap:28px;}
  .cw-clues{flex-basis:250px;}
}

/* Mobile: app-style screen - clue bar + keyboard pinned to the thumb zone. */
@media (max-width:720px){
  .cw{--cell:min(52px,calc((100vw - 24px) / var(--cols)),calc((100vh - 430px) / var(--rows)));--cell:min(52px,calc((100vw - 24px) / var(--cols)),calc((100dvh - 430px) / var(--rows)));}
  .cw-body{padding:16px 12px calc(var(--dock-h,230px) + 16px);}
  .cw-clues{display:none;}
  .cw-dock{display:block;position:fixed;left:0;right:0;bottom:0;z-index:20;background:var(--paper);border-top:1px solid var(--hairline);padding:8px 6px calc(8px + env(safe-area-inset-bottom));}
  .cw-cluebar{margin-bottom:8px;}
  .cw-keyboard{display:flex;flex-direction:column;gap:7px;}
  .cw-kb-row{display:flex;justify-content:center;gap:5px;}
  .cw-key{flex:1;max-width:40px;height:46px;border:none;border-radius:6px;background:#E6E3DC;font-family:'Inter',sans-serif;font-weight:700;font-size:15px;color:var(--ink);cursor:pointer;padding:0;}
  .cw-key:active{background:#D5D1C7;}
  .cw-key-wide{max-width:58px;flex:1.5;font-size:18px;}
  .game-toast{top:auto;bottom:calc(var(--dock-h,230px) + 12px);}
  .game-sheet-backdrop{align-items:flex-end;padding:0;}
  /* Extra bottom room: once the page has scrolled, iOS Safari collapses its
     toolbar into a strip along the bottom edge, and a tap there only expands
     the toolbar - it never reaches the page. Keep the sheet's buttons above it. */
  .game-sheet{max-width:none;border-radius:var(--radius-lg) var(--radius-lg) 0 0;padding-bottom:calc(64px + env(safe-area-inset-bottom));}
  .play-hub{padding:24px 16px 40px;}
  .play-dateline{font-size:26px;}
  .game-card{padding:16px;gap:14px;flex-wrap:wrap;}
  .game-card-actions{width:100%;}
  .game-card-link{flex:1;}
  .game-intro{padding:48px 20px 56px;}
  body:has(.cw-play:not([hidden])) .site-footer{display:none;}
  .wdi-play{padding:18px 12px 32px;}
  .wdi-prompt{font-size:20px;}
  .wdi-tile{min-height:68px;font-size:13px;padding:8px 6px;}
  .ss-play{padding:16px 10px 32px;}
  .ws-play{padding:16px 10px 32px;}
  .rf-play{padding:16px 12px 32px;}
  .rf-card{padding:18px 14px 14px;}
  .rf-question{font-size:19px;}
  .rf-option{min-height:136px;padding:14px 8px 12px;}
  .rf-option.is-picked{padding:13px 7px 11px;}
  .rf-option-label{font-size:14px;}
  .rf-dots{gap:4px;}
  .rf-dot{width:8px;height:8px;}
  .ws-prompt{font-size:20px;}
  .ws-main{flex-direction:column;align-items:stretch;gap:18px;}
  .ws-main .ws-board-wrap{max-width:none;}
  .ws-side{flex-basis:auto;}
  .ws-toggle{justify-content:center;}
  .ws-words{flex-direction:row;flex-wrap:wrap;justify-content:center;}
  .ss-prompt{font-size:20px;}
  .ss-spot{width:27%;padding:5px 4px 6px;}
  .ss-spot-name{font-size:11px;}
  .ss-spot-value{font-size:11px;}
}

@media (prefers-reduced-motion:reduce){
  .game-toast{transition:none;}
  .wdi-tile.is-shake{animation:none;}
  .ws-board.is-miss{animation:none;}
  .ws-switch,.ws-switch::after{transition:none;}
}

/* Rapid Fire */
.rf-play{max-width:560px;margin:0 auto;padding:22px 20px 40px;}
.rf-progress{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px;font-family:'Inter',sans-serif;font-size:13px;color:var(--ice);}
.rf-num{font-family:'JetBrains Mono',monospace;font-weight:700;color:var(--ink);}
.rf-dots{display:flex;gap:5px;}
.rf-dot{width:9px;height:9px;border-radius:50%;border:1.5px solid var(--hairline);background:var(--surface);}
.rf-dot.is-current{border-color:var(--ink);}
.rf-dot.is-right{background:var(--green);border-color:var(--green);}
.rf-dot.is-wrong{background:var(--red);border-color:var(--red);}
.rf-card-wrap{position:relative;}
.rf-card{background:var(--surface);border:1px solid var(--hairline);border-radius:var(--radius-lg);padding:22px 20px 18px;box-shadow:0 1px 3px rgba(27,30,36,0.04);text-align:center;}
.rf-badge{display:inline-block;font-family:'Inter',sans-serif;font-weight:700;font-size:10.5px;letter-spacing:0.14em;text-transform:uppercase;color:var(--ice);border:1px solid var(--hairline);border-radius:999px;padding:4px 10px;margin-bottom:14px;}
.rf-subject{display:flex;justify-content:center;margin-bottom:12px;}
.rf-subject[hidden]{display:none;}
.rf-subject-img{width:72px;height:72px;border-radius:50%;object-fit:cover;object-position:top;background:var(--paper);border:1px solid var(--hairline);}
.rf-question{font-family:'Source Serif 4',serif;font-weight:700;font-size:22px;line-height:1.3;margin:0 0 18px;}
.rf-options{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.rf-option{position:relative;display:flex;flex-direction:column;align-items:center;gap:8px;padding:16px 10px 14px;background:var(--surface);border:1px solid var(--hairline);border-radius:var(--radius-md);font-family:'Inter',sans-serif;color:var(--ink);cursor:pointer;min-height:150px;}
.rf-option:not(:disabled):hover{border-color:var(--ink);}
.rf-option:focus-visible{outline:2px solid var(--ink);outline-offset:2px;}
.rf-option:disabled{cursor:default;}
.rf-option-img{width:56px;height:56px;border-radius:50%;object-fit:cover;object-position:top;background:var(--paper);border:1px solid var(--hairline);}
.rf-option.is-team .rf-option-img{border-radius:0;object-fit:contain;background:none;border:none;}
.rf-option-label{font-weight:700;font-size:15px;line-height:1.25;}
.rf-option-value{font-family:'JetBrains Mono',monospace;font-weight:700;font-size:14px;min-height:1.2em;}
.rf-key{position:absolute;top:8px;left:10px;font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--ice);}
.rf-option.is-answered .rf-key{visibility:hidden;}
.rf-option.is-answered:not(.is-correct):not(.is-picked){opacity:0.7;}
.rf-option.is-correct{background:rgba(62,125,79,0.12);border-color:var(--green);color:#2C5E3A;}
.rf-option.is-wrong{background:var(--red-tint);border-color:var(--red);color:#9E1F23;}
.rf-option.is-picked{border-width:2px;padding:15px 9px 13px;}
.rf-next-row{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:44px;margin-top:14px;}
.rf-verdict{font-family:'Inter',sans-serif;font-weight:700;font-size:14px;}
.rf-verdict.is-right{color:#2C5E3A;}
.rf-verdict.is-wrong{color:#9E1F23;}
.rf-results-detail{font-family:'Inter',sans-serif;font-size:13px;color:var(--ice);margin:-14px 0 22px;}
.rf-review[hidden]{display:none;}
.rf-review-title{font-family:'Inter',sans-serif;font-weight:700;font-size:12px;letter-spacing:0.14em;text-transform:uppercase;color:var(--ice);margin:4px 0 10px;}
.rf-review-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px;}
.rf-review-item{background:var(--surface);border:1px solid var(--hairline);border-left:3px solid var(--green);border-radius:var(--radius-md);padding:12px 14px;font-family:'Inter',sans-serif;}
.rf-review-item.is-wrong{border-left-color:var(--red);}
.rf-review-q{font-weight:600;font-size:14px;line-height:1.35;margin-bottom:8px;}
.rf-review-opt{display:flex;justify-content:space-between;gap:10px;font-size:13px;color:var(--ice);padding:2px 0;}
.rf-review-opt.is-correct{color:#2C5E3A;font-weight:600;}
.rf-review-item.is-wrong .rf-review-opt.is-picked{color:#9E1F23;}
.rf-review-val{font-family:'JetBrains Mono',monospace;white-space:nowrap;}
.rf-actions{display:flex;justify-content:center;margin-top:16px;}

/* ---------- LEADERBOARDS ---------- */
.lb{max-width:760px;margin:0 auto;padding:28px 32px 48px;}
.lb-back{display:inline-flex;align-items:center;gap:4px;font-family:'Inter',sans-serif;font-weight:700;font-size:12px;letter-spacing:0.14em;text-transform:uppercase;color:var(--red);margin-bottom:10px;}
.lb-title{font-family:'Source Serif 4',serif;font-weight:700;font-size:36px;line-height:1.1;margin:0 0 8px;}
.lb-asof{font-family:'Inter',sans-serif;font-weight:700;font-size:11px;letter-spacing:0.14em;text-transform:uppercase;color:var(--ice);margin-bottom:22px;}
/* All-time / season toggle: a small segmented control above the list tabs. */
.lb-views{display:inline-flex;gap:2px;padding:3px;margin-bottom:12px;background:var(--surface);border:1px solid var(--hairline);border-radius:999px;}
.lb-view{padding:7px 14px;border:none;border-radius:999px;background:transparent;font-family:'Inter',sans-serif;font-weight:700;font-size:12px;color:var(--ice);cursor:pointer;}
.lb-view:hover{color:var(--ink);}
.lb-view.is-active{background:var(--paper);color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink);}
.lb-view:focus-visible{outline:2px solid var(--ink);outline-offset:2px;}
.lb-asof[hidden]{display:none;}
.lb-tabs{display:flex;gap:4px;padding:4px;background:var(--surface);border:1px solid var(--hairline);border-radius:999px;margin-bottom:14px;overflow-x:auto;scrollbar-width:none;}
.lb-tabs::-webkit-scrollbar{display:none;}
.lb-tab{flex:1 0 auto;padding:9px 16px;border:none;border-radius:999px;background:transparent;font-family:'Inter',sans-serif;font-weight:600;font-size:13px;color:var(--ice);cursor:pointer;white-space:nowrap;}
.lb-tab:hover{color:var(--ink);}
.lb-tab.is-active{background:var(--ink);color:#fff;}
.lb-tab:focus-visible{outline:2px solid var(--ink);outline-offset:2px;}
.lb-panel[hidden]{display:none;}
.lb-table{width:100%;border-collapse:separate;border-spacing:0;background:var(--surface);border:1px solid var(--hairline);border-radius:var(--radius-md);overflow:hidden;box-shadow:0 1px 3px rgba(27,30,36,0.04);}
.lb-table th{font-family:'Inter',sans-serif;font-weight:700;font-size:11px;letter-spacing:0.12em;text-transform:uppercase;color:var(--ice);text-align:left;padding:12px 14px;border-bottom:1px solid var(--hairline);background:var(--paper);}
.lb-table td{padding:8px 14px;border-bottom:1px solid var(--hairline);vertical-align:middle;}
.lb-table tbody tr:last-child td{border-bottom:none;}
.lb-table th.lb-value,.lb-table th.lb-detail,.lb-table td.lb-value,.lb-table td.lb-detail{text-align:right;}
.lb-rank{width:44px;font-family:'JetBrains Mono',monospace;font-weight:700;font-size:13px;color:var(--ice);}
/* Grid, not flex: Safari sizes a table column without counting the longest word
   inside a flex cell, so long last names ran into the bar column. */
.lb-player-cell{display:grid;grid-template-columns:auto auto;justify-content:start;align-items:center;gap:12px;}
.lb-headshot{min-width:40px;width:40px;height:40px;border-radius:50%;object-fit:cover;object-position:top;background:var(--paper);border:1px solid var(--hairline);}
.lb-name{font-family:'Inter',sans-serif;font-weight:600;font-size:14px;color:var(--ink);}
.lb-value{font-family:'JetBrains Mono',monospace;font-weight:700;font-size:15px;color:var(--ink);white-space:nowrap;}
/* The value column doubles as the bar track: bars start just inside its left
   edge (past the longest name) and the leader's runs behind its mph value.
   Color runs orange (the list's lowest value) to red (its highest) via --heat;
   ink text is 9.2:1 on the orange end and 5.4:1 on the red end. */
.lb-table th.lb-value{width:46%;}
.lb-table td.lb-value{position:relative;}
/* The mph value sits at the tip of its own bar; min-width keeps it inside even on the shortest bars. */
.lb-bar{position:absolute;left:10px;top:50%;height:24px;width:calc((100% - 10px) * var(--bar) * var(--fill));min-width:3.8em;transform:translateY(-50%);background:#F38F61;background:color-mix(in oklab, #EC6A57 calc(var(--heat) * 100%), #F8B26A);border-radius:0 4px 4px 0;display:flex;align-items:center;justify-content:flex-end;
  /* Fill-up: each bar grows from the start edge, rows staggered top to bottom
     (capped so a 50-row list still finishes in under a second). Panels are
     display:none while hidden, so this replays each time one is shown. */
  animation:lb-fill .45s cubic-bezier(.2,.7,.2,1) both;animation-delay:calc(min(var(--i), 20) * 22ms);}
/* --fill must be a registered property to animate; without @property support the bars just appear. */
@property --fill{syntax:'<number>';inherits:false;initial-value:1;}
@keyframes lb-fill{from{--fill:0;}to{--fill:1;}}
@media (prefers-reduced-motion:reduce){.lb-bar{animation:none;}}
.lb-value-num{position:relative;padding-right:8px;}
.lb-detail{font-family:'JetBrains Mono',monospace;font-weight:500;font-size:12.5px;color:var(--ice);white-space:nowrap;}

/* Smallest phones (~320px): drop headshots so the bar track keeps room. */
@media (max-width:360px){
  .lb-headshot{display:none;}
  .lb-detail{font-size:11px;}
}

/* ---------- RESPONSIVE ---------- */
@media (max-width:860px){
  .layout{grid-template-columns:1fr;padding:20px;}
  .sb-teams{flex-wrap:wrap;gap:16px;}
  nav.mainnav{padding:14px 18px;}
  .ticker-wrap{padding:10px 18px 6px;}
}

@media (max-width:720px){
  .hamburger-btn{width:38px;height:38px;}
}

@media (max-width:480px){
  .lb{padding:20px 12px 40px;}
  .lb-title{font-size:30px;}
  .lb-table th,.lb-table td{padding-left:8px;padding-right:8px;}
  .lb-rank{width:34px;}
  .lb-player-cell{gap:8px;}
  .lb-headshot{min-width:32px;width:32px;height:32px;}
  .lb-name{font-size:13px;}
  .lb-value{font-size:14px;}
  .lb-table th.lb-value{width:42%;}
  /* Too narrow to fit the value inside short bars without stretching them, so
     on phones bars keep their true length and the value sits just past the tip. */
  .lb-bar{left:6px;height:20px;width:calc((100% - 6px - 3.6em) * var(--bar) * var(--fill));min-width:0;}
  .lb-value-num{position:absolute;left:100%;padding:0 0 0 5px;}
  .lb-detail{font-size:11.5px;}
  .layout{padding:14px;gap:20px;}
  .ticker-wrap{padding:10px 14px 6px;}
  .scoreboard{padding:16px 14px;}
  .sb-team{width:auto;gap:4px;}
  .sb-logo{width:30px;height:30px;}
  .sb-score{font-size:26px;}
  .sb-team .name{font-size:13.5px;}
  .story-title{font-size:18px;}
  .story-thumb{width:76px;height:56px;}
  .ad-slot.rail-ad{min-height:160px;}
  .rail-card{padding:16px;}
}