/* Pre-Dark softens the light surfaces without recoloring artwork or the OBS overlay. */
:root[data-site-mode="predark"]{--paper:#c7c6c0;--muted:#535e64;--line:#b9bfbb}
[data-site-mode="predark"] .hero{background:linear-gradient(115deg,#c7c6c0 45%,#b9c1bc)}
[data-site-mode="predark"] :is(.theme-panel,.solo-mode-picker,.solo-detail){background:#c1c7be;border-color:#b4bdb6}
[data-site-mode="predark"] .docs code{background:#b9c1b8}
[data-site-mode="predark"] .docs tbody tr:nth-child(even){background:#bfc6bd}
[data-site-mode="predark"] .collection-section{background:#b9bfb8;border-color:#b4bdb6}
[data-site-mode="predark"] :is(input:not([type=checkbox]),textarea,select){background:#d4d6d0;border-color:#a9b4ae}
[data-site-mode="predark"] .effect-slot{background:linear-gradient(120deg,#cdc6d4,#c2b9cb)}
[data-site-mode="predark"] .rune-balance{background:#cbc1d5}
[data-site-mode="predark"] :is(.promo-receipt,.ai-notice){background:#d0d4cb}
.site-mode-toggle{display:inline-flex;align-items:center;justify-content:center;gap:8px;flex-shrink:0;padding:9px 10px;border:1px solid var(--line);border-radius:30px;background:transparent;color:var(--ink);font-size:11px;font-weight:600;white-space:nowrap;min-height:40px}
.mode-track{position:relative;display:inline-block;width:32px;height:18px;border-radius:12px;background:#aab3b3;transition:background .2s}
.mode-track::after{content:"";position:absolute;top:3px;left:3px;width:12px;height:12px;border-radius:50%;background:#fff;box-shadow:0 1px 3px #0003;transition:transform .2s}
.site-mode-toggle[aria-checked="true"] .mode-track{background:#586177}
.site-mode-toggle[aria-checked="true"] .mode-track::after{transform:translateX(14px)}
.site-mode-toggle .mode-dark{opacity:.55}.site-mode-toggle[aria-checked="true"] .mode-dark{opacity:1}.site-mode-toggle[aria-checked="true"] .mode-normal{opacity:.55}
.topbar{gap:14px}
@media(min-width:761px) and (max-width:1180px){.topbar{height:auto;min-height:90px;flex-wrap:wrap;padding-block:12px}.topbar nav{gap:16px}.brand-sub{display:none}}
@media(max-width:760px){.topbar{height:auto;min-height:74px;flex-wrap:wrap;padding-block:12px}.topbar .site-mode-toggle{order:4;margin-left:auto}.topbar nav{width:auto;flex:1;justify-content:flex-start;order:3}.topbar .brand{flex:1}.site-mode-toggle{font-size:10px;padding:7px 9px;gap:6px}}
@media(prefers-reduced-motion:reduce){.mode-track,.mode-track::after{transition:none}}