:root{color-scheme:dark;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#e8edf5;background:#090b0f;font-synthesis:none}*{box-sizing:border-box}body{margin:0;min-width:320px;background:#090b0f}button,input,select{font:inherit}button,select,input[type=search]{color:inherit;background:#191e27;border:1px solid #343c4b;border-radius:7px}button{cursor:pointer;padding:.55rem .75rem}button:hover{border-color:#6e8fc8}h1,h2,p{margin:0}h1{font-size:clamp(1.1rem,2vw,1.45rem)}h2{font-size:1rem}p{color:#96a1b2;font-size:.82rem}.topbar{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.85rem 1rem;border-bottom:1px solid #232936}.status{font:500 .75rem ui-monospace,monospace;color:#e9c46a;text-align:right}.status.ready{color:#6fd6a8}.status.error,.bad{color:#ff7b8b}.stage-grid{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:#2a303b;border-bottom:1px solid #2a303b}.stage-card{position:relative;min-width:0;height:min(54vh,620px);background:#11151c;overflow:hidden}.stage-card video,.stage-card canvas{width:100%;height:100%;display:block;object-fit:contain}.stage-label{position:absolute;z-index:2;top:.75rem;left:.75rem;display:flex;gap:.5rem;align-items:baseline;padding:.35rem .55rem;border-radius:6px;background:#090b0fd9;font-size:.78rem;pointer-events:none}.stage-label span{color:#8e9aab;font-size:.7rem}.stage-label select,.stage-label button{pointer-events:auto}.panel{margin:.75rem;border:1px solid #272e3a;border-radius:10px;background:#11151c}.transport{display:grid;grid-template-columns:auto minmax(140px,1fr) auto auto auto;align-items:center;gap:.75rem;padding:.65rem}.primary{background:#dce9ff;color:#101520;border-color:#dce9ff;min-width:4.5rem;font-weight:700}.transport input[type=range]{width:100%}.transport output{font:.75rem ui-monospace,monospace;white-space:nowrap}.transport label{display:flex;align-items:center;gap:.4rem;color:#aab4c4;font-size:.75rem}select{padding:.45rem}.segmented{display:flex}.segmented button{border-radius:0;margin-left:-1px;padding:.42rem .55rem;font-size:.75rem}.segmented button:first-child{border-radius:7px 0 0 7px}.segmented button:last-child{border-radius:0 7px 7px 0}.segmented .active{background:#42689f;border-color:#6e9adb}.workspace{display:grid;grid-template-columns:minmax(280px,.75fr) minmax(420px,1.25fr);gap:.75rem;margin:.75rem}.workspace .panel{margin:0}.panel-title{display:flex;justify-content:space-between;gap:1rem;align-items:center;padding:.75rem;border-bottom:1px solid #272e3a}.panel-title p{margin-top:.15rem}.moment-list{display:grid;grid-template-columns:repeat(2,1fr);gap:.45rem;padding:.75rem}.moment-list button{display:flex;flex-direction:column;align-items:flex-start;text-align:left}.moment-list span{color:#8e9aab;font-size:.68rem;margin-top:.15rem}.caveat{padding:0 .75rem .75rem;line-height:1.4}.switch{font-size:.75rem;color:#bac5d6;white-space:nowrap}.manual-controls{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.25rem .75rem;padding:.75rem;max-height:250px;overflow:auto}.manual-controls label{display:grid;grid-template-columns:minmax(120px,.9fr) 1fr 2.5rem;gap:.5rem;align-items:center;font-size:.72rem}.manual-controls span{overflow:hidden}.manual-controls strong,.manual-controls small{display:block;overflow:hidden;text-overflow:ellipsis}.manual-controls small{color:#758195;font-size:.62rem}.manual-controls output{font:.68rem ui-monospace,monospace}.subtle{margin:0 .75rem .75rem;font-size:.72rem}.debug-actions{display:flex;gap:.5rem}.debug-actions input{padding:.5rem .65rem}.unmapped{padding:.55rem .75rem;color:#aeb8c7;background:#161b23;font-size:.72rem}.table-wrap{max-height:390px;overflow:auto}table{width:100%;border-collapse:collapse;font:.71rem ui-monospace,monospace}th{position:sticky;top:0;background:#171c24;color:#92a0b4;text-align:left;z-index:1}th,td{padding:.42rem .65rem;border-bottom:1px solid #232a35;white-space:nowrap}td:first-child{color:#dbe7f7}td em{margin-left:.4rem;padding:.1rem .3rem;background:#6f4fa3;border-radius:4px;font:.6rem sans-serif}.not-mapped{opacity:.58}.ok{color:#66d19e}.muted{color:#8792a4}@media(max-width:900px){.stage-card{height:46vw;min-height:280px}.transport{grid-template-columns:auto 1fr auto}.segmented,.transport label{grid-row:2}.workspace{grid-template-columns:1fr}}@media(max-width:620px){.topbar{align-items:flex-start}.stage-grid{grid-template-columns:1fr}.stage-card{height:55vh}.transport{grid-template-columns:auto 1fr}.transport output{grid-column:1 / -1}.manual-controls,.moment-list{grid-template-columns:1fr}.panel-title{align-items:flex-start;flex-direction:column}.debug-actions{width:100%}.debug-actions input{min-width:0;flex:1}}.live-panel .live-steps{margin:.6rem 0 .4rem;padding-left:1.15rem;display:grid;gap:.3rem;font-size:.82rem;color:#b8c4d6}.live-panel .live-steps strong{color:#eaf1ff;font-variant-numeric:tabular-nums}#live-status[data-state=streaming]{color:#7ee2a8}#live-status[data-state=waiting]{color:#ffd479}#live-status[data-state=error]{color:#ff9a9a}.pill{padding:.2rem .55rem;border-radius:999px;background:#1c2431;border:1px solid #2c3746;font-size:.78rem;font-variant-numeric:tabular-nums}.bone-drives{display:grid;gap:.5rem;margin-bottom:.5rem}.bone-drive{align-items:flex-start;gap:.5rem}.bone-drive span{display:grid;gap:.15rem}.bone-drive small{color:#8f9db2;font-size:.72rem}.bone-drive em{color:#7f8da3;font-size:.72rem;font-style:normal;line-height:1.35}.slider-row{display:grid;grid-template-columns:8.5rem 1fr 3rem;align-items:center;gap:.5rem;font-size:.8rem;color:#b8c4d6}.slider-row output{text-align:right;font-variant-numeric:tabular-nums;color:#eaf1ff}#avatar-select{background:#191e27;border:1px solid #46536a;border-radius:.4rem;color:inherit;font:inherit;font-weight:700;padding:.15rem .35rem;cursor:pointer}#avatar-select:hover{border-color:#6e8fc8}.stage-grid.live-only{grid-template-columns:1fr}.stage-grid.live-only .stage-card.reference{display:none}.stage-grid.live-only .stage-card{height:min(64vh,720px)}td.changed{color:#ffd479}tbody tr[hidden]{display:none}.transport button:disabled,.transport input:disabled,.transport select:disabled{opacity:.4;cursor:not-allowed}.stage-card{position:relative}.view-switch{position:absolute;right:.6rem;bottom:.6rem;background:#0e1219d1;border-radius:.45rem;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.view-switch button{text-transform:capitalize;font-size:.75rem}.phonics-list{padding:.5rem .75rem .75rem;display:grid;gap:.1rem}.phonics-row{display:grid;grid-template-columns:9rem minmax(120px,1fr) 9.5rem;align-items:center;gap:.75rem;padding:.35rem 0;border-bottom:1px solid #1e242e}.phonics-name strong{font-size:.8rem}.phonics-name small{display:block;color:#8792a4;font-size:.68rem;font-family:ui-monospace,monospace}.phonics-meter{position:relative;height:.55rem;border-radius:999px;background:#1c2230;overflow:hidden}.phonics-meter .fill{position:absolute;inset:0 auto 0 0;width:0;background:linear-gradient(90deg,#3f7fd4,#6fd6a8);border-radius:999px}.phonics-meter .peak{position:absolute;top:0;bottom:0;width:2px;background:#eaf1ff}.phonics-meter .mark{position:absolute;top:-2px;bottom:-2px;width:1px;background:#7a879b}.phonics-state{font:.68rem ui-monospace,monospace;text-align:right;color:#8792a4}.phonics-state.ok{color:#6fd6a8}.phonics-state.bad{color:#e9c46a}.phonics-note{grid-column:1 / -1;margin:.1rem 0 0;font-size:.68rem;color:#75808f;line-height:1.35}.phonics-row[data-coverage=not-captured]{opacity:.78}.phonics-row[data-coverage=not-captured] .phonics-meter{background:repeating-linear-gradient(45deg,#1c2230,#1c2230 4px,#232a38 4px 8px)}.phonics-row[data-coverage=not-captured] .phonics-state{color:#ff9a9a}.phonics-row[data-coverage=partial] .phonics-name strong:after{content:" ◐";color:#e9c46a}.teach-grid{display:grid;grid-template-columns:minmax(300px,1.05fr) minmax(260px,1fr);gap:1rem;padding:.75rem}.sagittal-host{background:#f7f2ea;border-radius:14px;padding:.5rem;text-align:center}.sagittal-svg{width:100%;height:auto;display:block}.sag-cavity{fill:#7d3a49}.sag-head{fill:#ffd4ac;stroke:#7a5238;stroke-width:3.4;stroke-linejoin:round}.sag-chin{fill:#ffcda1}.sag-eye{fill:#fff;stroke:#7a5238;stroke-width:2.2}.sag-pupil{fill:#3b2a20}.sag-brow{fill:none;stroke:#7a5238;stroke-width:4;stroke-linecap:round}.sag-nose-air{fill:#7fc4e8}.sag-roof{fill:none;stroke:#6b4a35;stroke-width:3.4;stroke-linecap:round}.sag-velum{fill:none;stroke:#c98b6a;stroke-width:4.5;stroke-linecap:round}.sag-tongue{fill:#f78fa0;stroke:#b2455c;stroke-width:3;stroke-linejoin:round}.sag-teeth{fill:#fffdf8;stroke:#6b4a35;stroke-width:2}.sag-lip{fill:none;stroke:#e8737d;stroke-width:10;stroke-linecap:round}.sag-air{fill:#7fc4e8;opacity:0}.sag-contact{fill:#ffc93d;stroke:#8a5a00;stroke-width:2}.sag-contact.squeezed{fill:#7fc4e8;stroke:#23617f}.sag-halo{pointer-events:none}.sagittal-caption{margin-top:.1rem;font-size:1.5rem;font-weight:800}.sagittal-caption{color:#4a331f;letter-spacing:.02em}.sagittal-hint{margin:.2rem .5rem .3rem;color:#6b5744;font-size:.82rem;line-height:1.4}.teach-controls h3{margin:0 0 .35rem;font-size:.78rem;color:#9aa6b8;text-transform:uppercase;letter-spacing:.06em}.teach-controls h3+*{margin-bottom:.8rem}.word-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:.35rem}.word-list button{display:flex;flex-direction:column;align-items:flex-start;text-align:left;padding:.45rem .55rem}.word-list strong{font-size:.92rem}.word-list span{color:#8e9aab;font-size:.64rem;margin-top:.1rem;line-height:1.25}.phoneme-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(46px,1fr));gap:.3rem}.phoneme-grid button{padding:.4rem .2rem;font-size:.84rem;font-weight:700}.phoneme-grid button[data-kind=vowel]{background:#1d2733;color:#9fd0ff}.word-list button.active,.phoneme-grid button.active{background:#42689f;border-color:#6e9adb;color:#fff}@media(max-width:900px){.teach-grid{grid-template-columns:1fr}}.pose-sheet{padding-bottom:3rem}.pose-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:.6rem;padding:.75rem}.pose-cell{margin:0}.pose-cell figcaption{margin-top:.3rem;text-align:center;font:.68rem ui-monospace,monospace;color:#9aa6b8}.pose-cell .sagittal-caption{font-size:1rem}.pose-cell .sagittal-hint{display:none}.pose-word{padding:.5rem .75rem 0;font-size:.9rem;color:#dbe7f7}.pose-hero{grid-template-columns:repeat(auto-fill,minmax(330px,1fr))}.studio-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(320px,1fr);grid-auto-rows:min(58vh,660px);gap:1px;background:#2a303b;border-bottom:1px solid #2a303b}.studio-grid .stage-card{height:100%}.studio-grid .panel{margin:0;border:0;border-radius:0;display:flex;flex-direction:column;min-height:0}.caption-bar{position:absolute;z-index:2;left:50%;top:2.8rem;transform:translate(-50%);max-width:min(90%,46ch);padding:.45rem .8rem;border-radius:8px;background:#05070ae6;text-align:center;font-size:1rem;line-height:1.35;text-wrap:balance}.countdown[hidden]{display:none}.countdown{position:absolute;z-index:3;inset:0;display:grid;place-items:center;background:#05070aa8;font:800 clamp(4rem,14vw,9rem)/1 ui-monospace,monospace;color:#ff7b8b}.prompter{flex:1;min-height:0;overflow:auto;padding:.85rem;font-size:1.05rem;line-height:1.7}.prompter-line{margin:0 0 .5rem;color:inherit;font-size:inherit}.prompter-word{padding:.05rem .15rem;margin-right:.28rem;border-radius:5px;color:#77839a;cursor:pointer;transition:color .12s linear}.prompter-word.spoken{color:#cfd9ea}.prompter-word.active{background:#42689f;color:#fff}.recording{background:#ff7b8b;border-color:#ff7b8b;color:#170a0d}.pill{padding:.25rem .5rem;border-radius:999px;background:#191e27;font:.7rem ui-monospace,monospace;color:#9fb0c8}.live-steps{margin:0;padding:.6rem .75rem .6rem 2rem;color:#aab4c4;font-size:.76rem;line-height:1.6}.take-list{display:grid;gap:.35rem;padding:.75rem;max-height:280px;overflow:auto}.take-row{display:flex;flex-direction:column;align-items:flex-start;text-align:left;gap:.15rem}.take-row span{color:#8e9aab;font-size:.68rem;font-family:ui-monospace,monospace}.take-row.active{background:#42689f;border-color:#6e9adb}@media(max-width:900px){.studio-grid{grid-template-columns:1fr}.studio-grid .stage-card{height:52vh}}a{color:#8ab4f8}.demo-stage{position:relative;width:100%;height:100vh;height:100dvh;overflow:hidden;background:#05070a;touch-action:manipulation}.demo-stage canvas{width:100%;height:100%;display:block}.demo-caption{position:absolute;z-index:2;left:50%;bottom:calc(6vh + env(safe-area-inset-bottom));transform:translate(-50%);max-width:min(88vw,30ch);padding:.6rem 1.2rem;border-radius:12px;background:#05070ae0;text-align:center;text-wrap:balance;font-size:clamp(1.4rem,3.4vw,2.6rem);font-weight:600;line-height:1.3;color:#9aa7bd}.demo-caption .now{color:#fff}.demo-chrome{position:absolute;z-index:3;inset:0;pointer-events:none;transition:opacity .4s ease}.demo-chrome.idle{opacity:0}.demo-chrome button,.demo-chrome select{pointer-events:auto}.demo-play{position:absolute;left:calc(1rem + env(safe-area-inset-left));bottom:calc(1rem + env(safe-area-inset-bottom));width:3.4rem;height:3.4rem;border-radius:999px;background:#dce9ff;color:#101520;border-color:#dce9ff;font-size:1.1rem}.demo-bar{position:absolute;right:calc(1rem + env(safe-area-inset-right));bottom:calc(1rem + env(safe-area-inset-bottom));display:flex;flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:.5rem;max-width:calc(100% - 6rem)}.demo-bar button,.demo-bar select{min-height:2.75rem}.demo-bar select{max-width:42vw}.demo-title{color:#aab4c4;font-size:.8rem}.demo-curtain[hidden]{display:none}.demo-curtain{position:absolute;z-index:4;inset:0;display:grid;place-content:center;gap:.5rem;text-align:center;background:#05070ac4;cursor:pointer}.demo-curtain h1{font-size:clamp(1.6rem,4vw,2.6rem)}.demo-curtain p{font-size:.95rem}@media(max-width:620px){.demo-caption{bottom:calc(4.5rem + env(safe-area-inset-bottom));max-width:92vw;padding:.45rem .8rem;font-size:clamp(1.15rem,5.5vw,1.8rem)}.demo-bar{left:calc(1rem + env(safe-area-inset-left));right:calc(1rem + env(safe-area-inset-right));max-width:none;justify-content:flex-end}.demo-bar #take-select,.demo-title{display:none}.demo-play{width:3rem;height:3rem}.demo-curtain h1,.demo-curtain p{padding:0 1.25rem}}@media(orientation:landscape)and (max-height:460px){.demo-caption{bottom:calc(3.5rem + env(safe-area-inset-bottom));font-size:clamp(1rem,4vh,1.5rem)}}
