:root{--ground:#fff9f0;--panel:#fff;--border:#efe3d2;--ink:#2a2320;--muted:#7e7164;--dim:#b3a596;--ink-soft:#5c5248;--divider:#f5ede1;--track:#f5ede1;--good:#2bb673;--good-text:#1c7f4f;--good-shadow:#1f8e58;--good-bg:#e6f7ee;--good-border:#bbe8d2;--good-guide:#a9ddc3;--warn:#ff6b4a;--warn-text:#c34123;--warn-shadow:#d94a28;--warn-bg:#ffede8;--warn-border:#ffcbbc;--warn-body:#8a5a45;--warn-guide:#f5bca9;--special:#7c5ce0;--special-text:#6b4bd0;--special-bg:#f0ebfc;--special-border:#d6cbf5;--info:#3ba3e0;--info-text:#1e78af;--info-bg:#e8f4fc;--voice:#ffb627;--voice-text:#966700;--voice-shadow:#9a6a00;--voice-bg:#fff4dc;--voice-body:#5c4a28;--face:#fff3dc;--voice-halo:color-mix(in srgb, var(--voice) 28%, transparent);--off-tolerance:color-mix(in srgb, var(--warn) 18%, transparent);--off-tolerance-active:color-mix(in srgb, var(--warn) 38%, transparent);--field:#eaf6fd;--field-line:#c4e2f2;--field-label:#3b708d;--field-target:#d7eefa;--field-reference:#3896c6;--action:var(--warn);--action-press:0 5px 0 var(--warn-shadow);--on-action:var(--ink);--unmeasured-hatch:repeating-linear-gradient(135deg, color-mix(in srgb, var(--dim) 35%, transparent) 0 3px, transparent 3px 8px);--press-good:0 5px 0 var(--good-shadow);--press-warn:0 5px 0 var(--warn-shadow);--press-special:0 5px 0 var(--special-text);--press-info:0 5px 0 var(--info-text);--press-voice:0 5px 0 var(--voice-shadow);--press-neutral:0 5px 0 var(--border);--font-heading:"Kanit", system-ui, sans-serif;--font-body:"Anuphan", system-ui, sans-serif;--column-max:560px;--column-gap:24px;--gutter:16px;--touch-min:44px;--radius:16px}*,:before,:after{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{background:var(--ground);color:var(--ink);font-family:var(--font-body);margin:0;font-size:16px;font-weight:400;line-height:1.5}h1,h2,h3,.num{font-family:var(--font-heading);margin:0;font-weight:700;line-height:1.2}h2,h3{font-weight:600}p{margin:0}strong{font-weight:500}a{color:inherit}button,.tap{min-height:var(--touch-min);min-width:var(--touch-min)}.btn{border-radius:var(--radius);font-family:var(--font-heading);cursor:pointer;background:var(--panel);color:var(--ink);box-shadow:var(--press-neutral);border:0;justify-content:center;align-items:center;gap:8px;margin-bottom:5px;padding:10px 20px;font-size:17px;font-weight:600;text-decoration:none;transition:transform 60ms ease-out,box-shadow 60ms ease-out;display:inline-flex}.btn:active{box-shadow:none;transform:translateY(5px)}.btn:focus-visible{outline:3px solid var(--info);outline-offset:3px}.btn--good{background:var(--good);color:var(--panel);box-shadow:var(--press-good)}.btn--special{background:var(--special);color:var(--panel);box-shadow:var(--press-special)}.btn--voice{background:var(--voice);color:var(--ink);box-shadow:var(--press-voice)}.btn--block{width:100%;display:flex}.card{background:var(--panel);border:2px solid var(--border);border-radius:var(--radius);padding:16px}.muted{color:var(--muted)}[hidden]{display:none!important}.screen-header{align-items:center;gap:11px;display:flex}.screen-header__text{flex:1;min-width:0}.screen-header__title{font-size:18px;font-weight:600;line-height:1.25}.screen-header__subtitle{color:var(--muted);margin-top:1px;font-size:12px}.icon-btn{width:var(--touch-min);height:var(--touch-min);background:var(--panel);border:2px solid var(--border);color:var(--ink);cursor:pointer;border-radius:14px;flex:none;place-items:center;padding:0;text-decoration:none;display:grid}.icon-btn:focus-visible{outline:3px solid var(--info);outline-offset:3px}.field{background:var(--field);border:3px solid var(--panel);box-shadow:var(--press-neutral);border-radius:24px;margin-bottom:5px;position:relative;overflow:visible}.field--live{height:clamp(300px,46vh,420px)}.field--result{height:clamp(228px,32vh,320px)}.field--result[data-comb=true]{height:clamp(300px,44vh,400px)}.field[data-comb=true] .field__take polyline{stroke-width:3px}.field__window{z-index:1;background:var(--field);width:fit-content;color:var(--field-label);border-radius:999px;padding:1px 8px;font-size:12px;line-height:1.4;position:absolute;top:6px;left:18px;right:18px}.field__plot{position:absolute;inset:18px 18px 30px}.field__lane{left:calc(var(--x0) * 100%);width:calc((var(--x1) - var(--x0)) * 100%);top:calc(var(--top) * 100%);height:calc((var(--bottom) - var(--top)) * 100%);background:var(--field-target);border-block:2px solid var(--field-reference);min-height:6px;position:absolute}.field__comb{left:calc(var(--x) * 100%);top:max(0px, calc(var(--top) * 100% - 14px));background:var(--field-reference);border-radius:1px;width:2px;height:10px;margin-left:-1px;position:absolute}.field__reference{left:0;right:0;top:calc(var(--y) * 100%);border-top:1.5px dashed var(--field-reference);opacity:.6;position:absolute}.field__excursion{top:0;bottom:0;left:calc(var(--x0) * 100%);width:max(2px, calc((var(--x1) - var(--x0)) * 100%));background:var(--off-tolerance);position:absolute}.field__excursion[data-active=true]{background:var(--off-tolerance-active)}.field__shift{left:calc(var(--x) * 100%);top:calc(var(--y) * 100%);box-sizing:border-box;border:3px solid var(--ink);background:var(--panel);pointer-events:none;border-radius:50%;width:18px;height:18px;margin:-9px 0 0 -9px;position:absolute}.field__cursor{top:-6px;bottom:-6px;left:calc(var(--x) * 100%);border-left:2px solid var(--ink);pointer-events:none;position:absolute}.field__seek{cursor:pointer;background:0 0;border:0;min-width:0;min-height:0;padding:0;position:absolute;inset:0}.field__seek:focus-visible{outline:3px solid var(--info);outline-offset:4px;border-radius:8px}.playback{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.field-note{color:var(--ink);align-items:baseline;gap:10px;margin:0;font-size:15px;line-height:1.5;display:flex}.field-note__mark{box-sizing:border-box;border:3px solid var(--ink);background:var(--panel);border-radius:50%;flex:none;width:14px;height:14px;transform:translateY(2px)}.excursion-text{background:var(--warn-bg);color:var(--warn-text);border-radius:14px;flex-basis:100%;margin:0;padding:10px 14px;font-size:14px;line-height:1.5}.field__labels{pointer-events:none;position:absolute;inset:0}.field__label{background:var(--field);color:var(--field-label);white-space:nowrap;border-radius:4px;padding:1px 4px;font-size:10px;font-weight:600;line-height:1.2;position:absolute;left:0}.field__label--reference{top:calc(var(--y) * 100%);font-size:11px;translate:0 -50%}.field__mark{top:calc(100% + 8px);left:calc(var(--x) * 100%);color:var(--field-label);white-space:nowrap;font-size:11px;line-height:1;position:absolute;translate:-50%}.field__take{width:100%;height:100%;position:absolute;inset:0;overflow:visible}.field__take polyline{fill:none;stroke:var(--ink);stroke-width:6px;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}.tone{border-radius:20px;padding:15px 17px}.tone--good{background:var(--good-bg);color:var(--good-text)}.tone--watch,.tone--off{background:var(--warn-bg);color:var(--warn-text)}.tone--neutral{background:var(--panel);border:2px solid var(--border);color:var(--ink)}.tone--voice{background:var(--voice-bg);color:var(--voice-body)}.tone__heading{font-family:var(--font-heading);margin-bottom:7px;font-size:14px;font-weight:600}.tone--voice .tone__heading{color:var(--voice-text)}.line-item{align-items:flex-start;gap:10px;font-size:14px;line-height:1.6;display:flex}.line-item>svg{margin-top:3px}.prose{text-wrap:pretty;overflow-wrap:anywhere;word-break:normal;line-break:auto;min-width:0}.btn--action{background:var(--action);color:var(--on-action);box-shadow:var(--action-press)}.btn--tall{border-radius:18px;flex:1;min-height:56px}.missing{border:1.5px dashed var(--warn-text);background:var(--warn-bg);color:var(--warn-text);border-radius:6px;padding:2px 8px;font-size:12px;font-weight:600;line-height:1.4;display:inline-block}.field__take polyline[data-off=true]{stroke:var(--warn)}.field__take polyline[style*=--thickness]{stroke-width:calc(3px + var(--thickness) * 9px)}.teacher{border-top:2px solid var(--divider);padding-top:8px}.teacher__summary{min-height:var(--touch-min);cursor:pointer;color:var(--ink-soft);align-items:center;font-size:13px;font-weight:600;display:flex}.teacher__rows{flex-direction:column;gap:6px;margin:4px 0 0;display:flex}.teacher__row{grid-template-columns:minmax(0,2fr) minmax(0,3fr);gap:10px;font-size:13px;display:grid}.teacher__row dt{color:var(--ink-soft);overflow-wrap:anywhere}.teacher__row dd{color:var(--ink);margin:0}.field[data-windowed=true] .field__plot{top:34px}.language-switch{width:auto;min-width:var(--touch-min);font:inherit;background:var(--panel);border-color:var(--info);color:var(--info-text);align-items:center;gap:6px;padding-inline:10px;font-size:14px;font-weight:600;display:inline-flex}.language-switch:disabled{cursor:default;opacity:.55}.shell{min-height:100dvh;padding:var(--gutter);flex-direction:column;gap:20px;display:flex;overflow-x:clip}.shell__capped{width:100%;margin-inline:auto}.shell__field{width:100%}.shell__body{flex-direction:column;gap:20px;display:flex}.shell__footer{gap:10px;margin-top:auto;padding-bottom:8px;display:flex}.shell__colophon{text-align:center;color:var(--ink-soft);overflow-wrap:anywhere;margin-top:-8px;font-size:11px;line-height:1.4}.shell__primary,.shell__secondary{flex-direction:column;gap:16px;min-width:0;display:flex}@media (width>=600px){.shell__capped{max-width:var(--column-max)}}@media (width>=1024px){.shell[data-columns="2"] .shell__capped{max-width:calc(var(--column-max) * 2 + var(--column-gap))}.shell[data-columns="2"] .shell__body{column-gap:var(--column-gap);grid-template-columns:repeat(2,minmax(0,1fr));align-items:start;display:grid}}.shell__header{align-items:flex-start;gap:10px;display:flex}.shell__header-main{flex:1;min-width:0}.stack{flex-direction:column;gap:12px;display:flex}.dot{background:currentColor;border-radius:999px;flex:none;width:9px;height:9px;display:block}.teach{flex-direction:column;gap:10px;margin:0;padding:0;list-style:none;display:flex}.teach__step{background:var(--panel);border:2px solid var(--border);border-radius:20px;align-items:flex-start;gap:12px;padding:14px 16px;display:flex}.teach__step[data-part=what]{background:var(--voice-bg);border-color:#0000}.teach__marker{background:var(--ground);width:34px;height:34px;color:var(--voice-text);border-radius:12px;flex:none;place-items:center;display:grid}.teach__step[data-part=what] .teach__marker{background:var(--panel)}.teach__body{min-width:0}.teach__heading{color:var(--ink);align-items:center;gap:8px;margin-bottom:4px;font-size:14px;font-weight:600;display:flex}.teach__number{background:var(--voice-bg);width:20px;height:20px;color:var(--voice-text);border-radius:999px;flex:none;place-items:center;font-size:12px;line-height:1;display:inline-grid}.teach__step[data-part=what] .teach__number{background:var(--panel)}.teach__step[data-part=what] .teach__heading{color:var(--voice-text)}.teach__text{color:var(--ink);margin:0;font-size:14px;line-height:1.65}.asked__text{font-size:15px;line-height:1.6}.asked__criterion{border-top:2px solid var(--divider);color:var(--ink-soft);margin-top:8px;padding-top:8px;font-size:13px;line-height:1.6}.timer{background:var(--panel);min-height:32px;color:var(--muted);font-variant-numeric:tabular-nums;border-radius:999px;flex:none;align-items:center;gap:7px;padding:0 12px;font-size:13px;font-weight:500;display:flex}.timer .dot{background:var(--dim);width:8px;height:8px}.timer[data-live=true]{background:var(--warn-bg);color:var(--warn-text)}.timer[data-live=true] .dot{background:var(--warn)}.controls{justify-content:center;align-items:center;gap:24px;width:100%;padding-top:8px;display:flex}.icon-btn--lg{border-radius:18px;width:52px;height:52px}.icon-btn:disabled{opacity:.45;cursor:default}.record{background:var(--action);width:84px;height:84px;box-shadow:var(--action-press);cursor:pointer;border:0;border-radius:999px;place-items:center;margin-bottom:5px;display:grid}.record:active{box-shadow:none;transform:translateY(5px)}.record:focus-visible{outline:3px solid var(--info);outline-offset:4px}.record:disabled{opacity:.6;cursor:progress}.record__glyph{background:var(--on-action);border-radius:999px;width:30px;height:30px}.record[data-recording=true] .record__glyph{border-radius:8px;width:26px;height:26px}.outcome{flex-direction:column;gap:10px;margin:0;display:flex}.outcome__part{background:var(--panel);border:2px solid var(--border);border-radius:20px;padding:14px 16px}.outcome__part[data-part=next]{background:var(--voice-bg);border-color:#0000}.outcome__heading{font-family:var(--font-heading);color:var(--muted);margin-bottom:4px;font-size:13px;font-weight:600}.outcome__part[data-part=next] .outcome__heading{color:var(--voice-text)}.outcome__text{color:var(--ink);margin:0;font-size:15px;line-height:1.6}.effects-key{flex-direction:column;gap:8px;margin:0;padding:0;list-style:none;display:flex}.effects-key .line-item{color:var(--ink-soft);font-size:13px}.heard__key{margin-bottom:4px;font-size:14px}.heard__notes{flex-direction:column;gap:10px;margin:10px 0 0;padding:0;list-style:none;display:flex}.heard__note{border-top:2px solid var(--divider);align-items:flex-start;gap:12px;padding-top:10px;display:flex}.heard__index{background:var(--voice-bg);width:28px;height:28px;color:var(--voice-text);border-radius:999px;flex:none;place-items:center;font-size:13px;display:grid}.heard__lines{flex-direction:column;gap:2px;min-width:0;font-size:13px;display:flex}.heard__key[data-measured=false],.heard__lines [data-measured=false]{color:var(--muted)}.insight__rows{flex-direction:column;margin:0;padding:0;list-style:none;display:flex}.insight__row{border-top:2px solid var(--divider);min-height:var(--touch-min);grid-template-columns:minmax(0,2fr) minmax(0,3fr) auto;align-items:baseline;gap:12px;padding:10px 0;display:grid}.insight__row:first-child{border-top:0}.insight__name{overflow-wrap:anywhere;min-width:0;font-family:var(--font-heading);color:var(--ink);font-size:14px;font-weight:600}.insight__value{color:var(--ink);font-size:14px}.insight__row[data-measured=false] .insight__value{color:var(--muted);border-left:2px dashed var(--border);padding-left:8px;font-size:12px}.insight__count{color:var(--muted);white-space:nowrap;font-size:12px}.insight__track{background:var(--track);border-radius:999px;grid-column:1/-1;height:8px;overflow:hidden}.insight__bar{height:100%;width:calc(var(--extent) * 100%);background:var(--info);border-radius:999px;min-width:4px;display:block}.character{left:calc(var(--x) * 100%);top:calc(var(--y) * 100%);pointer-events:none;width:84px;height:93px;margin:-86px 0 0 -42px;transition:left .3s ease-out,top .3s ease-out;position:absolute}.rig{transform:scale(var(--grow,1));transform-origin:50% 92.5%;transition:transform 50ms linear;display:block;overflow:visible}.rig__shadow{fill:var(--ink);opacity:.07}.rig__body{fill:var(--voice)}.rig__arm{fill:none;stroke:var(--voice);stroke-width:6px;stroke-linecap:round}.rig__hair{fill:var(--ink)}.rig__face{fill:var(--face);stroke:var(--ink);stroke-width:2.4px}.rig__ink{fill:var(--ink)}.rig__glint{fill:var(--panel)}.rig__stroke{fill:none;stroke:var(--ink);stroke-linecap:round}.rig__blush{fill:var(--warn);opacity:.35}.rig__mouth{fill:var(--warn-text)}.rig__whole{transform-origin:0 20px}.rig__head{transform-origin:0 -8px}.rig__eyes{transform-box:fill-box;transform-origin:50%}.rig[data-state=idle] .rig__whole{animation:3.6s ease-in-out infinite rig-breathe}.rig[data-state=idle] .rig__eyes{animation:4.8s infinite rig-blink}.rig[data-state=listening] .rig__head{animation:1.6s ease-in-out infinite rig-sing;rotate:4deg}.rig[data-state=considering] .rig__head{animation:2.4s ease-in-out infinite rig-ponder;rotate:-6deg}.rig[data-state=pleased] .rig__whole{animation:1.4s ease-out infinite rig-hop}.rig[data-state=encouraging] .rig__head{animation:1.8s ease-in-out infinite rig-nod}@keyframes rig-breathe{0%,to{scale:1}50%{scale:1.015 1.03}}@keyframes rig-blink{0%,92%,to{scale:1}95%{scale:1 .1}}@keyframes rig-sing{0%,to{rotate:2deg}50%{rotate:6deg}}@keyframes rig-ponder{0%,to{rotate:-7deg}50%{rotate:5deg}}@keyframes rig-hop{0%,60%,to{translate:0}25%{translate:0 -5px}}@keyframes rig-nod{0%,to{rotate:0deg}50%{rotate:5deg}}@media (prefers-reduced-motion:reduce){.character,.rig{transition:none}.rig *,.rig__whole{animation:none!important}}.path{flex-direction:column;gap:12px;margin:0;padding:0;list-style:none;display:flex}.lesson{min-height:var(--touch-min);border-radius:var(--radius);border:2px solid var(--border);background:var(--panel);color:var(--ink);align-items:center;gap:14px;padding:14px 16px;text-decoration:none;display:flex}a.lesson{box-shadow:var(--press-neutral);margin-bottom:5px}a.lesson:active{box-shadow:none;transform:translateY(5px)}a.lesson:focus-visible{outline:3px solid var(--info);outline-offset:3px}.lesson__badge{width:var(--touch-min);height:var(--touch-min);background:var(--ground);color:var(--muted);border-radius:50%;flex:none;place-items:center;font-size:18px;display:grid}.lesson__text{flex-direction:column;gap:2px;min-width:0;display:flex}.lesson__title{font-size:18px}.lesson__state{font-size:14px}.lesson[data-state=open] .lesson__badge,.lesson[data-state=attempted] .lesson__badge{background:var(--voice);color:var(--ink)}.lesson__state{color:var(--muted)}.lesson[data-state=attempted] .lesson__state{color:var(--voice-text)}.lesson[data-suggested=true]{border-color:var(--voice)}.lesson__suggested{background:var(--voice-bg);color:var(--voice-text);border-radius:999px;align-self:flex-start;margin-top:4px;padding:2px 10px;font-size:12px;font-weight:600}