:root{color-scheme:light}
:root[data-appearance=dark]{color-scheme:dark;background:#111b1a;color:#e5eeeb}
:root[data-appearance=dark] body{--bg:#111b1a;--paper:#1a2825;--soft:#243b33;--green:#a8d9bf;--hero:#17483d;--muted:#adbbb4;--line:#3b5148;--accent:#f0c985;background:var(--bg);color:#e5eeeb}
:root[data-appearance=dark] body[data-theme=ocean]{--bg:#111b24;--paper:#1a2834;--soft:#263e51;--green:#abd7f2;--hero:#173e59;--line:#3d5263;--accent:#b6dcf3;--muted:#b1beca}
:root[data-appearance=dark] body[data-theme=plum]{--bg:#201720;--paper:#2c222c;--soft:#443047;--green:#edbfe1;--hero:#53324e;--line:#61465d;--accent:#efc2ab;--muted:#c7b5c3}
:root[data-appearance=dark] .sidebar,:root[data-appearance=dark] .topbar{background:var(--paper);border-color:var(--line)}
:root[data-appearance=dark] .sidebar-bottom,:root[data-appearance=dark] .nav a:hover{background:var(--soft)}
:root[data-appearance=dark] .nav a{color:var(--muted)}
:root[data-appearance=dark] .nav a.active{color:var(--green)}
:root[data-appearance=dark] button,:root[data-appearance=dark] input,:root[data-appearance=dark] select,:root[data-appearance=dark] textarea,:root[data-appearance=dark] dialog{background:var(--paper);color:#e5eeeb;border-color:var(--line)}
:root[data-appearance=dark] input::placeholder,:root[data-appearance=dark] textarea::placeholder{color:var(--muted);opacity:1}
:root[data-appearance=dark] button:hover{background:var(--soft)}
:root[data-appearance=dark] button.primary,:root[data-appearance=dark] .primary,:root[data-appearance=dark] .tabs button.active,:root[data-appearance=dark] .question-nav .active{background:var(--green);color:var(--bg);border-color:var(--green)}
:root[data-appearance=dark] .hero button{background:var(--accent);color:#24342e}
:root[data-appearance=dark] .task,:root[data-appearance=dark] .activity{border-color:var(--line)}
:root[data-appearance=dark] .pill,:root[data-appearance=dark] .day,:root[data-appearance=dark] .setup-progress li>span{background:var(--paper);color:#e5eeeb;border-color:var(--line)}
:root[data-appearance=dark] .pill.green,:root[data-appearance=dark] .notice,:root[data-appearance=dark] .solution,:root[data-appearance=dark] .chart,:root[data-appearance=dark] .timer,:root[data-appearance=dark] .meter{background:var(--soft);color:#e5eeeb}
:root[data-appearance=dark] .hint,:root[data-appearance=dark] .pill.amber,:root[data-appearance=dark] .notice.warning{background:#44371d;color:#ffe1a3}
:root[data-appearance=dark] .error{background:#482a2d;color:#ffced0}
:root[data-appearance=dark] .danger{color:#ffbdc1}
:root[data-appearance=dark] .avatar{background:var(--soft);color:var(--green)}
:root[data-appearance=dark] .setup-progress .reached>span{background:var(--green);color:var(--bg)}
:root[data-appearance=dark] .auth-aside{background:var(--hero)}
:root[data-appearance=dark] .skip{background:var(--paper);color:var(--green)}
:root[data-appearance=dark] #toast{background:var(--soft);color:#e5eeeb;border:1px solid var(--line)}
:root[data-appearance=dark] dialog::backdrop{background:#000a}
:root[data-appearance=dark] .reading .example{color:#e5eeeb}
:root[data-appearance=dark] .reading img{background:#e8eeea}
:root[data-appearance=dark] body.high-contrast{--muted:#eef4f1;--line:#a5bbb0;color:#fff}
:root[data-appearance=dark] body.high-contrast .subtle,:root[data-appearance=dark] body.high-contrast .setup-choice small{color:var(--muted)}
:root[data-appearance=dark] :focus-visible{outline:2px solid var(--accent);outline-offset:4px}
@media(forced-colors:active){:root[data-appearance=dark] :focus-visible{outline-color:Highlight}}