:root{color:#172033;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--ink:#172033;--muted:#667085;--line:#d7deea;--panel:#fff;--accent:#2765d8;--accent-soft:#e9f0ff;--tongue:#d45f76;--air:#2d85c5;--anatomy:#8d99ae;--cavity:#f8dfe4;background:#f4f7fb;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}body{background:radial-gradient(circle at 0 0,#eef4ff 0,#0000 34rem),#f4f7fb;min-height:100vh;margin:0}button,select,input{font:inherit}button{cursor:pointer}.shell{width:min(1180px,100% - 32px);margin:0 auto;padding:32px 0 64px}.workbench{gap:18px;display:grid}.workbench-header{justify-content:space-between;align-items:flex-end;gap:24px;display:flex}.eyebrow{color:var(--accent);letter-spacing:.1em;text-transform:uppercase;margin:0 0 7px;font-size:.76rem;font-weight:800}h1,h2,p{margin-top:0}h1{letter-spacing:-.035em;margin-bottom:9px;font-size:clamp(1.9rem,4vw,3.1rem);line-height:1.03}h2{overflow-wrap:anywhere;margin-bottom:18px;font-size:1rem}.lede{max-width:720px;color:var(--muted);margin-bottom:0;line-height:1.55}.runtime-badge{border:1px solid var(--line);text-align:right;background:#ffffffd1;border-radius:14px;min-width:112px;padding:10px 12px}.runtime-badge span,.runtime-badge strong{display:block}.runtime-badge span{color:var(--muted);font-size:.72rem}.runtime-badge strong{margin-top:2px;font-size:.92rem}.player-card,.articulation-card,.state-card,.segment-strip{border:1px solid var(--line);background:var(--panel);border-radius:20px;box-shadow:0 14px 34px #2334540f}.player-card{padding:16px}.player-actions{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.primary-control,.secondary-control,.word-chip,.segment-chip{border:1px solid var(--line);color:var(--ink);background:#fff;border-radius:999px}.primary-control,.secondary-control{min-height:40px;padding:0 18px;font-weight:750}.primary-control{border-color:var(--accent);background:var(--accent);color:#fff}.secondary-control:hover,.word-chip:hover,.segment-chip:hover{border-color:#9eb4dc}.rate-control{border:1px solid var(--line);min-height:40px;color:var(--muted);border-radius:999px;align-items:center;gap:8px;padding:0 12px;font-size:.86rem;display:flex}.rate-control select{color:var(--ink);background:0 0;border:0;font-weight:700}.time-readout{color:var(--muted);font-variant-numeric:tabular-nums;margin-left:auto;font-size:.82rem}.timeline-slider{width:100%;accent-color:var(--accent);margin:15px 0 10px}.sentence-track{flex-wrap:wrap;gap:7px;display:flex}.word-chip{padding:7px 11px;font-size:.95rem;transition:background .14s,border-color .14s,transform .14s}.word-chip.is-active{border-color:var(--accent);background:var(--accent-soft);color:#174aa8;transform:translateY(-1px)}.visual-grid{grid-template-columns:minmax(0,1.65fr) minmax(260px,.75fr);gap:18px;display:grid}.articulation-card,.state-card{min-width:0}.articulation-card{padding:18px}.active-sound{align-items:baseline;gap:10px;min-height:56px;display:flex}.active-sound-label{color:var(--muted);text-transform:uppercase;letter-spacing:.07em;font-size:.78rem;font-weight:700}.ipa-display{font-family:Noto Sans,Segoe UI,sans-serif;font-size:2.25rem;line-height:1}.word-display{color:var(--muted);font-size:1rem}.articulation-figure{margin:0}.articulation-svg{background:radial-gradient(circle at 62% 40%,#fff 0,#f8fbff 58%,#f1f5fb 100%);border-radius:18px;width:100%;max-height:530px;display:block}.articulation-figure figcaption{color:var(--muted);text-align:center;margin-top:8px;font-size:.76rem}.head-outline{fill:#f9e8dc;stroke:var(--anatomy);stroke-width:3px}.nasal-cavity{fill:#eaf2fa;stroke:#a5b5c7;stroke-width:2px}.palate,.jaw-line{fill:none;stroke:#8b6d63;stroke-width:5px;stroke-linecap:round}.teeth{fill:#fff;stroke:#a7a7a7;stroke-width:1.5px}.jaw{transform-box:fill-box;transform-origin:50%;transition:transform 60ms linear}.lips{fill:#be5368;stroke:#8d3548;stroke-width:2px;transition:rx 80ms linear,ry 80ms linear}.tongue{fill:var(--tongue);fill-opacity:.87;stroke:#a74257;stroke-width:2.5px;transition:d 60ms linear}.tongue-tip-marker,.tongue-body-marker{fill:#7e2438;stroke:#fff;stroke-width:2px}.velum{fill:none;stroke:#7d5060;stroke-width:8px;stroke-linecap:round;transition:d 90ms}.glottis path{fill:none;stroke:#5d6674;stroke-width:4px;stroke-linecap:round}.glottis.is-voiced .voice-wave{stroke:var(--accent);stroke-width:3px;animation:.42s ease-in-out infinite alternate voicePulse}.airflow{fill:none;stroke:var(--air);stroke-width:5px;stroke-linecap:round;stroke-dasharray:9 9;animation:.65s linear infinite airflowMove}.air-arrow-head{fill:var(--air)}.anatomy-labels{fill:#7b8798;font-size:14px}.state-card{padding:18px}.state-list{gap:0;margin:0;display:grid}.state-list>div{border-top:1px solid #edf0f5;grid-template-columns:108px minmax(0,1fr);gap:10px;padding:10px 0;display:grid}.state-list dt{color:var(--muted);font-size:.78rem;font-weight:700}.state-list dd{overflow-wrap:anywhere;margin:0;font-size:.86rem}.segment-meta{color:var(--muted);margin:17px 0 0;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.72rem;line-height:1.45}.segment-strip{scrollbar-width:thin;gap:7px;padding:12px;display:flex;overflow-x:auto}.segment-chip{text-align:center;flex:none;min-width:54px;padding:8px 10px}.segment-chip strong,.segment-chip span{display:block}.segment-chip strong{font-size:1.12rem}.segment-chip span{color:var(--muted);margin-top:2px;font-size:.65rem}.segment-chip.is-active{border-color:var(--accent);background:var(--accent-soft)}@keyframes voicePulse{0%{opacity:.35}to{opacity:1}}@keyframes airflowMove{to{stroke-dashoffset:-18px}}@media (max-width:760px){.shell{width:min(100% - 20px,1180px);padding-top:18px}.workbench-header{align-items:flex-start}.runtime-badge{display:none}.visual-grid{grid-template-columns:1fr}.player-card,.articulation-card,.state-card{border-radius:16px}.time-readout{width:100%;margin-left:0}.active-sound{min-height:48px}.articulation-card{padding:12px}.anatomy-labels{display:none}.state-list>div{grid-template-columns:96px minmax(0,1fr)}}@media (prefers-reduced-motion:reduce){.glottis.is-voiced .voice-wave,.airflow{animation:none}.jaw,.velum,.word-chip{transition:none}}
