.appearance-settings{border:2px solid #c3d7ca;border-radius:20px;padding:16px;margin:20px 0;color:var(--ink,#17342d);background:var(--cream,#fffdf5)}
.appearance-settings legend{font-weight:900;padding:0 8px}
.appearance-options{display:flex;gap:10px;flex-wrap:wrap}
.appearance-options label{display:flex;align-items:center;gap:8px;flex:1;min-width:120px;min-height:48px;padding:10px;border:2px solid #adc6ba;border-radius:14px;cursor:pointer;font-weight:800}
.appearance-options label:has(input:checked){border-color:#248855;background:#e4f5df;color:#17442d}
.appearance-options input{width:20px;height:20px;accent-color:#248855;flex-shrink:0}
.appearance-options input:focus-visible{outline:3px solid #2598e7;outline-offset:4px}
html[data-theme=dark]{--cream:#203840;--ink:#edf5f3;--muted:#bed0d4;--forest:#a0dfba;--forest-dark:#d3f2e0;--mint:#29483d;--line:#486268;color-scheme:dark}
html[data-theme=dark] body{background:#152b32;color:#edf5f3}
html[data-theme=dark] .scene::after{content:"";position:absolute;inset:0;background:rgba(4,18,30,.55);pointer-events:none}
html[data-theme=dark] :is(.dialog-card,.lesson-card,.book-learning-path,.book-path-unit,.teaching-screen,.account-strip,.profile-card,.progress-card,.plan-card,.feature-card,.auth-card,.support-card,.download-card){background:#203840;border-color:#4c7178;color:#edf5f3}
html[data-theme=dark] :is(.book-path-unit.is-free,.book-path-unit.is-locked,.book-path-unit.is-upcoming){background:#243e44}
html[data-theme=dark] :is(.teaching-character,.tone-demo,.tip-row,.sound-toggle,.install-app-card,.share-game-card,.access-pin-panel){background:#2b464d;border-color:#54737b;color:#edf5f3}
html[data-theme=dark] :is(.teaching-copy h3,.teaching-parent,.teaching-character>span,.hero-copy>p,.trust-row,.access-pin-copy p,.access-pin-copy h3,.access-pin-form label,.book-path-unit strong,.book-path-unit small,.book-path-unit h3){color:#cce5dc}
html[data-theme=dark] .teaching-screen :is(button,a,select){background:#29464d;color:#edf5f3;border-color:#7daf99}
html[data-theme=dark] .teaching-screen .teach-primary{background:#276c4c;color:white}
html[data-theme=dark] .teaching-choices button.is-correct{background:#2e6745;color:white}
html[data-theme=dark] .teaching-choices button.is-mistake{background:#705428;color:#fff2ce}
html[data-theme=dark] .tone-trace{stroke:#8ebdff}
html[data-theme=dark] .appearance-options label:has(input:checked){background:#2e6147;color:#effff2;border-color:#91d6a9}
html[data-theme=dark] :is(.auth-card input,.access-pin-form input){background:#152b32;color:#edf5f3;border-color:#6e9198}
html[data-theme=dark] .book-path-progress{background:#43595e}
html[data-theme=dark] :is(.dialog-card,.lesson-card,.book-learning-path,.account-strip,.auth-card,.support-card,.download-card) :is(h2,h3,strong){color:#edf5f3}
html[data-theme=dark] :is(.book-path-unit-title,.book-path-description,.book-path-lessons span,.book-path-footnote,.book-path-member-note,.book-path-parent-link){color:#cce5dc}
html[data-theme=dark] .close-button{background:#354f59;color:white}
html[data-theme=dark] :is(.panel,.review-panel,.payment-methods,.feature-grid article,.learning-journey){background:#203840;border-color:#4c7178;color:#edf5f3}
html[data-theme=dark] :is(.panel-heading span,.journey-heading span,.plan-label,.checkout-label,.access-pin-copy>span){color:#b5d9c7}
html[data-theme=dark] :is(.profile-chip,.achievement,.profile-chip.is-active,.achievement.is-earned,.leaderboard-row.is-own){background:#29483d;color:#edf5f3}
html[data-theme=dark] .lesson-card>small{color:#bed0d4}
html[data-theme=dark] :is(.download-page-link,.member-account-link,.member-kicker){color:#aed9ff}
html[data-theme=dark] .site-header .play-link{background:#276c4c;color:white}
html[data-theme=dark] :is(.primary-action,.plan-button,#manage-billing,#manage-billing-top){background:#276c4c;color:white;box-shadow:0 7px 0 #10251b}

/* Dark surfaces and their text must change together: never white text on pastel pills. */
html[data-theme=dark]{--cream:#1b2c3b;--ink:#f1f6fc;--muted:#c0cedd;--forest:#a6e6c1;--forest-dark:#e2f6ec;--mint:#263e43;--line:#566d80;--dark-surface:#1b2c3b;--dark-raised:#263c4e;--dark-text:#f1f6fc;--dark-muted:#c0cedd;--dark-border:#688296}
html[data-theme=dark] body{background:#101e2b;color:var(--dark-text)}
html[data-theme=dark] :is(.dialog-card,.lesson-card,.book-learning-path,.book-path-unit,.teaching-screen,.account-strip,.profile-card,.progress-card,.plan-card,.feature-card,.auth-card,.support-card,.download-card,.panel,.review-panel,.payment-methods,.feature-grid article,.learning-journey,.billing-panel,.appearance-settings){background:var(--dark-surface);border-color:var(--dark-border);color:var(--dark-text)}
html[data-theme=dark] :is(.game-mode-picker,.content-section-picker){background:#142432;border-color:#566f83;box-shadow:0 7px 0 #0a1621,0 14px 28px #06111b55}
html[data-theme=dark] .game-mode-button{background:#294052;border-color:#597489;color:var(--dark-text)}
html[data-theme=dark] .game-mode-button small{color:var(--dark-muted)}
html[data-theme=dark] .game-mode-button.is-member-mode:not(.is-active){background:#39334f;border-color:#8f83bb;color:#eee7ff}
html[data-theme=dark] .game-mode-button.is-active{background:#244d3e;border-color:#9de5b7;color:#effff5;box-shadow:inset 0 -3px 0 #122c22}
html[data-theme=dark] .game-mode-button.is-active small{color:#ceefdb}
html[data-theme=dark] .game-mode-button strong{color:inherit}
html[data-theme=dark] .content-section-picker :is(button,.standalone-page-nav){color:#e1ebf6}
html[data-theme=dark] .content-section-picker button.is-active{background:#f4d581;color:#30230b;box-shadow:inset 0 -3px 0 #c79d40}
html[data-theme=dark] .content-section-picker .lesson-exercises-nav{background:#514287;color:#fff;box-shadow:inset 0 -3px 0 #30254e}
html[data-theme=dark] .content-section-picker .unit-review-nav{background:#255b48;color:#fff;box-shadow:inset 0 -3px 0 #153b2d}
html[data-theme=dark] .lesson-card{box-shadow:inset 0 -4px 0 #0b172333,0 8px 0 #0b1723,0 16px 30px #07121b44}
html[data-theme=dark] .lesson-card>strong{background:#30485d;color:#f1f6fc}
html[data-theme=dark] .lesson-card .lesson-symbol{background:#e4edf6;color:#173a57;opacity:1;filter:none}
html[data-theme=dark] .lesson-card.is-locked .lesson-symbol{background:#dbe5ef;color:#304760;opacity:1}
html[data-theme=dark] .lesson-count{background:#f4d581;border-color:#f4e7bd;color:#30230b;box-shadow:0 4px 0 #8b6520}
html[data-theme=dark] :is(.lesson-member-badge,.lesson-member-badge.is-unlocked){background:#2d4765;border-color:#90b6d6;color:#fff;box-shadow:0 3px 0 #0c1d30}
html[data-theme=dark] .lesson-member-badge.is-unlocked{background:#27543f;border-color:#9de5b7}
html[data-theme=dark] .book-lesson-copy :is(strong,span){color:#f1f6fc}
html[data-theme=dark] .book-lesson-copy>small{color:#d6c9ad}
html[data-theme=dark] .book-lesson-copy>b{background:#f4d581;color:#30230b}
html[data-theme=dark] :is(.path-stop,.pinyin-stage-summary,.teaching-character,.tone-demo,.tip-row,.sound-toggle,.install-app-card,.share-game-card,.access-pin-panel,.payment-method-panel){background:var(--dark-raised);border-color:var(--dark-border);color:var(--dark-text)}
html[data-theme=dark] .path-stop strong{color:var(--dark-text)}
html[data-theme=dark] .path-stop small{color:var(--dark-muted)}
html[data-theme=dark] .path-stop.is-active{background:#244d3e;border-color:#9de5b7;box-shadow:0 4px 0 #102b21}
html[data-theme=dark] .path-stop.is-member::after{color:#f4d581}
html[data-theme=dark] .path-stop>b{background:#d8e8fa;color:#18354f}
html[data-theme=dark] .pinyin-stage-summary :is(h3,p){color:var(--dark-text)}
html[data-theme=dark] #pinyin-stage-all{background:#284e3d;color:#effff5;border-color:#9de5b7}
html[data-theme=dark] .lesson-section-heading{color:#f1f6fc;text-shadow:0 2px 4px #07131f}
html[data-theme=dark] .lesson-section-copy{background:#1b2c3b;border-color:#688296;color:#e1ebf6}
html[data-theme=dark] :is(.auth-card small,.auth-footnote,.dialog-card>p,.sound-toggle small,.tip-row p,.eyebrow,.panel>p,.panel>small){color:var(--dark-muted)}
html[data-theme=dark] :is(.auth-card input,.access-pin-form input,.panel input,.panel select,.profile-form input,.profile-form select){background:#10202e;color:#f1f6fc;border-color:#7894aa}
html[data-theme=dark] input::placeholder{color:#b8c8d8;opacity:1}
html[data-theme=dark] :is(.auth-recover,.auth-card a,.support-card a,.download-card a){color:#afd7ff}
html[data-theme=dark] :is(.auth-modes button,#copy-recovery,.appearance-options label,.journey-heading a){background:#294052;border-color:#7894aa;color:#edf5ff}
html[data-theme=dark] :is(.auth-modes [aria-pressed=true],.appearance-options label:has(input:checked)){background:#244d3e;border-color:#9de5b7;color:#effff5}
html[data-theme=dark] #recovery-code{background:#10202e;color:#f4d581;border:1px solid #7894aa;border-radius:12px}
html[data-theme=dark] :is(#auth-message,.access-pin-message){color:#ffc1b4}
html[data-theme=dark] .access-pin-message.is-success{color:#b6f2cb}
html[data-theme=dark] .member-plan{background:#193d32;border-color:#a6e6c1}
html[data-theme=dark] .member-plan .plan-button{background:#f4d581;color:#30230b;box-shadow:0 6px 0 #8b6520}
html[data-theme=dark] .notice{background:#443b24;border-color:#d4b76b;color:#fff0bc}
html[data-theme=dark] :is(.weekly-bar>span,.book-path-progress){background:#3d5366}
html[data-theme=dark] .journey-step.is-locked{opacity:1}
html[data-theme=dark] :is(a,button,input,select,summary):focus-visible{outline:3px solid #ffd975;outline-offset:4px}
html[data-theme=dark] .book-unit-heading{background:#1b2c3b;color:#f1f6fc;border:1px solid #688296;border-radius:12px;padding:.55rem .85rem;text-shadow:none}
html[data-theme=dark] :is(.book-path-summary-title small,.book-path-heading p){color:#c0cedd}
html[data-theme=dark] .book-path-summary-toggle{color:#afd7ff}
html[data-theme=dark] .book-path-summary-toggle>span{color:#f4d581}
html[data-theme=dark] .book-path-summary-progress{background:#3d5366}

/* A night picnic, not a dark card placed on a sunny daytime scene. */
html[data-theme=dark]{
  --night-scenery:url("assets/pinyin-adventure-bg.png");
  --moon-x:74%;--moon-y:78px;--moon-radius:25px;
  --night-background:
    radial-gradient(circle at calc(var(--moon-x) + 10px) calc(var(--moon-y) - 7px),#10243e 0 var(--moon-radius),transparent calc(var(--moon-radius) + 1px)),
    radial-gradient(circle at var(--moon-x) var(--moon-y),#e3efff 0 var(--moon-radius),transparent calc(var(--moon-radius) + 1px)),
    radial-gradient(circle at 14% 145px,#c9e4ff 0 1px,transparent 2px),
    radial-gradient(circle at 31% 65px,#c9e4ff 0 1px,transparent 2px),
    radial-gradient(circle at 47% 35px,#c9e4ff 0 1px,transparent 2px),
    radial-gradient(circle at 68% 190px,#c9e4ff 0 1px,transparent 2px),
    radial-gradient(circle at 93% 245px,#c9e4ff 0 1.5px,transparent 2.5px),
    radial-gradient(circle at 6% 360px,#bad9ff 0 1px,transparent 2px),
    radial-gradient(circle at 96% 460px,#bad9ff 0 1px,transparent 2px),
    linear-gradient(180deg,rgba(7,19,43,.94),rgba(16,45,75,.76) 42%,rgba(5,20,32,.74)),
    var(--night-scenery);
}
html[data-theme=dark] .scene{background-color:#0b1c30;background-image:var(--night-background);background-position:center;background-size:cover;background-repeat:no-repeat;background-blend-mode:normal}
html[data-theme=dark] .scene::after{content:none}
html[data-theme=dark] .picnic-cloud{background:rgba(134,165,205,.14)}
html[data-theme=dark] .picnic-butterfly{opacity:.78}
html[data-theme=dark] .brand{background:#1b2c3b;border-color:#688296;color:#ffbec3;filter:none;box-shadow:0 7px 0 #081725,0 12px 24px #020a1555}
html[data-theme=dark] .brand b{color:#a6e6c1}
html[data-theme=dark] .brand em{color:#f4d581}
html[data-theme=dark] .menu-heading{background:#1b2c3b;border-color:#688296;box-shadow:0 7px 0 #081725,0 12px 24px #020a1555}
html[data-theme=dark] .menu-heading h2{color:#f1f6fc}
html[data-theme=dark] .menu-heading p{background:#2b4355;color:#e2edf8}
@media(max-width:820px) and (orientation:portrait){
  html[data-theme=dark]{--night-scenery:url("assets/pinyin-adventure-bg-mobile.png");--moon-x:55%;--moon-y:36px;--moon-radius:15px}
  html[data-theme=dark] .app-shell{background-color:#0b1c30;background-image:var(--night-background);background-position:center top;background-size:cover;background-repeat:no-repeat;background-blend-mode:normal}
}