/* PointsBall Frontier 2.22 — Light Mode First, Event Centers & Play Slip */

/* ------------------------------------------------------------------
   Identity must be visible, not theoretical.
   ------------------------------------------------------------------ */
.score-watermark{opacity:.075;z-index:0;font-size:28px;right:64px;color:color-mix(in srgb,var(--ink) 72%,transparent)}
.score-command-row>*:not(.score-watermark){position:relative;z-index:1}
.game-card:before,.real-card:before{opacity:.065;font-size:28px;z-index:0}
.game-card>* ,.real-card>*{position:relative;z-index:1}
.play-entry-watermark{opacity:.06;font-size:30px;z-index:0}.play-entry>*:not(.play-entry-watermark){position:relative;z-index:1}
.prime-next-lock:after{opacity:.065;font-size:34px}

.score-command-row.universe-prime{border-left:4px solid var(--blue-ink)}
.score-command-row.universe-virtual{border-left:4px solid var(--orange-ink)}
.score-command-row.universe-prime .score-source>b{color:var(--blue-ink)}
.score-command-row.universe-virtual .score-source>b{color:var(--orange-ink)}
.real-card .real-card-head{background:color-mix(in srgb,var(--blue) 7%,var(--panel))}
.game-card .game-card-head{background:color-mix(in srgb,var(--orange) 7%,var(--panel))}

/* ------------------------------------------------------------------
   Event-level Virtual center. Tapping a score should feel intentional.
   ------------------------------------------------------------------ */
.virtual-game-center{position:relative;overflow:hidden;border-color:color-mix(in srgb,var(--league-accent) 50%,var(--line2));box-shadow:0 20px 55px var(--shadow-soft),inset 4px 0 color-mix(in srgb,var(--league-accent) 72%,transparent)}
.game-center-watermark{position:absolute;right:-18px;top:78px;pointer-events:none;transform:rotate(-8deg);font:950 clamp(28px,6vw,68px) var(--mono);letter-spacing:.11em;color:var(--league-accent);opacity:.07;white-space:nowrap}
.virtual-market-panel{border-top:3px solid color-mix(in srgb,var(--league-accent) 68%,transparent)}
.game-center-lines{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin-top:14px}
.game-center-lines .line-button{min-height:58px;padding:10px;border-radius:11px;font-size:13px}
.game-center-lines .line-button span{font-size:9px}
.game-center-state-callout{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:7px 15px;align-items:center;margin-top:14px;padding:15px 16px;border:1px solid var(--line);border-radius:12px;background:var(--panel2)}
.game-center-state-callout b,.game-center-state-callout span{display:block}.game-center-state-callout b{color:var(--cyan-ink);font:900 10px var(--mono);letter-spacing:.08em}.game-center-state-callout span{color:var(--muted);font-size:11px}.game-center-state-callout .btn{grid-column:2;grid-row:1/3}
.score-command-row,.ticker-game{transition:border-color .16s ease,background .16s ease,transform .16s ease}.score-command-row:hover{transform:translateX(2px)}

/* ------------------------------------------------------------------
   Play Slip: this is the action centerpiece, not a utility drawer.
   ------------------------------------------------------------------ */
