/* =========================================================
   BloxRadio — surfaces de nuit (thèmes sombres : Halloween, Nouvel An)
   Repeint les fonds blancs du site avec les couleurs --surface du thème.
   ========================================================= */
html[data-dark] { color-scheme: dark; }
html[data-dark] :is(.btn-outline, .icon-btn, .chat, .job, .sheet, .captcha-new, .req-search, .req-card,
  .t-req-search, .game-card, .poll-card, .poll-opt, .cookie-banner, .album-tabs button, .nav.open) {
  background: var(--surface);
}
html[data-dark] :is(input:not([type="range"]), textarea, select) { background: var(--surface-2); color: var(--text); }
html[data-dark] select option { background: var(--surface); }
html[data-dark] :is(input, textarea)::placeholder { color: var(--muted); opacity: .8; }
html[data-dark] .top::before { background: color-mix(in srgb, var(--bg) 85%, transparent); }
html[data-dark] .nav { background: color-mix(in srgb, var(--surface) 82%, transparent); box-shadow: 0 8px 24px -16px rgba(0, 0, 0, .8); }
html[data-dark] .nav a { color: var(--text-2); }
html[data-dark] .bar { background: color-mix(in srgb, var(--surface) 90%, transparent); border-color: var(--line-2); box-shadow: 0 20px 50px -18px rgba(0, 0, 0, .9); }
html[data-dark] .tile { box-shadow: 0 12px 30px -24px rgba(0, 0, 0, .9); }
html[data-dark] .ad-sheet .sheet-x { background: var(--surface); color: var(--text); }
html[data-dark] .modal { background: rgba(4, 2, 10, .7); }
html[data-dark] .onair, html[data-dark] .np-cover .eq { background: var(--surface); }
html[data-dark] .sheet::-webkit-scrollbar-thumb:hover { background-color: var(--surface-3); }
html[data-dark] .prize { background: rgba(255, 209, 102, .14); color: #ffd166; }
html[data-dark] :is(.ck-always, .req-btn:disabled) { background: rgba(141, 255, 107, .12) !important; color: #8dff6b !important; }
html[data-dark] .slot-badge { background: rgba(255, 59, 92, .16); }
html[data-dark] .tag.read { color: #8dff6b; background: rgba(141, 255, 107, .12); }
html[data-dark] .seg button[aria-selected="true"].today::after { background: var(--on-accent, #fff); }
html[data-dark] .ck-switch span::after { background: var(--text); }
html[data-dark] .big { text-shadow: 0 0 40px var(--blue-ring); }
html[data-dark] .msg-top b { filter: brightness(1.6) saturate(.85); } /* pseudos colorés lisibles sur fond sombre */