.lesson{background:#f5f4ed;border:1px solid #e7e5d9;border-radius:14px;padding:14px;margin:0 0 18px}.lesson-top,.lesson-actions{display:flex;align-items:center;justify-content:space-between;gap:10px}.lesson-top b{font-size:14px;color:#425e54}.lesson p{font-size:13px;line-height:1.7;margin:12px 0}.lesson .lesson-hint{font-size:11px;color:#7c8176}.lesson-actions button{min-height:44px}.lesson-actions span{font-size:12px}.pair-select{display:flex;align-items:center;gap:12px;margin-bottom:16px}.pair-select label{flex:1;display:grid!important;gap:6px;font-size:11px}.pair-select select{width:100%;min-height:44px;border:1px solid #deded3;background:#fffdf8;border-radius:9px;padding:6px 10px;font:inherit;color:#53685e}.mobile-dock{display:none}.comparison-values{grid-column:1/-1;width:100%;border-top:1px solid #e7e5da;padding-top:16px}.comparison-values summary{cursor:pointer;font-size:13px}.comparison-values table{width:100%;border-collapse:collapse;margin-top:12px;font-size:13px}.comparison-values td,.comparison-values th{text-align:left;padding:10px;border-bottom:1px solid #ece9df}.comparison-values p{font-size:11px;color:#85867a}button:focus-visible,select:focus-visible,input:focus-visible{outline:3px solid #638b83;outline-offset:3px}button:disabled{opacity:.45;cursor:default}
@media(max-width:760px){body{padding-bottom:calc(88px + env(safe-area-inset-bottom))}main{padding-left:14px;padding-right:14px}.intro{padding-top:22px;padding-bottom:20px}.intro h1{font-size:31px}.intro-copy{font-size:13px}.intro-index,.brand-divider,.version{display:none}.topbar{padding:16px}.transport{padding:12px;gap:12px}.transport .play-group{display:none}.transport .volume{flex:1;min-width:100px}.workspace{display:block}.visuals{min-width:0}.anatomy.panel{padding:14px}.anatomy>.controls{padding:14px;margin:14px 0;border:1px solid #e8e4d9;box-shadow:none}.controls .section-top,.controls .tip{display:none}.vowel-grid button{min-height:52px}.control-block{margin-top:18px;padding-bottom:16px}.control-block input[type=range],.art-control input[type=range]{height:32px}.anatomy-real{grid-template-columns:minmax(0,1fr) 100px;gap:8px}.anatomy-art{max-width:none}.tract-svg{min-height:0}.anatomy-detail{display:flex;flex-direction:column;gap:6px;padding-top:0}.fold-view{width:100px}.vowel-readout{display:none}.larynx-detail{border-top:0;padding-top:0}.larynx-heading{font-size:10px}.larynx-heading span,.fold-length-note,.lip-inset{display:none}.anatomy-detail .larynx-detail p{font-size:10px;line-height:1.4}.anatomy-figure figcaption{font-size:10px;line-height:1.4}.anatomy .section-top h2{font-size:17px}.anatomy .pill{display:none}.learning-note{font-size:12px}.art-grid{grid-template-columns:1fr}.art-control label{font-size:13px}.art-controls summary{min-height:44px;display:flex;align-items:center}.mobile-dock{display:flex;align-items:center;gap:10px;position:fixed;bottom:0;left:0;right:0;z-index:50;padding:10px 14px calc(10px + env(safe-area-inset-bottom));background:#fffdf7f5;border-top:1px solid #e0dfd3;box-shadow:0 -3px 18px #293f3410}.mobile-dock .play-button{min-height:48px;padding:10px 16px;font-size:14px}.mobile-dock>span{flex:1;font-size:12px;color:#52665a}.mobile-dock .quiet-button{min-height:44px;padding:7px}.spectrum-panel{margin-top:16px}.canvas-wrap{width:100%;min-width:0}.panel,.visuals,.workspace{min-width:0}.pose-summary b{font-size:10px}.compare{margin-top:18px}.lesson{padding:11px}.lesson-top b{font-size:13px}.lesson-top button{min-height:44px}.about summary{line-height:1.6}.comparison-values table{font-size:12px}.formant-strip strong{font-size:23px}}
@media(max-width:360px){.anatomy-real{grid-template-columns:minmax(0,1fr) 86px}.fold-view{width:86px}.mobile-dock{gap:6px}.mobile-dock .play-button{padding:10px}.brand-sub{font-size:12px}}
@media(max-width:760px){.transport{position:static;display:flex;flex-wrap:wrap}.anatomy-detail{border-top:0}.anatomy-real{padding-top:0}.controls .control-block:last-of-type{padding-bottom:0}.controls .last-control{margin-bottom:0}}
.advanced-sound{border-top:1px solid #e7e4da;margin-top:12px;padding-top:12px}.advanced-sound summary{font-size:12px;color:#5c7265;cursor:pointer;min-height:44px;display:flex;align-items:center}@media(max-width:760px){.control-block input[type=range],.art-control input[type=range]{background-size:100% 4px;background-repeat:no-repeat;background-position:center;margin:8px 0}.control-block input[type=range]::-webkit-slider-thumb,.art-control input[type=range]::-webkit-slider-thumb{width:22px;height:22px}.control-block input[type=range]::-moz-range-thumb,.art-control input[type=range]::-moz-range-thumb{width:18px;height:18px}}

.pitch-lab{margin:0 0 24px;padding:24px}.pitch-lab h2{margin:7px 0}.pitch-lab p{font-size:13px;color:#7e8578;line-height:1.6}.pitch-settings{display:grid;grid-template-columns:2fr 1fr 1fr 1fr auto;align-items:end;gap:14px;margin:20px 0}.pitch-settings label{display:grid;gap:8px;font-size:12px;color:#5d7062}.pitch-settings select,.pitch-settings input{width:100%;min-width:0;height:44px;padding:8px;border:1px solid #deded3;border-radius:8px;background:#fffdf8;color:#4c6558;font:inherit}.pitch-settings input:disabled{opacity:.5}.pitch-lab progress{width:100%;height:7px;accent-color:#cc7a65}.pitch-lab .pitch-caution{font-size:11px;color:#8f8b7d}@media(max-width:760px){.pitch-settings{grid-template-columns:1fr 1fr}.pitch-settings>label:first-child,.pitch-settings>button{grid-column:1/-1}.pitch-lab{padding:16px}.pitch-lab .pill{display:none}}

.vowel-map{margin-top:20px;padding:24px}.vowel-map h2{margin-top:7px}.map-intro,.map-readouts p{font-size:12px;color:#7d8477;line-height:1.8}.map-layout{display:grid;grid-template-columns:minmax(0,1fr) 175px;gap:12px;align-items:center}#vowelMapSvg{width:100%;display:block;overflow:visible}#vowelMapSvg text{font:12px sans-serif}.map-grid{stroke:#e8e5da;stroke-width:1}.map-reference{cursor:pointer}.map-reference:focus{outline:none}.map-reference:focus circle:first-child{stroke:#294b42;stroke-width:3}.map-readouts>b{font-size:13px;color:#4b6559}.map-readouts #mapValues>div{padding:10px 0;border-bottom:1px solid #e8e5da}.map-readouts strong,.map-readouts span{display:block;font-size:12px}.map-readouts span{margin-top:5px;color:#8c8679;font-size:11px}.map-legend{display:flex;flex-wrap:wrap;gap:15px;align-items:center;font-size:11px;color:#6b786b}.map-legend label{display:flex;gap:6px;align-items:center;min-height:32px}.map-footnote{font-size:11px;line-height:1.8;color:#8e897b;margin:12px 0 0}@media(max-width:1000px){.map-layout{grid-template-columns:1fr}.map-readouts #mapValues{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}}

.ab-visual{margin:24px 0;padding:24px}.ab-visual h2{margin-top:7px}.ab-help{font-size:12px;color:#858778;line-height:1.8}.ab-portraits{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin:20px 0}.ab-card{border:1px solid #dedfd3;border-radius:14px;overflow:hidden;background:#fffcf6}.ab-card header{display:flex;align-items:center;gap:12px;padding:14px}.ab-card header>b{font-size:24px;color:#4c7976}.ab-B header>b{color:#a77bb1}.ab-card header>strong{flex:1;font-size:15px}.ab-figure{position:relative;aspect-ratio:1;max-width:480px;margin:auto}.ab-figure .portrait-canvas,.ab-figure .portrait-labels{display:block}.ab-card>p{font-size:12px;padding:0 14px;color:#7f7c6d}.ab-actions{display:flex;align-items:center;gap:15px;flex-wrap:wrap}.ab-actions button{min-height:44px}.ab-actions>span{font-size:12px;color:#778474}.ab-chart-heading{display:flex;gap:20px;align-items:center;margin-top:22px}.ab-chart-heading h3{font-size:15px;flex:1}.ab-a-key{color:#4c7976}.ab-b-key{color:#a77bb1}#abCurves{display:block;width:100%;max-height:310px}#abGrid path{stroke:#e8e5db;fill:none}#abGrid text{font:11px sans-serif;fill:#8c8c7d}#abCurveA,#abCurveB{fill:none;stroke-width:2.5}#abCurveA{stroke:#4c7976}#abCurveB{stroke:#a77bb1;stroke-dasharray:7 4}.ab-visual summary{cursor:pointer;padding:15px 0;font-size:13px}.ab-visual table{border-collapse:collapse;width:100%;font-size:12px}.ab-visual td,.ab-visual th{padding:9px;text-align:left;border-bottom:1px solid #e9e5db}.ab-figure .portrait-labels text[id*="pt-"]{font-size:17px;text-anchor:middle;stroke-width:4px}@media(max-width:650px){.ab-portraits{grid-template-columns:1fr}.ab-visual{padding:16px}.ab-card header{gap:8px}.ab-visual .pill{display:none}}