.slip{--slip-accent:var(--cyan);--slip-accent-2:var(--violet);width:min(470px,100%);background:radial-gradient(circle at 85% 0,color-mix(in srgb,var(--slip-accent) 16%,transparent),transparent 29%),linear-gradient(180deg,var(--s3),var(--s1));border-left:1px solid color-mix(in srgb,var(--slip-accent) 46%,var(--line2))}
.slip[data-slip-universe="prime"]{--slip-accent:var(--blue);--slip-accent-2:var(--cyan)}
.slip[data-slip-universe="virtual"]{--slip-accent:var(--orange);--slip-accent-2:var(--amber)}
.slip[data-slip-universe="vba"]{--slip-accent:var(--orange);--slip-accent-2:var(--cyan)}
.slip[data-slip-universe="futures"]{--slip-accent:var(--amber);--slip-accent-2:var(--violet)}
.slip[data-slip-universe="card"]{--slip-accent:var(--cyan);--slip-accent-2:var(--violet)}
.slip:before{content:"POINTSBALL";position:absolute;right:-72px;top:41%;z-index:-1;transform:rotate(-90deg);font:950 56px var(--mono);letter-spacing:.14em;color:var(--slip-accent);opacity:.035;pointer-events:none}
.slip-head{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:10px;padding:16px 18px 15px;border-bottom:1px solid color-mix(in srgb,var(--slip-accent) 28%,var(--line));background:color-mix(in srgb,var(--s2) 92%,transparent);box-shadow:0 10px 32px var(--shadow-soft)}
.slip-head:after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:linear-gradient(90deg,var(--slip-accent),var(--slip-accent-2),transparent 84%)}
.slip-brand-lockup{display:flex;align-items:center;gap:11px;min-width:0}.slip-brand-orb{display:grid;place-items:center;width:46px;height:46px;border-radius:50%;border:2px solid color-mix(in srgb,var(--slip-accent) 60%,var(--line));background:radial-gradient(circle,var(--s8),var(--s2));box-shadow:0 0 0 4px color-mix(in srgb,var(--slip-accent) 8%,transparent),0 9px 22px var(--shadow-soft)}.slip-brand-orb img{width:42px;height:42px;object-fit:contain}.slip-head small{color:var(--slip-accent)!important;font-size:8px}.slip-head h2{font-size:21px;letter-spacing:-.025em}.slip-mode-badge{align-self:center;padding:6px 8px;border:1px solid color-mix(in srgb,var(--slip-accent) 45%,var(--line));border-radius:999px;background:color-mix(in srgb,var(--slip-accent) 10%,var(--panel));color:var(--slip-accent);font:900 7px var(--mono);letter-spacing:.1em}
#slipBody{padding-top:17px}
.slip-ticket{border-color:color-mix(in srgb,var(--slip-accent) 34%,var(--line2));background:radial-gradient(circle at 95% 0,color-mix(in srgb,var(--slip-accent) 13%,transparent),transparent 35%),linear-gradient(145deg,var(--s7),var(--s3));box-shadow:0 20px 50px var(--shadow-soft)}
.slip-ticket:before{width:4px;background:linear-gradient(var(--slip-accent),var(--slip-accent-2))}.slip-ticket:after{content:"POINTSBALL";position:absolute;right:-5px;bottom:20px;transform:rotate(-8deg);font:950 26px var(--mono);letter-spacing:.12em;color:var(--slip-accent);opacity:.045;pointer-events:none}
.slip-pick em{border-color:color-mix(in srgb,var(--slip-accent) 42%,var(--line));background:color-mix(in srgb,var(--slip-accent) 10%,transparent);color:var(--slip-accent)}
.slip .stake-field input{height:66px;border:2px solid color-mix(in srgb,var(--slip-accent) 35%,var(--line2));background:var(--s1);font-size:29px;letter-spacing:-.04em;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--slip-accent) 4%,transparent)}.slip .stake-field input:focus{border-color:var(--slip-accent);box-shadow:0 0 0 4px color-mix(in srgb,var(--slip-accent) 11%,transparent)}.stake-field>span{color:var(--slip-accent)}
.quick-stakes button{min-height:36px;background:var(--control-bg);color:var(--control-text);border-color:var(--control-border)}.quick-stakes button:hover{border-color:var(--slip-accent);color:var(--slip-accent);background:color-mix(in srgb,var(--slip-accent) 8%,var(--panel))}
.slip-breakdown{border-color:color-mix(in srgb,var(--slip-accent) 20%,var(--line));}.slip-breakdown .total{padding:15px;background:linear-gradient(100deg,color-mix(in srgb,var(--slip-accent) 9%,var(--s5)),var(--s5))}.slip-breakdown .total strong{font-size:22px;color:var(--slip-accent)}
.slip-actions #confirmBet{border:0;background:linear-gradient(120deg,var(--slip-accent),var(--slip-accent-2));color:var(--on-accent);box-shadow:0 12px 28px color-mix(in srgb,var(--slip-accent) 22%,transparent)}
.add-parlay{border-color:color-mix(in srgb,var(--slip-accent) 42%,var(--line2));background:color-mix(in srgb,var(--slip-accent) 7%,transparent);color:var(--slip-accent)}
.slip-empty{padding-top:0}.slip-empty-hero{display:grid;grid-template-columns:78px minmax(0,1fr);gap:15px;align-items:center;margin-bottom:15px;padding:17px;border:1px solid color-mix(in srgb,var(--slip-accent) 28%,var(--line));border-radius:16px;background:radial-gradient(circle at 0 0,color-mix(in srgb,var(--slip-accent) 14%,transparent),transparent 46%),var(--panel);overflow:hidden}.slip-empty-hero>span{display:grid;place-items:center;width:72px;height:72px;border-radius:50%;background:var(--s2);box-shadow:0 0 0 2px color-mix(in srgb,var(--slip-accent) 40%,transparent),0 10px 25px var(--shadow-soft)}.slip-empty-hero img{width:68px;height:68px;object-fit:contain}.slip-empty-hero small{color:var(--slip-accent);font:900 7px var(--mono);letter-spacing:.12em}.slip-empty-hero h3{margin:4px 0 5px;font-size:20px;line-height:1.05}.slip-empty-hero p{margin:0;color:var(--muted);font-size:10px;line-height:1.45}.slip-shortcut{background:var(--control-bg);color:var(--control-text);border-color:var(--control-border)}.slip-shortcut:hover{border-color:var(--slip-accent);background:color-mix(in srgb,var(--slip-accent) 7%,var(--panel))}.slip-shortcut i{color:var(--slip-accent)}
.card-slip-leg{padding:12px 13px;margin:0 8px;border-bottom-color:var(--line);border-radius:8px}.card-slip-leg:hover{background:color-mix(in srgb,var(--slip-accent) 5%,transparent)}.card-combined{margin:0 13px;padding:14px 0 10px}.card-combined strong{color:var(--slip-accent)}

