/* Learner appearance. The admin workspace keeps its independent stylesheet. */
html[data-theme=light]{color-scheme:light;--bg:#faf7ef;--surface:#fffdf8;--ink:#243d32;--muted:#5b665d;--accent:#285642;--gold:#805327;--line:#d7ddce}
html[data-theme=light] body{background:var(--bg)}
html[data-theme=light] body::before{display:none}
html[data-theme=light] .masthead{border-bottom:1px solid #e4e5d9}
html[data-theme=light] :is(.scene .lead,.scene .eyebrow,.scene-foot,.scene .form-note,.scene .sound-guide,.record-help,.record-time,.record-status,.audio-state,.lesson-meta,.brand small,.line .speaker,.turn-number,.line .meaning,.full-dialogue .meaning,.pattern-person,.starter-help p,.price-label,.legal p,label:not(.option),.partner){color:var(--muted)}
html[data-theme=light] :is(.scene h1,.scene h2,.spanish,.answer-text,.prompt,.starter-help .spanish){color:var(--ink)}
html[data-theme=light] .primary{color:#fffdf7;background:var(--accent);border-color:var(--accent);box-shadow:0 4px 0 #16372812}
html[data-theme=light] .primary:hover{background:#1d4534;border-color:#1d4534;box-shadow:0 5px 16px #244d3e1a}
html[data-theme=light] .primary:disabled{background:#e4e7db;border-color:#d7ddce;color:#687063;box-shadow:none}
html[data-theme=light] :is(.menu-button,.signin-link){color:var(--ink);background:transparent;border-color:var(--line)}
html[data-theme=light] .menu-button:hover{background:#eef0e5}
html[data-theme=light] :is(.option,.example-card,.name-pattern,.turn-prompt,.starter-answer,.review-note,.transcript,.conversation-card){background:var(--surface);border:1px solid var(--line);box-shadow:0 4px 16px #354c3105}
html[data-theme=light] .option:hover{background:#f1f3e9}
html[data-theme=light] .option:has(input:checked){background:#e9f0e2;border-color:var(--accent)}
html[data-theme=light] .option.unsure{color:var(--muted)}
html[data-theme=light] .name-pattern>div+div{border-color:var(--line)}
html[data-theme=light] .name-pattern mark{color:var(--accent);border-color:var(--accent)}
html[data-theme=light] :is(.line .pronunciation,.full-dialogue .pronunciation,.turn-prompt .pronunciation){color:#795229}
html[data-theme=light] :is(.starter-help,.lesson-tools>div){border-color:var(--line)}
html[data-theme=light] :is(.starter-help summary,.meaning-help summary){color:var(--accent)}
html[data-theme=light] :is(input:not([type=radio]):not([type=checkbox]),select,textarea){background:#fffefa;border-color:#b6c3b2;color:var(--ink)}
html[data-theme=light] dialog{background:var(--bg);border-color:var(--line);box-shadow:0 24px 100px #203b3229}
html[data-theme=light] dialog::backdrop{background:#1a352454;backdrop-filter:blur(5px)}
html[data-theme=light] .help-button:hover,html[data-theme=light] .help-button:focus-visible{background:#edf1e5}
html[data-theme=light] .listen-scene .scene-actions{border-color:var(--line)}
html[data-theme=light] :is(.stage-caption,.listening-stage){color:var(--muted)}
html[data-theme=light] .is-current .stage-caption{color:var(--ink)}
html[data-theme=light] .stage-core{border-color:#adbba6}
html[data-theme=light] .is-current .stage-core{background:#dfe9c9;border-color:#6f8a56;color:#244631}
html[data-theme=light] .is-complete .stage-core{background:var(--accent);border-color:var(--accent);color:white}
html[data-theme=light] .play-fill{stroke:var(--accent)}
html[data-theme=light] .speaker-dot,html[data-theme=light] .line[data-voice=male] .speaker-dot{background:#e5ebdd;border-color:#a8b99b;color:#345034}
html[data-theme=light] .spanish .spoken-word{background:#e3eccf;color:#233b2f;box-shadow:0 0 0 3px #e3eccf}
html[data-theme=light] .partner>span{background:#dde8d5;border-color:#b0c39d;color:#355331}
html[data-theme=light] .partner[data-voice=female]>span{background:#f1e3d4;border-color:#c8a580;color:#694a30}
html[data-theme=light] .journey-map{color:var(--accent)}
html[data-theme=light] .journey-map circle.earned{fill:var(--accent);stroke:var(--accent);filter:none}
html[data-theme=light] .journey-map circle.today{fill:#c7d6ac;stroke:var(--accent)}
html[data-theme=light] .message{color:#815020}
html[data-theme=light] ::selection{background:#d6e5bc;color:#213b2e}

/* A quiet page, a clear task, and one main action. */
.scene-body,.conversation-near,.conversation-far,.keepsake-card{animation:none}
.masthead .brand small{display:none}
.scene .primary{border-radius:18px}
.scene.home .scene-body{gap:20px}
.scene.home h1{font-size:clamp(2.25rem,5vw,3.5rem);line-height:1.08;letter-spacing:-.045em}
.scene.home .conversation-art{width:290px;height:192px}
.entry-scene .scene-body{gap:24px}
.entry-choices{display:flex;flex-direction:column;gap:14px;width:100%}
.entry-option{width:100%;min-height:82px;padding:16px 20px;border:1px solid var(--line);border-radius:18px;background:var(--surface);color:var(--ink);font-weight:600;text-align:left}
.entry-option span{display:block;margin-top:7px;font-size:.875rem;line-height:1.5;color:var(--muted);font-weight:400}
.entry-option:hover{border-color:var(--accent)}
.check-audio{width:100%;padding:16px 20px;background:var(--surface);border:1px solid var(--line);border-radius:20px}
.check-audio audio{width:100%;height:44px;display:block}
.check-audio .starter-help{border:0;padding:0;margin-top:6px}
.entry-scene form>.primary{margin-top:18px}
.entry-scene .option{padding:12px 16px;min-height:50px}
.entry-scene:has(#entry-check) .scene-body{gap:16px}
.entry-scene:has(#entry-check) h1{font-size:1.8rem}
.lesson-path{display:flex;gap:12px;justify-content:space-between;margin-top:14px;padding-bottom:2px}
.lesson-path>span{display:flex;align-items:center;gap:7px;color:var(--muted);font-size:.8125rem;line-height:1.5}
.lesson-path i{display:grid;place-items:center;width:23px;height:23px;border-radius:50%;border:1px solid var(--line);font-size:.75rem;font-style:normal}
.lesson-path .current{color:var(--ink);font-weight:600}
.lesson-path .current i,.lesson-path .past i{background:var(--accent);border-color:var(--accent);color:var(--bg)}
.voice-scene{height:calc(100svh - 80px);min-height:0!important;flex:none}
.voice-scene .scene-body{gap:16px;min-height:0;overflow-y:auto;justify-content:flex-start;overscroll-behavior:contain;padding:0 2px 10px;scrollbar-width:thin}
.voice-scene h1{font-size:clamp(1.75rem,4vw,2.4rem)}
.conversation-card{width:100%;padding:20px 24px;border:1px solid var(--line);border-radius:24px;background:var(--surface);text-align:left}
.conversation-person{display:flex;align-items:center;gap:10px;margin-bottom:16px}
.conversation-person>span:first-child{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:#e5c39b;color:#5a3c26;font:1.2rem Georgia,serif}
.conversation-person p{font-size:.875rem;color:var(--muted)}
.conversation-person .turn-state{margin-left:auto;color:var(--accent);font-size:.75rem;font-weight:600}
.conversation-card>.spanish{font-size:2rem;line-height:1.3}
.question-play{display:inline-flex;align-items:center;gap:9px;min-height:44px;margin-top:12px;padding:9px 14px;border:1px solid var(--line);border-radius:12px;background:var(--surface);color:var(--accent);font-size:.875rem;line-height:1.5}
.question-play:hover{border-color:var(--accent)}
.question-play:disabled{opacity:.5;cursor:default}
.conversation-card .meaning-help{margin-top:8px}
.voice-answer{width:100%;text-align:left}
.voice-instruction{font-size:1rem;line-height:1.5;color:var(--ink)}
.voice-answer .starter-help{border:0;padding:0;margin-top:4px}
.voice-answer .starter-help p{margin-top:4px}
.voice-answer .example-audio{height:40px;margin-top:10px}
.voice-meter{display:flex;align-items:center;gap:12px;height:32px;width:100%;justify-content:center;color:var(--accent)}
.voice-meter>svg{width:24px;height:24px}
.voice-meter>div{display:flex;align-items:center;gap:4px;height:28px}
.voice-meter i{width:4px;height:26px;background:currentColor;border-radius:4px;transform:scaleY(.18);transition:transform .1s linear}
.voice-meter>span{font-size:.8125rem;font-variant-numeric:tabular-nums}
.voice-scene[data-recording=true] .voice-meter{color:#a34732}
.voice-scene[data-playing=true] .conversation-person>span:first-child{animation:voice-listening 2s ease-in-out infinite}
@keyframes voice-listening{50%{box-shadow:0 0 0 5px #e5c39b40}}
.voice-scene .scene-actions{gap:10px;position:static;background:var(--bg);padding-top:12px;border-top:1px solid var(--line)}
.voice-scene[data-recording=true] :is(.meaning-help,.example-audio){display:none}
.voice-scene[data-recording=true] .conversation-card{display:none}
.voice-scene .audio-state{font-size:.9375rem;line-height:1.45;min-height:1.5em;margin:0;color:var(--ink)}
.voice-scene .scene-foot{font-size:.8125rem;line-height:1.45}
.voice-options{display:flex;flex-wrap:wrap;justify-content:center;gap:0 8px}
.voice-options .text-action{font-size:.8125rem;padding:10px 6px;min-height:44px}
.voice-options:empty{display:none}
.voice-scene .lesson-tools{margin-top:-12px}
@media(min-width:800px){.scene.home .scene-body{gap:26px}.scene.home .conversation-art{width:340px;height:225px}.voice-scene .conversation-card{padding:24px 28px}}
@media(max-height:740px){
 .scene.home .conversation-art{width:220px;height:140px}
 .entry-scene .scene-body{gap:18px}.entry-scene h1{font-size:1.875rem}
 .voice-scene{gap:12px;padding-top:14px;padding-bottom:16px}
 .voice-scene .scene-body{gap:12px}.voice-scene h1{font-size:1.75rem}
 .conversation-card{padding:14px 18px;border-radius:20px}.conversation-person{margin-bottom:10px}.conversation-card>.spanish{font-size:1.7rem}
 .voice-scene .scene-actions{gap:8px}.voice-answer .example-audio{margin-top:6px}
}
@media(prefers-reduced-motion:reduce){.voice-scene *,.voice-meter i{animation:none!important;transition:none!important}}
@media(max-height:700px){
 .voice-scene{height:calc(100svh - 80px);min-height:0!important;flex:none;padding:12px 0;gap:10px}
 .voice-scene .lesson-path{display:none}
 .voice-scene .scene-body{min-height:0;overflow-y:auto;justify-content:flex-start;overscroll-behavior:contain;padding:0 2px 10px;scrollbar-width:thin}
 .voice-scene .scene-actions{position:static;box-shadow:none;padding:8px 0 0;border-top:1px solid var(--line);gap:6px}
 .voice-scene[data-recording=true] h1{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
 .voice-scene .lesson-tools{margin:0}
}
.practice-level{width:100%;text-align:left;border:0;padding:0;display:grid;gap:10px}
.practice-level legend{font-size:.875rem;color:var(--muted);margin-bottom:10px}
.practice-level label{display:block;padding:14px 16px;border:1px solid var(--line);border-radius:16px;background:var(--surface);cursor:pointer;line-height:1.5}
.practice-level label:has(input:checked){border-color:var(--accent)}
.practice-level input{margin-right:8px;accent-color:var(--accent)}
.practice-level small{display:block;margin-left:25px;color:var(--muted);font-size:.8125rem}
.conversation-pattern{width:100%;display:grid;gap:18px;padding:20px;border:1px solid var(--line);border-radius:20px;background:var(--surface);text-align:left}
.conversation-pattern .spanish{font-size:1.5rem;line-height:1.4}
.conversation-pattern .meaning{font-size:.9375rem;color:var(--muted);margin-top:6px;line-height:1.5}
.speech-tools{width:100%;text-align:center}
.voice-scene[data-review=true] .speech-tools{text-align:left}
.speech-tools>.text-action{min-height:44px;padding:8px 0;font-size:.875rem;color:var(--accent)}
.speech-feedback{padding:14px 16px;border:1px solid var(--line);border-radius:16px;background:var(--surface);font-size:.9375rem;line-height:1.5;overflow-wrap:anywhere}
.speech-feedback p+p{margin-top:10px}
.speech-feedback .feedback-label{font-size:.8125rem;font-weight:600;color:var(--muted)}
.speech-feedback .speech-transcript{font-size:1.125rem;color:var(--ink)}
.speech-feedback .feedback-note{font-size:.8125rem;color:var(--muted)}
#speech-consent{width:min(500px,calc(100% - 28px));max-height:calc(100svh - 28px);overflow-y:auto;padding:24px;border-radius:20px;color:var(--ink)}
#speech-consent h2{font:1.8rem Georgia,serif;margin:0 0 18px}
#speech-consent p{font-size:.9375rem;line-height:1.55;margin:12px 0}
#speech-consent button{width:100%;margin-top:12px;min-height:44px}
.voice-scene[data-recording=true] .speech-tools{display:none}
.voice-scene:not([data-review=true]) h1{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.voice-scene[data-recording=false]:not([data-review=true]) .voice-instruction{display:none}
.voice-scene[data-review=true] .speech-tools{margin-top:0}
.voice-scene[data-review=true] .conversation-card{padding:10px 16px}
.voice-scene[data-review=true] .conversation-person{margin-bottom:4px}
.voice-scene[data-review=true] .conversation-card>.spanish{font-size:1.25rem}
.voice-scene [hidden]{display:none!important}
@media(max-height:700px){.voice-scene .speech-tools{margin-top:-8px}.voice-scene .speech-tools>.text-action{padding:4px 0}}
@media(max-height:480px){.voice-scene[data-review=true] h1{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}}
