/* KeyAtlas visual system. UI, editorial headings, and practice text have distinct roles. */
:root{
  --font-ui:'Plus Jakarta Sans',system-ui,-apple-system,'Segoe UI',sans-serif;
  --font-editorial:'Playfair Display',Georgia,serif;
  --font-practice:'JetBrains Mono',ui-monospace,SFMono-Regular,Consolas,monospace;
  --page:#f5efe6;--surface:#faf7f2;--soft:#ebe2d5;--ink:#0a261e;--muted:#526158;
  --line:#d4c9b9;--accent:#c7d9be;--error:#a5322a;--error-bg:#fdeae8;
  --focus:#1d5c4b;--action:#0f382c;--action-ink:#faf7f2;--brand:#1d5c4b;--gold:#a77339;
  --panel-radius:20px;--control-radius:10px;--panel-shadow:0 4px 0 #0f382c0d;
  color-scheme:light;
}
body[data-theme=dark],:root[data-theme=dark]{
  --page:#1a201c;--surface:#232b28;--soft:#2c3830;--ink:#faf7f2;--muted:#c7cebf;
  --line:#46544a;--accent:#c7d9be;--error:#ffb9ac;--error-bg:#512d2a;
  --focus:#e5b869;--action:#c7d9be;--action-ink:#0a261e;--brand:#c7d9be;--gold:#e5b869;
  --panel-shadow:0 4px 0 #0002;color-scheme:dark;
}
html{scroll-padding-top:24px}body{background:var(--page);color:var(--ink);font:15px/1.75 var(--font-ui);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
button,input,select,textarea,summary{font-family:var(--font-ui)}button,input,select,textarea{transition:background-color .15s,border-color .15s,box-shadow .15s}
button{font-size:13px;font-weight:650;line-height:1.5;min-height:44px;border-radius:var(--control-radius);border:1px solid var(--line);background:var(--surface);color:var(--ink);padding:10px 16px}
button:hover{background:var(--soft);border-color:var(--muted)}button.primary,button.active,.f-stage-active{background:var(--action);border-color:var(--action);color:var(--action-ink)}button.primary:hover,button.active:hover{background:var(--action);color:var(--action-ink);filter:brightness(.96);opacity:1}
button:disabled{cursor:not-allowed;opacity:.5}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid var(--focus);outline-offset:4px}
a{color:var(--brand);text-underline-offset:4px;text-decoration-thickness:1px}p,small,.eyebrow,.stat span,footer,.foot{color:var(--muted)}p{line-height:1.85}
h1,h2,h3,h4{font-family:var(--font-ui);color:var(--ink);letter-spacing:-.045em;overflow-wrap:break-word}h1{font-size:clamp(32px,4.2vw,48px);font-weight:800;line-height:1.2;margin:14px 0 20px}h1 em{font-family:var(--font-editorial);font-weight:600;font-style:italic;color:var(--brand);letter-spacing:-.04em}h2{font-size:25px;font-weight:750;line-height:1.4}h3{font-size:18px;font-weight:700;line-height:1.5}.eyebrow{font-size:10px;letter-spacing:.16em;font-weight:750;color:var(--brand)}
main{max-width:1200px;margin:auto;padding:34px 28px 52px;min-width:0}section{scroll-margin-top:24px}select,input[type=search],input[type=text],textarea{color:var(--ink);background:var(--surface);border:1px solid var(--line);border-radius:var(--control-radius)}select{min-height:44px;font-size:13px;padding:10px 12px}input[type=checkbox],progress{accent-color:var(--brand)}textarea::placeholder,input::placeholder{color:var(--muted);opacity:.85}
/* Header: retain all existing destinations and responsive disclosure behavior. */
.site-header{max-width:1440px;gap:18px;padding:17px 26px;background:var(--page);border-bottom:1px solid var(--line)}.site-header .logo{gap:0;letter-spacing:-1px;line-height:1;white-space:nowrap}.site-header .logo b{display:grid;place-items:center;background:#0f382c;color:#e5b869;width:38px;height:38px;padding:0;margin-right:10px;border-radius:11px;font:600 23px var(--font-ui);border:1px solid #0a261e;box-shadow:0 2px 0 #0f382c18}.brand-key{font-family:var(--font-ui);font-weight:800;font-size:23px}.brand-atlas{font-family:var(--font-editorial);font-weight:600;font-style:italic;color:var(--brand);font-size:25px;letter-spacing:-1px}.site-header .beta-label{font:650 8px var(--font-ui);letter-spacing:1px;margin-left:8px;padding:4px 5px;border:1px solid var(--line);border-radius:4px;color:var(--muted);background:var(--surface)}
.site-header #primaryNav{padding:4px;border:1px solid var(--line);border-radius:13px;background:var(--soft);gap:3px}.site-header #primaryNav>button,.site-header #primaryNav summary{font:650 12px/1.5 var(--font-ui);padding:10px 9px;min-height:42px;color:var(--muted);border:1px solid transparent;background:transparent;border-radius:9px;white-space:nowrap}.site-header #primaryNav>button.active,.site-header #primaryNav summary[data-active=true]{background:var(--surface);color:var(--ink);border-color:var(--line);box-shadow:0 2px 0 #0f382c0a}.site-header #primaryNav>button:hover,.site-header #primaryNav summary:hover{color:var(--ink);background:var(--surface)}.header-popup{background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:12px;box-shadow:0 15px 30px #0f382c18}.header-popup button{border-color:transparent;font-size:13px;background:var(--surface)}.header-popup button:hover{background:var(--soft)}.site-header #uiLanguage{width:64px;font-size:12px;background:var(--surface);border-color:var(--line)}.site-header #themeToggle{font-size:20px;border-color:var(--line);background:var(--surface)}.mobile-nav-toggle{background:var(--surface)}
#test>.intro{margin:4px 0 28px}#test>.intro h1{font-size:clamp(32px,4vw,46px);line-height:1.2;margin:12px 0 16px;font-weight:800}#test>.intro p{max-width:68ch;font-size:14px;margin:0}.home-actions{gap:10px;margin:22px 0 0}.home-actions button{min-height:46px;font-size:12px;padding:11px 18px}.home-actions button:not(.primary){background:var(--surface)}
/* Test, course player and all embedded exercise variants. */
.workspace,.card,.learning-plan,.course-preview{border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:var(--panel-radius);box-shadow:var(--panel-shadow)}.card{padding:25px}.workspace{overflow:hidden}#typingWorkspace>.toolbar{padding:22px 26px;gap:20px;background:var(--surface);border-bottom:1px solid var(--line)}.practice-field{min-width:150px}.practice-field label{font-size:11px;font-weight:700;letter-spacing:.025em;color:var(--muted)}.practice-field select{font-size:13px;background:var(--page);border-color:var(--line);border-radius:10px;min-height:44px}#durations{padding:4px;gap:3px;border:1px solid var(--line);border-radius:11px;background:var(--page)}#durations button{border:1px solid transparent;background:transparent;font-size:12px;min-height:36px;min-width:48px;padding:7px 10px;color:var(--muted)}#durations button.active{background:var(--action);color:var(--action-ink);box-shadow:0 2px 0 #0f382c0d}
#typingWorkspace>.stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;padding:0;background:var(--soft);border-bottom:1px solid var(--line)}#typingWorkspace>.stats .stat{padding:18px 12px;border-right:1px solid var(--line);min-width:0}#typingWorkspace>.stats .stat:last-child{border-right:0}#typingWorkspace>.stats strong{font-family:var(--font-practice);font-size:32px;font-weight:700;line-height:1.3;letter-spacing:-.06em;font-variant-numeric:tabular-nums;color:var(--ink)}#typingWorkspace>.stats span{display:block;font-size:10px;font-weight:750;letter-spacing:.11em;margin-top:5px;color:var(--muted)}
#typingWorkspace #passage{font-family:var(--font-practice);font-weight:400;font-size:25px;line-height:1.9;letter-spacing:0;color:var(--muted);background:var(--page);border:1px solid var(--line);border-radius:12px;padding:20px 22px;margin:24px 26px 12px;max-height:265px;overflow:auto;white-space:pre-wrap}#typingWorkspace #input{font-family:var(--font-practice);font-weight:400;font-size:18px;line-height:1.8;letter-spacing:0;min-height:108px;background:var(--surface);border:1px solid var(--line);border-radius:11px;padding:16px 19px;width:calc(100% - 52px);margin:12px 26px 0}#typingWorkspace #input:focus{border-color:var(--focus);box-shadow:0 0 0 3px #1d5c4b12}#typingWorkspace #input::placeholder{font-family:var(--font-ui);font-size:13px}#typingWorkspace .input-feedback{font:11px/1.8 var(--font-ui);margin:10px 26px}#typingWorkspace>.foot{padding:20px 26px;border:0;gap:10px}#typingWorkspace>.foot #hint{font-size:11px;line-height:1.8}#typingWorkspace>.foot button{font-size:12px}.practice-settings{padding:0 26px;background:var(--page);border-top:1px solid var(--line)}.practice-settings>summary{font:650 12px/1.7 var(--font-ui);padding:15px 0;color:var(--muted)}.practice-settings-body{gap:24px;padding-top:8px}.practice-settings-body h3{font-size:14px}.practice-settings-body label,.practice-settings-body select{font-size:12px}.practice-settings-body p{font-size:11px!important}.practice-notes{border-color:var(--line)}
#typingWorkspace .ok{color:var(--ink);text-decoration:underline;text-underline-offset:5px}#typingWorkspace .bad{color:var(--error);background:var(--error-bg);text-decoration:underline wavy;text-underline-offset:5px}#typingWorkspace .cursor{border-color:var(--focus)}#result{background:var(--soft);border:1px solid var(--line);border-radius:12px;font-size:14px;color:var(--ink)}
/* Flat keycaps: preserve layout, next-key, focus, and pressed-state semantics. */
.key,.f-letters .course-key{font-family:var(--font-practice);font-weight:600;background:var(--surface);color:var(--ink);border:1px solid var(--line);border-bottom:3px solid var(--line);border-radius:7px;box-shadow:none}.key{font-size:12px}.key.next{background:var(--accent);color:#0a261e;border-color:#9ab58b;outline:2px solid var(--brand);outline-offset:1px}.course-keyboard{padding:22px;border:1px solid var(--line);border-radius:16px;background:var(--page)}.f-letters .course-key.active{background:var(--action);color:var(--action-ink);border-color:var(--action);outline-color:var(--focus)}.f-letters .course-key:focus-visible{outline:3px solid var(--focus);box-shadow:none}.course-extra-keys{font-family:var(--font-practice)}
.learning-plan{padding:28px;margin-top:30px}.learning-plan h2{font-size:26px;margin:10px 0}.learning-plan>div>p{font-size:13px}.learning-plan>.route-controls{background:var(--page);border:1px solid var(--line);padding:20px;border-radius:13px;gap:18px}.route-controls select{font-size:13px;background:var(--surface);min-height:45px}.route-start-actions button{font-size:12px;min-height:46px}#routePreview,#routeRunControls{background:var(--page);border-color:var(--line)}#routeSelectionSummary{font-size:12px}.lesson-example,#coursePreviewText,#rhythmLetters{font-family:var(--font-practice)!important;font-weight:400;letter-spacing:0}.lesson-example{background:var(--page);border:1px solid var(--line);border-radius:10px;padding:14px;font-size:14px;line-height:1.85}.course-preview{padding:22px}.course-preview h3{font-size:17px}#coursePreviewText{color:var(--ink);font-size:20px;line-height:1.9}.f-stage-active{color:var(--action-ink);outline-color:var(--focus)}#courseSteps button{font-size:12px}.home-guide-links a{font-size:12px;font-weight:650;padding:12px 16px;background:var(--surface);border:1px solid var(--line)}.home-discovery h2{font-size:23px}.home-discovery .card{background:var(--surface)}
.lesson-grid{gap:18px}.lesson-grid .card{padding:25px;border-radius:17px}.lesson-grid .card h3{font-size:20px;margin:10px 0}.lesson-grid .card p{font-size:13px}.lesson-grid .card>button:last-child{font-size:12px;margin-top:auto}#lessonHub .card h2{font-size:22px}#learningExercises{border-top-color:var(--line)}#lessonPracticePanel,#rhythmPanel{background:var(--soft);border-color:var(--line)}#lessonPracticeTitle,#rhythmTitle{font-size:24px;font-weight:750;letter-spacing:-.04em}#lessonPracticeChange,#rhythmControls button{font-family:var(--font-ui);font-size:14px}#typingWorkspace[data-rhythm=true] #input{font-family:var(--font-practice)}#typingWorkspace[data-rhythm=true] #passage{font-family:var(--font-practice)}#rhythmControls button,#lessonPracticeChange{border-radius:11px}#rhythmControls .rhythm-next{border-color:var(--action)}
/* Work area and browser-local document import. */
#textPoolPanel{padding:28px}#textPoolPanel h2{font-size:25px;margin:0 0 12px}#textPoolPanel>.goal-controls,#workSettings .goal-controls{background:var(--page);border:1px solid var(--line);padding:20px;gap:18px;border-radius:13px}.work-field>label{font:700 11px/1.7 var(--font-ui);color:var(--muted)}.work-field select{font-size:13px;background:var(--surface);border-color:var(--line);min-height:45px}.work-field.work-toggle{background:var(--surface);border-color:var(--line)}#workFixedTime{font-family:var(--font-practice);font-size:12px;background:var(--soft);color:var(--ink);border-radius:9px}#workCustomPanel{padding:22px;border-color:var(--line);background:var(--page)}#workCustom,#workFilePreview{font-family:var(--font-ui)!important;font-size:15px!important;line-height:1.8!important;border-color:var(--line);background:var(--surface)}#workFile{font-size:12px}#workFile::file-selector-button{font:650 12px var(--font-ui);border:1px solid var(--line);border-radius:9px;background:var(--surface);color:var(--ink);padding:11px 15px;margin-right:12px;cursor:pointer}#workFileHelp,#workFileStatus,#poolMetadata,#poolScope,#poolCount{font-size:12px;line-height:1.8}#workSearch{font-family:var(--font-ui);font-size:13px;background:var(--surface);border-color:var(--line)}#workSettings{margin:20px 0;border:1px solid var(--line);border-radius:12px;padding:0 18px}#workSettings>summary{padding:14px 0;margin:0;font-size:12px}#workSettings p{font-size:12px}#workarea #poolPreview{font-size:16px;line-height:1.95;max-height:255px}#poolStart,#poolSuggest{margin:8px 8px 8px 0;font-size:13px}#clerkArchive{border-top:1px solid var(--line);margin-top:20px;padding-top:16px;font-size:13px}#clerkSources article{padding:18px;border:1px solid var(--line);border-radius:11px;margin:12px 0;background:var(--page)}#workSource{font-size:12px;overflow-wrap:anywhere}#typingWorkspace[data-work-view=performance] .stat strong{font-size:42px}
/* All games keep their own timers and scoring. */
#game-grid .game-card,#rushCard{background:var(--surface);border:1px solid var(--line);border-radius:18px;box-shadow:var(--panel-shadow);padding:25px}#game-grid .game-card h2,#rushCard h2{font-size:23px;letter-spacing:-.04em}#game-grid .game-card p,#game-grid .game-card small,#rushCard p{font-size:13px;line-height:1.85;color:var(--muted)}#game-grid .game-card .level-action{background:var(--page);border-color:var(--line);font-size:12px;color:var(--ink)}#game-grid .game-card .level-done{color:var(--brand)}#game-grid .game-card progress{accent-color:var(--brand)}#game-grid .game-card .primary{color:var(--action-ink)}#game-grid .game-card .primary:hover{background:var(--action)}#rushQueue li,#rushInput{font-family:var(--font-practice)}#rushQueue li[aria-current=true]{font-family:var(--font-practice);background:var(--soft);color:var(--ink);border-color:var(--focus);font-weight:600}#rushInput{font-size:23px}#rushTime,#rushWords,#rushPrepValue,#studyPrepValue{font-family:var(--font-practice);font-variant-numeric:tabular-nums;letter-spacing:-.04em}.rush-stats strong{font-family:var(--font-practice)}.rush-stats span{font-size:12px}#rushSetup label{font-size:12px;font-weight:650}.level-label{font-size:13px}.game-result,.f-course-result{border-color:var(--line)}
/* Results, preparation, fallback dialogs, and history. */
dialog,#resultDialog,#rushSetup,#rushResults{font-family:var(--font-ui);background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:22px;padding:28px;box-shadow:0 25px 80px #0a261e25}dialog::backdrop{background:#0a261eaa;backdrop-filter:blur(3px)}.dialog-heading h2{font-family:var(--font-ui);font-size:30px;line-height:1.3;font-weight:800;letter-spacing:-.05em;margin:8px 0 10px}.dialog-heading>button{font-size:11px;white-space:nowrap}.result-headline{gap:12px;margin:22px 0 16px}.result-headline>div{background:var(--page);border:1px solid var(--line);border-radius:13px;padding:20px}.result-headline>div:first-child{background:var(--action);border-color:var(--action);color:var(--action-ink)}.result-headline>div:first-child span,.result-headline>div:first-child strong span{color:var(--action-ink)}.result-headline span{font:600 11px/1.7 var(--font-ui);letter-spacing:0}.result-headline strong,.result-headline strong span{font-family:var(--font-practice);font-size:34px;font-weight:700;letter-spacing:-.07em;font-variant-numeric:tabular-nums}.result-score{background:var(--soft);border:1px solid var(--line);border-radius:11px;padding:14px 18px;gap:10px}.result-score strong{font:700 28px var(--font-practice);letter-spacing:-1px}.result-score span{font-size:11px}.result-metrics{gap:10px}.result-metrics>div{background:var(--page);border:1px solid var(--line);padding:15px;border-radius:11px}.result-metrics dt{font:650 11px/1.6 var(--font-ui);color:var(--muted)}.result-metrics dd{font:650 25px/1.4 var(--font-practice);font-variant-numeric:tabular-nums;letter-spacing:-.05em;color:var(--ink)}#resultDialog>p,#dialogRule,#rushResultNote,#rushResultScope{font-size:12px;line-height:1.85}#resultDialog details{border-top:1px solid var(--line);padding-top:14px}#resultDialog summary{font-size:13px;font-weight:650;cursor:pointer}#resultDialog details p{font-size:12px}.dialog-actions{border-top:1px solid var(--line);padding-top:18px;gap:9px;margin-top:20px}.dialog-actions button{font-size:12px;min-height:44px}.lesson-dialog-button{background:var(--soft);color:var(--ink);border:1px solid var(--line)}.lesson-dialog-button:hover{background:var(--soft)}#dialogContext{font-size:12px;color:var(--muted)}#studyPreparation,#rushPreparation{border:0;border-radius:0;box-shadow:none;padding:0;background:var(--page)}.study-prep-center h2{font-size:26px}.progress-row{display:flex;gap:18px;flex-wrap:wrap;border:1px solid var(--line);border-radius:12px;background:var(--surface);padding:18px 20px;margin-bottom:10px;font-size:13px}.progress-row strong{font-family:var(--font-practice);font-variant-numeric:tabular-nums}table{font-family:var(--font-ui);background:var(--surface);color:var(--ink);font-size:13px}th{font-size:11px;font-weight:750;color:var(--muted);background:var(--page)}td,th{border-color:var(--line);padding:14px}#skillSummary .card{font-size:13px}.table-wrap{border:1px solid var(--line);border-radius:13px;overflow:auto}caption{padding:16px;font-size:13px}.content-status{font-size:11px;color:var(--muted)}
footer{font-family:var(--font-ui);font-size:11px;line-height:2;background:var(--surface);border-top:1px solid var(--line);padding:26px 30px;color:var(--muted)}footer p{font-size:11px;margin:0 auto 12px;max-width:1000px}footer a{color:var(--brand)}
/* Standalone learning, source, method, and passage guides share the same type system. */
body.guide-page{max-width:none;margin:0;padding:0;background:var(--page);font:15px/1.9 var(--font-ui);color:var(--ink)}.guide-page header{max-width:1050px;margin:auto;padding:24px 28px;border-bottom:1px solid var(--line);display:flex;flex-wrap:wrap;gap:18px;align-items:center;justify-content:space-between}.guide-page header>a{font-family:var(--font-ui);font-size:23px;font-weight:800;text-decoration:none;letter-spacing:-1px;color:var(--ink)}.guide-page header nav{display:flex;gap:8px;flex-wrap:wrap}.guide-page header nav a{padding:8px;font-size:11px}.guide-page main{max-width:970px;padding:38px 28px 58px}.guide-page h1{font-family:var(--font-editorial);font-weight:600;font-size:clamp(32px,4.3vw,46px);letter-spacing:-.035em;line-height:1.25;max-width:20ch;margin:18px 0 24px}.guide-page h2{font-size:23px;margin:34px 0 14px}.guide-page h3{font-size:17px;margin:14px 0}.guide-page p,.guide-page li{font-size:14px;line-height:1.95;color:var(--muted)}.guide-page main>a:first-child{display:inline-flex;align-items:center;min-height:44px;font-size:12px;font-weight:650;text-decoration:none;color:var(--brand)}.guide-page .box,.guide-page article,.guide-page section{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:24px;margin:22px 0;box-shadow:var(--panel-shadow)}.guide-page .box>h2:first-child,.guide-page section>h2:first-child{margin-top:0}.guide-page table{width:100%;border:1px solid var(--line);border-collapse:collapse}.guide-page th,.guide-page td{padding:12px 14px;line-height:1.7}.guide-page th{font-size:11px}.guide-page td{font-size:12px;vertical-align:top}.guide-page .cta{display:inline-flex;align-items:center;justify-content:center;min-height:46px;margin:8px 12px 8px 0;padding:12px 20px;border-radius:10px;border:1px solid var(--action);background:var(--action);color:var(--action-ink);font-size:13px;font-weight:700;text-decoration:none;box-shadow:0 2px 0 #0f382c10}.guide-page .cta:hover{filter:brightness(.95)}.guide-page footer{max-width:none;padding:24px max(24px,calc((100% - 914px)/2));margin:0;font-size:12px}.guide-page footer a{font-size:12px}.guide-page pre,.guide-page code{font-family:var(--font-practice);font-size:.9em;overflow-wrap:anywhere}
/* Accessibility settings retain precedence over the visual theme. */
body.contrast{--ink:#092318;--muted:#243e30;--line:#62775f;--focus:#153d22;--brand:#164a34}body.contrast[data-theme=dark]{--ink:#fff;--muted:#e5eee0;--line:#b1c2a5;--focus:#e5b869;--brand:#d5e8c3}body.contrast p,body.contrast .eyebrow,body.contrast .card small,body.contrast footer,body.contrast #passage{color:var(--muted)}body.contrast .ok{color:var(--ink)}body.contrast .bad{color:var(--error);background:var(--error-bg)}.no-motion *,body.no-motion *:before,body.no-motion *:after{transition:none!important;animation:none!important;scroll-behavior:auto!important}
@media(max-width:1180px){.site-header{padding:13px 20px;gap:12px}.site-header #primaryNav{background:var(--surface);border:1px solid var(--line);padding:12px}.site-header #primaryNav>button{font-size:14px;text-align:left;padding:11px 14px}.site-header #primaryNav summary{font-size:14px;padding:11px 14px}.site-header #primaryNav .header-popup{border-left:2px solid var(--line)}.site-header .mobile-nav-toggle{font-size:12px;padding:9px 12px}.brand-key{font-size:22px}.brand-atlas{font-size:24px}}
@media(max-width:700px){main{padding:25px 16px 36px}h1{font-size:32px;letter-spacing:-1.2px}h2{font-size:23px}h3{font-size:17px}p{font-size:14px;line-height:1.85}button{font-size:12px;padding:10px 13px}#test>.intro{margin:0 0 24px}#test>.intro h1{font-size:32px;line-height:1.25}#test>.intro p{font-size:13px}.home-actions{margin-top:18px;gap:8px}.home-actions button{font-size:11px;padding:10px 12px}.card{padding:19px}.practice-field{min-width:0}.practice-field select{width:100%;font-size:12px}#typingWorkspace>.toolbar{padding:16px;gap:16px}#durations{width:100%;justify-content:space-between}#durations button{min-width:0;flex:1;font-size:11px;padding:8px 4px}#typingWorkspace>.stats .stat{padding:16px 8px}#typingWorkspace>.stats strong{font-size:27px}#typingWorkspace>.stats span{font-size:9px;letter-spacing:.06em}#typingWorkspace #passage{margin:16px 16px 12px;padding:15px;font-size:21px;line-height:1.85;max-height:240px}#typingWorkspace #input{width:calc(100% - 32px);margin:12px 16px 0;padding:14px 15px;font-size:17px;min-height:105px}#typingWorkspace .input-feedback{margin:8px 16px;font-size:10px}#typingWorkspace>.foot{padding:16px;gap:8px}#typingWorkspace>.foot button{font-size:11px}.practice-settings{padding:0 16px}.practice-settings>summary{font-size:11px}.key{font-size:10px;min-width:0;flex:0 1 32px;padding:7px 3px}.key.row-space{flex-basis:140px}.course-keyboard{padding:14px}.course-keyboard-row{min-width:600px}.learning-plan,#textPoolPanel{padding:20px}.learning-plan h2{font-size:23px}.learning-plan>.route-controls,#textPoolPanel>.goal-controls,#workSettings .goal-controls{padding:14px;gap:15px}.route-start-actions button{font-size:12px}.lesson-grid .card{padding:20px}.lesson-grid .card h3{font-size:20px}.lesson-grid .card p{font-size:12px}.work-field select{font-size:12px}.work-field>label{font-size:11px}#workSettings{padding:0 13px}#workFile{max-width:100%;font-size:11px}#workCustomPanel{padding:17px}#workarea #poolPreview{font-size:14px}.result-headline>div{padding:16px}.result-headline strong,.result-headline strong span{font-size:28px}.result-headline span{font-size:10px}.result-score span{font-size:10px}.result-score strong{font-size:25px}.result-metrics>div{padding:12px}.result-metrics dt{font-size:10px}.result-metrics dd{font-size:22px}.dialog-heading h2{font-size:26px}.dialog-actions button{font-size:12px}.progress-row{padding:16px;font-size:12px}.guide-page header{padding:18px 20px}.guide-page header nav{gap:0}.guide-page main{padding:24px 20px 40px}.guide-page h1{font-size:34px}.guide-page h2{font-size:22px}.guide-page .box,.guide-page article,.guide-page section{padding:18px}.guide-page p,.guide-page li{font-size:13px}.guide-page table{display:block;overflow-x:auto}.guide-page th,.guide-page td{min-width:90px;font-size:11px;padding:10px}footer{padding:24px 18px;font-size:10px}footer p{font-size:10px}}
@media(max-width:480px){.site-header{padding:11px 12px;gap:5px}.site-header .logo b{width:30px;height:30px;font-size:19px;margin-right:6px}.brand-key{font-size:18px}.brand-atlas{font-size:20px}.site-header #uiLanguage{width:58px;font-size:12px}.site-header .mobile-nav-toggle{font-size:11px;padding:8px;min-width:44px}.site-header #themeToggle{width:38px}.home-actions button{flex:1 1 auto}#typingWorkspace>.stats strong{font-size:25px}.guide-page h1{font-size:30px}#game-grid .game-card,#rushCard{padding:20px}}
@media(max-width:600px){#resultDialog,#rushSetup,#rushResults{padding:22px 18px;border-radius:0}.dialog-actions{gap:8px}.result-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important;animation:none!important;scroll-behavior:auto!important}}
@media(forced-colors:active){button.active,.f-stage-active,.key.next,.course-key.active{outline:2px solid Highlight}.bad{border-bottom:2px dashed CanvasText}.ok{border-bottom:1px solid CanvasText}}

/* Course selectors keep labels and controls together at every width. */
.course-field{display:flex;flex-direction:column;gap:7px;min-width:0}.course-field label{font:700 11px/1.6 var(--font-ui);color:var(--muted)}.course-field select{margin:0;max-width:100%;min-height:44px;background:var(--page)}#fcourse>.goal-controls:first-of-type{gap:18px;margin-bottom:16px;align-items:end}#fcourse>.goal-controls:first-of-type .course-field{min-width:180px}#fcourse .course-settings{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}#courseSteps>.goal-controls{align-items:end;gap:12px;margin:20px 0}#courseSteps>.goal-controls .course-field{min-width:220px}#fTitle em{display:inline-block;margin-left:.07em}#fOverview h2{font-size:22px}#fOverview p{font-size:12px;line-height:1.9}@media(max-width:700px){#fcourse>.goal-controls:first-of-type{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}#fcourse>.goal-controls:first-of-type .course-field{min-width:0}#fcourse .course-settings{grid-template-columns:1fr;gap:16px}#courseSteps>.goal-controls .course-field{width:100%;min-width:0}#fStages{gap:8px}#fStages button{font-size:11px;text-align:left}#fTitle em{margin-left:0}}