:root{--bg:#f6f7f9;--surface:#fff;--text:#1c2430;--muted:#5b6676;--border:#dde2e8;--accent:#2357c6;--accent-text:#fff;--pass:#1f7a4d;--warn:#9a6400;--fail:#b3261e;--pass-bg:#e7f5ed;--warn-bg:#fdf3e1;--fail-bg:#fbe9e8;--radius:10px;--gap:16px;font-family:system-ui,-apple-system,Segoe UI,sans-serif;line-height:1.5}@media (prefers-color-scheme:dark){:root{--bg:#11151b;--surface:#1a2029;--text:#e6eaf0;--muted:#9aa5b4;--border:#2c3542;--accent:#6f9cff;--accent-text:#0b1220;--pass:#5fd09a;--warn:#f0b85a;--fail:#ff8a80;--pass-bg:#15291f;--warn-bg:#2d2412;--fail-bg:#331a19}}*{box-sizing:border-box}body{background:var(--bg);color:var(--text);margin:0}.app{max-width:820px;padding:var(--gap);margin:0 auto}.app-header h1{margin:0;font-size:1.5rem}.disclaimer{color:var(--muted);margin:4px 0 var(--gap);font-size:.9rem}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:var(--gap);margin-bottom:var(--gap)}.card h2,.card h3{margin-top:0}.field{margin-bottom:var(--gap);flex-direction:column;gap:4px;display:flex}.field span{color:var(--muted);font-size:.9rem}input[type=text],input[type=password],select,textarea{font:inherit;border:1px solid var(--border);background:var(--bg);color:var(--text);border-radius:6px;padding:8px 10px}.actions{margin-top:var(--gap);flex-wrap:wrap;align-items:center;gap:8px;display:flex}button,.button{font:inherit;border:1px solid var(--border);background:var(--surface);color:var(--text);cursor:pointer;border-radius:6px;padding:8px 14px}button.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-text)}button:focus-visible,.button:focus-within{outline:2px solid var(--accent);outline-offset:2px}.toggle{color:var(--muted);align-items:center;gap:6px;display:inline-flex}button:disabled{opacity:.5;cursor:default}.hint{color:var(--muted);font-size:.85rem}.warning{color:var(--warn)}input[type=number]{font:inherit;border:1px solid var(--border);background:var(--bg);color:var(--text);border-radius:6px;max-width:12em;padding:8px 10px}.step-count{color:var(--muted);margin:0 0 4px;font-size:.85rem}.passage{margin:var(--gap) 0;border-left:4px solid var(--accent);background:var(--bg);padding:12px 16px;font-size:1.15rem;line-height:1.7}.row-actions{white-space:nowrap;gap:6px;display:flex}.table-scroll{overflow-x:auto}.button.disabled{opacity:.5;cursor:default}.visually-hidden{clip:rect(0 0 0 0);width:1px;height:1px;position:absolute;overflow:hidden}.hardware{border:1px solid var(--border);border-radius:var(--radius);padding:var(--gap);margin:0 0 var(--gap)}.hardware legend{padding:0 6px;font-weight:600}.modes{margin-bottom:var(--gap);gap:4px;display:flex}.modes button.selected,.tabs button.selected{background:var(--accent);border-color:var(--accent);color:var(--accent-text)}.practice-settings{gap:0 var(--gap);grid-template-columns:repeat(auto-fit,minmax(220px,1fr));display:grid}.band-field{margin:0 0 var(--gap);border:none;flex-flow:wrap;align-items:center;gap:6px;padding:0;display:flex}.band-field legend{width:100%;color:var(--muted);margin-bottom:4px;padding:0;font-size:.9rem}.band-field input{width:6.5em}.live-readout{gap:var(--gap);grid-template-columns:repeat(auto-fit,minmax(140px,1fr));display:grid}.readout{flex-direction:column;display:flex}.readout-label{color:var(--muted);font-size:.85rem}.readout-value{font-variant-numeric:tabular-nums;font-size:1.3rem;font-weight:600}.readout[data-status=within] .readout-status{color:var(--pass)}.readout[data-status=below] .readout-status,.readout[data-status=above] .readout-status{color:var(--warn)}.tabs{margin-bottom:var(--gap);flex-wrap:wrap;gap:4px;padding:0;display:flex}.live-trace canvas,.live-voice-range canvas,.game canvas{border-radius:6px;display:block}.onsets tr[data-status=within] td:last-child{color:var(--pass)}.onsets tr[data-status=below] td:last-child,.onsets tr[data-status=above] td:last-child{color:var(--warn)}.instructions{padding-left:1.2em}.level-meter{margin:var(--gap) 0}.level-track{background:var(--bg);border:1px solid var(--border);border-radius:7px;height:14px;overflow:hidden}.level-fill{background:var(--muted);height:100%;transition:width 80ms linear}.level-meter[data-zone=good] .level-fill{background:var(--pass)}.level-meter[data-zone=too_quiet] .level-fill{background:var(--warn)}.level-meter[data-zone=too_loud] .level-fill{background:var(--fail)}.level-hint{color:var(--muted);font-size:.85rem}.prompt{min-height:2em;font-size:1.4rem;font-weight:600}.prompt[data-phase=voicing]{color:var(--accent)}.error{color:var(--fail)}.progress{background:linear-gradient(90deg, transparent, var(--accent), transparent);background-repeat:no-repeat;background-size:50% 100%;border-radius:2px;height:4px;animation:1.2s ease-in-out infinite progress}@keyframes progress{0%{background-position:-50% 0}to{background-position:150% 0}}.recording-report{margin-top:calc(var(--gap) * 2)}.recording-report>.card:first-child h2{overflow-wrap:anywhere}.recording-report audio{flex:260px}.indices .index{margin-bottom:var(--gap)}.index-value{font-variant-numeric:tabular-nums;color:var(--accent)}.indices-message{color:var(--warn)}.chart{margin:0}.chart svg{width:100%;height:auto;display:block}.chart .grid{stroke:var(--border);stroke-width:1px}.chart .tick,.chart .axis-label{fill:var(--muted);font-size:11px}.chart .contour{fill:none;stroke:var(--accent);stroke-width:1.5px}.chart .marker{fill:var(--fail)}.chart .area{fill:var(--accent);fill-opacity:.15;stroke:var(--accent);stroke-width:2px}.chart .vowel-label{fill:var(--text);font-size:14px;font-weight:600}.vowel-space-chart{max-width:520px}.viewer-card summary{cursor:pointer;font-weight:600}.viewer-card[open] summary{margin-bottom:var(--gap)}.summary td .hint{font-weight:400}.voice-range-chart canvas{display:block}.signal-viewer{width:100%}.viewer-canvas{touch-action:none;cursor:crosshair;display:block}.viewer-readout{color:var(--muted);font-variant-numeric:tabular-nums;margin:6px 0;font-size:.85rem}.viewer-controls{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.segmented{gap:10px;padding:0 6px;display:inline-flex}.metadata{margin:0 0 var(--gap);grid-template-columns:max-content 1fr;gap:2px 16px;display:grid}.metadata dt{color:var(--muted)}.metadata dd{overflow-wrap:anywhere;margin:0}audio{width:100%}.quality[data-status=pass]{background:var(--pass-bg)}.quality[data-status=warn]{background:var(--warn-bg)}.quality[data-status=fail]{background:var(--fail-bg)}.checks{margin:0;padding:0;list-style:none}.checks li{grid-template-columns:minmax(0,14em) 7em 1fr;gap:8px;padding:4px 0;display:grid}.checks li[data-status=pass] .check-message{color:var(--pass)}.checks li[data-status=warn] .check-message{color:var(--warn)}.checks li[data-status=fail] .check-message{color:var(--fail)}.measures{border-collapse:collapse;width:100%}.measures th,.measures td{text-align:left;border-bottom:1px solid var(--border);padding:6px 8px}.measures .numeric{text-align:right;font-variant-numeric:tabular-nums}.measures .group-row th{color:var(--muted);text-transform:uppercase;padding-top:14px;font-size:.85rem}.measures pre{white-space:pre-wrap;color:var(--muted);margin:0;font-size:.75rem}.method-note{color:var(--muted);font-size:.85rem}.print-only{display:none}@media (width<=560px){.checks li{grid-template-columns:1fr auto}.check-message{grid-column:1/-1}}@media print{:root{--bg:#fff;--surface:#fff;--text:#000;--muted:#444;--border:#bbb;--pass:#1f7a4d;--warn:#9a6400;--fail:#b3261e;--pass-bg:#fff;--warn-bg:#fff;--fail-bg:#fff}.no-print{display:none!important}.print-only{display:block}.app{max-width:none;padding:0}.card{break-inside:avoid;border:none;padding:0 0 12px}.script-row,.signal-viewer{break-inside:avoid}.viewer-card:not([open]){display:none}.voice-range-chart{break-inside:avoid}.recording-report{break-before:page}.index-value{color:var(--text)}}