/* ------------------------------------------------------------------
   LIGHT MODE — fully designed, not a dark theme with gray patches.
   ------------------------------------------------------------------ */
html[data-theme="light"] body{background:linear-gradient(180deg,#fbfdff 0,#f4f8fc 46%,#eef4f9 100%);color:#111827}
html[data-theme="light"] .topbar,html[data-theme="light"] .ticker,html[data-theme="light"] .rail{background:rgba(255,255,255,.97)}
html[data-theme="light"] .feature,html[data-theme="light"] .vba-hero,html[data-theme="light"] .sports-hero,html[data-theme="light"] .feed-command,html[data-theme="light"] .real-risk-command,html[data-theme="light"] .commissioner-command{background:linear-gradient(145deg,#fff,#f5f9fd 70%)!important;color:#111827}

/* Prime hero was the worst offender: remove the dark translucent quick strip. */
html[data-theme="light"] .real-showcase{position:relative;background:radial-gradient(circle at 78% -20%,rgba(31,111,224,.13),transparent 42%),linear-gradient(145deg,#fff,#f4f8ff 68%)!important;border-color:#b7cdea!important;box-shadow:0 18px 48px rgba(31,72,128,.12)!important;color:#111827}
html[data-theme="light"] .real-showcase:before{content:"PRIME";position:absolute;right:-18px;top:38%;transform:rotate(-8deg);font:950 clamp(42px,8vw,82px) var(--mono);letter-spacing:.12em;color:#1f6fe0;opacity:.075;pointer-events:none}
html[data-theme="light"] .showcase-top,html[data-theme="light"] .showcase-match,html[data-theme="light"] .showcase-quick{position:relative;z-index:1}
html[data-theme="light"] .showcase-top h2,html[data-theme="light"] .showcase-match>div b,html[data-theme="light"] .showcase-match>strong{color:#111827}
html[data-theme="light"] .showcase-top p,html[data-theme="light"] .showcase-match>div span,html[data-theme="light"] .showcase-match>strong small{color:#52647b}
html[data-theme="light"] .showcase-quick{background:#eef5ff!important;border-top-color:#c9d8eb}.showcase-quick span{border-right-color:var(--line)}
html[data-theme="light"] .showcase-quick span{color:#52647b!important}html[data-theme="light"] .showcase-quick b{color:#122138!important}html[data-theme="light"] .showcase-quick .source-health{color:#175fae!important}
html[data-theme="light"] .verified-seal{background:#fff;border-color:#b5cce6;color:#175fae;box-shadow:0 8px 20px rgba(40,75,120,.08)}

/* Distinct, readable Prime / Virtual results and cards. */
html[data-theme="light"] .score-command{background:#fff;border-color:#d4deea;box-shadow:0 10px 30px rgba(35,58,86,.06)}
html[data-theme="light"] .score-command-row{background:#fff;color:#152235;border-color:#dbe4ed}
html[data-theme="light"] .score-command-row.universe-prime{background:linear-gradient(90deg,#edf5ff 0,#fff 38%);border-left-color:#1f6fe0}
html[data-theme="light"] .score-command-row.universe-virtual{background:linear-gradient(90deg,#fff2e8 0,#fff 38%);border-left-color:#d64509}
html[data-theme="light"] .score-command-row.universe-prime:before{background:linear-gradient(90deg,rgba(31,111,224,.12),transparent 54%)}
html[data-theme="light"] .score-command-row.universe-virtual:before{background:linear-gradient(90deg,rgba(214,69,9,.11),transparent 54%)}
html[data-theme="light"] .score-watermark{display:block!important;opacity:.105!important;color:#203048!important;text-shadow:0 1px 0 rgba(255,255,255,.75)}
html[data-theme="light"] .game-card:before,html[data-theme="light"] .real-card:before{opacity:.085!important}
html[data-theme="light"] .play-entry-watermark{opacity:.075!important;color:#25354a!important}
html[data-theme="light"] .prime-next-lock:after{opacity:.08!important;color:#1f5fae}
html[data-theme="light"] .real-card{background:#fff;border-color:#cfdae7}html[data-theme="light"] .game-card{background:#fff;border-color:#d8dfE8}
html[data-theme="light"] .real-card .real-card-head{background:#edf5ff}html[data-theme="light"] .game-card .game-card-head{background:#fff3ea}
html[data-theme="light"] .real-team strong,html[data-theme="light"] .game-team strong,html[data-theme="light"] .team-score,html[data-theme="light"] .real-score{color:#142238}
html[data-theme="light"] .real-line,html[data-theme="light"] .line-button{background:#fff;color:#26364c;border-color:#cbd7e5;box-shadow:0 3px 10px rgba(39,55,78,.035)}
html[data-theme="light"] .real-line:hover:not(:disabled){background:#edf5ff;color:#164f9d;border-color:#79a9e0}
html[data-theme="light"] .line-button:hover:not(:disabled){background:#eef8fb;color:#0b7f9c;border-color:#76bfd0}

/* Gray/dark legacy panels corrected in light mode. */
html[data-theme="light"] .competition-card{background:linear-gradient(145deg,#fff,#f6f9fc)!important;border-color:#d3deea}
html[data-theme="light"] .competition-round{background:#fff!important;border-color:#d6e0ea}
html[data-theme="light"] .competition-pick-row button{background:#f8fafc;color:#182638;border-color:#cbd7e4}
html[data-theme="light"] .competition-pick-row button:hover:not(:disabled),html[data-theme="light"] .competition-pick-row button.selected{background:#eaf7fb}
html[data-theme="light"] .feed-command strong,html[data-theme="light"] .vba-star p strong,html[data-theme="light"] .card-combined strong,html[data-theme="light"] .play-card-legs em{color:#17253a!important}
html[data-theme="light"] .coverage-hour{background:#fff}
html[data-theme="light"] .coverage-hour.required{background:#eef9fc}
html[data-theme="light"] .market-queue-filters button{background:#fff;color:#4c5d73;border-color:#cbd6e3}
html[data-theme="light"] .market-queue-filters button.active{background:#eaf2ff;color:#15355c!important;border-color:#7caeea}
html[data-theme="light"] .market-category-tabs button,html[data-theme="light"] .sport-tab,html[data-theme="light"] .filter,html[data-theme="light"] .quick-stakes button,html[data-theme="light"] .icon-button{background:#fff;color:#34445a;border-color:#cbd6e3}
html[data-theme="light"] .market-category-tabs button.active,html[data-theme="light"] .sport-tab.active,html[data-theme="light"] .filter.active{background:#e9f3fb!important;color:#10233a!important;border-color:#79a9d8!important}
html[data-theme="light"] .game-center-score{background:radial-gradient(circle at 80% 0,rgba(214,69,9,.07),transparent 40%),linear-gradient(145deg,#fff,#f6f9fc)!important;color:#132238;border-color:#cfdae6}
html[data-theme="light"] .virtual-game-center .game-center-watermark{opacity:.10}
html[data-theme="light"] .game-market-panel{background:#fff;border-color:#d4dee8}
html[data-theme="light"] .game-center-state-callout{background:#f7fafc;border-color:#d4dee8}

/* Light Play Slip: crisp white card, strong accent, dark readable text. */
html[data-theme="light"] .slip{background:radial-gradient(circle at 92% 0,color-mix(in srgb,var(--slip-accent) 11%,transparent),transparent 31%),linear-gradient(180deg,#fff,#f5f8fc)!important;color:#111827;border-left-color:color-mix(in srgb,var(--slip-accent) 38%,#ccd7e4);box-shadow:-24px 0 70px rgba(30,48,72,.18)}
html[data-theme="light"] .slip:before{opacity:.05}
html[data-theme="light"] .slip-head{background:rgba(255,255,255,.97)!important;border-bottom-color:#d7e1eb}
html[data-theme="light"] .slip-brand-orb{background:#fff}
html[data-theme="light"] .slip-mode-badge{background:color-mix(in srgb,var(--slip-accent) 9%,#fff)}
html[data-theme="light"] .slip-ticket{background:radial-gradient(circle at 95% 0,color-mix(in srgb,var(--slip-accent) 9%,transparent),transparent 35%),linear-gradient(145deg,#fff,#f6f9fc)!important;border-color:color-mix(in srgb,var(--slip-accent) 32%,#cbd6e3);box-shadow:0 16px 38px rgba(39,55,78,.08)}
html[data-theme="light"] .slip-ticket:after{opacity:.065}
html[data-theme="light"] .slip-match,html[data-theme="light"] .slip-pick strong,html[data-theme="light"] .slip-lock strong,html[data-theme="light"] .card-slip-leg strong{color:#152238!important}
html[data-theme="light"] .slip-lock,html[data-theme="light"] .slip-breakdown,html[data-theme="light"] .slip-breakdown .total{background:#f4f8fb!important}
html[data-theme="light"] .slip-account{background:#fff;border-color:#d5e0ea}.slip-account span{border-color:var(--line)}
html[data-theme="light"] .slip .stake-field input{background:#fff!important;color:#111827}
html[data-theme="light"] .slip-empty-hero{background:radial-gradient(circle at 0 0,color-mix(in srgb,var(--slip-accent) 10%,transparent),transparent 45%),#fff}
html[data-theme="light"] .slip-empty-hero>span{background:#f3f7fb}
html[data-theme="light"] .slip-shortcut{background:#fff;color:#24354b;border-color:#cbd7e4}
html[data-theme="light"] .slip-shortcut:hover{background:color-mix(in srgb,var(--slip-accent) 7%,#fff)}
html[data-theme="light"] .card-slip-leg{border-bottom-color:#dce4ec}
html[data-theme="light"] .card-sport{background:#f3f7fb;border-color:#cbd8e6}
html[data-theme="light"] .payout-cap-notice{background:#fff6ee;border-color:#edbf9b}

@media(max-width:700px){
  .score-watermark{right:24px;font-size:21px;opacity:.065}
  .game-center-lines{grid-template-columns:repeat(2,minmax(0,1fr))}
  .game-center-state-callout{grid-template-columns:1fr}.game-center-state-callout .btn{grid-column:auto;grid-row:auto;width:100%}
  .slip-head{grid-template-columns:minmax(0,1fr) auto}.slip-mode-badge{display:none}.slip-brand-orb{width:42px;height:42px}.slip-brand-orb img{width:39px;height:39px}
  .slip-empty-hero{grid-template-columns:62px minmax(0,1fr);padding:14px}.slip-empty-hero>span{width:58px;height:58px}.slip-empty-hero img{width:55px;height:55px}.slip-empty-hero h3{font-size:17px}
}
@media(max-width:430px){
  .score-watermark{display:block!important;right:18px;top:14px;transform:rotate(-7deg);font-size:15px;opacity:.075}
  html[data-theme="light"] .score-watermark{opacity:.10!important}
  .score-command-row{grid-template-columns:90px 1fr 1fr 68px}
  .game-center-lines{grid-template-columns:1fr 1fr}
  .slip .stake-field input{height:61px;font-size:26px}
}
