/* SillyFight dark mode ("Fight Night, after dark"). Loaded on every page with media="(prefers-color-scheme: dark)",
   AFTER the page's own styles, so light mode is untouched. Same red / mustard / cream, on a deep brown-black.
   --ink flips to cream (text + outlines + hard shadows), --paper becomes the dark card colour. Elements that were
   "dark chip with light text" get --night; elements on mustard keep dark text (--onacc). Red text uses --red-t (lighter). */
:root,[data-theme=g]{--bg:#17120e;--bg2:#1f1a15;--bg3:#2a221b;--paper:#2a221b;--ink:#f3e8cf;--soft:#33291f;
  --primary:#c62f26;--primary-ink:#f7eedb;--accent:#e2a72e;--alt:#120e0b;--alt-ink:#f3e8cf;--hl:#ef6a5e;
  --night:#120e0b;--card:#241d17;--field:#322920;--onacc:#1f1a15;--red-t:#ef6a5e;color-scheme:dark}
html{background:url(/shared/grain.png) 0 0/200px 200px repeat,radial-gradient(ellipse 70.7107% 141.4214vh at 50% 0,#3a2d21 0,#1f1a15 55%,#140f0c 100%) no-repeat,#140f0c}html[data-theme=g]{background:#120e0b}
/* same seamless page background as poc.css (vignette not clipped at 100vh; <html> covers collapsed-margin strips) */
body,[data-theme=g] body{color:var(--ink);background:url(/shared/grain.png) 0 0/200px 200px repeat,radial-gradient(ellipse 70.7107% 141.4214vh at 50% 0,#3a2d21 0,#1f1a15 55%,#140f0c 100%) no-repeat,#140f0c}
[data-theme=g] body{background:url(/shared/grain.png) 0 0/200px 200px repeat,radial-gradient(ellipse at 50% 0,#3a2d21 0,#1f1a15 55%,#140f0c 100%) 0 0/100% 100vh no-repeat,#140f0c}
.card,[data-theme=g] .card{background:url(/shared/grain.png) 0 0/200px 200px repeat,linear-gradient(180deg,#2c241c,#221b15);box-shadow:0 16px 30px -12px rgba(0,0,0,.8)}
/* red text: lighter red for contrast on dark */
h1,.title,.hl,.err,.top .kicker,.logo .f,.tvlogo .f,.big-num,.vs .mid,.phase-h,.tvtitle,.panel h3,.st-row .rk,.lstat b,.lobby h2,.bigcode,.ccard .v.minus,
.game b,[data-theme=g] .title,[data-theme=g] .logo-fight,[data-theme=g] .top::before,[data-theme=g] .link-btn,[data-theme=g] .bill-k,[data-theme=g] #billR,
[data-theme=g] .countdown,[data-theme=g] .you,[data-theme=g] .final::before{color:var(--red-t)}
[data-theme=g] .final::before{border-color:var(--red-t)}
/* light surfaces -> dark surfaces */
input[type=text],input:not([type]),textarea,select,[data-theme=g] input{background:var(--field);color:var(--ink)}
input::placeholder,textarea::placeholder{color:rgba(243,232,207,.55)}
.game,.pc,.ccard,[data-theme=g] .slot.filled,[data-theme=g] .move,[data-theme=g] .btn.ghost,[data-theme=g] .taunt,[data-theme=g] .bubble,[data-theme=g] .log li,[data-theme=g] .pbp{background:var(--card);color:var(--ink)}
.game:hover,.game:focus-visible{background:#3a2e22}
.mute.snd.off{background:#4a2a22}
.panel{background:url(/shared/grain.png) 0 0/200px repeat,#2a221b}
.lstat{background:#2c2219;color:var(--ink)}
.lobby{background:url(/shared/grain.png) 0 0/200px repeat,rgba(31,26,21,.96);color:var(--ink)}
[data-theme=g] .countdown span{background:#2c241c}
/* dark chips with light text: keep them dark */
.game em,.roomcode,.ticker,.timer,.status,#toast,.arena .ms,.diffset .dlab,[data-theme=g] .move .tag,[data-theme=g] .btn.alt,[data-theme=g] .stats-card,
[data-theme=g] .sb-side.r,[data-theme=g] .f-name,[data-theme=g] .log li b{background:var(--night)}
.ticker,.status,#toast{color:var(--ink)}
[data-theme=g] .stats-card{outline-color:#f3e8cf;border-color:#f3e8cf}
/* mustard surfaces keep dark text */
.btn.alt,.badge,.choice.sel+.x,.ccard.sel,.pc.ev,.tvctl .btn.sel,.banner.warn,.banner.count,[data-theme=g] .btn,[data-theme=g] .mode,[data-theme=g] .vs-splash{color:var(--onacc)}
[data-theme=g] .btn.big,[data-theme=g] .mode[aria-checked=true]{color:var(--primary-ink)}
[data-theme=g] .btn.alt{color:#f3e8cf}[data-theme=g] .btn.ghost{color:var(--ink)}
[data-theme=g] .mode::after{border-color:rgba(31,26,21,.5)}
[data-theme=g] .btn.big,[data-theme=g] .btn.big:active{box-shadow:0 0 0 3px #1f1a15,0 0 0 6px var(--ink)}
/* dashed separators drawn in dark ink */
.plist li,.st-row{border-bottom-color:rgba(243,232,207,.25)}
/* My challenges */
.mc li,.mc-auto{background:var(--card)}
.mc li small{color:#cbbd9f}
.bd.pending{background:#3a2e22;color:var(--ink)}.bd.gone{background:#5a5048;color:var(--ink)}.bd.draw,.bd.done{color:var(--onacc)}
/* notify.js (injects its own <style> later in <head>: :root raises specificity so these still win) */
:root .sfn-w{border-color:var(--ink);background:var(--card)}
:root .sfn-w a{color:var(--red-t)}
:root .sfn-w.sfn-todo{border-color:var(--red-t);background:#3a231c}
:root .sfn-sw{border-color:var(--ink);background:#5a4a36}
:root .sfn-hint{background:#2c241c;color:var(--ink)}
:root .sfn-card{background:#2a221b;color:var(--ink);border-color:var(--ink)}
:root .sfn-card h2{color:var(--red-t)}
:root .sfn-note,:root .sfn-link{border-color:#1f1a15}
/* Duel: challenger name chip, unlocks, talk-back picker (judges keep their cream score cards on the dark panel) */
[data-theme=g] .challenger-intro .title .hl{color:var(--onacc)}
.unlocks,[data-theme=g] .unlocks{color:var(--onacc)}
.tb-chip{background:var(--card);color:var(--ink);border-color:var(--ink);box-shadow:2px 2px 0 var(--ink)}
.tb-chip[aria-pressed=true]{background:#c62f26;color:#f7eedb}
.tb-h b,.tb-k{color:var(--red-t)}.tb-k b{color:var(--ink)}
[data-theme=g] .sb-side{background:#b3261e}[data-theme=g] .sb-side.r{background:var(--night)}
/* Bike phone: tilt box. Seagull TV: difficulty picker */
.tiltbox,.diffset{background:var(--card)}
.diffset .dopt.sel{color:var(--onacc)}
/* hard text shadows were dark ink; cream shadows behind red text look muddy, so they stay near-black */
.logo .f,.tvlogo .f,[data-theme=g] .logo-fight{text-shadow:3px 3px 0 #000}
.bigcode{text-shadow:5px 5px 0 #000}.big-num{text-shadow:4px 4px 0 #000}
[data-theme=g] .vs,[data-theme=g] .bill i{text-shadow:2px 2px 0 #000}[data-theme=g] .vsp-vs{text-shadow:4px 4px 0 #000}
.lobbyp span{text-shadow:2px 2px 0 #000}
.me-badge{text-shadow:1px 1px 0 #000}.arena[data-state=go] .msg,.hold .clock,.delta{text-shadow:3px 3px 0 #000}.flashtxt,.vsbig{text-shadow:4px 4px 0 #000}
