/* Shared tokens keep every screen, feedback state and player in the selected theme. */
:root{color-scheme:light;--page:#f7f5ef;--surface:#fffefa;--ink:#243c33;--accent:#345b43;--on-accent:#fff;--secondary:#405347;--muted:#63715f;--line:#d7dfcf;--soft:#f1f3eb;--selected:#edf3e6;--success-bg:#eaf3e3;--success-line:#386f34;--success-ink:#305c3c;--warning-bg:#fff1e5;--warning-line:#a44e2c;--disabled-bg:#e5e9df;--disabled-ink:#5e6c59;--focus:#b67842;--shadow:#263b3214;--card-radius:18px;--button-radius:11px}
:root[data-theme="mint"]{--page:#f3f7f5;--surface:#fff;--ink:#173c32;--accent:#214f40;--on-accent:#fff;--secondary:#395c4e;--muted:#4f6b5e;--line:#c9ddcb;--soft:#e2efdf;--selected:#d9eecb;--success-bg:#def0d7;--success-line:#386f34;--success-ink:#285b30;--warning-bg:#fff0e3;--warning-line:#a45028;--disabled-bg:#e4ece4;--disabled-ink:#526b59;--focus:#8c5a2d;--shadow:#173c3214;--card-radius:24px;--button-radius:16px}
:root[data-theme="night"]{color-scheme:dark;--page:#171b23;--surface:#202630;--ink:#f4ede1;--accent:#e8ba85;--on-accent:#232831;--secondary:#c2ccd5;--muted:#aebdc8;--line:#4d5a68;--soft:#293440;--selected:#3b382f;--success-bg:#263e30;--success-line:#8bc39b;--success-ink:#d1f0d8;--warning-bg:#493129;--warning-line:#f1b08d;--disabled-bg:#2b333e;--disabled-ink:#b4bec9;--focus:#f2ca99;--shadow:#00000044;--card-radius:14px;--button-radius:8px}
:root[data-theme="charcoal"]{color-scheme:dark;--page:#141c1c;--surface:#1d2928;--ink:#ecf4ef;--accent:#9bd7c1;--on-accent:#142d25;--secondary:#bfd2ca;--muted:#adbfba;--line:#4d6660;--soft:#263a35;--selected:#2c463d;--success-bg:#254333;--success-line:#9bcca4;--success-ink:#d4eed9;--warning-bg:#49362e;--warning-line:#e9b396;--disabled-bg:#2a3935;--disabled-ink:#b0c6bb;--focus:#c7eadd;--shadow:#00000044;--card-radius:20px;--button-radius:12px}
:root{--font-step:1pt;font-size:calc(16px - var(--font-step));font-family:"Segoe UI","Malgun Gothic",system-ui,sans-serif;color:var(--ink);background:var(--page);font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button{cursor:pointer;color:inherit}button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid var(--focus);outline-offset:3px}[hidden]{display:none!important}.app{max-width:480px;margin:auto}header{display:flex;justify-content:space-between;align-items:center;padding:20px}.brand{text-decoration:none;color:inherit;font-weight:750;font-size:calc(17px - var(--font-step))}.brand small{font-size:calc(8px - var(--font-step));letter-spacing:.12em;display:block;color:var(--muted);margin-top:2px}.tag{font-size:calc(10px - var(--font-step));border:1px solid var(--line);border-radius:20px;padding:7px 10px;color:var(--muted)}main{padding:0 20px 125px}.heading{display:flex;align-items:center;justify-content:space-between}.heading img{object-fit:cover;border-radius:15px}h1{font-size:calc(27px - var(--font-step));margin:0;letter-spacing:-.06em}.heading p{margin:4px 0 0;font-size:calc(13px - var(--font-step));color:var(--muted)}.collection{display:flex;align-items:center;justify-content:space-between;margin:20px 0 9px;font-size:calc(12px - var(--font-step))}.collection span{font-size:calc(11px - var(--font-step));color:var(--muted)}nav{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:14px}.chapter-tile{background:var(--soft);border:1px solid transparent;border-radius:12px;padding:10px 3px;text-align:center;font-size:calc(12px - var(--font-step));min-height:61px}.chapter-tile span{display:block;font-size:calc(17px - var(--font-step));margin-bottom:4px}.chapter-tile:disabled{cursor:default;color:var(--disabled-ink);background:var(--disabled-bg)}.chapter-tile.current{border:2px solid var(--accent);background:var(--surface);padding:9px 2px}.chapter-tile.cleared{color:var(--success-ink);background:var(--success-bg)}.game{padding:20px 17px;background:var(--surface);border:1px solid var(--line);border-radius:19px}.eyebrow{font-size:calc(10px - var(--font-step));color:var(--muted);font-weight:700;letter-spacing:.08em}h2{font-size:calc(22px - var(--font-step));letter-spacing:-.05em;margin:7px 0 4px}p{line-height:1.5}.english{font-size:calc(13px - var(--font-step));color:var(--muted);margin:4px 0 0}.scene{margin:17px 0;padding:13px;background:var(--soft);border-radius:12px}.scene p{font-size:calc(14px - var(--font-step));margin-top:0;margin-bottom:5px}.scene .english{font-size:calc(12px - var(--font-step))}blockquote{margin:10px 0;font-size:calc(16px - var(--font-step));line-height:1.6;font-weight:600}h3{font-size:calc(16px - var(--font-step));line-height:1.5;margin:0 0 3px}.small-button{border:1px solid var(--line);background:transparent;border-radius:9px;padding:9px 11px;font-size:calc(12px - var(--font-step));min-height:40px}.scene button{margin-top:7px}#choices{display:grid;gap:9px;margin-top:15px}.choice{border:1px solid var(--line);border-radius:12px;background:var(--surface);display:flex;gap:10px;text-align:left;padding:12px;line-height:1.55;font-size:calc(14px - var(--font-step))}.choice .letter{border-radius:50%;background:var(--soft);flex:0 0 23px;height:23px;text-align:center;font-size:calc(11px - var(--font-step));line-height:23px}.choice small{display:block;font-size:calc(12px - var(--font-step));line-height:1.45;color:var(--muted);margin-top:5px}.choice.wrong{border-color:var(--warning-line);background:var(--warning-bg)}.choice.correct{border-color:var(--success-line);background:var(--success-bg)}.choice:disabled{cursor:default;opacity:1}.choice:disabled:not(.correct){opacity:.5}#feedback{font-size:calc(13px - var(--font-step));line-height:1.6;margin-top:14px;padding:11px;border-radius:10px;background:var(--warning-bg)}#feedback.correct{background:var(--success-bg)}#feedback small{display:block;color:var(--muted);margin-top:3px;font-size:calc(12px - var(--font-step))}#reward{display:grid;gap:10px;margin-top:12px}.primary{border:0;border-radius:11px;background:var(--accent);color:var(--on-accent);padding:13px;font-size:calc(14px - var(--font-step));font-weight:600;width:100%;min-height:45px}.all-clear{margin-top:14px;border:1px solid var(--line);border-radius:15px;padding:17px;background:var(--success-bg)}.all-clear p{font-size:calc(12px - var(--font-step));color:var(--muted)}.relax{margin-top:19px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.relax summary{cursor:pointer;padding:17px 0;font-size:calc(14px - var(--font-step));font-weight:600}.relax summary span{font-size:calc(12px - var(--font-step));font-weight:400;color:var(--muted);margin-left:7px}.relax-body{padding-bottom:14px}#chapters{display:grid;gap:7px;margin:9px 0}.chapter-button{display:flex;justify-content:space-between;border:1px solid var(--line);background:transparent;border-radius:9px;padding:11px;font-size:calc(12px - var(--font-step));min-height:42px}.chapter-button.is-current{background:var(--selected)}.settings{display:flex;flex-wrap:wrap;gap:14px;font-size:calc(11px - var(--font-step));align-items:center;margin-top:14px}.settings select{border:1px solid var(--line);border-radius:6px;padding:5px;background:var(--surface)}.muted{font-size:calc(11px - var(--font-step));color:var(--muted)}.bottom-note{display:flex;justify-content:space-between;align-items:center;margin:16px 0;color:var(--muted);font-size:calc(10px - var(--font-step))}.bottom-note button{border:0;background:none;color:var(--muted);font-size:calc(10px - var(--font-step));padding:10px}.player{position:fixed;bottom:0;left:50%;transform:translateX(-50%);width:min(480px,100%);border:1px solid var(--line);border-radius:18px 18px 0 0;border-bottom:0;background:var(--surface);padding:11px 19px max(10px,env(safe-area-inset-bottom));box-shadow:0 -5px 22px var(--shadow);z-index:3}.player-row{display:flex;gap:10px;align-items:center}.play{width:35px;height:35px;flex-shrink:0;border-radius:50%;border:0;background:var(--accent);color:var(--on-accent);font-size:calc(13px - var(--font-step))}#player-title{font-size:calc(11px - var(--font-step));flex:1;line-height:1.5}.speed summary{font-size:calc(12px - var(--font-step));cursor:pointer;list-style:none;padding:9px;border-radius:8px;background:var(--soft);white-space:nowrap}.speed-panel{position:absolute;bottom:calc(100% + 8px);right:15px;width:260px;padding:15px;background:var(--surface);border:1px solid var(--line);box-shadow:0 4px 20px var(--shadow);border-radius:13px}.speed-panel label{display:block;font-size:calc(12px - var(--font-step))}.speed-panel input{width:100%;margin:12px 0 0;accent-color:var(--accent)}.rate-labels{display:flex;justify-content:space-between;font-size:calc(10px - var(--font-step));color:var(--muted)}.speed-panel small{display:block;font-size:calc(10px - var(--font-step));margin-top:12px;color:var(--muted)}.seek-row{display:flex;align-items:center;gap:8px;margin-top:5px}.seek-row input{flex:1;min-width:0;height:16px;accent-color:var(--accent)}.seek-row time{font-size:calc(9px - var(--font-step));color:var(--muted)}.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}@media(min-width:600px){.app{padding-top:15px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
/* Always-visible transport controls, shared by story, chapter and dialogue audio. */
main{padding-bottom:170px}.player-caption{flex:1;min-width:0}.player-caption strong{display:block}.player-caption small{display:block;font-size:calc(10px - var(--font-step));color:var(--muted);margin-top:2px}.transport{display:grid;grid-template-columns:1fr 1.5fr 1fr 1fr;gap:6px;margin-top:9px}.control{min-height:40px;padding:8px 4px;border:1px solid var(--line);border-radius:9px;background:var(--soft);font-size:calc(12px - var(--font-step));font-weight:600}#play-all{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}.control:disabled{opacity:.4;cursor:default}
/* Readable bilingual copy and an explicit select-then-check answer flow. */
.english,.scene .english,.choice small,#feedback small,.all-clear p{font-size:calc(16px - var(--font-step));line-height:1.6;color:var(--secondary)}.scene p{font-size:calc(16px - var(--font-step));line-height:1.65}.choice{position:relative;cursor:pointer;font-size:calc(17px - var(--font-step));line-height:1.6;padding:14px;gap:12px}.choice input[type=radio]{width:22px;height:22px;flex:0 0 22px;margin:3px 0 0;accent-color:var(--accent);cursor:pointer}.choice.selected{border:2px solid var(--accent);padding:13px;background:var(--selected)}.choice.selected.wrong{border-color:var(--warning-line);background:var(--warning-bg)}.choice.selected.correct{border-color:var(--success-line);background:var(--success-bg)}.choice small{margin-top:7px}.check-answer{font-size:calc(16px - var(--font-step));margin-top:14px}.check-answer:disabled{background:var(--disabled-bg);color:var(--disabled-ink);cursor:default}h3{font-size:calc(18px - var(--font-step));line-height:1.6}#feedback{font-size:calc(16px - var(--font-step));line-height:1.65}#feedback small{margin-top:6px}.heading p{font-size:calc(16px - var(--font-step));color:var(--secondary)}.eyebrow{font-size:calc(12px - var(--font-step));color:var(--secondary)}.collection{font-size:calc(14px - var(--font-step))}.collection span,.tag{font-size:calc(12px - var(--font-step));color:var(--secondary)}.small-button,.chapter-button,.relax summary span,.settings{font-size:calc(14px - var(--font-step));color:var(--secondary)}.small-button{min-height:44px}.muted{font-size:calc(14px - var(--font-step));color:var(--secondary)}.bottom-note,.bottom-note button{font-size:calc(12px - var(--font-step));color:var(--secondary)}.player-caption small,.speed-panel small,.rate-labels{font-size:calc(12px - var(--font-step));color:var(--secondary)}#player-title{font-size:calc(13px - var(--font-step))}.speed summary,.speed-panel label{font-size:calc(14px - var(--font-step))}.control{min-height:44px;font-size:calc(14px - var(--font-step))}.seek-row time{font-size:calc(11px - var(--font-step));color:var(--secondary)}
/* One saved display preference for every chapter; settings stay bilingual. */
html[data-language="ko"] [data-en],html[data-language="explanations"] [data-en="translation"]{display:none!important}.heading>div{min-width:0}.heading img{width:62px;flex-shrink:0;margin-left:8px}.heading .mission-question{font-size:calc(22px - var(--font-step));line-height:1.5;color:var(--ink);margin:0}.global-settings{margin:16px 0;border:1px solid var(--line);border-radius:12px;background:var(--surface)}.global-settings>summary{cursor:pointer;padding:13px;font-size:calc(16px - var(--font-step));font-weight:600}.global-settings>summary span{font-weight:400;color:var(--secondary)}.language-options{border:0;border-top:1px solid var(--line);padding:16px 13px 6px;margin:0;min-width:0}.language-options legend{float:left;width:100%;font-size:calc(16px - var(--font-step));margin-bottom:12px;font-weight:600}.language-options legend span{display:block;font-weight:400;color:var(--secondary);line-height:1.6}.language-options label{display:flex;align-items:flex-start;gap:11px;padding:12px 10px;clear:both;border:1px solid var(--line);border-radius:10px;margin-bottom:9px;font-size:calc(16px - var(--font-step));cursor:pointer;line-height:1.5}.language-options label:has(input:checked){border-color:var(--accent);background:var(--selected)}.language-options input{accent-color:var(--accent);width:21px;height:21px;flex-shrink:0;margin:3px 0 0}.language-options small{display:block;font-size:calc(16px - var(--font-step));color:var(--secondary);line-height:1.6}.language-note{clear:both;font-size:calc(14px - var(--font-step));color:var(--secondary);line-height:1.6}.language-note span{display:block;font-size:calc(16px - var(--font-step))}.chapter-button small{display:block;font-size:calc(14px - var(--font-step));color:var(--secondary);margin-top:4px}.chapter-tile small{display:block;font-size:calc(13px - var(--font-step));color:var(--secondary);line-height:1.35;margin-top:4px}.chapter-tile:disabled small{color:inherit}.transport [data-en]{display:block;font-size:calc(11px - var(--font-step));line-height:1.2;margin-top:2px}.transport .control{min-height:48px}.transport #play-all [data-en]{color:inherit}

.close-settings{margin:2px 0 10px;min-height:46px;font-size:calc(16px - var(--font-step))}
.zero-rate-note{font-size:calc(14px - var(--font-step));line-height:1.5;color:var(--secondary);margin:12px 0 0}.zero-rate-note span{display:block}.speed-panel{width:280px}.rate-labels{font-variant-numeric:tabular-nums}.speed-panel input{min-height:24px}
.speed-save{margin-top:14px;min-height:46px;font-size:calc(16px - var(--font-step))}
/* Keep the complete transport button as one stable touch target. */
.transport .control{touch-action:manipulation}.transport .control>*{pointer-events:none}

/* Category metadata drives the chapter catalog; questions remain inside each chapter. */
.back-link{border:0;background:none;padding:0 0 14px;text-align:left;font-size:calc(15px - var(--font-step));color:var(--accent);min-height:36px}.library-progress{font-size:calc(14px - var(--font-step));color:var(--secondary);margin:20px 0 12px}.library-progress [data-en]{display:block;margin-top:4px}#category-filters{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:16px}.category-filter{border:1px solid var(--line);border-radius:11px;background:var(--surface);padding:10px 12px;text-align:left;font-size:calc(15px - var(--font-step));min-height:44px}.category-filter small{display:block;font-size:calc(14px - var(--font-step));margin-top:3px}.category-filter[aria-pressed="true"]{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}#chapter-list{display:grid;gap:13px}.chapter-card{display:block;width:100%;position:relative;text-align:left;border:1px solid var(--line);background:var(--surface);border-radius:16px;padding:18px}.card-meta{font-size:calc(13px - var(--font-step));color:var(--secondary);margin-bottom:12px;padding-right:60px}.card-meta [data-en]{display:block;margin-top:3px}.chapter-card img{float:right;margin:0 0 9px 10px;border-radius:12px}.card-title{display:block;font-size:calc(20px - var(--font-step));line-height:1.5;letter-spacing:-.03em}.card-english{display:block;font-size:calc(16px - var(--font-step));line-height:1.6;color:var(--secondary);margin-top:4px}.chapter-card p{font-size:calc(16px - var(--font-step));line-height:1.6;margin:11px 0 15px;clear:both}.card-bottom{display:flex;align-items:center;justify-content:space-between;gap:10px;border-top:1px solid var(--line);padding-top:12px;font-size:calc(14px - var(--font-step))}.card-action{font-weight:600;color:var(--accent)}.card-action [data-en]{display:block;font-size:calc(14px - var(--font-step));margin-top:3px}.card-bottom>span:first-child{white-space:nowrap}#library-view{padding-bottom:20px}.app:has(#library-view:not([hidden])):has(#audio-player[hidden]) main{padding-bottom:25px}#complete-back{margin:10px 5px 0 0}

.library-listen{border:1px solid var(--line);border-radius:14px;background:var(--soft);padding:14px;margin-bottom:16px}.library-listen .primary{font-size:calc(16px - var(--font-step))}.library-listen .primary [data-en]{display:block;margin-top:4px;font-weight:400}.library-listen-body>.small-button{display:block;width:100%;margin-top:9px;background:var(--surface);font-size:calc(15px - var(--font-step))}.library-listen-body>.small-button [data-en]{display:block;margin-top:3px}.listening-note{font-size:calc(14px - var(--font-step));line-height:1.6;color:var(--secondary);margin:11px 0 0}.listening-note [data-en]{display:block}.library-listen .settings{gap:9px;margin-top:12px}#listen-everything{width:100%;margin-bottom:9px}
/* Mobile reading size matched to the supplied reference. */
@media(max-width:600px){
 .scene p,.choice,#feedback,.chapter-card p{font-size:18px;line-height:1.7}
 .english,.scene .english,.choice small,#feedback small,.card-english,.all-clear p,.heading p{font-size:16px;line-height:1.65}
 blockquote{font-size:18px;line-height:1.7}
 h3{font-size:18px;line-height:1.65}
 .scene .small-button,.check-answer,.close-settings,.global-settings>summary,.language-options legend,.language-options label,.language-options small,.language-note span{font-size:16px}
 .scene .small-button{min-height:44px;line-height:1.5}
}

.game,.chapter-card{border-radius:var(--card-radius)}.primary{border-radius:var(--button-radius)}
:root[data-theme="mint"] .chapter-card{box-shadow:0 4px 0 #d6e5d2}
:root[data-theme="night"] #chapter-art,:root[data-theme="night"] .chapter-card img{filter:brightness(.82) saturate(.72)}
:root[data-theme="charcoal"] #chapter-art,:root[data-theme="charcoal"] .chapter-card img{filter:brightness(.86) saturate(.75)}
.design-options{border:0;border-top:1px solid var(--line);padding:16px 13px;margin:0;min-width:0}.design-options legend{float:left;width:100%;font-size:16px;font-weight:600;line-height:1.5;margin-bottom:12px}.design-options legend span{font-weight:400;color:var(--secondary)}.theme-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;clear:both}.theme-option{position:relative;display:flex;flex-direction:column;gap:8px;border:1px solid var(--line);border-radius:12px;padding:10px;cursor:pointer;min-width:0;background:var(--surface);font-size:16px;line-height:1.5}.theme-option:has(input:checked){border:2px solid var(--accent);padding:9px;background:var(--selected)}.theme-option input{position:absolute;top:11px;right:11px;width:20px;height:20px;accent-color:var(--accent);margin:0;z-index:1}.theme-option small{display:block;font-size:14px;line-height:1.5;color:var(--secondary)}.theme-swatch{display:block;position:relative;height:47px;border:1px solid var(--line);border-radius:8px;background:var(--swatch-page);overflow:hidden;pointer-events:none}.theme-swatch::before{content:"";position:absolute;left:8px;top:9px;width:50%;height:27px;background:var(--swatch-surface);border-radius:5px;box-shadow:0 2px 4px #00000012}.theme-swatch::after{content:"";position:absolute;left:13px;top:25px;width:30%;height:6px;border-radius:3px;background:var(--swatch-accent)}
[data-theme-choice="paper"]{--swatch-page:#f7f5ef;--swatch-surface:#e8ede4;--swatch-accent:#345b43}[data-theme-choice="mint"]{--swatch-page:#e2efdf;--swatch-surface:#cce9c3;--swatch-accent:#214f40}[data-theme-choice="night"]{--swatch-page:#171b23;--swatch-surface:#344453;--swatch-accent:#e8ba85}[data-theme-choice="charcoal"]{--swatch-page:#141c1c;--swatch-surface:#2e4840;--swatch-accent:#9bd7c1}
.theme-save-status{font-size:14px;line-height:1.6;color:var(--secondary);margin:13px 0 0}.settings-close-top{display:flex;justify-content:flex-end;padding:0 13px 10px}.settings-close-top button{font-size:14px;min-height:40px}
/* Separate repeat and sleep timer into two clearly labeled rows. */
.library-listen .settings,.relax .settings{display:grid;grid-template-columns:minmax(0,1fr);gap:0}
.settings .setting-row{display:flex;align-items:center;gap:12px;min-width:0;min-height:48px;line-height:1.5}
.settings .setting-row+.setting-row{border-top:1px solid var(--line);margin-top:10px;padding-top:12px}
.settings .setting-copy{display:block;flex:1;min-width:0}
.settings .setting-copy small{display:block;font-size:inherit;font-weight:400;color:var(--secondary);margin-top:2px}
.settings .setting-row input[type=checkbox]{width:20px;height:20px;flex:0 0 20px;margin:0;accent-color:var(--accent)}
.settings .setting-row select{margin-left:auto;min-height:44px;min-width:84px;color:var(--ink)}
/* Theme choices live in their own dialog, shared by current and future chapters. */
:root[data-theme="blue"]{--page:#f1f6fc;--surface:#fff;--ink:#20354d;--accent:#315f8f;--on-accent:#fff;--secondary:#40566e;--muted:#536b82;--line:#c9d8e7;--soft:#e7eff9;--selected:#dceafa;--success-bg:#e6f1e5;--success-line:#3c6c41;--success-ink:#285333;--warning-bg:#fff0e5;--warning-line:#a34e2a;--disabled-bg:#e1e9f1;--disabled-ink:#5b6c7d;--focus:#7d5a37;--shadow:#20354d14;--card-radius:18px;--button-radius:12px}
:root[data-theme="rose"]{--page:#fbf4f5;--surface:#fffefa;--ink:#472f3b;--accent:#875465;--on-accent:#fff;--secondary:#684c5b;--muted:#7a5968;--line:#e4ccd5;--soft:#f6e8ee;--selected:#f1dce6;--success-bg:#e8f1e5;--success-line:#456f45;--success-ink:#355a36;--warning-bg:#fff0e3;--warning-line:#a4502d;--disabled-bg:#eee3e8;--disabled-ink:#735864;--focus:#9b6d3f;--shadow:#472f3b14;--card-radius:20px;--button-radius:12px}
[data-theme-choice="blue"]{--swatch-page:#f1f6fc;--swatch-surface:#dceafa;--swatch-accent:#315f8f}[data-theme-choice="rose"]{--swatch-page:#fbf4f5;--swatch-surface:#f1dce6;--swatch-accent:#875465}
.settings-toolbar{position:relative;margin:16px 0}.settings-toolbar>.global-settings{margin:0}.settings-toolbar>.global-settings>summary{padding-right:140px}.appearance-trigger{position:absolute;top:4px;right:4px;border:1px solid var(--line);border-radius:9px;background:var(--soft);color:var(--ink);padding:7px 9px;min-height:40px;font:inherit;font-size:13px;cursor:pointer}.appearance-trigger [data-en]{font-size:11px}
#theme-dialog{width:min(420px,calc(100vw - 24px));max-height:88dvh;padding:0;border:1px solid var(--line);border-radius:18px;background:var(--surface);color:var(--ink);box-shadow:0 16px 55px var(--shadow);overflow-y:auto;overscroll-behavior:contain}#theme-dialog::backdrop{background:#0008}html:has(#theme-dialog[open]){overflow:hidden}.appearance-dialog-head{position:sticky;top:0;z-index:2;display:flex;justify-content:space-between;align-items:center;gap:12px;background:var(--surface);padding:14px 16px;border-bottom:1px solid var(--line)}.appearance-dialog-head h2{font-size:20px;margin:0}.appearance-dialog-head h2 small{display:block;font-size:14px;font-weight:400;letter-spacing:0;line-height:1.5;color:var(--secondary)}.appearance-dialog-head button{white-space:nowrap;font-size:13px;min-height:42px}.appearance-dialog-body{padding:0 16px 10px}#theme-dialog .design-options{padding:14px 0;border-top:0}#theme-dialog .design-options+.design-options{border-top:1px solid var(--line)}#theme-dialog .theme-swatch{height:34px}#theme-dialog .theme-option{gap:5px;padding:8px}#theme-dialog .theme-option:has(input:checked){padding:7px}#theme-dialog .theme-option input{top:8px;right:8px}#theme-dialog .theme-option small{font-size:13px}#theme-dialog .theme-save-status{margin:0}.appearance-dialog-foot{position:sticky;bottom:0;z-index:2;background:var(--surface);border-top:1px solid var(--line);padding:10px 16px}.appearance-dialog-foot .primary{font-size:16px;min-height:44px}
/* Fixed columns keep scene numbers and durations aligned in every chapter. */
.chapter-button{display:grid;grid-template-columns:2.3ch minmax(0,1fr) 4.5ch;gap:10px;align-items:start;text-align:left;line-height:1.55;padding:12px}
.audio-scene-number,.audio-scene-duration{font-variant-numeric:tabular-nums;white-space:nowrap}.audio-scene-copy{display:block;min-width:0;text-align:left}.audio-scene-copy>span{display:block}.audio-scene-copy small{margin-top:5px;text-align:left}.audio-scene-duration{text-align:right}
.chapter-navigation{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:10px;align-items:center;margin:18px 0 0}.chapter-navigation button{min-height:46px;font-size:14px}.chapter-navigation button small{display:block;font-size:12px;margin-top:3px;color:inherit}.chapter-navigation button:disabled{opacity:.5;cursor:default}.chapter-navigation>span{font-size:12px;font-variant-numeric:tabular-nums;color:var(--secondary);white-space:nowrap}
.playlist-navigation{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:8px 0 0}.playlist-navigation button{min-height:44px;font-size:13px}.playlist-navigation button small{display:block;font-size:11px;margin-top:2px;color:inherit}.playlist-navigation button>*{pointer-events:none}.app:has(#playlist-navigation:not([hidden])) main{padding-bottom:230px}
/* Compact title-row shortcuts; settings only occupy space when opened. */
.heading{display:block;position:relative}.heading-title-row{display:flex;align-items:center;justify-content:space-between;gap:10px}.heading-title-row h1{flex:1;min-width:0}.heading-actions{display:flex;align-items:center;gap:3px;flex:0 0 auto}.icon-button{display:grid;place-items:center;width:44px;height:44px;padding:10px;border:0;border-radius:10px;background:transparent;color:var(--ink);cursor:pointer;touch-action:manipulation}.icon-button:hover,.icon-button[aria-expanded="true"]{background:var(--soft)}.icon-button svg{display:block;width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linejoin:round;stroke-linecap:round;pointer-events:none}.heading #chapter-art{position:absolute;right:0;bottom:0;width:32px;height:26px;margin:0}.heading:has(#chapter-art:not([hidden])) #mission-title-en{padding-right:42px}
.preference-dialog{width:min(420px,calc(100vw - 24px));max-height:85dvh;padding:0;border:1px solid var(--line);border-radius:18px;background:var(--surface);color:var(--ink);box-shadow:0 16px 55px var(--shadow);overflow-y:auto;overscroll-behavior:contain}.preference-dialog::backdrop{background:#0008}html:has(.preference-dialog[open]){overflow:hidden}.preference-dialog-head{position:sticky;top:0;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;background:var(--surface);border-bottom:1px solid var(--line)}.preference-dialog-head h2{font-size:20px;margin:0}.preference-dialog-head h2 small{display:block;font-size:14px;color:var(--secondary);font-weight:400;line-height:1.5;letter-spacing:0}.preference-dialog-head button{font-size:13px;white-space:nowrap;min-height:42px}.preference-dialog .language-options{padding:16px;border:0}.preference-dialog .close-settings{margin:4px 0 0}

/* The library listening controls stay folded until requested. */
.library-listen{padding:0;overflow:clip}.library-listen>summary{display:flex;align-items:center;justify-content:space-between;gap:14px;cursor:pointer;list-style:none;padding:13px 15px;min-height:58px;color:var(--ink);font-size:16px;font-weight:600;touch-action:manipulation}.library-listen>summary::-webkit-details-marker{display:none}.library-listen>summary:focus-visible{outline-offset:-4px;border-radius:13px}.library-listen-label{min-width:0}.library-listen-label small{font-size:14px;color:var(--secondary);font-weight:400;margin-left:8px}.listening-chevron{width:9px;height:9px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);flex:0 0 9px;margin:0 3px 5px}.library-listen[open] .listening-chevron{transform:rotate(225deg);margin-bottom:-4px}.library-listen[open]>summary{border-bottom:1px solid var(--line)}.library-listen-body{padding:14px}.library-listen-body>.small-button{display:block;width:100%;margin-top:9px;background:var(--surface);font-size:calc(15px - var(--font-step))}

/* A compact Google account control replaces the header's chapter-count badge. */
.brand{display:flex;align-items:center;gap:9px}.brand .brand-icon{display:block;width:34px;height:34px;flex:0 0 34px;border-radius:10px}.brand>span{display:block}
#my-learning{border:1px solid var(--line);border-radius:12px;padding:12px;margin:15px 0}#my-learning>summary{cursor:pointer;font-size:16px;font-weight:600}#my-learning>summary small{display:inline;margin-left:5px;font-weight:400}#learning-stats{margin-top:15px}#learning-stats p{font-size:14px;margin:12px 0}#learning-stats small{font-size:12px}.learning-totals{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:0}.learning-totals>div{padding:10px;background:var(--soft);border-radius:9px}.learning-totals dt{font-size:14px;line-height:1.4}.learning-totals dt small{font-size:11px}.learning-totals dd{margin:5px 0 0;font-size:24px;font-weight:700}.learning-days{border-collapse:collapse;width:100%;font-size:12px;font-variant-numeric:tabular-nums}.learning-days th,.learning-days td{padding:8px 3px;text-align:left;border-bottom:1px solid var(--line)}.learning-days th{font-size:11px}.learning-rate{display:block;height:5px;background:var(--soft);border-radius:3px;margin-top:4px;overflow:hidden}.learning-rate>span{display:block;height:100%;background:var(--accent)}.bottom-note{gap:12px;align-items:flex-start}.bottom-note #progress-save-state{max-width:calc(100% - 65px);line-height:1.5}.bottom-note #progress-save-state [lang="en"]{display:block;margin-top:3px}
.account-trigger{display:flex;align-items:center;gap:8px;max-width:180px;min-height:44px;padding:8px 13px;border:1px solid var(--line);border-radius:24px;background:var(--surface);color:var(--ink);font-size:14px;line-height:1.4}.account-trigger svg,.google-placeholder svg{width:19px;height:19px;flex:0 0 19px}.account-trigger #account-label{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.account-trigger:hover,.account-trigger[aria-expanded="true"]{background:var(--soft)}#account-initial{display:grid;place-items:center;min-width:23px;height:23px;border-radius:50%;background:var(--accent);color:var(--on-accent);font-size:12px;font-weight:700}.account-body{padding:18px 18px 20px}.account-body p{margin:0 0 17px;font-size:16px;line-height:1.6}.account-body small{display:block;color:var(--secondary);font-size:14px;line-height:1.6;margin-top:5px}.google-placeholder{width:min(280px,100%);display:flex;align-items:center;justify-content:center;gap:12px;min-height:44px;border:1px solid var(--line);border-radius:24px;background:var(--surface);color:var(--secondary);font-size:15px;cursor:default;margin:0 auto 18px}.google-placeholder:disabled{opacity:.7}#google-button{display:flex;align-items:center;justify-content:center;width:min(280px,100%);height:44px;min-width:0;overflow:hidden;margin:0 auto 18px}#google-button svg{display:block;width:18px;height:18px;max-width:18px;max-height:18px;flex:0 0 18px}#google-button:empty{display:none}.account-body .account-privacy{font-size:13px;color:var(--secondary);margin:17px 0}.account-body .account-privacy small{font-size:12px}.account-body .account-local-note{font-size:14px;color:var(--secondary);border-top:1px solid var(--line);padding-top:14px;margin-bottom:0}.account-body .account-local-note small{font-size:13px}#account-name{display:block;font-size:20px;overflow-wrap:anywhere}#account-email{font-size:14px;color:var(--secondary);overflow-wrap:anywhere;margin-top:4px}.account-body #account-logout{margin-bottom:18px}html:has(#account-dialog[open]){overflow:hidden}

/* Keep the catalog controls to a fixed number of rows as categories grow. */
html[data-view="library"] header{padding:10px 20px}
.library-toolbar{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px;margin:0 0 6px}
#category-filters{display:block;min-width:0;margin:0}
#category-select{display:block;width:100%;min-width:0;max-width:100%;height:44px;padding:8px 28px 8px 12px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--ink);font-size:15px;line-height:1.4;text-overflow:ellipsis;cursor:pointer}
.library-progress{font-size:13px;line-height:20px;min-height:20px;margin:0 0 9px;color:var(--secondary)}
.library-progress [data-en]{display:inline;margin:0}
.library-listen{margin-bottom:12px}
.library-listen>summary{padding:9px 12px;min-height:44px;gap:10px;font-size:15px}
.library-listen-label small{font-size:14px;margin-left:6px}

/* Learning records are a routed page, with no extra account confirmation panel. */
html[data-view="learning"] header{padding:10px 20px}
.learning-page-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin:2px 0 20px}
#learning-title{font-size:24px;line-height:1.4;letter-spacing:-.04em}
#learning-title small{display:block;font-size:16px;font-weight:400;letter-spacing:0;color:var(--secondary);margin-top:5px}
#learning-stats{margin-top:0}
#learning-stats small,#learning-guest small{display:block;color:var(--secondary);font-size:14px;line-height:1.5;margin-top:4px}
#learning-stats p{font-size:16px;line-height:1.6;margin:16px 0}
#learning-stats .learning-totals>div{padding:16px 13px;border:1px solid var(--line);border-radius:var(--card-radius);background:var(--soft)}
#learning-stats .learning-totals dt{font-size:16px}
#learning-stats .learning-totals dd{font-size:30px;margin-top:10px}
#learning-stats .learning-days{font-size:14px}
#learning-stats .learning-days th{font-size:12px}
#learning-stats .learning-days th,#learning-stats .learning-days td{padding:12px 4px}
#learning-stats .learning-rate{height:7px;margin-top:6px}
#learning-member>#account-logout{margin-top:20px;min-height:44px;font-size:15px}
#learning-account-status{font-size:15px;color:var(--secondary);line-height:1.6}
#learning-account-status:empty{display:none}
#learning-guest p{font-size:16px;line-height:1.6;margin:18px 0}
#learning-view .back-link{margin-top:4px}
.app:has(#learning-view:not([hidden])):has(#audio-player[hidden]) main{padding-bottom:25px}

/* Responsive SVG charts share the app theme and never load a chart library. */
.learning-charts{margin-top:25px}
.learning-chart-controls{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}
.learning-chart-controls h2{font-size:18px;margin:0;line-height:1.4;letter-spacing:-.02em}
#learning-stats .learning-chart-controls h2 small{font-size:14px;font-weight:400}
#learning-chart-range{min-height:44px;min-width:0;max-width:56%;font-size:14px;padding:8px 25px 8px 10px;border:1px solid var(--line);border-radius:9px;background:var(--surface);color:var(--ink)}
#learning-stats .learning-chart-hint{font-size:14px;margin:10px 0 14px;line-height:1.5;color:var(--secondary)}
.learning-chart-plots{display:grid;gap:14px}
.learning-chart{margin:0;padding:15px 12px 12px;border:1px solid var(--line);border-radius:var(--card-radius);background:var(--surface);min-width:0}
.learning-chart figcaption{font-size:17px;font-weight:650;line-height:1.4;margin:0 3px 12px}
#learning-stats .learning-chart figcaption small{font-size:14px;font-weight:400}
.learning-chart svg{display:block;width:100%;height:auto;overflow:visible;touch-action:pan-y;cursor:crosshair}
.learning-chart svg:focus-visible{outline:3px solid var(--focus);outline-offset:3px;border-radius:4px}
.chart-grid{stroke:var(--line);stroke-width:.7}
.chart-axis{fill:var(--secondary);font-size:10px;font-variant-numeric:tabular-nums}
.chart-day-selection{fill:var(--soft)}
.chart-bar{fill:var(--accent);opacity:.65}
.chart-bar.selected{opacity:1;stroke:var(--ink);stroke-width:1}
.chart-accuracy-line{fill:none;stroke:var(--accent);stroke-width:2.5;stroke-linejoin:round;stroke-linecap:round}
.chart-dot{fill:var(--surface);stroke:var(--accent);stroke-width:2}
.chart-dot.selected{fill:var(--accent);stroke:var(--ink);stroke-width:2}
.learning-chart-reading{display:grid;grid-template-columns:1fr auto;align-items:center;gap:3px 8px;border-top:1px solid var(--line);padding:10px 3px 0;margin-top:6px;font-size:14px;font-variant-numeric:tabular-nums}
.learning-chart-reading time{color:var(--secondary)}
.learning-chart-reading strong{font-size:17px;text-align:right}
#learning-stats .learning-chart-reading small{grid-column:1/-1;margin:0;text-align:right;font-size:13px}
#learning-stats .learning-chart-note,#learning-stats .learning-chart-empty{font-size:14px;line-height:1.6;margin:14px 0;color:var(--secondary)}
.learning-day-details{border-top:1px solid var(--line);margin-top:18px}
.learning-day-details>summary{padding:13px 0;min-height:44px;cursor:pointer;font-size:15px;font-weight:600}
#learning-stats .learning-day-details>summary small{display:inline;margin-left:6px;font-weight:400}
#learning-stats .chart-missing-note{font-size:13px;line-height:1.5;color:var(--secondary);margin:10px 3px 0}

/* Do not paint a signed-out header while a stored session is being restored. */
html[data-auth-ui="pending"] #open-account{visibility:hidden}
html[data-auth-ui="member"] #open-account>svg{display:none!important}

/* Keep whole-chapter listening visible before any question is answered. */
.chapter-listening{margin-top:14px}
.chapter-listening>.primary{font-size:14px;line-height:1.4;padding:10px 12px;min-height:44px;border-radius:9px}
.chapter-listening>.primary [data-en]{display:inline;font-size:12px;font-weight:400;margin-left:5px;margin-top:0}
.chapter-listening .relax{margin-top:6px;border-top:0}
.chapter-listening .relax>summary{padding:10px 0;min-height:44px;font-size:14px}
.chapter-listening .relax>summary span{font-size:13px;margin-left:5px}
.chapter-listening+.collection{margin-top:14px}
.legal-links{display:flex;flex-wrap:wrap;gap:10px 16px;margin:24px 0 0;font-size:12px}
.legal-links a{color:var(--secondary);line-height:1.5;text-underline-offset:3px}
.delete-account-link{display:block;margin-top:14px}
.delete-account-actions{display:flex;justify-content:flex-end;gap:12px;margin-top:20px}
#confirm-delete-account{font-weight:700}
#delete-account-error{color:var(--secondary);font-size:14px}