/* BingoPlus Courtside v11 — "Arena Night" theme layer.
   Load AFTER style.css, pc-header-icons.css and mobile-dock.css.
   Re-skins every surface; does not change any id / class / data hook used by app.js,
   predictions.js, highlight-gallery.js or hero.js. */

@font-face{font-family:"Saira";font-weight:400;font-display:swap;src:url(../fonts/saira-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Saira";font-weight:500;font-display:swap;src:url(../fonts/saira-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"Saira";font-weight:600;font-display:swap;src:url(../fonts/saira-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:"Saira";font-weight:700;font-display:swap;src:url(../fonts/saira-latin-700-normal.woff2) format("woff2")}
@font-face{font-family:"Saira Condensed";font-weight:600;font-display:swap;src:url(../fonts/saira-condensed-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:"Saira Condensed";font-weight:700;font-display:swap;src:url(../fonts/saira-condensed-latin-700-normal.woff2) format("woff2")}
@font-face{font-family:"Saira Condensed";font-weight:800;font-display:swap;src:url(../fonts/saira-condensed-latin-800-normal.woff2) format("woff2")}

:root{
  --bg:#070b16;--bg2:#0b1222;--panel:#111a2e;--panel2:#162138;--line:rgba(255,255,255,.09);--line2:rgba(255,255,255,.16);
  --text:#eef2fb;--mute:#9aa6c4;--dim:#6b779a;
  --orange:#ff7b1c;--orange2:#ffb347;--cyan:#35d7ff;--live:#ff3b5c;--green:#3ddc84;--pba-blue:#2f6bff;--pba-red:#ff3b5c;--mpl:#b06bff;
  --font:"Saira",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;--cond:"Saira Condensed","Saira",Impact,sans-serif;
  /* remap legacy style.css tokens so leftover rules stay readable on dark */
  --ink:#eef2fb;--muted:#9aa6c4;--purple:#ffb347;--purple-2:#ff7b1c;--pink:#ff7b1c;--gold:#ffb347;--paper:#070b16;--soft:#0b1222;--shadow:0 20px 50px rgba(0,0,0,.45);--radius:22px;--shell:1180px
}
html{scroll-padding-top:92px}
body.cs-body{background:var(--bg);color:var(--text);font-family:var(--font);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased}
body.cs-body::before{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;background:
  radial-gradient(900px 480px at 90% -10%,rgba(255,123,28,.16),transparent 60%),
  radial-gradient(700px 500px at -10% 60%,rgba(47,107,255,.14),transparent 60%),
  linear-gradient(rgba(255,255,255,.028) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.028) 1px,transparent 1px);
  background-size:auto,auto,48px 48px,48px 48px}
body.cs-body>header,body.cs-body>main,body.cs-body>footer,body.cs-body>.cs-ticker{position:relative;z-index:1}
h1,h2,h3,.cs-body .section-head h2,.cs-body .guide-intro h2,.cs-body .app-banner h2{font-family:var(--cond);text-transform:uppercase;letter-spacing:.005em;line-height:1.02}
.cs-body .section-head h2,.cs-body .guide-intro h2,.cs-body .app-banner h2,.cs-body .history-section h2{font-size:clamp(30px,3.8vw,46px);font-weight:800;color:#fff}
.cs-body .kicker,.cs-body .eyebrow{color:var(--orange2);font-family:var(--font);letter-spacing:.16em;font-weight:700;font-size:11px}
.cs-body .kicker::before{content:"";display:inline-block;width:18px;height:2px;background:var(--orange);margin-right:8px;vertical-align:middle}
.cs-body .section-note,.cs-body .status-meta{color:var(--mute);font-weight:600}
.cs-body .pulse{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--green);box-shadow:0 0 0 4px rgba(61,220,132,.18)}
.cs-body a:focus-visible,.cs-body button:focus-visible{outline:3px solid var(--cyan);outline-offset:3px}
.cs-body .skip-link{background:var(--orange);color:#1a0d02;font-weight:700}

/* ---------- header ---------- */
.cs-body .site-header.cs-header{position:sticky;top:0;z-index:60;background:rgba(7,11,22,.74);border-bottom:1px solid var(--line);backdrop-filter:blur(16px) saturate(140%);-webkit-backdrop-filter:blur(16px) saturate(140%);box-shadow:none}
.cs-body .cs-header .header-inner{height:72px;gap:20px}
.cs-body .cs-brand{gap:12px}
.cs-body .cs-brand img{width:96px;height:36px;object-fit:contain}
.cs-body .cs-brand span{padding-left:12px;border-left:1px solid var(--line2)}
.cs-body .cs-brand strong{font-family:var(--cond);font-size:15px;letter-spacing:.16em;color:var(--orange2)}
.cs-body .cs-brand small{margin-top:4px;color:var(--dim);font-size:10px;letter-spacing:.1em}
.cs-body .cs-nav{display:flex;gap:2px;margin-left:auto;color:var(--mute);font-size:13px;font-weight:600}
.cs-body .cs-nav a{display:block;padding:8px 12px;border-radius:9px;transition:background .2s,color .2s}
.cs-body .cs-nav a::after{display:none}
.cs-body .cs-nav a:hover,.cs-body .cs-nav a:focus-visible{background:rgba(255,255,255,.07);color:#fff}
.cs-body .cs-cta{display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border-radius:999px;background:var(--orange);color:#1a0d02;font-size:13px;font-weight:700;box-shadow:0 10px 24px -10px rgba(255,123,28,.8);white-space:nowrap}
.cs-body .cs-cta:hover{background:#ff9240}

/* ---------- hero ---------- */
.cs-body .cs-hero{background:#070b16;color:#fff;overflow:hidden}
.cs-body .cs-hero::before{display:none}
.cs-body .cs-hero .hero-video-bg__poster{opacity:.55;object-fit:cover;object-position:70% center}
.cs-body .cs-hero .hero-video-bg__scrim{background:linear-gradient(90deg,rgba(7,11,22,.96) 0%,rgba(7,11,22,.82) 42%,rgba(7,11,22,.38) 100%),linear-gradient(180deg,rgba(7,11,22,.1),rgba(7,11,22,.95))}
.cs-body .cs-hero .hero-noise{display:none}
.cs-body .cs-hero-grid{grid-template-columns:1.12fr .88fr;min-height:560px;padding-block:64px 56px;gap:32px}
.cs-body .cs-eyebrow{color:var(--orange2);font-size:11px;letter-spacing:.18em}
.cs-body .cs-eyebrow .eyebrow-pulse{width:8px;height:8px;border-radius:50%;background:var(--live);box-shadow:0 0 0 5px rgba(255,59,92,.18);animation:cs-blink 1.6s infinite}
@keyframes cs-blink{50%{opacity:.35}}
.cs-body .cs-hero h1{margin:18px 0 16px;max-width:760px;font-family:var(--cond);font-size:clamp(50px,7.4vw,96px);font-weight:800;line-height:.94;letter-spacing:.005em;text-transform:uppercase}
.cs-body .cs-hero h1 em{font-style:normal;color:var(--orange)}
.cs-body .cs-hero .hero-lede{max-width:600px;margin-bottom:26px;color:#c5cee6;font-size:clamp(16px,1.6vw,18px);line-height:1.65}
.cs-body .cs-hero .hero-lede strong{color:#fff;font-weight:600}
.cs-body .button{font-family:var(--font);font-weight:700;border-radius:999px;min-height:50px;padding:12px 22px;letter-spacing:.01em}
.cs-body .button.primary{background:linear-gradient(135deg,var(--orange),#ff5a1f);color:#1a0d02;box-shadow:0 14px 32px -12px rgba(255,123,28,.9)}
.cs-body .button.primary svg,.cs-body .button.ghost svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.cs-body .button.ghost{background:rgba(255,255,255,.07);color:#fff;border:1px solid var(--line2);backdrop-filter:blur(8px)}
.cs-body .button.ghost:hover{background:rgba(255,255,255,.13)}
.cs-body .button.light{background:#fff;color:#0b1222}
.cs-body .cs-proof{display:flex;flex-wrap:wrap;gap:10px 22px;margin-top:26px;padding-top:20px;border-top:1px solid var(--line);color:var(--mute);font-size:13px}
.cs-body .cs-proof span{display:inline-flex;align-items:center;gap:8px}
.cs-body .cs-proof i{width:8px;height:8px;border-radius:2px;background:var(--cyan)}
.cs-body .cs-proof strong{color:#fff;font-weight:700}
.cs-body .cs-hero .source-note{margin-top:16px;color:var(--dim);font-size:12px;max-width:600px}
.cs-body .hero-video-toggle{margin-top:14px;padding:8px 14px;border:1px solid var(--line2);border-radius:999px;background:rgba(7,11,22,.6);color:#fff;font-size:12px;display:inline-flex;align-items:center;gap:8px;cursor:pointer}
.cs-body .hero-video-toggle span{width:7px;height:7px;border-radius:50%;background:var(--orange)}
/* scoreboard art */
.cs-body .cs-art{position:relative;display:grid;place-items:center;min-width:0}
.cs-body .cs-board{position:relative;z-index:2;width:min(100%,400px);padding:22px 24px 20px;border-radius:26px;background:linear-gradient(160deg,rgba(17,26,46,.92),rgba(11,18,34,.9));border:1px solid var(--line2);box-shadow:0 40px 90px -30px rgba(0,0,0,.9),inset 0 1px 0 rgba(255,255,255,.08);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.cs-body .cs-board__head{display:flex;justify-content:space-between;align-items:center;font-size:10px;font-weight:700;letter-spacing:.16em;color:var(--mute)}
.cs-body .cs-board__live{display:inline-flex;align-items:center;gap:7px;color:#fff}
.cs-body .cs-board__live i{width:7px;height:7px;border-radius:50%;background:var(--live);box-shadow:0 0 0 4px rgba(255,59,92,.2);animation:cs-blink 1.4s infinite}
.cs-body .cs-board__clock{display:block;margin-top:14px;font-family:var(--cond);font-size:clamp(64px,7vw,92px);font-weight:800;line-height:.9;color:#fff;letter-spacing:.02em;font-variant-numeric:tabular-nums;text-shadow:0 0 40px rgba(255,123,28,.35)}
.cs-body .cs-board__sub{display:block;margin-top:8px;color:var(--dim);font-size:10px;letter-spacing:.16em;font-weight:600}
.cs-body .cs-board__leagues{display:flex;gap:6px;margin-top:16px}
.cs-body .cs-lg{font-family:var(--cond);font-weight:800;font-size:13px;letter-spacing:.1em;padding:6px 12px;border-radius:8px;color:#fff}
.cs-body .cs-lg--nba{background:linear-gradient(135deg,#1d428a,#c8102e)}
.cs-body .cs-lg--pba{background:linear-gradient(135deg,var(--pba-blue),var(--pba-red))}
.cs-body .cs-lg--mpl{background:linear-gradient(135deg,#6a2bd9,var(--mpl))}
.cs-body .cs-board__rows{list-style:none;margin:16px 0 0;padding:0;display:grid;gap:6px}
.cs-body .cs-board__rows li{display:flex;justify-content:space-between;align-items:center;padding:9px 12px;border-radius:12px;background:rgba(255,255,255,.04);border:1px solid var(--line);font-size:12px;color:var(--mute)}
.cs-body .cs-board__rows b{color:#fff;font-weight:600}
.cs-body .cs-board__bars{display:flex;gap:4px;align-items:flex-end;height:18px;margin-top:16px}
.cs-body .cs-board__bars span{width:5px;border-radius:3px;background:linear-gradient(var(--orange2),var(--orange));animation:cs-bars .9s ease-in-out infinite alternate}
.cs-body .cs-board__bars span:nth-child(1){height:40%}.cs-body .cs-board__bars span:nth-child(2){height:80%;animation-delay:.15s}.cs-body .cs-board__bars span:nth-child(3){height:55%;animation-delay:.3s}.cs-body .cs-board__bars span:nth-child(4){height:95%;animation-delay:.45s}.cs-body .cs-board__bars span:nth-child(5){height:60%;animation-delay:.6s}
@keyframes cs-bars{to{transform:scaleY(.45)}}
.cs-body .cs-ball{position:absolute;z-index:1;right:-30px;top:-80px;width:260px;height:260px;filter:drop-shadow(0 30px 40px rgba(0,0,0,.6));animation:cs-float 6s ease-in-out infinite}
@keyframes cs-float{50%{transform:translateY(-14px) rotate(4deg)}}

/* ticker */
.cs-ticker{border-block:1px solid var(--line);background:var(--bg2);overflow:hidden}
.cs-ticker ul{list-style:none;margin:0;padding:11px 0;display:flex;gap:44px;white-space:nowrap;width:max-content;animation:cs-tick 42s linear infinite}
.cs-ticker li{font-size:13px;color:var(--mute)}
.cs-ticker li b{font-family:var(--cond);font-size:15px;letter-spacing:.08em;color:var(--orange2);margin-right:8px}
@keyframes cs-tick{to{transform:translateX(-50%)}}

/* ---------- sections ---------- */
.cs-body .live-center-section{padding:64px 0 24px;background:transparent}
.cs-body .score-section,.cs-body .history-section,.cs-body .video-section,.cs-body .prediction-section,.cs-body .guide-section,.cs-body .faq-section{padding:64px 0;background:transparent;color:var(--text)}
.cs-body .history-section{background:linear-gradient(180deg,var(--bg2),transparent)}
.cs-body .video-section{background:transparent;color:var(--text)}
.cs-body .prediction-section{background:linear-gradient(180deg,transparent,var(--bg2))}
.cs-body .guide-section{background:transparent}
.cs-body .section-head{margin-bottom:26px}
.cs-body .live-center-heading .section-note{color:var(--mute)}
.cs-body .attribution{color:var(--dim);font-size:12px}
.cs-body .inline-empty{border:1px dashed var(--line2);color:var(--mute);background:rgba(255,255,255,.02)}

/* live tabs */
.cs-body .live-league-switcher{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:18px}
.cs-body .live-league-tab{display:flex;align-items:center;gap:12px;padding:12px 14px;border:1px solid var(--line);border-radius:16px;background:var(--panel);color:var(--mute);cursor:pointer;text-align:left;transition:border-color .2s,background .2s}
.cs-body .live-league-tab:hover{border-color:var(--line2)}
.cs-body .live-league-tab.is-active{background:linear-gradient(135deg,rgba(255,123,28,.16),rgba(255,123,28,.05));border-color:rgba(255,123,28,.5);color:#fff}
.cs-body .live-league-tab__mark{display:grid;place-items:center;min-width:48px;height:34px;padding:0 10px;border-radius:9px;background:rgba(255,255,255,.08);font-family:var(--cond);font-weight:800;letter-spacing:.1em;font-size:13px;color:#fff}
.cs-body .live-league-tab.is-active .live-league-tab__mark{background:var(--orange);color:#1a0d02}
.cs-body .live-league-tab__copy{display:grid;gap:2px;min-width:0}
.cs-body .live-league-tab__copy strong{font-size:14px;font-weight:600}
.cs-body .live-league-tab__copy small{font-size:9px;letter-spacing:.12em;font-weight:700;color:var(--orange2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cs-body .live-league-tab.is-live .live-league-tab__copy small,.cs-body .live-league-tab[data-live-state="live"] small{color:var(--live)}
/* live card */
.cs-body .league-live-card{border:1px solid var(--line2);border-radius:26px;background:var(--panel);box-shadow:0 30px 70px -30px rgba(0,0,0,.8)}
.cs-body .league-live-card.is-live{box-shadow:0 30px 80px -30px rgba(255,59,92,.45),inset 0 0 0 1px rgba(255,59,92,.35)}
.cs-body .league-live-card__visual{background:#0b1222}
.cs-body .league-live-card__visual::after{background:linear-gradient(0deg,rgba(17,26,46,.95),transparent 55%)}
.cs-body .league-live-card__brand{font-family:var(--cond);letter-spacing:.14em;background:rgba(7,11,22,.8);border-color:var(--line2)}
.cs-body .league-live-card__status{color:var(--orange2);font-size:10px;letter-spacing:.14em}
.cs-body .league-live-card__status i{background:var(--orange2)}
.cs-body .league-live-card__status.is-live{color:#fff}
.cs-body .league-live-card__status.is-live i{background:var(--live)}
.cs-body .league-live-card__timezone{color:var(--dim)}
.cs-body .league-live-card__body h3{font-family:var(--cond);font-weight:800;font-size:clamp(26px,2.4vw,36px);letter-spacing:.005em}
.cs-body .league-live-card__description{color:var(--mute)}
.cs-body .league-live-card__countdown span{background:rgba(255,255,255,.04);border-color:var(--line)}
.cs-body .league-live-card__countdown strong{font-family:var(--cond);font-size:26px;color:var(--orange2)}
.cs-body .league-live-card__countdown small{color:var(--dim)}
.cs-body .league-live-card__meta span{background:rgba(255,255,255,.05);border-color:var(--line);color:var(--mute)}
.cs-body .league-live-card__actions .text-button{color:var(--orange2);font-weight:700}
.cs-body .league-live-card__note{color:var(--dim)}
.cs-body .league-live-card__live-choice{background:rgba(255,255,255,.05);border-color:var(--line)}
.cs-body .league-live-card__live-choice small{color:var(--orange2)}
.cs-body .league-live-card__loading{padding:60px 24px;text-align:center;color:var(--mute)}
.cs-body .live-multiview{background:var(--panel);border:1px solid var(--line);border-radius:20px}
.cs-body .watch-live-btn,.cs-body .waiting-room-btn{font-weight:700}

/* league switcher */
.cs-body .league-switcher__button{border:1px solid var(--line);border-radius:14px;background:var(--panel);color:var(--mute);box-shadow:none;font-weight:600}
.cs-body .league-switcher__button:hover{border-color:var(--line2);transform:translateY(-1px)}
.cs-body .league-switcher__button.is-active{background:linear-gradient(135deg,rgba(255,123,28,.18),rgba(255,123,28,.06));border-color:rgba(255,123,28,.55);color:#fff;box-shadow:0 12px 30px -16px rgba(255,123,28,.8)}
.cs-body .league-switcher__mark{background:rgba(255,255,255,.08);color:#fff;font-family:var(--cond);font-size:12px;letter-spacing:.1em}
.cs-body .league-switcher__button.is-active .league-switcher__mark{background:var(--orange);color:#1a0d02}
.cs-body .league-switcher__button>b{background:rgba(255,255,255,.08);color:var(--mute)}
.cs-body .league-switcher__button.is-active>b{background:#fff;color:#1a0d02}
.cs-body .league-switcher__quality{color:var(--dim)}
.cs-body .league-switcher__quality i{background:var(--green);box-shadow:0 0 0 4px rgba(61,220,132,.14)}

/* toolbar / filters */
.cs-body .toolbar{border:1px solid var(--line);border-radius:16px;background:var(--panel);box-shadow:none}
.cs-body .filter{color:var(--mute);border-radius:11px;font-weight:600}
.cs-body .filter:hover{color:#fff}
.cs-body .filter.active{background:#fff;color:#0b1222}
.cs-body .filter b{display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 6px;margin-left:4px;border-radius:999px;background:rgba(255,255,255,.1);font-size:11px}
.cs-body .filter.active b{background:var(--orange);color:#1a0d02}
.cs-body .icon-button{color:var(--orange2);font-weight:700}
.cs-body .text-button{color:var(--orange2);font-weight:700;background:none;border:0;cursor:pointer}
.cs-body .score-checking{border:1px solid var(--line);background:var(--panel);color:var(--mute);border-radius:16px}
.cs-body .schedule-summary{border:1px solid var(--line);border-left:4px solid var(--orange2);background:rgba(255,179,71,.08);color:#ffd9a8;border-radius:14px}
.cs-body .schedule-summary.live{border-left-color:var(--live);background:rgba(255,59,92,.1);color:#ffb3c0}
.cs-body .empty-state{border:1px dashed var(--line2);background:var(--panel);border-radius:26px}
.cs-body .empty-state h3{font-family:var(--cond);font-size:28px;font-weight:700;color:#fff}
.cs-body .empty-state p:not(.kicker){color:var(--mute)}
.cs-body .empty-ball{width:46px;height:46px;margin:0 auto 14px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#ffb347,#ff5a1f 70%);box-shadow:0 14px 30px -10px rgba(255,123,28,.8)}
.cs-body .error-state{border:1px solid rgba(255,59,92,.35);background:rgba(255,59,92,.08);color:#ffc2cc;border-radius:14px}

/* game cards */
.cs-body .game-card,.cs-body .history-grid .game-card,.cs-body .game-card[data-league="PBA"],.cs-body .history-grid .game-card[data-league="PBA"]{border:1px solid var(--line);border-radius:22px;background:linear-gradient(160deg,var(--panel2),var(--panel));box-shadow:0 20px 50px -30px rgba(0,0,0,.9);color:var(--text);transition:transform .25s,border-color .25s}
.cs-body .game-card:hover{transform:translateY(-4px);border-color:var(--line2)}
.cs-body .game-card:before{height:3px;background:linear-gradient(90deg,var(--orange),var(--orange2))}
.cs-body .game-card[data-league="PBA"]:before{background:linear-gradient(90deg,var(--pba-blue) 0 50%,var(--pba-red) 50%)}
.cs-body .game-card[data-league="NBA"]:before{background:linear-gradient(90deg,#1d428a 0 50%,#c8102e 50%)}
.cs-body .game-card[data-league="ESPORTS"]:before{background:linear-gradient(90deg,#6a2bd9,var(--mpl))}
.cs-body .game-top,.cs-body .history-grid .game-top{color:var(--mute);font-weight:600}
.cs-body .league-pill,.cs-body .game-card[data-league="PBA"] .league-pill{background:rgba(255,255,255,.1);color:#fff;font-family:var(--cond);letter-spacing:.1em;font-size:10px}
.cs-body .game-card[data-league="PBA"] .league-pill{background:linear-gradient(90deg,var(--pba-blue) 0 50%,var(--pba-red) 50%)}
.cs-body .game-card[data-league="NBA"] .league-pill{background:linear-gradient(90deg,#1d428a 0 50%,#c8102e 50%)}
.cs-body .game-card[data-league="ESPORTS"] .league-pill{background:linear-gradient(90deg,#6a2bd9,var(--mpl))}
.cs-body .game-status,.cs-body .history-grid .game-status{background:rgba(255,255,255,.08);color:#fff;font-weight:700}
.cs-body .game-status.live{background:var(--live);color:#fff;box-shadow:0 0 0 4px rgba(255,59,92,.18)}
.cs-body .game-media{background:linear-gradient(135deg,#0b1222,#162138)}
.cs-body .game-media-status,.cs-body .game-media--final .game-media-status{background:rgba(7,11,22,.82);border:1px solid var(--line2);font-size:8px}
.cs-body .game-media-status--count{background:linear-gradient(135deg,var(--orange),#ff5a1f);border:0;color:#1a0d02}
.cs-body .game-media--scheduled .game-media-status{background:linear-gradient(135deg,#2f6bff,#6a2bd9)}
.cs-body .team-mark,.cs-body .history-grid .team-mark{border:1px solid var(--line2);background:rgba(255,255,255,.06);color:#fff;font-family:var(--cond);font-size:13px;letter-spacing:.06em;border-radius:12px}
.cs-body .team-name strong{color:#fff;font-weight:600}
.cs-body .team-name small,.cs-body .history-grid .team-name small{color:var(--dim)}
.cs-body .team-score{font-family:var(--cond);font-size:34px;font-weight:800;color:#fff;letter-spacing:.01em}
.cs-body .game-footer,.cs-body .history-grid .game-footer{border-top:1px solid var(--line);color:var(--dim)}
.cs-body .highlight-btn,.cs-body .history-grid .highlight-btn{background:#fff;color:#0b1222;border-radius:999px;padding:8px 13px;font-weight:700;transition:background .2s}
.cs-body .highlight-btn:hover{background:var(--orange2)}
.cs-body .highlight-btn.is-pending{background:rgba(255,255,255,.08);color:var(--mute)}
.cs-body .replay-pending{border-color:var(--line);background:rgba(255,255,255,.05);color:var(--mute)}
.cs-body .esports-load-more{background:var(--panel);border:1px solid var(--line2);color:#fff;border-radius:999px;padding:12px 20px;font-weight:700;cursor:pointer}

/* videos */
.cs-body .video-card{border:1px solid var(--line);border-radius:22px;background:linear-gradient(160deg,var(--panel2),var(--panel));box-shadow:0 20px 50px -30px rgba(0,0,0,.9);transition:transform .25s,border-color .25s}
.cs-body .video-card:hover{transform:translateY(-4px);border-color:var(--line2)}
.cs-body .video-thumb{background:#0b1222;border:0;padding:0;width:100%;cursor:pointer}
.cs-body .video-play{background:var(--orange);color:#1a0d02;box-shadow:0 10px 24px -8px rgba(255,123,28,.9)}
.cs-body .video-source{color:var(--orange2)}
.cs-body .video-body h3{font-family:var(--font);text-transform:none;letter-spacing:0;font-size:15px;line-height:1.45;font-weight:600}
.cs-body .video-title-button{background:none;border:0;padding:0;color:#fff;text-align:left;cursor:pointer;font:inherit}
.cs-body .video-title-button:hover{color:var(--orange2)}
.cs-body .video-body time{color:var(--dim)}
.cs-body .video-loading div{background:linear-gradient(100deg,rgba(255,255,255,.04) 20%,rgba(255,255,255,.09) 40%,rgba(255,255,255,.04) 60%);background-size:200% 100%}

/* predictions */
.cs-body .prediction-copy>p:not(.kicker):not(.prediction-disclaimer){color:var(--mute)}
.cs-body .model-facts span{border:1px solid var(--line);background:var(--panel);color:var(--mute);border-radius:14px}
.cs-body .model-facts strong{color:var(--orange2)}
.cs-body .prediction-disclaimer{border-left:3px solid var(--orange2);background:rgba(255,179,71,.07);color:#e6d7c2;border-radius:0 12px 12px 0}
.cs-body .prediction-card{border:1px solid var(--line);border-radius:22px;background:linear-gradient(160deg,var(--panel2),var(--panel));box-shadow:0 20px 50px -30px rgba(0,0,0,.9)}
.cs-body .prediction-head{color:var(--mute)}
.cs-body .confidence{background:rgba(255,255,255,.08);color:#fff;font-weight:700}
.cs-body .forecast-team strong{color:#fff;font-weight:600}
.cs-body .forecast-team b{font-family:var(--cond);font-size:24px;color:var(--mute)}
.cs-body .forecast-team.is-predicted-winner strong,.cs-body .forecast-team.is-predicted-winner>b{color:var(--orange2)}
.cs-body .forecast-bar{background:rgba(255,255,255,.08)}
.cs-body .forecast-bar i{background:linear-gradient(90deg,var(--orange),var(--orange2))}
.cs-body .prediction-verdict{background:rgba(255,255,255,.04);border:1px solid var(--line)}
.cs-body .prediction-verdict strong{color:#fff}
.cs-body .prediction-verdict p{color:var(--mute)}
.cs-body .prediction-ai-badge{background:var(--orange);color:#1a0d02;box-shadow:none}
.cs-body .prediction-factors li{color:var(--mute)}
.cs-body .prediction-factors li::before{background:var(--cyan)}
.cs-body .prediction-meta{border-top:1px solid var(--line)}
.cs-body .prediction-meta span{background:rgba(255,255,255,.06);color:var(--mute)}
.cs-body .prediction-empty{border:1px dashed var(--line2);background:var(--panel);color:var(--text)}
.cs-body .prediction-empty>span{background:linear-gradient(135deg,var(--orange),#ff5a1f);color:#1a0d02}
.cs-body .prediction-empty p{color:var(--mute)}
.cs-body .prediction-history{color:var(--mute)}

/* guide */
.cs-body .guide-intro p:not(.kicker){color:var(--mute)}
.cs-body .cs-links{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.cs-body .cs-links a{padding:8px 13px;border-radius:999px;border:1px solid var(--line2);background:rgba(255,255,255,.05);color:#fff;font-size:13px;font-weight:600;transition:background .2s}
.cs-body .cs-links a:hover{background:rgba(255,255,255,.12)}
.cs-body .guide-cards article{border:1px solid var(--line);background:var(--panel);border-radius:20px;min-height:200px}
.cs-body .guide-cards span{background:rgba(255,123,28,.14);color:var(--orange2);font-family:var(--cond);font-size:15px;border-radius:10px}
.cs-body .guide-cards h3{font-size:20px;font-weight:700;color:#fff}
.cs-body .guide-cards p{color:var(--mute)}

/* faq */
.cs-body .faq-list{border-top:1px solid var(--line)}
.cs-body .faq-list details{border-bottom:1px solid var(--line)}
.cs-body .faq-list summary{color:#fff;font-weight:600;font-size:16px}
.cs-body .faq-list summary span:before,.cs-body .faq-list summary span:after{border-top-color:var(--orange2)}
.cs-body .faq-list details p{color:var(--mute)}
.cs-body .faq-list details[open] summary{color:var(--orange2)}

/* banner + rg */
.cs-body .app-banner{padding:0 0 40px}
.cs-body .app-banner-inner{display:grid;grid-template-columns:1.3fr auto;gap:24px;align-items:center;padding:36px 40px;border-radius:28px;background:radial-gradient(120% 140% at 100% 0%,rgba(255,123,28,.4),transparent 55%),radial-gradient(90% 120% at 0% 100%,rgba(47,107,255,.35),transparent 55%),var(--panel);border:1px solid var(--line2)}
.cs-body .app-banner .kicker{color:var(--orange2)}
.cs-body .app-banner h2{font-size:clamp(28px,3.6vw,40px)}
.cs-body .app-banner p:last-child{color:var(--mute)}
.cs-body .cs-banner__actions{display:grid;gap:10px}
.cs-body .cs-banner__actions .button{width:100%}
.cs-rg{padding:0 0 56px}
.cs-rg__box{display:grid;grid-template-columns:auto 1fr;gap:20px;align-items:center;padding:22px 26px;border-radius:22px;background:var(--panel);border:1px solid var(--line)}
.cs-rg__age{width:60px;height:60px;border-radius:16px;border:2px solid var(--orange2);display:grid;place-items:center;font-family:var(--cond);font-weight:800;color:var(--orange2);font-size:20px}
.cs-rg h2{font-size:20px;font-weight:700;margin:0 0 6px;color:#fff}
.cs-rg p{margin:0;color:var(--mute);font-size:14px}
.cs-rg a{color:#fff;text-decoration:underline}

/* footer */
.cs-body .footer{background:#05080f;border-top:1px solid var(--line);color:var(--mute);padding:40px 0 36px}
.cs-body .footer-inner{grid-template-columns:1.4fr auto;align-items:start;gap:26px}
.cs-body .cs-footer__logo{width:120px;height:45px;margin-bottom:12px}
.cs-body .footer strong{color:#fff;font-family:var(--cond);letter-spacing:.08em;text-transform:uppercase}
.cs-body .footer p{color:var(--dim);max-width:460px}
.cs-body .cs-footer__pg{width:260px;height:34px;margin-top:14px;opacity:.9}
.cs-body .footer nav{display:flex;flex-wrap:wrap;gap:8px 20px;font-size:13px;font-weight:600}
.cs-body .footer nav a{color:var(--mute)}
.cs-body .footer nav a:hover{color:#fff}
.cs-body .cs-footer__legal{margin-top:12px;font-size:12px!important}
.cs-body .cs-footer__legal a{text-decoration:underline;color:var(--dim)}
.cs-body .footer-inner>p{grid-column:1/-1;border-top:1px solid var(--line);padding-top:16px;font-size:12px}

/* dialogs */
.cs-body .video-dialog{background:#0b1222;border:1px solid var(--line2)}
.cs-body .video-dialog::backdrop{background:rgba(3,5,12,.8)}
.cs-body .dialog-head h2{font-family:var(--font);text-transform:none;letter-spacing:0;font-size:17px;font-weight:600}
.cs-body .dialog-head button{background:rgba(255,255,255,.1)}
.cs-body .highlight-gallery{background:var(--panel);border-top:1px solid var(--line)}
.cs-body .dialog-live-label{color:var(--live);font-weight:700;font-size:11px;letter-spacing:.14em}
.cs-body .live-player-message{color:#fff}
.cs-body .live-dialog-source{color:var(--dim);font-size:12px;padding:0 18px 16px}

/* back to top, side button, dock */
.cs-body .back-to-top{background:var(--orange);color:#1a0d02;border:0;border-radius:14px}
.cs-body .bp-side-button img{width:84px;height:84px}
@media (max-width:680px){
  .cs-body .mobile-dock.mobile-dock--courtside{background:rgba(11,18,34,.94);border-color:var(--line2);box-shadow:0 16px 40px rgba(0,0,0,.6)}
  .cs-body .mobile-dock.mobile-dock--courtside::before{background:linear-gradient(110deg,rgba(255,123,28,.5),rgba(255,59,92,.25) 50%,rgba(47,107,255,.3));opacity:.8}
  .cs-body .mobile-dock.mobile-dock--courtside a{color:var(--mute)}
  .cs-body .mobile-dock.mobile-dock--courtside a.active{background:rgba(255,255,255,.08);color:#fff}
  .cs-body .mobile-dock.mobile-dock--courtside a img{filter:drop-shadow(0 4px 8px rgba(0,0,0,.5))}
}

/* ---------- responsive ---------- */
@media (max-width:1024px){
  .cs-body .cs-hero-grid{grid-template-columns:1fr;min-height:0;padding-block:52px 40px}
  .cs-body .cs-art{display:grid;margin-top:8px}
  .cs-body .cs-ball{display:none}
  .cs-body .cs-board{width:100%}
  .cs-body .app-banner-inner{grid-template-columns:1fr}
}
@media (max-width:900px){
  .cs-body .hero-art.cs-art{display:grid}
  .cs-body .cs-nav,.cs-body .cs-cta{display:none}
  .cs-body .cs-header .header-inner{height:64px}
}
@media (max-width:680px){
  .cs-body .site-header.cs-header{position:sticky}
  .cs-body .cs-hero h1{font-size:clamp(44px,13vw,60px)}
  .cs-body .cs-hero .hero-lede{font-size:15px}
  .cs-body .hero-actions{grid-template-columns:1fr}
  .cs-body .cs-proof{gap:8px 14px;font-size:12px}
  .cs-body .cs-board{padding:18px 18px 16px}
  .cs-body .cs-board__clock{font-size:60px}
  .cs-body .live-league-switcher{grid-template-columns:1fr;gap:8px}
  .cs-body .live-league-tab{padding:10px 12px}
  .cs-body .score-section,.cs-body .history-section,.cs-body .video-section,.cs-body .prediction-section,.cs-body .guide-section,.cs-body .faq-section{padding:48px 0}
  .cs-body .section-head h2{font-size:30px}
  .cs-body .league-switcher__button{font-size:12px}
  .cs-body .app-banner-inner{padding:26px 20px}
  .cs-rg__box{grid-template-columns:1fr;padding:20px}
  .cs-body .footer-inner{grid-template-columns:1fr}
  .cs-body .footer nav{grid-row:auto}
  .cs-body .footer-inner>p{grid-column:1}
  .cs-body .cs-eyebrow{font-size:10px;letter-spacing:.12em}
  .cs-ticker li{font-size:12px}
  .cs-body .bp-side-button img{width:64px;height:64px}
  .cs-body .back-to-top{bottom:calc(92px + env(safe-area-inset-bottom))}
}
@media (prefers-reduced-motion:reduce){
  .cs-ticker ul,.cs-body .cs-board__bars span,.cs-body .cs-ball,.cs-body .cs-eyebrow .eyebrow-pulse,.cs-body .cs-board__live i{animation:none!important}
}
