/* Shared appearance layer. Existing layouts, game worlds and question ink stay intact. */
:root{--theme-paper:#fffdf5;--theme-soft:#edf2e5;--theme-ink:#233d32;--theme-muted:#52665a;--theme-line:#78917e;--theme-action:#315c47;--theme-on-action:#fffdf5;--theme-focus:#8b4c19;--theme-link:#584190;--ink:var(--theme-ink);--muted:var(--theme-muted);--paper:var(--theme-paper);--line:var(--theme-line);--cl-green:var(--theme-action);--cl-border:var(--theme-line);background:#edf2e5;scrollbar-color:#7b9686 #edf2e5}
html[data-theme=night]{--theme-paper:#183932;--theme-soft:#234a40;--theme-ink:#f4f3df;--theme-muted:#c1d6ca;--theme-line:#789e8c;--theme-action:#acdcbf;--theme-on-action:#13372a;--theme-focus:#f3c978;--theme-link:#d8c7f5;background:#102723;scrollbar-color:#789e8c #102723}
html .cl-themed{isolation:isolate;background:transparent;color:var(--theme-ink)}
.theme-landscape{position:fixed;inset:0;z-index:-2;pointer-events:none;overflow:hidden;background:#edf2e5}
.theme-painting{position:absolute;inset:0;background-position:center;background-size:cover;transition:opacity 420ms ease-in-out}
.theme-morning{background-image:url('/assets/theme-day.webp')}.theme-moonlight{background-image:url('/assets/theme-night.webp');opacity:0}
html[data-theme=night] .theme-moonlight{opacity:1}html[data-theme=night] .theme-morning{opacity:0}
.theme-landscape:after{content:'';position:absolute;inset:0;background:#f5f7ecb5;pointer-events:none}
html[data-theme=night] .theme-landscape:after{background:#102723b8}
html .theme-landscape #nightSky{position:absolute;inset:0;z-index:1;width:100%;height:100%;opacity:1}
html .cl-themed header{color:var(--theme-ink);background:var(--theme-paper);border-bottom:1px solid var(--theme-line);border-radius:0 0 16px 16px}
html .cl-themed .brand,html .cl-themed h1,html .cl-themed h2,html .cl-themed h3{color:inherit}
html[data-theme=night] .cl-themed .brand span,html[data-theme=night] .cl-themed .brand>span>span{color:#d8c7f5}
html .cl-themed .theme-controls{max-width:1280px;margin:14px auto 8px;padding:0 28px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
html .cl-themed .setting-control{background:var(--theme-paper);border:1px solid var(--theme-line);color:var(--theme-ink);box-shadow:none;border-radius:10px;min-height:76px;min-width:0;padding:12px 16px;gap:12px;display:flex;align-items:center;text-align:left}
.theme-icon{width:24px;height:24px;flex:0 0 24px}.theme-control .setting-copy{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
html .cl-themed .setting-copy strong{font-size:16px;line-height:1.35}html .cl-themed .setting-copy small{font-size:13px;line-height:1.4;font-weight:600;color:var(--theme-muted)}
html .cl-themed .switch-track{display:block;flex:0 0 40px;width:40px;height:24px;padding:3px;background:#657b6d;border-radius:20px;transition:background 180ms ease}
html .cl-themed .switch-track>span{display:block;width:18px;height:18px;border-radius:50%;background:#fffdf5;box-shadow:none;transition:transform 180ms ease}
html .cl-themed .setting-control[aria-checked=true] .switch-track{background:#315c47}html .cl-themed .setting-control[aria-checked=true] .switch-track>span{transform:translateX(16px)}
html[data-theme=night] .cl-themed .setting-control[aria-checked=true] .switch-track{background:#acdcbf}html[data-theme=night] .cl-themed .setting-control[aria-checked=true] .switch-track>span{background:#16392c}
.theme-status{grid-column:1/-1;font-size:13px;color:var(--theme-ink)}.theme-status:empty{display:none}
html .cl-themed :is(.card,.setup-panel,.rules-panel,.question-panel,.race-arena,.results-view,.user-row,dialog,.game-card,.coop-arena,.standing,.final-row,.resume-banner){background:var(--theme-paper);color:var(--theme-ink);border-color:var(--theme-line)}
html .cl-themed :is(.hint,.eyebrow,footer,dialog p,.rules-panel li,.game-card p,.card-link,.standing p,.final-row p,.board-legend,.setup-panel label,.name-label,.topic-description,.results-view>p:not(.eyebrow)){color:var(--theme-muted)}
html .cl-themed :is(.pill,.badge,.private-badge,.guide,.tabs button,.coop-objective,.coop-station-prompt,.coop-task,.question-hint,.coop-badge,.active-team,.turn-pill){background:var(--theme-soft);color:var(--theme-ink);border-color:var(--theme-line)}
html .cl-themed :is(input,select,textarea){background:var(--theme-paper);color:var(--theme-ink);border-color:var(--theme-line);caret-color:var(--theme-ink)}
html .cl-themed :is(input,textarea)::placeholder{color:var(--theme-muted);opacity:1}
html .cl-themed :is(.answer-choice,.choices button,.coop-station,.header-tools button,button:where(:not(.primary):not(.setting-control):not(.game-card):not(.avatar-choice):not(.reward):not(.button))){background:var(--theme-paper);color:var(--theme-ink);border-color:var(--theme-line)}
html .cl-themed :is(.primary,.button.primary,form>.primary){background:var(--theme-action);color:var(--theme-on-action);border-color:var(--theme-action)}
html .cl-themed .tabs button[aria-selected=true]{background:var(--theme-action);color:var(--theme-on-action);border-color:var(--theme-action)}
html .cl-themed .choices button.selected{background:var(--theme-soft);color:var(--theme-ink);border-color:var(--theme-action)}
html .cl-themed :is(.answer-choice,.coop-station,.choices button):enabled:hover{border-color:var(--theme-action)}
html .cl-themed a:where(:not(.brand):not(.button):not(.portal-home):not(.private-badge)){color:var(--theme-link)}
html .cl-themed a.contact-link{background:var(--theme-action);border-color:var(--theme-action);color:var(--theme-on-action)}
html .cl-themed .learning-scene div :is(p,.scene-label){color:var(--theme-muted)}
html .cl-themed .learning-scene .scene-label{color:var(--theme-muted)!important}
html .cl-themed .game-card.selected{border-color:var(--theme-action);background:var(--theme-soft)}
html .cl-themed :is(.lobby-hero,.hero){color:var(--theme-ink)}html .cl-themed .lobby-hero{background:var(--theme-paper);border:1px solid var(--theme-line)}
html .cl-themed .lobby-hero h1>span{color:var(--theme-action)}html .cl-themed .lobby-hero :is(.eyebrow,p:not(.eyebrow)){color:var(--theme-muted)}
html .cl-themed .hero-chips span{color:var(--theme-ink);border-color:var(--theme-line);background:var(--theme-soft)}
html .cl-themed .hero>div{background:none}html .cl-themed .hero{border-color:var(--theme-line)}
html .cl-themed .question-visual{background:#fff;color:#243c43}html .cl-themed .question-visual text{color:#243c43}
html .cl-themed :is(.answer-choice.correct,.choices button.selected,.feedback.good,.success,.final-row.winner){background:#dceee0;color:#194532;border-color:#397353}
html .cl-themed :is(.answer-choice.incorrect,.feedback.bad){background:#f6e3df;color:#792f25;border-color:#a46358}
html[data-theme=night] .cl-themed :is(.answer-choice.correct,.choices button.selected,.feedback.good,.success,.final-row.winner){background:#254f3b;color:#d7f2de;border-color:#87c7a0}
html[data-theme=night] .cl-themed :is(.answer-choice.incorrect,.feedback.bad){background:#553329;color:#ffe0d6;border-color:#d69782}
html[data-theme=night] .cl-themed :is(.error,#editError,#profileError,.wrong){color:#ffd2c4}html[data-theme=night] .cl-themed #message:not(:empty){background:#553329;color:#ffe0d6}
html[data-theme=night] .cl-themed .learning-scene{background:#183932;border-color:var(--theme-line)}html[data-theme=night] .cl-themed .learning-scene img{filter:brightness(.86)}html[data-theme=night] .cl-themed .learning-scene :is(p,h2){color:var(--theme-ink)}
html[data-theme=night] .cl-themed .coop-stage-label{background:#183932eb;color:var(--theme-ink);border-color:var(--theme-line)}.coop-stage-label{z-index:2}
html[data-theme=night] .cl-themed .race-stopwatch>span{color:#d8c7f5}html[data-theme=night] .cl-themed .race-question-dots span{background:var(--theme-soft);color:var(--theme-ink)}
html .cl-themed :is(button,a,input,select,textarea,summary):focus-visible{outline:3px solid var(--theme-focus);outline-offset:3px}
html .cl-themed ::selection{background:var(--theme-action);color:var(--theme-on-action)}
html.theme-changing .cl-themed :is(header,.card,.setup-panel,.rules-panel,.question-panel,.lobby-hero,.setting-control){transition:background-color 180ms ease,color 180ms ease,border-color 180ms ease}
html[data-motion=false] .cl-themed *,html[data-motion=false] .cl-themed *:before,html[data-motion=false] .cl-themed *:after{animation:none!important;scroll-behavior:auto!important;transition:none!important}
@media(max-width:720px){html .cl-themed .theme-controls{padding:0 16px;gap:8px}html .cl-themed .theme-controls .setting-control{padding:10px;flex-wrap:wrap;gap:7px}html .cl-themed .theme-controls .theme-icon{width:20px;height:20px;flex-basis:20px}.theme-controls .switch-track{margin-left:auto}.theme-controls .setting-copy{flex-basis:100%;order:2}html .cl-themed .theme-controls .setting-copy strong{font-size:14px}html .cl-themed .theme-controls .setting-copy small{font-size:12px}.preferences .theme-icon{display:none}.theme-painting{background-position:48% center}.theme-landscape:after{background:#f5f7ecce}html[data-theme=night] .theme-landscape:after{background:#102723ca}}
@media(prefers-reduced-motion:reduce){.theme-painting,.switch-track,.switch-track>span{transition:none!important}}
