@font-face{font-family:Barlow Condensed;font-style:normal;font-display:swap;font-weight:500;src:url(/assets/barlow-condensed-latin-500-normal-BgYH2mbd.woff2)format("woff2"),url(/assets/barlow-condensed-latin-500-normal-HIEiP5Ov.woff)format("woff")}@font-face{font-family:Barlow Condensed;font-style:normal;font-display:swap;font-weight:600;src:url(/assets/barlow-condensed-latin-600-normal-DepVgxBB.woff2)format("woff2"),url(/assets/barlow-condensed-latin-600-normal-BFJEwTuo.woff)format("woff")}@font-face{font-family:Barlow Condensed;font-style:normal;font-display:swap;font-weight:700;src:url(/assets/barlow-condensed-latin-700-normal-v1xN8_Wq.woff2)format("woff2"),url(/assets/barlow-condensed-latin-700-normal-Dmwat-ge.woff)format("woff")}@font-face{font-family:Manrope;font-style:normal;font-display:swap;font-weight:400;src:url(/assets/manrope-latin-400-normal-PaqtzbVb.woff2)format("woff2"),url(/assets/manrope-latin-400-normal-8tf8FM3T.woff)format("woff")}@font-face{font-family:Manrope;font-style:normal;font-display:swap;font-weight:500;src:url(/assets/manrope-latin-500-normal-BYYD-dBL.woff2)format("woff2"),url(/assets/manrope-latin-500-normal-DMZssgOp.woff)format("woff")}@font-face{font-family:Manrope;font-style:normal;font-display:swap;font-weight:600;src:url(/assets/manrope-latin-600-normal-4f0koTD-.woff2)format("woff2"),url(/assets/manrope-latin-600-normal-BqgrALkZ.woff)format("woff")}@font-face{font-family:IBM Plex Mono;font-style:normal;font-display:swap;font-weight:400;src:url(/assets/ibm-plex-mono-latin-400-normal-DMJ8VG8y.woff2)format("woff2"),url(/assets/ibm-plex-mono-latin-400-normal-CvHOgSBP.woff)format("woff")}@font-face{font-family:IBM Plex Mono;font-style:normal;font-display:swap;font-weight:500;src:url(/assets/ibm-plex-mono-latin-500-normal-DSY6xOcd.woff2)format("woff2"),url(/assets/ibm-plex-mono-latin-500-normal-CB9ihrfo.woff)format("woff")}@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after{--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial;--tw-tracking:initial;--tw-outline-style:solid;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial}::backdrop{--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial;--tw-tracking:initial;--tw-outline-style:solid;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial}}}@layer theme{:root,:host{--font-body:"Manrope", sans-serif;--font-display:"Barlow Condensed", sans-serif;--font-mono:"IBM Plex Mono", monospace;--font-weight-normal:400;--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--text-xs:.6875rem;--text-sm:.8125rem;--text-base:.9375rem;--text-md:1.125rem;--text-lg:1.375rem;--text-xl:1.75rem;--text-2xl:2.25rem;--text-3xl:3rem;--text-display-md:clamp(1.625rem, 3.4vw, 2.5rem);--text-display-lg:clamp(2.25rem, 5vw, 4rem);--spacing:.25rem;--container-reading:72ch;--container-stage:76rem;--breakpoint-sm:40rem;--breakpoint-lg:64rem;--breakpoint-compact:24.375rem;--color-night:rgb(var(--flowkeys-rgb-night));--color-night-soft:#19232c;--color-chalk:rgb(var(--flowkeys-rgb-chalk));--color-chalk-dim:#b9b6ae;--color-ink:rgb(var(--flowkeys-rgb-ink));--color-ink-muted:#53636a;--color-signal:rgb(var(--flowkeys-rgb-signal));--color-signal-deep:rgb(var(--flowkeys-rgb-signal-deep));--color-signal-ink:#245e52;--color-signal-paper:#dfeae6;--color-signal-white:rgb(var(--flowkeys-rgb-signal-white));--color-tactile:rgb(var(--flowkeys-rgb-tactile));--color-tactile-light:rgb(var(--flowkeys-rgb-tactile-light));--color-tactile-deep:rgb(var(--flowkeys-rgb-tactile-deep));--color-wood:#231914;--color-wood-soft:#30231c;--color-shadow:rgb(var(--flowkeys-rgb-shadow));--color-key-face:#ead9bd;--color-key-ink:rgb(var(--flowkeys-rgb-key-ink));--color-key-ink-strong:#33241a;--color-key-ink-muted:#6a5747;--color-key-edge:#a96431;--color-key-edge-deep:#55321e;--color-help:rgb(var(--flowkeys-rgb-help));--color-help-light:#cfc8e8;--color-help-deep:#5b5287;--color-recovery:rgb(var(--flowkeys-rgb-recovery));--color-recovery-light:#e58a7d;--color-focus:#fff3ad;--color-support:rgb(var(--flowkeys-rgb-support));--color-support-light:#ffdd85;--color-support-edge:#9c6c14;--color-support-ink:#2b1d04;--color-support-heart:#b4451f;--color-letter:#1c2730;--color-letter-ink:#e4ddd0;--color-share:rgb(var(--flowkeys-rgb-share));--color-share-light:#ffa6d6;--color-share-edge:#8f2a63;--color-share-ink:#3a0824;--color-feedback:rgb(var(--flowkeys-rgb-feedback));--color-feedback-light:#9cebf5;--color-feedback-edge:#1d7584;--color-feedback-ink:#052a31;--color-black:rgb(var(--flowkeys-rgb-black));--color-white:rgb(var(--flowkeys-rgb-white));--color-onboarding-band:#0f161c;--color-onboarding-frame:rgb(var(--flowkeys-rgb-onboarding-frame));--color-onboarding-key:#22303a;--color-signal-edge:#214a43;--color-signal-strong:rgb(var(--flowkeys-rgb-signal-strong));--color-signal-key-face:#d6e3df;--color-signal-key-edge:#17302d;--color-signal-band:#d4e1dc;--color-signal-light:#8fd6c4;--color-signal-title-ink:#1d463e;--color-tactile-band:#1a130f;--color-tactile-well:#17110e;--color-tactile-strong:#7a4220;--color-tactile-copy-strong:#8e5a2c;--color-tactile-ink-deep:#1b1109;--color-key-side:#6c4426;--color-key-ink-soft:#594636;--color-key-ink-disabled:#958a80;--color-disabled-ink:#7f756d;--color-recovery-edge:#8d4238;--color-recovery-edge-deep:#4b211d;--color-choice-ink:#2a1a0e;--color-choice-ink-muted:#6b3a17;--color-recall-cue:#1b120c;--color-shadow-deep:#090605;--color-shadow-veil:rgb(var(--flowkeys-rgb-shadow-veil));--color-hub-key-edge:#151c21;--color-hub-key-idle-top:#303a40;--color-hub-key-idle-bottom:#283137;--color-hub-key-ready-edge:#173630;--color-hub-key-ready-top:#2b383f;--color-hub-key-ready-bottom:#242f36;--color-hub-key-planned-top:#2a3338;--color-hub-key-planned-bottom:#242c31;--color-reveal-border:#735039;--color-reveal-inset:#76553d;--color-reveal-key-top:#ffe0ad;--color-reveal-key-ink:#452713;--color-reveal-key-border:#ffe5bc;--color-reveal-key-edge:#985929;--color-reveal-key-highlight:#fff0d5;--color-reveal-field:#18120e;--color-reveal-field-border:#b88a65;--color-reveal-placeholder:#b8a693;--color-spark-green:#4dcba2;--color-spark-blue:#62adf2;--color-spark-violet:#b18bf0;--color-cast-ana:#f5c4cf;--color-cast-ana-ink:#4d1f2b;--color-cast-ana-edge:#c98597;--color-cast-leo:#b9dcea;--color-cast-leo-ink:#173a48;--color-cast-leo-edge:#7fa9ba;--color-cast-diego:#cfe5b4;--color-cast-diego-ink:#28391a;--color-cast-diego-edge:#93ad75;--color-portrait-line:#2a1c17;--color-portrait-blush:#e58b7d;--color-portrait-collar:#eef3f1;--color-portrait-lens:#d8ecf2;--color-portrait-ana-skin:#e3ab86;--color-portrait-ana-shade:#c98d68;--color-portrait-ana-hair:#3b2420;--color-portrait-leo-skin:#95603f;--color-portrait-leo-shade:#7a4b2f;--color-portrait-leo-hair:#1d1512;--color-portrait-diego-skin:#f0c7a2;--color-portrait-diego-shade:#d9a983;--color-portrait-diego-hair:#74482a;--color-stage-wall-top:#3b2b24;--color-stage-wall-bottom:#281d19;--color-stage-floor:#1c1411;--color-stage-window:#172633;--color-stage-window-frame:#5d4337;--color-stage-panel:#151b21;--color-stage-sky-sunset-top:#4b4a6e;--color-stage-sky-sunset-bottom:#e0955f;--color-stage-sky-dusk-top:#232d4f;--color-stage-sky-dusk-bottom:#7d5a72;--color-stage-sky-night-top:#0f1a2d;--color-stage-sky-night-bottom:#22334d;--color-stage-sky-late-top:#070c16;--color-stage-sky-late-bottom:#121e30;--color-stage-sun:#ffcf8a;--color-stage-moon:#eef1e6;--color-stage-star:#dfe8f0;--color-stage-cloud:#3a4152;--color-stage-cloud-dark:#262c38;--color-stage-skyline:#0c131c;--color-stage-lit:#f2c46d;--color-stage-sill:#6e5143;--color-stage-curtain:#56392e;--color-stage-curtain-fold:#47302a;--color-stage-lamp-shade:#d9a868;--color-stage-lamp-pole:#4a3a31;--color-stage-clock-face:#e9dfcc;--color-stage-kitchen-wall-top:#2c3a36;--color-stage-kitchen-wall-bottom:#1f2926;--color-stage-tile:#34443f;--color-stage-tile-grout:#27332f;--color-stage-counter:#8b7d6a;--color-stage-cabinet:#4b3a2f;--color-stage-cabinet-edge:#33271f;--color-stage-handle:#b89a73;--color-stage-pot:#b8674b;--color-stage-leaf:#6f9a6b;--color-story-paper-top:#fbfdfb;--color-story-paper-bottom:#eaf1ed;--color-story-sky-top:#14202b;--color-story-sky-bottom:#1d3338;--color-story-room:#0d151b;--color-story-light:#c85c47;--color-story-structure:#31434a;--color-story-building:#68767b;--color-story-ink-light:#eef7f4;--color-story-ink-signal:#bfe4da;--radius-focus:.25rem;--radius-surface:1.125rem;--shadow-panel:0 1.25rem 3.125rem #00000057;--shadow-tactile:0 .5rem 0 var(--color-tactile-deep), 0 1.5rem 3.75rem #00000059;--ease-out:cubic-bezier(.22, 1, .36, 1);--ease-state:cubic-bezier(.32, .72, 0, 1);--ease-emphasis:cubic-bezier(.16, 1, .3, 1)}}@layer base,components;@layer utilities{.collapse{visibility:collapse}.visible{visibility:visible}.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}.static{position:static}.top-4{top:calc(var(--spacing) * 4)}.left-4{left:calc(var(--spacing) * 4)}.z-50{z-index:50}.mx-auto{margin-inline:auto}.mt-1{margin-top:var(--spacing)}.mt-2{margin-top:calc(var(--spacing) * 2)}.mt-3{margin-top:calc(var(--spacing) * 3)}.mt-4{margin-top:calc(var(--spacing) * 4)}.mt-5{margin-top:calc(var(--spacing) * 5)}.mt-6{margin-top:calc(var(--spacing) * 6)}.mt-7{margin-top:calc(var(--spacing) * 7)}.mt-8{margin-top:calc(var(--spacing) * 8)}.mt-9{margin-top:calc(var(--spacing) * 9)}.mt-10{margin-top:calc(var(--spacing) * 10)}.block{display:block}.flex{display:flex}.grid{display:grid}.hidden{display:none}.inline{display:inline}.inline-block{display:inline-block}.table{display:table}.h-1{height:var(--spacing)}.h-2{height:calc(var(--spacing) * 2)}.h-3{height:calc(var(--spacing) * 3)}.h-4{height:calc(var(--spacing) * 4)}.h-6{height:calc(var(--spacing) * 6)}.h-8{height:calc(var(--spacing) * 8)}.h-12{height:calc(var(--spacing) * 12)}.h-16{height:calc(var(--spacing) * 16)}.h-\[7px\]{height:7px}.min-h-screen{min-height:100vh}.w-1{width:var(--spacing)}.w-2{width:calc(var(--spacing) * 2)}.w-3{width:calc(var(--spacing) * 3)}.w-4{width:calc(var(--spacing) * 4)}.w-6{width:calc(var(--spacing) * 6)}.w-8{width:calc(var(--spacing) * 8)}.w-10{width:calc(var(--spacing) * 10)}.w-12{width:calc(var(--spacing) * 12)}.w-16{width:calc(var(--spacing) * 16)}.w-\[7px\]{width:7px}.max-w-\[13ch\]{max-width:13ch}.max-w-\[28ch\]{max-width:28ch}.max-w-\[44ch\]{max-width:44ch}.max-w-\[46ch\]{max-width:46ch}.max-w-\[48ch\]{max-width:48ch}.max-w-\[70ch\]{max-width:70ch}.max-w-\[100rem\]{max-width:100rem}.max-w-reading{max-width:var(--container-reading)}.max-w-stage{max-width:var(--container-stage)}.min-w-0{min-width:0}.-translate-y-24{--tw-translate-y:calc(var(--spacing) * -24);translate:var(--tw-translate-x) var(--tw-translate-y)}.transform{transform:var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,)}.resize{resize:both}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.items-end{align-items:flex-end}.justify-between{justify-content:space-between}.justify-end{justify-content:flex-end}.justify-start{justify-content:flex-start}.gap-1{gap:var(--spacing)}.gap-2{gap:calc(var(--spacing) * 2)}.gap-3{gap:calc(var(--spacing) * 3)}.gap-4{gap:calc(var(--spacing) * 4)}.gap-6{gap:calc(var(--spacing) * 6)}.gap-8{gap:calc(var(--spacing) * 8)}.gap-10{gap:calc(var(--spacing) * 10)}.gap-x-2{column-gap:calc(var(--spacing) * 2)}.gap-x-6{column-gap:calc(var(--spacing) * 6)}.gap-y-1{row-gap:var(--spacing)}.gap-y-3{row-gap:calc(var(--spacing) * 3)}.rounded-full{border-radius:2147483647px}.rounded-surface{border-radius:var(--radius-surface)}.border{border-style:var(--tw-border-style);border-width:1px}.border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.border-t-2{border-top-style:var(--tw-border-style);border-top-width:2px}.border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.border-b-0{border-bottom-style:var(--tw-border-style);border-bottom-width:0}.border-chalk\/10{border-color:color-mix(in srgb, rgb(var(--flowkeys-rgb-chalk)) 10%, transparent)}@supports (color:color-mix(in lab, red, red)){.border-chalk\/10{border-color:color-mix(in oklab, var(--color-chalk) 10%, transparent)}}.border-chalk\/15{border-color:color-mix(in srgb, rgb(var(--flowkeys-rgb-chalk)) 15%, transparent)}@supports (color:color-mix(in lab, red, red)){.border-chalk\/15{border-color:color-mix(in oklab, var(--color-chalk) 15%, transparent)}}.border-ink\/15{border-color:color-mix(in srgb, rgb(var(--flowkeys-rgb-ink)) 15%, transparent)}@supports (color:color-mix(in lab, red, red)){.border-ink\/15{border-color:color-mix(in oklab, var(--color-ink) 15%, transparent)}}.border-signal\/40{border-color:color-mix(in srgb, rgb(var(--flowkeys-rgb-signal)) 40%, transparent)}@supports (color:color-mix(in lab, red, red)){.border-signal\/40{border-color:color-mix(in oklab, var(--color-signal) 40%, transparent)}}.border-signal\/50{border-color:color-mix(in srgb, rgb(var(--flowkeys-rgb-signal)) 50%, transparent)}@supports (color:color-mix(in lab, red, red)){.border-signal\/50{border-color:color-mix(in oklab, var(--color-signal) 50%, transparent)}}.border-tactile\/20{border-color:color-mix(in srgb, rgb(var(--flowkeys-rgb-tactile)) 20%, transparent)}@supports (color:color-mix(in lab, red, red)){.border-tactile\/20{border-color:color-mix(in oklab, var(--color-tactile) 20%, transparent)}}.border-tactile\/50{border-color:color-mix(in srgb, rgb(var(--flowkeys-rgb-tactile)) 50%, transparent)}@supports (color:color-mix(in lab, red, red)){.border-tactile\/50{border-color:color-mix(in oklab, var(--color-tactile) 50%, transparent)}}.bg-cast-ana{background-color:var(--color-cast-ana)}.bg-cast-diego{background-color:var(--color-cast-diego)}.bg-cast-leo{background-color:var(--color-cast-leo)}.bg-chalk{background-color:var(--color-chalk)}.bg-chalk-dim{background-color:var(--color-chalk-dim)}.bg-focus{background-color:var(--color-focus)}.bg-help{background-color:var(--color-help)}.bg-help-deep{background-color:var(--color-help-deep)}.bg-ink{background-color:var(--color-ink)}.bg-key-face{background-color:var(--color-key-face)}.bg-night{background-color:var(--color-night)}.bg-night-soft{background-color:var(--color-night-soft)}.bg-night-soft\/80{background-color:#19232ccc}@supports (color:color-mix(in lab, red, red)){.bg-night-soft\/80{background-color:color-mix(in oklab, var(--color-night-soft) 80%, transparent)}}.bg-recovery{background-color:var(--color-recovery)}.bg-signal{background-color:var(--color-signal)}.bg-signal-deep{background-color:var(--color-signal-deep)}.bg-signal-ink{background-color:var(--color-signal-ink)}.bg-signal-paper{background-color:var(--color-signal-paper)}.bg-support{background-color:var(--color-support)}.bg-tactile{background-color:var(--color-tactile)}.bg-tactile-deep{background-color:var(--color-tactile-deep)}.bg-tactile-light{background-color:var(--color-tactile-light)}.bg-wood{background-color:var(--color-wood)}.bg-wood-soft{background-color:var(--color-wood-soft)}.px-3{padding-inline:calc(var(--spacing) * 3)}.px-4{padding-inline:calc(var(--spacing) * 4)}.px-5{padding-inline:calc(var(--spacing) * 5)}.py-2{padding-block:calc(var(--spacing) * 2)}.py-3{padding-block:calc(var(--spacing) * 3)}.py-7{padding-block:calc(var(--spacing) * 7)}.pt-4{padding-top:calc(var(--spacing) * 4)}.pt-6{padding-top:calc(var(--spacing) * 6)}.pt-12{padding-top:calc(var(--spacing) * 12)}.font-body{font-family:var(--font-body)}.font-display{font-family:var(--font-display)}.font-mono{font-family:var(--font-mono)}.text-2xl{font-size:var(--text-2xl)}.text-3xl{font-size:var(--text-3xl)}.text-base{font-size:var(--text-base)}.text-display-lg{font-size:var(--text-display-lg)}.text-lg{font-size:var(--text-lg)}.text-md{font-size:var(--text-md)}.text-sm{font-size:var(--text-sm)}.text-xl{font-size:var(--text-xl)}.text-xs{font-size:var(--text-xs)}.leading-5{--tw-leading:calc(var(--spacing) * 5);line-height:calc(var(--spacing) * 5)}.leading-6{--tw-leading:calc(var(--spacing) * 6);line-height:calc(var(--spacing) * 6)}.leading-7{--tw-leading:calc(var(--spacing) * 7);line-height:calc(var(--spacing) * 7)}.leading-8{--tw-leading:calc(var(--spacing) * 8);line-height:calc(var(--spacing) * 8)}.leading-\[0\.92\]{--tw-leading:.92;line-height:.92}.leading-none{--tw-leading:1;line-height:1}.font-bold{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.tracking-\[-0\.025em\]{--tw-tracking:-.025em;letter-spacing:-.025em}.tracking-\[0\.1em\]{--tw-tracking:.1em;letter-spacing:.1em}.tracking-\[0\.06em\]{--tw-tracking:.06em;letter-spacing:.06em}.tracking-\[0\.08em\]{--tw-tracking:.08em;letter-spacing:.08em}.tracking-\[0\.12em\]{--tw-tracking:.12em;letter-spacing:.12em}.tracking-\[0\.14em\]{--tw-tracking:.14em;letter-spacing:.14em}.text-cast-ana-ink{color:var(--color-cast-ana-ink)}.text-cast-diego-ink{color:var(--color-cast-diego-ink)}.text-cast-leo-ink{color:var(--color-cast-leo-ink)}.text-chalk{color:var(--color-chalk)}.text-chalk-dim{color:var(--color-chalk-dim)}.text-help{color:var(--color-help)}.text-ink{color:var(--color-ink)}.text-ink-muted{color:var(--color-ink-muted)}.text-key-ink{color:var(--color-key-ink)}.text-night{color:var(--color-night)}.text-signal{color:var(--color-signal)}.text-signal-deep{color:var(--color-signal-deep)}.text-signal-ink{color:var(--color-signal-ink)}.text-signal-paper{color:var(--color-signal-paper)}.text-signal-white{color:var(--color-signal-white)}.text-support-ink{color:var(--color-support-ink)}.text-tactile{color:var(--color-tactile)}.text-tactile-copy-strong{color:var(--color-tactile-copy-strong)}.text-tactile-light{color:var(--color-tactile-light)}.text-wood{color:var(--color-wood)}.uppercase{text-transform:uppercase}.outline{outline-style:var(--tw-outline-style);outline-width:1px}.filter{filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}.transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter,display,content-visibility,overlay,pointer-events;transition-timing-function:var(--tw-ease,ease);transition-duration:var(--tw-duration,0s)}.focus\:translate-y-0:focus{--tw-translate-y:0px;translate:var(--tw-translate-x) var(--tw-translate-y)}@media (min-width:40rem){.sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.sm\:grid-cols-\[13rem_1fr\]{grid-template-columns:13rem 1fr}.sm\:px-8{padding-inline:calc(var(--spacing) * 8)}}@media (min-width:64rem){.lg\:sticky{position:sticky}.lg\:top-0{top:0}.lg\:flex{display:flex}.lg\:h-screen{height:100vh}.lg\:grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.lg\:grid-cols-\[1fr_1\.2fr\]{grid-template-columns:1fr 1.2fr}.lg\:grid-cols-\[12rem_1fr\]{grid-template-columns:12rem 1fr}.lg\:grid-cols-\[16rem_minmax\(0\,1fr\)\]{grid-template-columns:16rem minmax(0,1fr)}.lg\:grid-cols-\[18rem_minmax\(0\,1fr\)\]{grid-template-columns:18rem minmax(0,1fr)}.lg\:items-center{align-items:center}.lg\:overflow-y-auto{overflow-y:auto}.lg\:border-r{border-right-style:var(--tw-border-style);border-right-width:1px}.lg\:border-b-0{border-bottom-style:var(--tw-border-style);border-bottom-width:0}.lg\:px-6{padding-inline:calc(var(--spacing) * 6)}.lg\:px-14{padding-inline:calc(var(--spacing) * 14)}.lg\:py-9{padding-block:calc(var(--spacing) * 9)}.lg\:pt-16{padding-top:calc(var(--spacing) * 16)}}}:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;font-family:var(--font-body);--flowkeys-rgb-black:0, 0, 0;--flowkeys-rgb-white:255, 255, 255;--flowkeys-rgb-night:17, 24, 32;--flowkeys-rgb-chalk:242, 235, 221;--flowkeys-rgb-ink:22, 35, 42;--flowkeys-rgb-signal:121, 201, 181;--flowkeys-rgb-signal-deep:45, 117, 102;--flowkeys-rgb-signal-strong:47, 111, 96;--flowkeys-rgb-signal-white:244, 247, 244;--flowkeys-rgb-tactile:234, 163, 90;--flowkeys-rgb-tactile-light:245, 195, 130;--flowkeys-rgb-tactile-deep:142, 78, 37;--flowkeys-rgb-shadow:18, 12, 9;--flowkeys-rgb-shadow-veil:10, 7, 5;--flowkeys-rgb-key-ink:41, 28, 20;--flowkeys-rgb-help:179, 169, 214;--flowkeys-rgb-recovery:219, 109, 96;--flowkeys-rgb-support:245, 196, 81;--flowkeys-rgb-share:240, 122, 190;--flowkeys-rgb-feedback:92, 207, 226;--flowkeys-rgb-onboarding-frame:160, 200, 190;--flowkeys-rgb-cast-ana:245, 196, 207;--flowkeys-rgb-cast-leo:185, 220, 234;--flowkeys-rgb-cast-diego:207, 229, 180;--flowkeys-rgb-rain:176, 206, 226;--flowkeys-rgb-lamp:255, 196, 120;--flowkeys-rgb-mist:214, 226, 232;--body:var(--font-body);--display:var(--font-display);--mono:var(--font-mono);--night:var(--color-night);--night-soft:var(--color-night-soft);--chalk:var(--color-chalk);--chalk-dim:var(--color-chalk-dim);--ink:var(--color-ink);--muted-ink:var(--color-ink-muted);--signal:var(--color-signal);--signal-deep:var(--color-signal-deep);--signal-ink:var(--color-signal-ink);--signal-paper:var(--color-signal-paper);--signal-white:var(--color-signal-white);--tactile:var(--color-tactile);--tactile-light:var(--color-tactile-light);--tactile-deep:var(--color-tactile-deep);--lavender:var(--color-help);--lavender-light:var(--color-help-light);--lavender-deep:var(--color-help-deep);--wood:var(--color-wood);--wood-soft:var(--color-wood-soft);--shadow:var(--color-shadow);--recovery:var(--color-recovery);--recovery-light:var(--color-recovery-light);--focus:var(--color-focus);--display-md:var(--text-display-md);--display-lg:var(--text-display-lg);--space-1:calc(var(--spacing) * 1);--space-2:calc(var(--spacing) * 2);--space-3:calc(var(--spacing) * 3);--space-4:calc(var(--spacing) * 4);--space-5:calc(var(--spacing) * 6);--space-6:calc(var(--spacing) * 8);--space-7:calc(var(--spacing) * 12);--space-8:calc(var(--spacing) * 16)}[data-track=course]{--track-accent:var(--color-signal);--track-accent-ink:var(--color-night);--track-accent-text:var(--color-signal);--track-ground:var(--color-night);--track-raised:var(--color-night-soft);--track-surface:var(--color-signal-paper);--track-surface-ink:var(--color-ink);--track-highlight:var(--color-signal-ink)}[data-track=natural]{--track-accent:var(--color-tactile);--track-accent-ink:var(--color-wood);--track-accent-text:var(--color-tactile-light);--track-ground:var(--color-wood);--track-raised:var(--color-wood-soft);--track-surface:var(--color-key-face);--track-surface-ink:var(--color-key-ink);--track-highlight:var(--color-cast-ana)}[data-track]{--track-wash:var(--track-accent)}@supports (color:color-mix(in lab, red, red)){[data-track]{--track-wash:color-mix(in srgb, var(--track-accent) 10%, transparent)}}[data-track]{--track-line:var(--track-accent)}@supports (color:color-mix(in lab, red, red)){[data-track]{--track-line:color-mix(in srgb, var(--track-accent) 24%, transparent)}}:root{--utility-ink:var(--color-chalk-dim);--utility-ink-hover:var(--color-chalk);--utility-wash:rgba(var(--flowkeys-rgb-chalk), .06);--utility-wash-hover:rgba(var(--flowkeys-rgb-chalk), .12);--utility-line:rgba(var(--flowkeys-rgb-chalk), .16);--utility-line-hover:rgba(var(--flowkeys-rgb-chalk), .3);--flowkeys-rgb-original-amber:244, 162, 97;--flowkeys-rgb-original-ink:58, 54, 50;--flowkeys-rgb-original-pbt:249, 248, 246;--flowkeys-rgb-original-jelly-glow:161, 240, 129;--flowkeys-rgb-original-grain-light:255, 220, 170;--flowkeys-rgb-original-grain-warm:255, 200, 140;--color-original-ink:#3a3632;--color-original-pbt-tray:#eae7e1;--flowkeys-rgb-original-shadow:26, 19, 11;--color-original-vowel-tray:#d6e4f0;--color-original-accent:#f4a261;--color-original-jelly-active:#e1f0d6;--color-original-warm-word:#f4e4d6;--color-original-wood-deep:#1d130a;--color-original-wood-warm:#3a2716;--color-original-wood-mid:#2c1d10}@property --tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"*";inherits:false;initial-value:0}@property --tw-rotate-x{syntax:"*";inherits:false}@property --tw-rotate-y{syntax:"*";inherits:false}@property --tw-rotate-z{syntax:"*";inherits:false}@property --tw-skew-x{syntax:"*";inherits:false}@property --tw-skew-y{syntax:"*";inherits:false}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-tracking{syntax:"*";inherits:false}@property --tw-outline-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}*{box-sizing:border-box}html{background:var(--night);min-width:320px;min-height:100%}body{background:var(--night);min-width:320px;min-height:100vh;color:var(--chalk);text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;margin:0}button,input,summary{font:inherit}button,summary{-webkit-tap-highlight-color:transparent}button{border:0}button:not(:disabled),summary{cursor:pointer}a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible,[tabindex="-1"]:focus-visible{outline:3px solid var(--focus);outline-offset:4px}.mode-attention .lesson-main button:focus-visible,.mode-attention .lesson-main summary:focus-visible,.mode-attention .lesson-main [tabindex="-1"]:focus-visible{outline-color:var(--signal-ink)}button:disabled{cursor:not-allowed}p,h1,h2,ol{margin:0}.app-shell{background:var(--night);grid-template-rows:auto 1fr;min-height:100vh;display:grid}.lesson-topbar{min-height:72px;padding:0 var(--space-6);align-items:center;gap:var(--space-5);background:var(--night);border-bottom:1px solid rgba(var(--flowkeys-rgb-chalk), .1);z-index:20;grid-template-columns:1fr auto auto auto;display:grid;position:relative}.lesson-topbar-start{align-items:center;gap:var(--space-4);display:flex}.topbar-lessons,.onboarding-lessons{min-height:44px;padding:0 var(--space-3);align-items:center;gap:var(--space-2);color:var(--chalk-dim);border:1px solid rgba(var(--flowkeys-rgb-chalk), .16);font-family:var(--mono);font-size:var(--text-xs);letter-spacing:.07em;text-transform:uppercase;background:0 0;display:inline-flex}.topbar-lessons:hover,.onboarding-lessons:hover{color:var(--chalk);border-color:rgba(var(--flowkeys-rgb-signal), .5)}.topbar-lessons svg,.onboarding-lessons svg{width:17px;height:17px}.wordmark{align-items:center;gap:var(--space-3);width:max-content;color:var(--chalk);display:inline-flex}.wordmark>span{background:var(--signal);width:30px;height:30px;color:var(--night);font-family:var(--display);font-size:var(--text-lg);place-items:center;font-weight:700;display:grid}.wordmark strong{font-family:var(--display);font-size:var(--text-lg);letter-spacing:.02em}.session-context{align-items:center;gap:var(--space-2);font-family:var(--mono);font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.08em;color:var(--chalk-dim);display:flex}.session-context svg{width:16px;height:16px;color:var(--signal)}.session-context i{background:currentColor;border-radius:50%;width:3px;height:3px}.comfort-menu{justify-self:end;position:relative}.comfort-menu summary{min-height:44px;color:var(--chalk-dim);font-family:var(--mono);font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.08em;align-items:center;list-style:none;display:inline-flex}.comfort-menu summary::-webkit-details-marker{display:none}.comfort-menu>div{z-index:30;width:min(320px,100vw - 32px);padding:var(--space-4);background:var(--night-soft);color:var(--chalk);box-shadow:0 20px 50px rgba(var(--flowkeys-rgb-black), .34), 0 0 0 1px rgba(var(--flowkeys-rgb-chalk), .12);transform-origin:100% 0;animation:menu-enter .18s var(--ease-out) both;position:absolute;top:calc(100% + 8px);right:0}.comfort-menu strong{margin-bottom:var(--space-1);font-size:var(--text-base);display:block}.comfort-menu p+*+strong,.comfort-menu .comfort-voice-choice+strong{margin-top:var(--space-4)}.comfort-menu p{color:var(--chalk-dim);font-size:var(--text-sm);line-height:1.55}.comfort-menu div>span{margin-top:var(--space-3);color:var(--signal);font-family:var(--mono);font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.08em;display:block}.lesson-layout{grid-template-rows:auto minmax(0,1fr);grid-template-columns:minmax(0,1fr);min-height:0;display:grid}.lesson-layout>.lesson-main:only-child{grid-row:1/-1}.stage-spine{padding:var(--space-3) var(--space-6);justify-content:center;align-items:center;gap:var(--space-2) var(--space-5);color:color-mix(in srgb, var(--chalk-dim) 78%, var(--night));background:var(--night);font-family:var(--mono);font-size:var(--text-xs);letter-spacing:.1em;text-transform:uppercase;flex-wrap:wrap;display:flex}.spine-title{align-items:baseline;gap:var(--space-2);display:inline-flex}.spine-title>span,.spine-boundary>span{color:var(--signal)}.spine-title>strong{color:var(--chalk);font-family:var(--display);font-size:var(--text-md);letter-spacing:0;text-transform:none;font-weight:600}.stage-spine ol{justify-content:center;align-items:center;gap:var(--space-2);flex-wrap:wrap;padding:0;list-style:none;display:flex}.stage-spine li{align-items:center;gap:6px;display:inline-flex}.stage-spine li+li:before{content:"→";content:"→" / "";margin-right:var(--space-2);color:rgba(var(--flowkeys-rgb-signal), .45)}.stage-spine li.is-complete{color:var(--chalk-dim)}.stage-spine li svg{width:14px;height:14px;color:var(--signal)}.stage-spine li.is-current{color:var(--signal)}.mode-tactile .stage-spine li.is-current{color:var(--tactile-light)}.stage-spine li strong{font-weight:500}.stage-spine li small,.stage-spine .teaching-progress,.spine-boundary{color:var(--chalk-dim);font-family:var(--body);font-size:var(--text-sm);letter-spacing:0;text-transform:none}.stage-spine li small{margin-left:var(--space-1)}.stage-spine .teaching-progress{margin-top:0}.spine-boundary{padding-left:var(--space-5);border-left:1px solid rgba(var(--flowkeys-rgb-chalk), .14)}.spine-boundary>span{margin-right:var(--space-1);font-family:var(--mono);font-size:var(--text-xs);letter-spacing:.1em;text-transform:uppercase}.lesson-main{min-width:0;padding:var(--space-6) clamp(24px, 4vw, 64px) calc(var(--space-8) + var(--space-6));color:var(--ink);background:linear-gradient(rgba(var(--flowkeys-rgb-ink), .045) 1px, transparent 1px) 0 0 / 100% 32px, var(--signal-paper)}.mode-tactile .lesson-main{color:var(--chalk);background:linear-gradient(90deg, rgba(var(--flowkeys-rgb-tactile-light), .025) 1px, transparent 1px) 0 0 / 40px 100%, linear-gradient(rgba(var(--flowkeys-rgb-tactile-light), .025) 1px, transparent 1px) 0 0 / 100% 40px, var(--wood)}.mode-signal{align-items:center;gap:var(--space-2) var(--space-4);width:100%;min-height:44px;margin-bottom:var(--space-5);font-family:var(--mono);flex-wrap:wrap;display:flex}.mode-copy{flex:auto;min-width:0}.procedural-help{flex:none;position:relative}.help-control{align-items:center;gap:var(--space-2);min-height:44px;padding:0 var(--space-3);color:var(--signal-deep);font-family:var(--mono);font-size:var(--text-xs);letter-spacing:.08em;text-transform:uppercase;cursor:pointer;background:0 0;border:1px solid;display:inline-flex}.help-control svg{width:17px;height:17px}.mode-signal.is-tactile .help-control,.instrument .help-control,.recall-instrument .help-control{color:var(--tactile-light)}.instrument-bed>.turn-wait{z-index:2;width:min(760px,100%);position:relative}.instrument>.instrument-guidance,.recall-instrument>.instrument-guidance{width:min(760px,100%);margin:var(--space-2) auto 0}.instrument .help-text,.recall-instrument .help-text{width:min(460px,100%);margin-top:var(--space-2);box-shadow:0 0 0 1px rgba(var(--flowkeys-rgb-chalk), .16);position:static}.help-text{z-index:30;width:min(340px,100vw - 32px);padding:var(--space-3) var(--space-4);background:var(--night-soft);color:var(--chalk);font-family:var(--body);font-size:var(--text-base);text-transform:none;letter-spacing:0;box-shadow:0 18px 45px rgba(var(--flowkeys-rgb-black), .34), 0 0 0 1px rgba(var(--flowkeys-rgb-chalk), .14);margin:0;line-height:1.6;position:absolute;top:calc(100% + 8px);right:0}.help-restart{margin-top:var(--space-3);padding-top:var(--space-3);border-top:1px solid rgba(var(--flowkeys-rgb-chalk), .16)}.help-restart button{align-items:center;gap:var(--space-2);width:100%;min-height:44px;padding:0 var(--space-3);background:rgba(var(--flowkeys-rgb-chalk), .06);color:var(--chalk);font-family:var(--body);font-size:var(--text-sm);text-align:left;display:inline-flex}.help-restart button:hover{background:rgba(var(--flowkeys-rgb-chalk), .12)}.help-restart button.is-confirming{background:var(--tactile);color:var(--wood);font-weight:600}.help-restart svg{flex:none;width:17px;height:17px}.help-restart p{margin-top:var(--space-2);color:var(--chalk-dim);font-size:var(--text-xs);line-height:1.55}.mode-icon{place-items:center;width:38px;height:38px;display:grid}.mode-icon svg{width:19px;height:19px}.mode-signal.is-attention .mode-icon{background:var(--signal-deep);color:var(--signal-white)}.mode-signal.is-tactile .mode-icon{background:var(--tactile);color:var(--wood);box-shadow:0 4px 0 var(--tactile-deep), 0 8px 18px rgba(var(--flowkeys-rgb-black), .22)}.mode-signal>span:last-child{min-width:0}.mode-signal strong{font-size:var(--text-xs);letter-spacing:.11em;text-transform:uppercase;display:block}.lesson-stage{width:min(1120px,100%);animation:stage-enter .36s var(--ease-out) both;margin:0 auto}.lesson-stage [data-enter-step]{animation:stage-enter .36s var(--ease-out) both;animation-delay:var(--enter-at,0s)}.lesson-stage [data-enter-step][data-enter-live]{animation-name:stage-enter-live}@keyframes stage-enter-live{0%{transform:translateY(10px)}to{transform:none}}.lesson-stage [data-enter-step="0"]{--enter-at:0s}.lesson-stage [data-enter-step="1"]{--enter-at:.3s}.lesson-stage [data-enter-step="2"]{--enter-at:.6s}.stage-heading{max-width:880px}.stage-heading>span{margin-bottom:var(--space-3);color:var(--signal-deep);font-family:var(--mono);font-size:var(--text-xs);letter-spacing:.12em;text-transform:uppercase;font-weight:500;display:block}.mode-tactile .stage-heading>span{color:var(--tactile-light)}.stage-heading h1{max-width:900px;font-family:var(--display);font-size:var(--display-lg);letter-spacing:-.025em;font-weight:600;line-height:.9}.stage-heading h1 em{color:var(--signal-deep);font-style:normal}.stage-heading>p{max-width:720px;margin-top:var(--space-4);color:var(--muted-ink);font-size:var(--text-md);line-height:1.6}.mode-tactile .stage-heading>p{color:var(--chalk-dim)}.stage-heading.is-compact h1{font-size:var(--display-md)}.teacher-console{padding:var(--space-5);background:var(--signal-white);color:var(--ink);box-shadow:0 0 0 1px rgba(var(--flowkeys-rgb-ink), .08), 0 2px 8px rgba(var(--flowkeys-rgb-ink), .05), 0 18px 40px rgba(var(--flowkeys-rgb-ink), .06)}.mode-tactile .teacher-console{background:var(--color-signal-key-face);box-shadow:0 8px 0 var(--color-signal-key-edge), 0 24px 50px rgba(var(--flowkeys-rgb-black), .26)}.teacher-console.is-compact{margin-top:var(--space-5)}.teacher-line{justify-content:space-between;align-items:center;gap:var(--space-4);display:flex}.teacher-identity{align-items:center;gap:var(--space-3);display:flex}.teacher-mark{background:var(--ink);width:38px;height:38px;color:var(--signal-white);font-family:var(--display);font-size:var(--text-lg);border-radius:50%;place-items:center;font-weight:700;display:grid}.teacher-identity strong,.teacher-identity span{display:block}.teacher-identity strong{font-family:var(--display);font-size:var(--text-lg)}.teacher-identity div>span{margin-top:var(--space-1);color:var(--muted-ink);font-family:var(--mono);font-size:var(--text-xs);letter-spacing:.07em;text-transform:uppercase}.listen-control,.tool-control,.quiet-action{justify-content:center;align-items:center;gap:var(--space-2);background:0 0;min-height:44px;display:inline-flex}.listen-control{padding:var(--space-1) var(--space-3) var(--space-1) var(--space-1);color:var(--ink);font-family:var(--mono);font-size:var(--text-xs);letter-spacing:.06em;text-transform:uppercase;box-shadow:inset 0 0 0 1px rgba(var(--flowkeys-rgb-ink), .16);font-weight:500}.listen-icon{background:var(--signal-deep);width:32px;height:32px;color:var(--color-white);place-items:center;display:grid}.listen-icon svg{width:15px;height:15px;transform:translate(1px)}.voice-score{height:26px;margin:var(--space-4) 0 var(--space-3);align-items:center;gap:var(--space-1);opacity:.32;display:flex}.voice-score.is-live{opacity:1}.voice-score i{width:3px;height:var(--voice-height);background:var(--signal-deep);transform-origin:50%}.teacher-script{max-width:900px;font-size:var(--text-base);line-height:1.72}.stage-action-row{margin-top:var(--space-5);justify-content:space-between;align-items:center;gap:var(--space-5);display:flex}.stage-action-row>p{max-width:430px;color:var(--muted-ink);font-size:var(--text-sm);line-height:1.5}.mode-tactile .stage-action-row>p{color:var(--chalk-dim)}.primary-action{min-height:52px;padding:0 var(--space-4);justify-content:center;align-items:center;gap:var(--space-3);font-size:var(--text-sm);transition:transform .16s var(--ease-out), opacity .16s var(--ease-out), filter .16s var(--ease-out);font-weight:600;display:inline-flex}.primary-action svg{width:18px;height:18px}.primary-action em{font-style:normal}.primary-action.is-digital{background:var(--ink);color:var(--signal-white);box-shadow:inset 4px 0 0 var(--signal)}.primary-action.is-tactile{background:var(--tactile-light);color:var(--wood);box-shadow:0 5px 0 var(--tactile-deep), 0 12px 30px rgba(var(--flowkeys-rgb-black), .24)}.primary-action:not(:disabled):active{transform:translateY(3px)}.primary-action:disabled{opacity:.35;filter:saturate(.4)}.perform-composition{padding-bottom:var(--space-4)}.instrument{color:var(--chalk)}.instrument-topline{min-height:44px;padding-top:var(--space-4);justify-content:space-between;align-items:center;gap:var(--space-4);display:flex}.instrument-instruction>span,.instrument-instruction>strong{display:block}.instrument-instruction strong{margin-top:var(--space-1);font-size:var(--text-sm);font-weight:500}.word-completion{min-height:15px;margin-top:var(--space-1);color:var(--tactile-light);font-family:var(--mono);font-size:var(--text-xs);text-transform:uppercase}.instrument-actions{align-items:center;gap:var(--space-2);display:flex}.tool-control,.sound-mixer summary,.instrument-more>summary{min-height:44px;padding:0 var(--space-4);color:var(--chalk-dim);font-family:var(--mono);font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.04em;background:rgba(var(--flowkeys-rgb-chalk), .06);transition:color .16s var(--ease-out), background-color .16s var(--ease-out);border-radius:999px;list-style:none}.tool-control:hover,.tool-control:focus-visible,.sound-mixer summary:hover,.instrument-more>summary:hover,.instrument-more[open]>summary{color:var(--chalk);background:rgba(var(--flowkeys-rgb-tactile-light), .14)}.tool-control svg,.sound-mixer summary svg,.instrument-more>summary svg{width:15px;height:15px}.sound-mixer,.instrument-more{position:relative}.sound-mixer summary,.instrument-more>summary{align-items:center;gap:var(--space-2);display:flex}.sound-mixer summary::-webkit-details-marker{display:none}.instrument-more>summary::-webkit-details-marker{display:none}.instrument-more-panel{z-index:30;width:270px;padding:var(--space-4);gap:var(--space-3);background:var(--color-tactile-well);border-radius:var(--space-4);box-shadow:0 18px 45px rgba(var(--flowkeys-rgb-black), .45), inset 0 0 0 1px rgba(var(--flowkeys-rgb-chalk), .13);animation:menu-enter .18s var(--ease-out) both;display:grid;position:absolute;top:calc(100% + 8px);right:0}.instrument-more-panel>strong{color:var(--chalk-dim);font-family:var(--mono);font-size:var(--text-xs);letter-spacing:.08em;text-transform:uppercase}.instrument-more-panel>.sound-mixer>summary,.instrument-more-panel>.tool-control{justify-content:center;width:100%}.sound-mixer .mixer-panel{z-index:20;width:250px;padding:var(--space-4);background:var(--color-tactile-well);border-radius:var(--space-4);box-shadow:0 18px 45px rgba(var(--flowkeys-rgb-black), .45), inset 0 0 0 1px rgba(var(--flowkeys-rgb-chalk), .13);transform-origin:100% 0;animation:menu-enter .18s var(--ease-out) both;position:absolute;top:calc(100% + 8px);right:0}.mixer-panel label{gap:var(--space-2);color:var(--chalk-dim);font-family:var(--mono);font-size:var(--text-xs);text-transform:uppercase;grid-template-columns:1fr auto;display:grid}.mixer-panel label+label{margin-top:var(--space-3)}.mixer-panel input{width:100%;accent-color:var(--tactile);grid-column:1/3}.mixer-panel input:disabled{opacity:.4}.mixer-panel small{margin-top:var(--space-3);color:var(--chalk-dim);font-family:var(--mono);font-size:var(--text-xs);text-transform:uppercase;line-height:1.5;display:block}.mixer-quiet,.onboarding-quiet{align-items:center;gap:var(--space-2);min-height:44px;font-family:var(--mono);font-size:var(--text-xs);letter-spacing:.06em;text-transform:uppercase;cursor:pointer;background:0 0;border:0;padding:0;display:inline-flex}.mixer-quiet{margin-bottom:var(--space-1);color:var(--chalk)}.mixer-quiet.is-quiet{color:var(--tactile)}.onboarding-quiet{margin-top:var(--space-3);color:var(--signal)}.onboarding-quiet.is-quiet{color:var(--tactile)}.mixer-quiet svg,.onboarding-quiet svg{width:16px;height:16px}.mixer-quiet:hover,.mixer-quiet:focus-visible,.onboarding-quiet:hover,.onboarding-quiet:focus-visible{text-decoration:underline}.sentence-rail{padding:var(--space-4) 0 0;justify-content:safe center;gap:var(--space-2);scroll-snap-type:x proximity;scrollbar-width:thin;scrollbar-color:rgba(var(--flowkeys-rgb-tactile), .4) transparent;display:flex;overflow-x:auto}.rail-group{min-height:40px;padding:0 var(--space-4);justify-content:center;align-items:center;gap:var(--space-2);scroll-snap-align:center;background:rgba(var(--flowkeys-rgb-chalk), .05);color:var(--ghost-ink);font-size:var(--text-sm);white-space:nowrap;border-radius:999px;flex:none;display:inline-flex}.rail-group small{color:inherit;font-family:var(--mono);font-size:var(--text-xs);letter-spacing:.09em;text-transform:uppercase}.rail-group.is-current{background:rgba(var(--flowkeys-rgb-tactile), .14);color:var(--tactile-light);box-shadow:inset 0 0 0 1px rgba(var(--flowkeys-rgb-tactile), .42)}.rail-group.is-complete{background:rgba(var(--flowkeys-rgb-signal), .1);color:var(--chalk);box-shadow:inset 0 0 0 1px rgba(var(--flowkeys-rgb-signal), .3)}.rail-group.is-complete small:before{content:"✓";content:"✓" / "";margin-right:var(--space-1);color:var(--signal)}.instrument-bed{margin-top:var(--space-3);padding:var(--space-5) 0 var(--space-2);scroll-margin-bottom:calc(var(--keyboard-inset,0px) + 24px);perspective:1100px;justify-items:center;gap:clamp(18px,3vw,28px);display:grid;position:relative}.resonance-field{opacity:.9;pointer-events:none;width:100%;height:100%;position:absolute;inset:0}.resonance-field[data-fallback=true]{background:radial-gradient(ellipse at 50% 38%, rgba(var(--flowkeys-rgb-tactile), .12), transparent 60%)}.phrase-key{width:min(820px,100%);min-height:154px;padding:var(--space-6) clamp(22px, 4vw, 44px) var(--space-6);text-align:left;background:var(--color-key-face);color:var(--color-key-ink);box-shadow:0 8px 0 var(--color-key-edge), 0 15px 0 var(--color-key-edge-deep), 0 28px 60px rgba(var(--flowkeys-rgb-black), .5), inset 0 1px 0 rgba(var(--flowkeys-rgb-white), .65);border-radius:var(--radius-surface);transform-origin:bottom;z-index:2;transition:filter .32s var(--ease-state);align-content:center;display:grid;position:relative;transform:rotateX(3deg)translateY(0)}.instrument-bed.is-pressed .phrase-key{box-shadow:0 3px 0 var(--color-key-edge), 0 8px 0 var(--color-key-edge-deep), 0 18px 44px rgba(var(--flowkeys-rgb-black), .46), inset 0 1px 0 rgba(var(--flowkeys-rgb-white), .65);transform:rotateX(3deg)translateY(5px)}.instrument-bed.is-settling .phrase-key{filter:saturate(1.1);transition:transform .22s var(--ease-state), filter .22s var(--ease-state);transform:rotateX(3deg)translateY(7px)}.instrument-bed.is-mistake .phrase-key{box-shadow:0 8px 0 var(--color-recovery-edge), 0 15px 0 var(--color-recovery-edge-deep), 0 28px 60px rgba(var(--flowkeys-rgb-black), .5), inset 4px 0 0 var(--recovery)}.phrase-key-label{margin-bottom:var(--space-4);color:var(--color-tactile-deep);font-family:var(--mono);font-size:var(--text-xs);letter-spacing:.12em;text-transform:uppercase}.phrase-key-purpose{margin:calc(-1 * var(--space-2)) 0 var(--space-4);color:var(--color-key-ink-soft);font-size:var(--text-sm);line-height:1.4}.phrase-key-text{font-family:var(--display);font-size:var(--display-lg);flex-wrap:wrap;font-weight:600;line-height:.98;display:flex}.phrase-word,.phrase-space{display:inline-flex}.character{color:var(--color-key-ink-strong)}.character.is-typed{color:var(--color-key-ink-muted)}.character.is-active{color:var(--color-key-ink-strong);text-decoration:underline;-webkit-text-decoration-color:var(--tactile-deep);text-decoration-color:var(--tactile-deep);text-underline-offset:8px;text-decoration-thickness:3px}.key-front{left:var(--space-5);right:var(--space-5);background:var(--color-tactile-deep);border-radius:0 0 var(--space-2) var(--space-2);pointer-events:none;height:8px;position:absolute;bottom:-9px}.capture-field{z-index:2;gap:var(--space-2);width:min(760px,100%);scroll-margin-bottom:calc(var(--keyboard-inset,0px) + 24px);display:grid;position:relative}.capture-label{align-items:center;gap:var(--space-2);color:rgba(var(--flowkeys-rgb-chalk), .62);font-family:var(--mono);font-size:var(--text-xs);letter-spacing:.08em;text-transform:uppercase;display:inline-flex}.capture-label svg{width:15px;height:15px}.capture-input{width:100%;min-height:52px;padding:0 var(--space-4);background:rgba(var(--flowkeys-rgb-shadow-veil), .76);border:1px solid rgba(var(--flowkeys-rgb-tactile-light), .3);color:var(--chalk);caret-color:var(--tactile);font-family:var(--mono);font-size:var(--text-md);letter-spacing:.02em;border-radius:0}.capture-input::selection{background:var(--tactile);color:var(--color-tactile-ink-deep)}.capture-input:focus-visible{outline:3px solid var(--tactile);outline-offset:2px}.capture-input:disabled{opacity:.45}.capture-input:read-only{border-style:dashed}:is(.instrument,.recall-instrument) .capture-input{background:var(--color-reveal-field);border-color:var(--color-reveal-field-border);border-radius:var(--space-2);box-shadow:inset 0 2px 4px rgba(var(--flowkeys-rgb-black), .4)}.instrument-bed:not(:focus-within) .character.is-active{text-decoration:none}.visually-hidden{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.sentence-complete{width:min(760px,100%);min-height:200px;padding:var(--space-6);place-items:center;gap:var(--space-2);text-align:center;background:var(--color-key-face);color:var(--color-key-ink);border-radius:var(--radius-surface);box-shadow:0 8px 0 var(--color-key-edge), 0 16px 50px rgba(var(--flowkeys-rgb-black), .45);z-index:2;animation:materialize .42s var(--ease-out) both;display:grid;position:relative}.sentence-complete>span{color:var(--color-tactile-deep);font-family:var(--mono);font-size:var(--text-xs);letter-spacing:.1em;text-transform:uppercase}.sentence-complete>strong{max-width:660px;font-family:var(--display);font-size:var(--display-md);line-height:1}.instrument-footer{min-height:52px;margin-top:var(--space-5);justify-content:center;align-items:center;gap:var(--space-4);color:var(--ghost-ink);font-family:var(--mono);font-size:var(--text-xs);letter-spacing:.05em;text-transform:uppercase;display:flex}.story-page{margin-top:var(--space-5)}.story-page.has-illustration{align-items:center;gap:var(--space-5);grid-template-columns:minmax(160px,.42fr) minmax(0,1fr);display:grid}.story-light{border-radius:var(--radius-surface);background:linear-gradient(150deg, transparent 0 48%, rgba(var(--flowkeys-rgb-signal), .12) 48% 50%, transparent 50%), linear-gradient(30deg, var(--color-story-sky-top), var(--color-story-sky-bottom));min-height:320px;position:relative;overflow:hidden}.story-light:before,.story-light:after{content:"";background:var(--color-story-room);position:absolute}.story-light:before{height:62%;box-shadow:0 0 0 1px rgba(var(--flowkeys-rgb-signal), .2);bottom:0;left:18%;right:18%}.story-light:after{background:var(--color-story-light);width:26%;height:22%;box-shadow:0 0 34px rgba(var(--flowkeys-rgb-recovery), .7);top:45%;left:37%}.story-light i{z-index:2;background:var(--color-story-structure);clip-path:polygon(35% 0,68% 0,85% 18%,75% 55%,100% 100%,0 100%,27% 55%,16% 18%);width:14%;height:34%;position:absolute;bottom:0;left:43%}.story-copy{max-width:62ch;margin-inline:auto}.story-copy p{font-size:var(--text-lg);line-height:1.65}.story-copy p+p{margin-top:var(--space-4)}.story-copy mark{background:rgba(var(--flowkeys-rgb-signal), .22);color:var(--signal-deep);padding:0 .1em}.story-scene{margin-top:var(--space-6);background:var(--signal-white);color:var(--ink);box-shadow:0 0 0 1px rgba(var(--flowkeys-rgb-ink), .08), 0 28px 60px rgba(var(--flowkeys-rgb-ink), .11)}.story-scene-header{min-height:52px;padding:0 var(--space-4);align-items:center;gap:var(--space-3);border-bottom:1px solid rgba(var(--flowkeys-rgb-ink), .1);font-family:var(--mono);font-size:var(--text-xs);letter-spacing:.08em;text-transform:uppercase;display:flex}.story-scene-live{background:var(--signal-deep);width:8px;height:8px;box-shadow:0 0 0 4px rgba(var(--flowkeys-rgb-signal-deep), .12);border-radius:50%}.story-participants,.story-messages{margin:0;padding:0;list-style:none}.story-participants{padding:var(--space-4);gap:var(--space-3);background:var(--signal-paper);grid-template-columns:repeat(3,minmax(0,1fr));display:grid}.story-participants li{align-items:center;gap:var(--space-3);min-width:0;display:flex}.participant-avatar{background:var(--night-soft);width:38px;height:38px;color:var(--chalk);font-family:var(--mono);font-size:var(--text-sm);flex:none;place-items:center;display:grid}.participant-avatar.is-maya{background:var(--signal-deep)}.participant-avatar.is-leo{background:var(--color-story-building)}.story-participants strong,.story-participants small{display:block}.story-participants small{color:var(--muted-ink);font-size:var(--text-xs);margin-top:2px;line-height:1.35}.story-messages{gap:var(--space-3);padding:clamp(24px,5vw,48px);display:grid}.story-messages li{width:min(620px,88%);padding:var(--space-3) var(--space-4);background:var(--color-white);box-shadow:inset 3px 0 0 var(--signal-deep)}.story-messages li:nth-child(2n){background:var(--signal-paper);margin-left:auto}.story-messages li.is-pending{border:1px dashed rgba(var(--flowkeys-rgb-ink), .32);box-shadow:none;color:var(--muted-ink);background:0 0}.story-messages strong{font-family:var(--mono);font-size:var(--text-xs);letter-spacing:.07em;text-transform:uppercase}.story-messages p{margin-top:var(--space-1);font-family:var(--display);font-size:var(--text-xl);line-height:1.15}.story-messages mark{background:rgba(var(--flowkeys-rgb-signal), .22);color:var(--signal-ink)}.evidence-board{margin-top:var(--space-5);gap:var(--space-2);display:grid}.evidence-board>div{min-height:72px;padding:var(--space-3) var(--space-4);align-items:center;gap:var(--space-4);background:rgba(var(--flowkeys-rgb-signal-white), .55);border-radius:var(--radius-surface);grid-template-columns:136px minmax(0,1fr) 24px;display:grid}.evidence-board>div>span{max-width:100%;min-height:28px;padding:0 var(--space-3);align-items:center;gap:var(--space-1);color:var(--signal-ink);background:rgba(var(--flowkeys-rgb-signal-deep), .1);font-family:var(--mono);font-size:var(--text-xs);letter-spacing:.1em;text-transform:uppercase;border-radius:999px;justify-self:start;display:inline-flex}.evidence-board p{font-family:var(--display);font-size:var(--text-lg);line-height:1.2}.evidence-board svg{width:21px;height:21px;color:var(--signal-deep)}.learning-state{margin:var(--space-2) 0 0;gap:var(--space-2);grid-template-columns:1fr 1fr;display:grid}.learning-state>div{min-height:92px;padding:var(--space-4);background:rgba(var(--flowkeys-rgb-signal-white), .55);border-radius:var(--radius-surface)}.learning-state span{color:var(--muted-ink);font-family:var(--mono);font-size:var(--text-xs);letter-spacing:.09em;text-transform:uppercase;display:block}.learning-state strong{margin-top:var(--space-3);font-family:var(--display);font-size:var(--text-xl);font-weight:600;display:block}.state-now{box-shadow:inset 0 0 0 1.5px rgba(var(--flowkeys-rgb-signal-deep), .4)}.state-next strong{color:var(--muted-ink)}.state-next p{margin-top:var(--space-2);color:var(--muted-ink);font-size:var(--text-sm);line-height:1.5}.final-actions{margin-top:var(--space-5);align-items:center;gap:var(--space-3);display:flex}.quiet-action{padding:0 var(--space-3);color:var(--muted-ink);font-size:var(--text-xs)}@keyframes stage-enter{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes materialize{0%{opacity:0;filter:blur(4px);transform:translateY(8px)}to{opacity:1;filter:blur();transform:translateY(0)}}@keyframes menu-enter{0%{opacity:0;filter:blur(3px);transform:translateY(-5px)}to{opacity:1;filter:blur();transform:translateY(0)}}@media (max-width:960px){.lesson-topbar{grid-template-columns:1fr auto auto}.session-context{display:none}.stage-spine{padding:var(--space-3) var(--space-4)}.spine-title,.spine-boundary,.stage-spine .teaching-progress,.stage-spine li small{display:none}.lesson-main{padding-top:var(--space-5)}.story-page.has-illustration{grid-template-columns:150px minmax(0,1fr)}}@media (max-width:680px){.lesson-topbar{min-height:62px;padding:0 var(--space-4)}.wordmark>span{width:27px;height:27px}.wordmark strong{font-size:var(--text-md)}.lesson-topbar-start{gap:var(--space-2)}.lesson-topbar[data-language-support=true] .wordmark strong{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.topbar-lessons{padding:0 var(--space-2)}.topbar-lessons span{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.comfort-menu summary{min-height:44px}.stage-spine{padding:var(--space-2) var(--space-3)}.lesson-main{padding:var(--space-4) var(--space-3) var(--space-7)}.mode-signal{margin-bottom:var(--space-5)}.teacher-console{padding:var(--space-4)}.teacher-line{align-items:flex-start}.listen-control>span:last-child{display:none}.listen-control{min-width:44px;padding:var(--space-1)}.voice-score{margin-top:var(--space-3)}.stage-action-row{flex-direction:column;align-items:stretch}.stage-action-row>p{font-size:var(--text-xs)}.primary-action{width:100%}.instrument-topline{flex-direction:column-reverse;align-items:flex-start}.instrument-actions{grid-template-columns:repeat(3,1fr);width:100%;display:grid}.instrument.is-message-practice .instrument-actions{grid-template-columns:repeat(2,1fr)}.tool-control,.sound-mixer summary,.instrument-more>summary{width:100%;padding:0 var(--space-2);justify-content:center}.sound-mixer .mixer-panel{right:0}.instrument-more-panel{width:min(270px,100vw - 48px);right:0}.instrument.is-message-practice .sentence-rail .rail-group:not(.is-current){display:none}.instrument.is-message-practice .sentence-rail .rail-group.is-current{width:100%;min-width:100%}.instrument-bed{padding:var(--space-4) 0 var(--space-2)}.phrase-key{min-height:170px;padding:var(--space-5) var(--space-4) var(--space-6)}.instrument-footer{padding-top:var(--space-2);align-items:center}.story-page.has-illustration{grid-template-columns:1fr}.story-light{min-height:210px}.story-copy p{font-size:var(--text-md)}.story-participants{grid-template-columns:1fr}.story-messages{padding:var(--space-4)}.story-messages li{width:94%}.learning-state{grid-template-columns:1fr}.evidence-board>div{gap:var(--space-2);grid-template-columns:minmax(0,1fr) 20px}.evidence-board>div>span{grid-column:1/-1}.final-actions{flex-direction:column;align-items:stretch}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}.lesson-stage [data-enter-step]{animation:none}.resonance-field{opacity:.42}.instrument-bed.is-pressed .phrase-key,.instrument-bed.is-settling .phrase-key{transform:rotateX(3deg)translateY(0)}}.meaning-check{margin-top:var(--space-5);padding:var(--space-4) var(--space-4);gap:var(--space-2);background:rgba(var(--flowkeys-rgb-signal), .13);border-left:3px solid var(--signal-deep);display:grid}.meaning-check-prompt{font-family:var(--display);font-size:var(--display-lg);margin:0;font-weight:600;line-height:1.1}.meaning-check p{margin:0}.meaning-check-options{margin-top:var(--space-1);gap:var(--space-2);grid-template-columns:repeat(auto-fit,minmax(150px,1fr));display:grid}.meaning-check-options button{min-height:60px;padding:var(--space-2) var(--space-3);gap:var(--space-1);text-align:left;background:var(--paper);box-shadow:inset 0 0 0 1px rgba(var(--flowkeys-rgb-signal-strong), .32);display:grid}.meaning-check-options button small{font-family:var(--mono);font-size:var(--text-xs);letter-spacing:.1em;color:var(--signal-deep)}.meaning-check-options button.is-chosen{background:var(--signal-deep);color:var(--color-story-ink-light)}.meaning-check-options button.is-chosen small{color:var(--color-story-ink-signal)}.meaning-check-options button:disabled{cursor:default}.meaning-check-feedback{font-size:var(--text-base);line-height:1.55}.meaning-check-feedback.is-right{color:var(--signal)}.meaning-check-feedback.is-wrong{color:var(--recovery-light)}.comfort-record{margin-top:var(--space-4);gap:var(--space-1);display:grid}.comfort-record p{color:var(--chalk-dim);font-size:var(--text-sm);line-height:1.5}.comfort-record .quiet-action{color:var(--chalk-dim);font-family:var(--mono);font-size:var(--text-xs);letter-spacing:.06em;text-transform:uppercase;justify-self:start;padding:0}.comfort-record .quiet-action.is-confirming{color:var(--tactile)}.lesson-stage:focus,.lesson-stage:focus-visible{outline:none}.teacher-transcript summary{min-height:44px;color:var(--signal-deep);font-family:var(--mono);font-size:var(--text-xs);letter-spacing:.06em;text-transform:uppercase;cursor:pointer;align-items:center;list-style:none;display:inline-flex}.teacher-transcript summary::-webkit-details-marker{display:none}.teacher-transcript summary:before{content:"▸";margin-right:var(--space-2)}.teacher-transcript[open] summary:before{content:"▾"}.teacher-transcript summary:focus-visible{outline:2px solid var(--signal-deep);outline-offset:3px}@media (max-width:760px){.perform-composition.is-practising .stage-heading p{display:none}.perform-composition.is-practising .stage-heading h1{font-size:var(--text-xl)}.perform-composition.is-practising .instrument-bed{padding:var(--space-3) 0 var(--space-2)}.perform-composition.is-practising .phrase-key{min-height:132px}.perform-composition.is-practising .sentence-rail{padding:var(--space-2) 0 var(--space-3)}.recall-bed{padding:var(--space-4) 0 var(--space-2)}.lesson-layout{padding-bottom:var(--keyboard-inset,0px)}}.story-copy mark{color:inherit;box-shadow:inset 0 -.14em rgba(var(--flowkeys-rgb-signal), .2);background:0 0;padding:0}.recall-instrument{margin-top:var(--space-5)}.recall-cue{justify-items:center;gap:var(--space-2);color:var(--chalk);text-align:center;grid-template-columns:minmax(0,1fr);display:grid}.recall-topline{padding:0 0 var(--space-3);justify-content:center;display:flex}.recall-task,.evidence-copy small{color:var(--tactile-light);font-family:var(--mono);font-size:var(--text-xs);letter-spacing:.09em;text-transform:uppercase}.recall-cue p{font-family:var(--display);font-size:var(--display-md);line-height:1.08}.recall-bed{margin-top:var(--space-4);padding:var(--space-5) 0 var(--space-2);justify-items:center;gap:var(--space-4);scroll-margin-bottom:calc(var(--keyboard-inset,0px) + 24px);display:grid;position:relative}.recall-bed>.turn-wait{z-index:2;width:min(620px,100%);position:relative}.recall-feedback{min-height:44px;margin-top:var(--space-2);justify-content:center;align-items:center;gap:var(--space-1) var(--space-3);color:var(--chalk-dim);text-align:center;flex-wrap:wrap;display:flex}.recall-feedback span{color:var(--tactile-light);font-family:var(--mono);font-size:var(--text-xs);line-height:1.5}.recall-feedback span:empty{display:none}.recall-feedback svg{width:22px;height:22px}.recall-feedback strong{color:var(--chalk);font-size:var(--text-sm);font-weight:500}.recall-action{margin-top:var(--space-4)}.evidence-copy small{margin-top:var(--space-2);padding:2px var(--space-3);color:var(--muted-ink);box-shadow:inset 0 0 0 1px color-mix(in srgb, currentColor 35%, transparent);border-radius:999px;display:inline-flex}.recall-situation{margin:0 0 var(--space-1);color:var(--chalk);font-size:var(--text-base);line-height:1.6}.recall-field{width:min(620px,100%)}.recall-cue.has-conversation{gap:var(--space-2)}.recall-cue.has-conversation .recall-situation,.recall-cue.has-conversation .conversation-speaker{font-family:var(--body);font-size:var(--text-base);color:var(--chalk);margin:0;line-height:1.5}.recall-cue.has-conversation .conversation-speaker{color:var(--tactile-light);font-weight:600}.conversation-question{max-width:28ch;font-family:var(--display);color:var(--chalk);margin:0;font-size:clamp(1.75rem,4vw,2.75rem);font-weight:600;line-height:1.15}.conversation-role{z-index:2;width:min(620px,100%);color:var(--chalk);font-size:var(--text-base);line-height:1.5;position:relative}.conversation-role p{margin:0}.conversation-role .conversation-instruction{margin-top:var(--space-3)}.recall-controls{z-index:2;justify-content:center;align-items:center;gap:var(--space-3);flex-wrap:wrap;display:flex;position:relative}.recall-model,.recall-nudge{z-index:2;width:min(620px,100%);padding:var(--space-3) var(--space-3);font-size:var(--text-base);background:rgba(var(--flowkeys-rgb-chalk), .07);border-radius:var(--space-3);box-shadow:inset 0 0 0 1px rgba(var(--flowkeys-rgb-chalk), .14);color:var(--chalk);margin:0;line-height:1.55;position:relative}.recall-model svg{vertical-align:-3px;width:16px;height:16px;margin-right:var(--space-1)}.recall-model strong{color:var(--tactile)}.recall-feedback span{font-family:var(--mono);font-size:var(--text-xs);letter-spacing:.06em;text-transform:uppercase}.evidence-board small[data-claim=untested]{color:var(--muted-ink);font-style:italic}.evidence-board small[data-claim=supported]{color:var(--color-tactile-copy-strong)}.evidence-board small[data-claim=independent]{color:var(--signal-deep)}.stage-heading>.return-kicker{min-height:28px;margin-bottom:var(--space-3);padding:0 var(--space-3);align-items:center;gap:var(--space-2);color:var(--tactile-light);background:rgba(var(--flowkeys-rgb-tactile), .12);font-family:var(--mono);font-size:var(--text-xs);letter-spacing:.12em;text-transform:uppercase;border-radius:999px;display:inline-flex}.return-kicker svg{width:15px;height:15px}.return-result{margin-top:var(--space-4);justify-items:center;gap:var(--space-1);text-align:center;display:grid}.return-result span{font-family:var(--mono);font-size:var(--text-xs);letter-spacing:.1em;text-transform:uppercase;color:var(--chalk-dim)}.return-result strong{font-family:var(--display);font-size:var(--display-md);font-weight:600;line-height:1.15}.return-result[data-support=independent] strong{color:var(--signal)}.return-defer{justify-content:center;display:flex}.onboarding-return{margin:var(--space-4) 0 0;padding:var(--space-3) var(--space-4);background:rgba(var(--flowkeys-rgb-signal), .12);border-left:3px solid var(--signal);color:var(--chalk);font-size:var(--text-base);line-height:1.6}.onboarding-return strong{color:var(--signal)}.evidence-warning{margin-top:var(--space-2);color:var(--tactile);font-family:var(--mono);font-size:var(--text-xs);line-height:1.5}.onboarding-shell{min-height:100vh;padding:var(--space-6) clamp(16px, 5vw, 72px);color:var(--chalk);background:radial-gradient(52rem 30rem at 50% 16rem, rgba(var(--flowkeys-rgb-signal), .15), transparent 70%), linear-gradient(rgba(var(--flowkeys-rgb-signal), .035) 1px, transparent 1px) 0 0 / 100% 32px, var(--night);place-items:start center;display:grid;overflow-x:clip}.onboarding-stage{width:min(680px,100%)}.onboarding-brand{align-items:center;gap:var(--space-2);font-family:var(--display);font-size:var(--text-lg);margin-bottom:clamp(34px,7vw,72px);display:inline-flex}.onboarding-brand>span{width:30px;height:30px;color:var(--night);background:var(--signal);place-items:center;font-weight:700;display:grid}.onboarding-kicker,.onboarding-lesson>span{color:var(--signal);font-family:var(--mono);font-size:var(--text-xs);letter-spacing:.12em;text-transform:uppercase;display:block}.onboarding-lead h1{max-width:760px;margin-top:var(--space-3);font-family:var(--display);font-size:var(--display-lg);letter-spacing:-.025em;font-weight:600;line-height:.92}.onboarding-lead header>p{max-width:620px;margin-top:var(--space-4);color:var(--chalk-dim);font-size:var(--text-base);line-height:1.6}.voice-choices{margin-top:var(--space-6);gap:var(--space-3);grid-template-columns:1fr 1fr;display:grid}.voice-choice,.saved-voice{min-height:112px;padding:var(--space-4);align-items:center;gap:var(--space-3);color:var(--chalk);text-align:left;background:rgba(var(--flowkeys-rgb-chalk), .045);border:1px solid rgba(var(--flowkeys-rgb-chalk), .13);grid-template-columns:46px minmax(0,1fr) auto;display:grid}.voice-choice.is-selected,.saved-voice{color:var(--ink);background:var(--signal-paper);border-color:var(--signal);box-shadow:0 7px 0 var(--color-signal-edge)}.voice-choice-mark{width:46px;height:46px;color:var(--night);background:var(--signal);border-radius:50%;place-items:center;display:grid}.voice-choice-mark svg{width:21px;height:21px}.voice-choice strong,.voice-choice small,.saved-voice strong,.saved-voice small{display:block}.voice-choice strong,.saved-voice strong{font-family:var(--display);font-size:var(--text-lg)}.voice-choice small,.saved-voice small{margin-top:var(--space-1);color:inherit;opacity:.68;font-size:var(--text-xs)}.voice-choice em{color:inherit;font-family:var(--mono);font-size:var(--text-xs);letter-spacing:.07em;text-transform:uppercase;font-style:normal}.saved-voice{margin-top:var(--space-6)}.saved-voice button{min-height:44px;padding:0 var(--space-3);color:var(--signal-deep);font-family:var(--mono);font-size:var(--text-xs);text-transform:uppercase;background:0 0}.onboarding-detail blockquote{margin:var(--space-5) 0 0;padding:var(--space-4) var(--space-4);color:var(--chalk-dim);background:rgba(var(--flowkeys-rgb-black), .14);border-left:3px solid var(--signal);font-size:var(--text-base);line-height:1.65}.onboarding-lesson{margin-top:var(--space-5);padding:var(--space-4) var(--space-4);background:rgba(var(--flowkeys-rgb-signal), .07)}.onboarding-lesson strong{margin-top:var(--space-2);font-family:var(--display);font-size:var(--text-xl);display:block}.onboarding-lesson p{margin-top:var(--space-2);color:var(--chalk-dim);font-size:var(--text-sm)}.onboarding-begin{width:100%;margin-top:var(--space-5);background:var(--signal);color:var(--night)}.onboarding-aside{margin-top:var(--space-4);align-items:center;gap:var(--space-3);flex-wrap:wrap;display:flex}.onboarding-aside .saved-voice,.onboarding-aside .voice-choices{flex:320px;min-height:0;margin-top:0}.onboarding-aside .saved-voice{min-height:72px;padding:var(--space-3) var(--space-4);box-shadow:0 5px 0 var(--color-signal-edge)}.onboarding-aside .procedural-help{flex:none}.onboarding-aside .help-control{color:var(--signal)}.onboarding-detail{margin-top:var(--space-5);border-top:1px solid rgba(var(--flowkeys-rgb-chalk), .14)}.onboarding-detail>summary{align-items:center;gap:var(--space-2);min-height:44px;color:var(--signal);font-family:var(--mono);font-size:var(--text-sm);letter-spacing:.06em;text-transform:uppercase;cursor:pointer;display:flex}.onboarding-detail-body{padding-bottom:var(--space-4);gap:var(--space-3);display:grid}.onboarding-detail .onboarding-lesson{margin-top:0}.onboarding-detail blockquote{margin-top:var(--space-3)}.teacher-playback-state{margin-top:var(--space-2);color:var(--muted-ink);font-family:var(--mono);font-size:var(--text-xs);letter-spacing:.06em;text-transform:uppercase}.handoff-escape{margin-top:var(--space-3);align-items:center;gap:var(--space-2);min-height:44px;color:var(--signal-deep);font-family:var(--mono);font-size:var(--text-xs);letter-spacing:.06em;text-transform:uppercase;cursor:pointer;background:0 0;border:0;padding:0;display:inline-flex}.handoff-escape svg{width:15px;height:15px}.handoff-escape:hover,.handoff-escape:focus-visible{text-decoration:underline}.teacher-console[data-status=playing] .voice-score i{animation:.7s ease-in-out infinite alternate voice-live;animation-delay:calc(var(--voice-height) * -11ms)}.comfort-voice-choice{margin-top:var(--space-3);gap:var(--space-1);grid-template-columns:1fr 1fr;display:grid}.comfort-voice-choice button{min-height:44px;color:var(--chalk-dim);background:rgba(var(--flowkeys-rgb-chalk), .05);border:1px solid rgba(var(--flowkeys-rgb-chalk), .13);font-family:var(--mono);font-size:var(--text-xs)}.comfort-voice-choice button.is-active{color:var(--night);background:var(--signal);border-color:var(--signal)}.instrument[data-input-ready=false] .phrase-key{filter:saturate(.55)brightness(.82);cursor:wait}@keyframes voice-live{to{transform:scaleY(.36)}}@media (max-width:680px){.onboarding-shell{padding:var(--space-4) var(--space-4) 0}.onboarding-brand{margin-bottom:var(--space-7)}.voice-choices{grid-template-columns:1fr}.voice-choice,.saved-voice{grid-template-columns:42px minmax(0,1fr);min-height:96px}.voice-choice em,.saved-voice button{grid-column:2;justify-self:start}}@media (prefers-reduced-motion:reduce){.teacher-console[data-status=playing] .voice-score i{animation:none}}.onboarding-brand-row{justify-content:space-between;align-items:center;gap:var(--space-4);margin-bottom:clamp(34px,7vw,72px);display:flex}.onboarding-brand-row .onboarding-brand{margin-bottom:0}.guided-composition{max-width:840px;margin-inline:auto}.guided-composition .stage-heading{margin-bottom:var(--space-5)}.guided-composition .stage-heading h1{font-size:var(--display-md)}.guided-composition .stage-heading p{max-width:60ch}.example-focus{background:var(--signal-paper);color:var(--ink);padding:var(--space-5) var(--space-6)}.example-context{align-items:center;gap:var(--space-3);font-size:var(--text-sm);display:flex}.example-context>svg{width:30px;height:30px;color:var(--signal-deep);flex:none}.example-count{white-space:nowrap;font-size:var(--text-sm);color:var(--muted-ink);margin-left:auto}.example-focus h1{margin:var(--space-5) 0 var(--space-2);font-family:var(--body);font-size:var(--text-md);font-weight:600;line-height:1.35}.example-sentence{font-size:var(--display-lg);font-weight:500;line-height:1.25}.example-sentence strong{color:var(--signal-deep);text-underline-offset:.12em;text-decoration:underline}.example-caption{margin-top:var(--space-4)}.example-meaning{font-size:var(--text-base);line-height:1.6}.example-connection{margin-top:var(--space-2);font-size:var(--text-sm);color:var(--muted-ink)}.guided-composition .teacher-console{margin-top:var(--space-4);padding:var(--space-4) var(--space-5)}.guided-composition .teacher-script{font-size:var(--text-base);max-width:70ch;line-height:1.65}.guided-composition .voice-score{display:none}.guided-composition .teacher-playback-state{font-size:var(--text-xs)}.guided-action{align-items:center;gap:var(--space-4);z-index:3;padding:var(--space-4) 0;background:var(--wood);flex-direction:row;display:flex;position:sticky;bottom:0}.mode-attention .guided-action{background:var(--signal-paper)}.mode-attention .guided-action .quiet-action{color:var(--ink)}.mode-tactile .help-control{color:var(--tactile-light);border-color:var(--tactile-light)}.teacher-console.is-compact .voice-score{display:none}.teacher-console.is-compact .teacher-playback-state{margin-top:var(--space-2)}.guided-action .quiet-action{align-items:center;gap:var(--space-1);min-height:44px;display:inline-flex}.guided-action p{text-align:right;font-size:var(--text-sm);flex:1}.guided-action button:disabled{opacity:.45}.notice-guided .meaning-check{margin-top:0}.meaning-check-burst{vertical-align:baseline;width:0;height:0;display:inline-block;position:relative}.notice-guided .meaning-check-options button{min-height:90px}.notice-guided .meaning-check-feedback{min-height:2.8em}.typing-demo{justify-content:center;align-items:center;gap:var(--space-2) var(--space-4);width:-moz-fit-content;width:fit-content;max-width:100%;padding:var(--space-2) var(--space-3) var(--space-2) var(--space-5);margin:var(--space-4) auto 0;color:var(--chalk-dim);background:rgba(var(--flowkeys-rgb-chalk), .05);font-size:var(--text-sm);border-radius:999px;flex-wrap:wrap;display:flex}.typing-demo>div,.typing-demo>div>span{align-items:center;gap:var(--space-2);display:flex}.typing-demo samp{color:var(--chalk);font-family:var(--body);font-size:var(--text-md)}.typing-demo kbd{border:1px solid var(--tactile-deep);background:var(--wood-soft);min-width:28px;min-height:32px;color:var(--tactile-light);font:16px var(--body);box-shadow:0 3px 5px rgba(var(--flowkeys-rgb-black), .333333);border-radius:5px;justify-content:center;align-items:center;display:inline-flex}.punctuation-cue{justify-content:space-between;align-items:center;gap:var(--space-4);margin:var(--space-3) 0 0;color:var(--tactile-light);font-size:var(--text-base);display:flex}.punctuation-cue button{background:var(--tactile-light);min-width:76px;min-height:48px;color:var(--wood);font:600 24px var(--body);box-shadow:0 5px 12px rgba(var(--flowkeys-rgb-black), .333333);border-radius:7px}.punctuation-cue small{font:11px var(--body);display:block}.instrument-bed>.punctuation-cue{z-index:1;width:min(760px,100%);position:relative}.capture-label{font-family:var(--body)}.lesson-choices{margin-top:var(--space-4);gap:var(--space-2);justify-items:start;display:grid}.lesson-choices-options{gap:var(--space-3);flex-wrap:wrap;display:flex}.lesson-choices button{color:var(--signal);font-size:var(--text-sm);padding-left:0}.lesson-choices button[aria-current]{opacity:1;color:var(--chalk-dim);text-underline-offset:.25em;text-decoration:underline}.story-composition .teacher-script{max-width:70ch}@media (max-width:760px){.guided-composition .stage-heading{margin-bottom:var(--space-4)}.guided-composition .stage-heading h1{font-size:var(--display-md)}.example-focus{padding:var(--space-4)}.example-context{gap:var(--space-2);flex-wrap:wrap}.example-context p{flex:1}.example-count{width:100%;margin-left:var(--space-6)}.example-focus h1{margin-top:var(--space-4)}.example-caption{margin-top:var(--space-3)}.guided-composition .teacher-console{padding:var(--space-4)}.guided-composition .teacher-identity>div>span{display:none}.guided-action{gap:var(--space-2);flex-flow:row}.guided-action .quiet-action{width:auto}.guided-action p{display:none}.guided-action .primary-action{width:auto;min-width:156px;margin-left:auto}.notice-guided .meaning-check-options{gap:var(--space-2);grid-template-columns:1fr}.notice-guided .meaning-check-options button{text-align:left;min-height:60px}.notice-guided .guided-action{position:static}.typing-demo{gap:var(--space-2);width:100%;padding:var(--space-3) var(--space-4);border-radius:var(--radius-surface)}.typing-demo>div{justify-content:space-between;width:100%}.punctuation-cue{font-size:var(--text-sm)}}.anchor-token{color:var(--signal-deep);text-underline-offset:.16em;background:0 0;font-weight:600;text-decoration:underline;text-decoration-thickness:.08em}.mode-tactile .anchor-token,.instrument .anchor-token,.recall-instrument .anchor-token{color:var(--tactile-light)}.contrast-token{color:var(--signal-deep);font-style:normal;font-weight:700}.meaning-emoji{margin-top:var(--space-3);font-size:var(--display-md);-webkit-user-select:none;user-select:none;align-items:center;gap:.35em;line-height:1;display:inline-flex}.meaning-emoji i{font-style:normal}.meaning-emoji i:nth-child(2){opacity:.65;font-size:.6em}.meaning-emoji.is-option{margin:0 0 var(--space-1);font-size:var(--text-xl)}.meaning-emoji.is-rail{margin:0 0 var(--space-1);font-size:var(--text-md)}.meaning-emoji.is-record{margin:0 var(--space-1) 0 0;font-size:var(--text-base);vertical-align:-2px}.notice-guided .meaning-check-options button{min-height:90px;padding:var(--space-3) var(--space-4);background:var(--wood-soft);color:var(--chalk);box-shadow:0 5px 0 var(--key-side,var(--color-key-side)), 0 12px 22px rgba(var(--flowkeys-rgb-black), .4), inset 0 1px 0 rgba(var(--flowkeys-rgb-white), .14);transition:transform .12s var(--ease-out), box-shadow .12s var(--ease-out);cursor:pointer;border:0;border-radius:8px;align-content:start;transform:translateY(0)}.notice-guided .meaning-check-options button small{color:var(--tactile-light)}.notice-guided .meaning-check-options button:hover:not(:disabled),.notice-guided .meaning-check-options button:focus-visible{box-shadow:0 7px 0 var(--key-side,var(--color-key-side)), 0 16px 28px rgba(var(--flowkeys-rgb-black), .45), inset 0 1px 0 rgba(var(--flowkeys-rgb-white), .2);transform:translateY(-2px)}.notice-guided .meaning-check-options button:active:not(:disabled){box-shadow:0 1px 0 var(--key-side,var(--color-key-side)), 0 4px 10px rgba(var(--flowkeys-rgb-black), .4);transform:translateY(4px)}.notice-guided .meaning-check-options button.is-chosen{background:var(--tactile-light);color:var(--color-choice-ink)}.notice-guided .meaning-check-options button.is-chosen small{color:var(--color-choice-ink-muted)}.notice-guided .meaning-check-options button.is-chosen .anchor-token{color:var(--color-choice-ink)}.notice-guided .meaning-check-options button:disabled:not(.is-chosen){opacity:.5;box-shadow:inset 0 0 0 1px rgba(var(--flowkeys-rgb-chalk), .18);transform:none}.recall-situation{color:var(--chalk)}.recall-task{color:var(--tactile-light);opacity:1}.recall-cue p:last-child{color:var(--chalk);font-weight:500}.lesson-stage .recall-cue,.lesson-stage .example-focus,.lesson-stage .meaning-check{filter:none}.help-control{min-width:44px;min-height:44px;color:inherit;opacity:1;font-family:var(--body);font-size:var(--text-base);letter-spacing:0;text-transform:none;cursor:pointer;transition:opacity .14s var(--ease-out), background-color .14s var(--ease-out);background:0 0;border:1px solid;border-radius:999px;justify-content:center;align-items:center;padding:0;font-weight:600;display:inline-flex}.help-control:hover,.help-control:focus-visible,.procedural-help.is-open .help-control{opacity:1;background:color-mix(in srgb, currentColor 12%, transparent)}.mode-attention .help-control{color:var(--signal-ink)}.mode-tactile .help-control{color:var(--tactile-light)}.help-text{z-index:30;width:min(360px,100vw - 32px);padding:var(--space-4) var(--space-4);gap:var(--space-2);background:var(--night-soft);color:var(--chalk);font-family:var(--body);font-size:var(--text-base);text-transform:none;letter-spacing:0;box-shadow:0 18px 45px rgba(var(--flowkeys-rgb-black), .4), 0 0 0 1px rgba(var(--flowkeys-rgb-chalk), .16);margin:0;line-height:1.6;display:grid;position:absolute;top:calc(100% + 8px);right:0}.help-text p{margin:0}.help-action{color:var(--chalk)}.help-lens{padding-top:var(--space-2);border-top:1px solid rgba(var(--flowkeys-rgb-chalk), .16);color:var(--chalk-dim)}.help-text .anchor-token{color:var(--signal)}.help-text .contrast-token{color:var(--tactile-light)}.concept-line{margin:0}.concept-parts{flex-wrap:wrap;align-items:flex-end;gap:.1em .34em;display:flex}.concept-part{animation:concept-arrive .46s var(--ease-emphasis) both;animation-delay:var(--delay,0s);justify-items:center;gap:.06em;display:grid}@keyframes concept-arrive{0%{opacity:0;transform:translateY(10px)scale(.72)}to{opacity:1;transform:none}}@media (prefers-reduced-motion:reduce){.concept-part{animation:none}}[data-handoff=handing] .teacher-console{animation:handoff-recede .32s var(--ease-out) .12s both}[data-handoff=handing] .instrument-bed,[data-handoff=handing] .recall-bed{animation:handoff-arrive .38s var(--ease-out) .28s both}@keyframes handoff-recede{0%{opacity:1;transform:none}to{opacity:.62;transform:scale(.988)}}@keyframes handoff-arrive{0%{opacity:.72;transform:translateY(10px)}to{opacity:1;transform:none}}.voice-countdown{margin-top:var(--space-3);align-items:center;gap:var(--space-2);display:flex}.voice-countdown-track{background:rgba(var(--flowkeys-rgb-ink), .16);flex:1;height:2px;overflow:hidden}.voice-countdown-track i{transform-origin:0;background:var(--signal-deep);height:100%;transition:transform .26s linear;display:block}.voice-countdown-label{color:var(--muted-ink);font-family:var(--mono);font-size:var(--text-xs);letter-spacing:.08em;text-transform:uppercase;white-space:nowrap;font-variant-numeric:tabular-nums}.mode-tactile .voice-countdown-track{background:rgba(var(--flowkeys-rgb-chalk), .16)}.mode-tactile .voice-countdown-track i{background:var(--tactile)}.mode-tactile .voice-countdown-label{color:var(--chalk-dim)}.onboarding-scope{margin-top:var(--space-2);color:var(--chalk-dim);font-size:var(--text-sm);line-height:1.65}@media (prefers-reduced-motion:reduce){[data-handoff] .teacher-console,[data-handoff] .instrument-bed,[data-handoff] .recall-bed{animation:none}.voice-countdown-track i{transition:none}}.app-shell{--ghost-ink:var(--muted-ink);--ghost-rule:rgba(var(--flowkeys-rgb-ink), .13);--ghost-strong:var(--ink)}.mode-tactile{--ghost-ink:color-mix(in srgb, var(--chalk) 62%, var(--wood));--ghost-rule:rgba(var(--flowkeys-rgb-chalk), .15);--ghost-strong:var(--chalk)}.teacher-console,.mode-tactile .teacher-console,.guided-composition .teacher-console{padding:var(--space-4) 0 0;border-top:1px solid var(--ghost-rule);box-shadow:none;color:var(--ghost-ink);transition:color .2s var(--ease-out);background:0 0}.guided-composition .teacher-console,.story-composition .teacher-console{margin-top:var(--space-5)}.teacher-console:hover,.teacher-console:focus-within,.teacher-console[data-status=playing]{color:var(--ghost-strong)}.teacher-console .teacher-identity{gap:var(--space-2)}.teacher-console .teacher-mark{width:26px;height:26px;color:inherit;line-height:1;font-family:var(--mono);letter-spacing:.04em;opacity:.7;background:0 0;place-items:center;font-size:10px;font-weight:500;display:grid;box-shadow:inset 0 0 0 1px}.teacher-console .teacher-identity strong{font-family:var(--mono);font-size:var(--text-xs);letter-spacing:.09em;text-transform:uppercase;color:inherit;font-weight:500}.teacher-console .teacher-identity div>span{color:inherit;opacity:.72}.teacher-console .listen-control{padding:var(--space-1) var(--space-2) var(--space-1) var(--space-1);color:inherit;box-shadow:none}.teacher-console .listen-icon{width:26px;height:26px;color:inherit;background:0 0;border-radius:50%;box-shadow:inset 0 0 0 1px}.teacher-console .listen-control:hover:not(:disabled),.teacher-console .listen-control:focus-visible{color:var(--ghost-strong);text-underline-offset:.3em;text-decoration:underline}.teacher-console .teacher-script,.guided-composition .teacher-script{margin-top:var(--space-3);color:inherit;font-size:var(--text-base);max-width:70ch;line-height:1.7}.teacher-console .teacher-playback-state{color:inherit;opacity:.62}.translation-switch{--switch-ink:var(--spanish-ink);--switch-on-ink:var(--signal-paper);--switch-tint:color-mix(in srgb, var(--switch-ink) 12%, transparent);min-height:48px;margin-top:var(--space-3);padding:0 var(--space-3) 0 var(--space-2);color:var(--switch-ink);background:var(--switch-tint);font:inherit;transition:background-color .16s var(--ease-out);border:0;border-radius:999px;align-items:center;gap:2px;text-decoration:none;display:inline-flex}.translation-switch:hover{--switch-tint:color-mix(in srgb, var(--switch-ink) 20%, transparent)}.translation-switch>svg:first-child{box-sizing:border-box;background:color-mix(in srgb, currentColor 16%, transparent);border-radius:50%;flex:none;width:32px;height:32px;padding:7px}.translation-switch>svg:last-child{flex:none;width:22px;height:22px}.translation-switch.is-translated>svg:first-child{color:var(--switch-on-ink);background:var(--switch-ink)}.mode-tactile .translation-switch{--switch-on-ink:var(--wood)}.translation-switch:focus-visible{outline-offset:4px;outline:2px solid}.teacher-console .teacher-script.is-translated{color:var(--ghost-strong);white-space:pre-line}.interface-language{z-index:50;position:relative}.interface-language-control{min-height:46px;padding:var(--space-1) var(--space-2);color:color-mix(in srgb, var(--chalk) 72%, var(--night-soft));border:1px solid rgba(var(--flowkeys-rgb-chalk), .18);text-align:left;transition:color .16s var(--ease-out), background .16s var(--ease-out), border-color .16s var(--ease-out);background:0 0;border-radius:999px;align-items:center;gap:6px;display:inline-flex}.interface-language-control:hover,.interface-language-control:focus-visible,.interface-language.is-confirming .interface-language-control{color:var(--signal);background:rgba(var(--flowkeys-rgb-signal), .16);border-color:rgba(var(--flowkeys-rgb-signal), .46)}.interface-language-control:focus-visible,.word-gloss>button:focus-visible{outline-offset:3px;outline:2px solid}.interface-language-control>svg{flex:none;width:18px;height:18px}.interface-language-control>span{gap:1px;display:grid}.interface-language-control small{color:inherit;font-family:var(--mono);letter-spacing:.08em;text-transform:uppercase;opacity:.72;font-size:10px;font-weight:500;line-height:1.2}.interface-language-dialog{top:calc(100% + var(--space-2));width:min(340px,100vw - 24px);padding:var(--space-4);gap:var(--space-2);color:var(--chalk);background:var(--night-soft);border:1px solid rgba(var(--flowkeys-rgb-chalk), .16);box-shadow:0 18px 40px -18px rgba(var(--flowkeys-rgb-black), .72);border-radius:14px;display:grid;position:absolute;right:0}.interface-language-dialog:before{content:"";background:var(--night-soft);border-top:1px solid rgba(var(--flowkeys-rgb-chalk), .16);border-left:1px solid rgba(var(--flowkeys-rgb-chalk), .16);width:9px;height:9px;position:absolute;top:-5px;right:26px;transform:rotate(45deg)}.interface-language-dialog>strong{font-family:var(--display);font-size:var(--text-lg);line-height:1.15}.interface-language-dialog>p{color:var(--chalk-dim);font-size:var(--text-sm);line-height:1.55}.interface-language-dialog>p[lang=es]{padding-top:var(--space-2);border-top:1px solid rgba(var(--flowkeys-rgb-chalk), .12)}.interface-language-dialog-actions{margin-top:var(--space-2);align-items:center;gap:var(--space-2);flex-wrap:wrap;display:flex}.interface-language-dialog-actions .primary-action,.interface-language-dialog-actions .quiet-action{min-height:44px;font-size:var(--text-sm)}.word-gloss{display:inline;position:relative}.word-gloss>button{color:inherit;font:inherit;line-height:inherit;background:0 0;border:0;border-bottom:1px dotted;padding:0;display:inline}.word-gloss-popover{z-index:45;width:max-content;max-width:min(260px,100vw - 32px);padding:var(--space-2) var(--space-3);color:var(--chalk);background:var(--night-soft);box-shadow:0 12px 30px rgba(var(--flowkeys-rgb-black), .34), 0 0 0 1px rgba(var(--flowkeys-rgb-chalk), .16);font-family:var(--body);font-size:var(--text-sm);visibility:hidden;opacity:0;pointer-events:none;gap:2px;line-height:1.4;display:grid;position:absolute;bottom:calc(100% + 9px);left:50%;transform:translate(-50%)}.word-gloss-popover strong{color:var(--signal);font-family:var(--mono);font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.08em}.word-gloss.is-open .word-gloss-popover{visibility:visible;opacity:1}.onboarding-promise .translatable-passage-copy>p{max-width:620px;margin-top:var(--space-4);color:var(--chalk-dim);font-size:var(--text-base);line-height:1.6}@media (max-width:680px){.interface-language-control{min-width:0;padding-inline:var(--space-2)}.interface-language-dialog{position:fixed;top:78px;right:12px}.interface-language-dialog:before{display:none}.onboarding-brand-row{gap:var(--space-2)}.onboarding-brand-row .onboarding-lessons{justify-content:center;width:44px;padding:0;font-size:0}.word-gloss-popover{left:var(--space-4);right:var(--space-4);bottom:var(--space-4);width:auto;max-width:none;position:fixed;transform:none}}.teacher-console .teacher-transcript summary,.teacher-console .handoff-escape{color:inherit}:is(.instrument,.recall-instrument) .handoff-escape{color:var(--ghost-ink)}.teacher-console .teacher-transcript summary:hover,.teacher-console .handoff-escape:hover,.teacher-console .handoff-escape:focus-visible,:is(.instrument,.recall-instrument) .handoff-escape:hover,:is(.instrument,.recall-instrument) .handoff-escape:focus-visible{color:var(--ghost-strong)}.example-focus{background:linear-gradient(180deg, var(--color-story-paper-top) 0%, var(--signal-white) 58%, var(--color-story-paper-bottom) 100%);box-shadow:inset 0 1px 0 rgba(var(--flowkeys-rgb-white), .9), 0 0 0 1px rgba(var(--flowkeys-rgb-ink), .06), 0 20px 44px -22px rgba(var(--flowkeys-rgb-ink), .34);border-radius:clamp(20px,2.4vw,30px);padding:clamp(20px,2.6vw,32px) clamp(24px,4vw,56px) clamp(24px,2.8vw,36px)}.example-context{padding-bottom:var(--space-3);border-bottom:1px solid rgba(var(--flowkeys-rgb-ink), .08);color:var(--muted-ink)}.example-focus h1{margin:clamp(20px, 2.6vw, 32px) auto var(--space-4);text-align:center;color:var(--muted-ink)}.example-caption{text-align:center;margin-top:clamp(20px,2.6vw,30px)}.example-caption .example-meaning{max-width:46ch;margin-inline:auto}.example-sentence{text-align:center;font-weight:600}.listen-guided .concept-parts{justify-content:center}.concept-parts{gap:.16em .3em}.concept-part{gap:.12em}.concept-word{line-height:1.04}.concept-picture{font-size:.44em;line-height:1.15}@media (max-width:760px){.example-focus{padding:var(--space-4) var(--space-4) var(--space-5);border-radius:18px}.example-focus h1{margin-top:var(--space-4)}.example-count{margin-left:calc(30px + var(--space-3))}}.notice-guided .meaning-check{gap:var(--space-3);border-left-width:4px;border-radius:clamp(18px,2.2vw,26px);padding:clamp(18px,2.4vw,28px) clamp(20px,3vw,36px) clamp(20px,2.6vw,30px)}.notice-guided .meaning-check-options{margin-top:var(--space-2)}@media (max-width:760px){.notice-guided .meaning-check{padding:var(--space-4);border-radius:16px}}.concept-reveal{padding-block:var(--space-3) var(--space-5)}.reveal-heading{text-align:center;margin-bottom:var(--space-5)}.reveal-heading h1{color:var(--chalk);font:600 var(--display-md)/1.15 var(--display);text-wrap:balance}.reveal-heading p{margin-top:var(--space-3);color:var(--chalk-dim);font-size:var(--text-md);line-height:1.5}.reveal-instrument{padding:var(--space-6);background:var(--wood-soft);border:1px solid var(--color-reveal-border);border-radius:var(--space-4);box-shadow:0 8px 0 var(--shadow), inset 0 1px 0 var(--color-reveal-inset)}.reveal-parts{align-items:center;gap:var(--space-5);margin-bottom:var(--space-6);grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);display:grid}.reveal-part{justify-items:center;gap:var(--space-3);text-align:center;min-width:0;color:var(--chalk);font:500 var(--text-3xl)/1.1 var(--display);overflow-wrap:anywhere;display:grid}[data-concept-reveal=pending] .reveal-part:first-of-type{--arrive-at:0s}[data-concept-reveal=pending] .reveal-part:last-of-type{--arrive-at:.3s}[data-concept-reveal=pending] .reveal-word-key{--arrive-at:.6s}[data-concept-reveal=pending] .reveal-entry{--arrive-at:.9s}[data-concept-reveal=pending] .reveal-part,[data-concept-reveal=pending] .reveal-word-key,[data-concept-reveal=pending] .reveal-entry{animation:reveal-arrive .46s var(--ease-emphasis) both;animation-delay:var(--arrive-at,0s)}@keyframes reveal-arrive{0%{opacity:0;transform:translateY(16px)scale(.86)}to{opacity:1;transform:none}}[data-concept-reveal=pending] .reveal-word-key{animation-name:reveal-arrive-key}@keyframes reveal-arrive-key{0%{opacity:0;transform:translateY(18px)scale(.8)}to{opacity:1;transform:translateY(-3px)}}.reveal-picture{font:var(--text-3xl)/1.2 var(--body)}.reveal-word-key{min-width:88px;min-height:88px;padding:var(--space-3) var(--space-5);border-radius:var(--space-3);background:linear-gradient(155deg, var(--color-reveal-key-top), var(--tactile-light));color:var(--color-reveal-key-ink);border:1px solid var(--color-reveal-key-border);box-shadow:0 7px 0 var(--color-reveal-key-edge), 0 12px 16px rgba(var(--flowkeys-rgb-shadow), .4), inset 0 1px 0 var(--color-reveal-key-highlight);font:600 var(--text-3xl)/1 var(--display);transition:transform .16s var(--ease-out);touch-action:manipulation;place-items:center;display:grid;transform:translateY(-3px)}.reveal-word-key:active{transform:translateY(3px)scale(.96)}@media (hover:hover) and (pointer:fine){.reveal-word-key:hover{transform:translateY(-5px)}.reveal-word-key:active{transform:translateY(3px)scale(.96)}}.reveal-entry{width:min(100%,280px);margin-inline:auto}.reveal-label{align-items:center;gap:var(--space-2);margin-bottom:var(--space-2);color:var(--chalk);font-size:var(--text-md);line-height:1.5;display:flex}.reveal-label svg{width:22px;height:22px}.reveal-input{width:100%;min-height:56px;padding:var(--space-3) var(--space-4);background:var(--color-reveal-field);color:var(--chalk);border:1px solid var(--color-reveal-field-border);border-radius:var(--space-2);font:500 var(--text-lg)/1.4 var(--mono);caret-color:var(--tactile-light);box-shadow:inset 0 2px 4px rgba(var(--flowkeys-rgb-black), .4)}.reveal-input::placeholder{color:var(--color-reveal-placeholder);opacity:1;font:400 var(--text-md)/1.4 var(--body)}.concept-reveal .procedural-help{margin-top:var(--space-4)}.concept-reveal .help-control{min-height:44px;padding:var(--space-2) var(--space-3);color:var(--tactile-light);opacity:1;font-size:var(--text-base);margin-inline:auto}.concept-reveal .help-text{color:var(--chalk);font-size:var(--text-base);line-height:1.65}.reveal-word-key{position:relative}.concept-reveal.is-connecting .reveal-word-key{animation:key-seat .76s var(--ease-emphasis) both}.concept-reveal.is-connecting .reveal-part:first-of-type{animation:connect-close .62s var(--ease-out) .2s both;--close-from:0;--close-to:14px}.concept-reveal.is-connecting .reveal-part:last-of-type{animation:connect-close .62s var(--ease-out) .2s both;--close-from:0;--close-to:-14px}.concept-reveal.is-connecting .reveal-heading,.concept-reveal.is-connecting .reveal-entry,.concept-reveal.is-connecting .procedural-help{animation:connect-retire .32s var(--ease-out) .16s both}.concept-reveal.is-connecting .reveal-instrument{animation:connect-bare .36s var(--ease-out) .56s both}@keyframes key-seat{0%{transform:translateY(-3px)}14%{transform:translateY(6px)scale(.94)}46%{transform:translateY(-10px)scale(1.08)}72%{transform:translateY(1px)scale(.99)}to{box-shadow:0 0 0 var(--color-reveal-key-edge), 0 0 0 rgba(var(--flowkeys-rgb-shadow), 0);transform:translateY(0)scale(1)}}@keyframes connect-close{0%{transform:translateX(var(--close-from,0))}to{transform:translateX(var(--close-to,0))}}@keyframes connect-retire{0%{opacity:1;transform:none}to{opacity:0;transform:translateY(6px)}}@keyframes connect-bare{0%{background-color:var(--wood-soft);border-color:var(--color-reveal-border);box-shadow:0 8px 0 var(--shadow), inset 0 1px 0 var(--color-reveal-inset)}to{background-color:#0000;border-color:#0000;box-shadow:0 0 #0000,inset 0 0 #0000}}.concept-reveal.is-connecting .reveal-word-key,.concept-reveal.is-connecting .reveal-input{pointer-events:none}.concept-line.is-connected .concept-part{animation:connection-settle .44s var(--ease-out) both;animation-delay:0s;position:relative}.concept-line.is-connected .is-subject{--connect-from:-10px}.concept-line.is-connected .is-complement{--connect-from:10px}.concept-line.is-connected .is-anchor{animation:connection-bounce .56s var(--ease-out) both}@keyframes connection-settle{0%{transform:translateX(var(--connect-from,0))}to{transform:translate(0)}}@keyframes connection-bounce{0%{transform:translateY(4px)scale(.9)}38%{transform:translateY(-6px)scale(1.09)}66%{transform:translateY(2px)scale(.98)}to{transform:translateY(0)scale(1)}}.completion-burst{pointer-events:none;-webkit-user-select:none;user-select:none;z-index:3;--burst-reach:112px;--burst-scale:1.15;width:0;height:0;position:absolute;top:0;left:50%}.completion-burst.is-large{--burst-reach:186px;--burst-scale:1.9}.completion-spark{width:calc(5px * var(--burst-scale));height:calc(12px * var(--burst-scale));background:var(--spark-color);box-shadow:0 0 calc(10px * var(--burst-scale)) color-mix(in srgb, var(--spark-color) 62%, transparent);animation:.76s cubic-bezier(.12,.72,.3,1) both completion-spark;animation-delay:calc(var(--spark-order) * 7ms);border-radius:999px;position:absolute}.spark-0{--spark-color:var(--color-spark-green)}.spark-1{--spark-color:var(--color-spark-blue)}.spark-2{--spark-color:var(--color-spark-violet)}.completion-ring{width:calc(30px * var(--burst-scale));height:calc(30px * var(--burst-scale));margin:calc(-15px * var(--burst-scale)) 0 0 calc(-15px * var(--burst-scale));border:2px solid var(--color-signal);animation:completion-ring .52s var(--ease-out) both;border-radius:50%;position:absolute;top:0;left:0}@keyframes completion-spark{0%{opacity:0;transform:translate(-50%, -50%) rotate(var(--spark-turn)) scale(.35)}12%{opacity:1}68%{opacity:1}to{opacity:0;transform:translate(calc(var(--spark-x) * var(--burst-reach) - 50%), calc(var(--spark-y) * var(--burst-reach) - 50%)) rotate(var(--spark-turn)) scale(.55)}}@keyframes completion-ring{0%{opacity:.7;transform:scale(.25)}to{opacity:0;transform:scale(2.1)}}.complete-mark{width:max-content;position:relative}.complete-mark>svg{animation:connection-bounce .56s var(--ease-out) both}@media (max-width:600px){.completion-burst{--burst-reach:84px;--burst-scale:1}.completion-burst.is-large{--burst-reach:118px;--burst-scale:1.35}.reveal-instrument{padding:var(--space-5) var(--space-4)}.reveal-parts{gap:var(--space-3);margin-bottom:var(--space-5)}.reveal-part{font-size:var(--text-xl)}.reveal-picture{font-size:var(--text-2xl)}.reveal-word-key{min-width:64px;min-height:68px;padding-inline:var(--space-4);font-size:var(--text-2xl)}.reveal-heading{margin-bottom:var(--space-4)}}@media (prefers-reduced-motion:reduce){.completion-burst{display:none}[data-concept-reveal=pending] .reveal-part,[data-concept-reveal=pending] .reveal-word-key,[data-concept-reveal=pending] .reveal-entry,.concept-reveal.is-connecting .reveal-word-key,.concept-reveal.is-connecting .reveal-part,.concept-reveal.is-connecting .reveal-heading,.concept-reveal.is-connecting .reveal-entry,.concept-reveal.is-connecting .reveal-instrument,.concept-reveal.is-connecting .procedural-help{animation:none}.concept-line.is-connected .concept-part,.complete-mark>svg{animation:none;transform:none}.reveal-word-key{transition:none;transform:none}.reveal-word-key:hover,.reveal-word-key:active{transform:none}}.teaching-progress{margin-top:var(--space-3);color:var(--chalk-dim);font-size:var(--text-sm);line-height:1.6}.teaching-exchange{margin-block:var(--space-4);line-height:1.6}.teaching-speakers{color:var(--muted-ink);font-size:var(--text-sm);font-weight:600}.teaching-prompt{margin-top:var(--space-2);color:var(--ink);font-size:var(--text-base)}.lesson-hub{min-height:100vh;color:var(--chalk);background:radial-gradient(circle at 82% 8%, rgba(var(--flowkeys-rgb-signal), .12), transparent 28%), linear-gradient(rgba(var(--flowkeys-rgb-signal), .03) 1px, transparent 1px) 0 0 / 100% 32px, var(--night)}.lesson-hub[hidden]{display:none}.hub-topbar{min-height:72px;padding:0 var(--space-6);align-items:center;gap:var(--space-5);border-bottom:1px solid rgba(var(--flowkeys-rgb-chalk), .1);grid-template-columns:1fr auto 1fr;display:grid}.hub-context,.hub-tools,.hub-truth,.key-topline,.key-action,.set-label,.section-heading-row{align-items:center;display:flex}.hub-context{min-height:36px;padding:0 var(--space-4) 0 var(--space-3);gap:var(--space-2);color:var(--chalk-dim);background:rgba(var(--flowkeys-rgb-signal), .06);box-shadow:inset 0 0 0 1px rgba(var(--flowkeys-rgb-signal), .16);font-family:var(--mono);font-size:var(--text-xs);letter-spacing:.08em;text-transform:uppercase;border-radius:999px}.hub-context svg{width:17px;height:17px;color:var(--signal)}.hub-tools{justify-self:end;gap:var(--space-2)}.hub-tools .quiet-action,.hub-tools .help-control{min-height:44px;color:var(--utility-ink);border:1px solid var(--utility-line);transition:color .16s var(--ease-out), background-color .16s var(--ease-out), border-color .16s var(--ease-out);background:0 0}.hub-tools .quiet-action{padding:0 var(--space-4) 0 var(--space-3);align-items:center;gap:var(--space-2);font-family:var(--body);font-size:var(--text-sm);letter-spacing:0;text-transform:none;border-radius:999px;font-weight:600;display:inline-flex}.hub-tools .quiet-action:hover,.hub-tools .quiet-action:focus-visible,.hub-tools .help-control:hover{color:var(--utility-ink-hover);background:var(--utility-wash-hover);border-color:var(--utility-line-hover)}.hub-tools .quiet-action.is-quiet{color:var(--tactile);border-color:rgba(var(--flowkeys-rgb-tactile), .4)}.hub-tools svg{width:17px;height:17px}.hub-main{width:min(1180px,100% - 48px);padding:clamp(48px, 8vw, 96px) 0 var(--space-8);margin:0 auto}.hub-welcome{justify-content:space-between;align-items:flex-end;gap:var(--space-5) clamp(24px, 5vw, 64px);flex-wrap:wrap;display:flex}.hub-welcome h1{font-family:var(--display);font-size:var(--display-lg);letter-spacing:-.03em;font-weight:600;line-height:.9}.hub-welcome h1:focus{outline:none}.hub-welcome .hub-language-key{flex:0 460px}.course-doors{margin-top:clamp(32px,5vw,56px)}.door-pair{grid-template-columns:repeat(2,minmax(0,1fr));align-items:stretch;gap:clamp(16px,2.4vw,28px);display:grid}.door-pair.is-single{grid-template-columns:minmax(0,620px)}.course-door{--door-ink:var(--track-accent-text);--door-wash:color-mix(in srgb, var(--track-accent) 7%, transparent);--door-wash-soft:color-mix(in srgb, var(--track-accent) 5%, transparent);--door-wash-strong:color-mix(in srgb, var(--track-accent) 10%, transparent);--door-line:color-mix(in srgb, var(--track-accent) 42%, transparent);--door-line-soft:color-mix(in srgb, var(--track-accent) 30%, transparent);--door-line-switch:color-mix(in srgb, var(--track-accent) 34%, transparent);--door-glow:color-mix(in srgb, var(--track-accent) 55%, transparent);gap:var(--space-5);background:rgba(var(--flowkeys-rgb-chalk), .025);min-width:0;box-shadow:inset 0 0 0 1px rgba(var(--flowkeys-rgb-chalk), .09);transition:background-color .2s var(--ease-out), box-shadow .2s var(--ease-out), transform .2s var(--ease-out);border-radius:30px;flex-direction:column;padding:clamp(18px,2.4vw,28px);display:flex;position:relative}.course-door.is-selected{background:var(--door-wash);box-shadow:inset 0 0 0 1.5px var(--door-line), 0 28px 60px -36px var(--door-glow)}.course-door.is-warm.is-selected{background:linear-gradient(170deg, rgba(var(--flowkeys-rgb-tactile), .12), rgba(var(--flowkeys-rgb-tactile), .03))}.course-door:not(.is-selected):hover{background:var(--door-wash-soft);box-shadow:inset 0 0 0 1px var(--door-line-soft)}.door-tab{align-items:center;gap:var(--space-3);color:var(--chalk);text-align:left;font:inherit;background:0 0;border:0;border-radius:14px;flex-wrap:wrap;padding:0;display:flex}.course-door.is-selected .door-tab{cursor:default}.course-door:not(.is-selected) .door-tab{cursor:pointer;flex-direction:column;flex:1;align-items:flex-start}.course-door:not(.is-selected) .door-tab:after{content:"";border-radius:30px;position:absolute;inset:0}.door-tab:focus-visible{outline:none}.door-tab:focus-visible:after,.course-door.is-selected .door-tab:focus-visible{outline:2px solid var(--focus);outline-offset:4px}.door-name{font-family:var(--display);color:var(--door-ink);margin-right:auto;font-size:clamp(24px,2.6vw,32px);font-weight:600;line-height:1}.door-facts{gap:var(--space-2);flex-wrap:wrap;display:flex}.door-facts .hub-truth{margin-top:0}.door-badge{min-height:30px;padding:0 var(--space-3) 0 10px;color:var(--tactile-light);background:rgba(var(--flowkeys-rgb-tactile), .12);box-shadow:inset 0 0 0 1px rgba(var(--flowkeys-rgb-tactile), .28);font:500 var(--text-xs)/1 var(--mono);letter-spacing:.07em;text-transform:uppercase;white-space:nowrap;border-radius:999px;align-items:center;gap:6px;display:inline-flex}.door-badge svg{flex:none;width:15px;height:15px}.door-preview-scene{padding-top:var(--space-6);color:var(--chalk-dim);font-size:var(--text-md);margin-top:auto}.door-ghost{border:1.5px dashed var(--door-line-soft);background:rgba(var(--flowkeys-rgb-chalk), .015);width:100%;min-height:232px;transition:border-color .2s var(--ease-out), background-color .2s var(--ease-out);border-radius:24px;flex-direction:column;margin-top:auto;padding:clamp(22px,3.4vw,32px);display:flex}.door-preview-scene+.door-ghost{margin-top:var(--space-3)}.course-door:not(.is-selected):hover .door-ghost{border-color:var(--door-line);background:var(--door-wash-soft)}.door-ghost-top>span{min-width:30px;height:30px;color:var(--chalk-dim);background:rgba(var(--flowkeys-rgb-chalk), .05);font:500 var(--text-xs)/1 var(--mono);letter-spacing:.02em;border-radius:999px;place-items:center;padding:0 6px;display:inline-grid}.door-ghost-phrase{padding-top:var(--space-6);font-family:var(--display);letter-spacing:-.02em;color:rgba(var(--flowkeys-rgb-chalk), .62);overflow-wrap:anywhere;margin-top:auto;font-size:clamp(30px,4vw,48px);font-weight:600;line-height:.95}.door-ghost-purpose{margin-top:var(--space-2);color:var(--chalk-dim);font-size:var(--text-sm)}.door-ghost-action{margin-top:var(--space-5);height:50px;padding:var(--space-2);box-shadow:inset 0 0 0 1px rgba(var(--flowkeys-rgb-chalk), .08);border-radius:16px;justify-content:flex-end;display:flex}.door-ghost-action>span{width:34px;height:34px;box-shadow:inset 0 0 0 1.5px var(--door-line-soft);border-radius:50%}.door-switch{min-height:44px;padding:0 var(--space-4);align-items:center;gap:var(--space-2);color:var(--door-ink);box-shadow:inset 0 0 0 1px var(--door-line-switch);font-size:var(--text-sm);border-radius:999px;font-weight:600;display:inline-flex}.door-switch svg{width:15px;height:15px}.course-door:not(.is-selected):hover .door-switch{background:var(--door-wash-strong)}.door-body{gap:var(--space-5);display:grid}.course-shelf{margin-top:clamp(40px,6vw,72px)}.shelf-heading{padding-bottom:var(--space-5)}.shelf-heading h2{font-family:var(--display);font-size:var(--display-md);font-weight:600;line-height:1}.course-shelf.is-right-word .shelf-heading h2{color:var(--tactile-light)}.shelf-heading p{max-width:620px;margin-top:var(--space-2);color:var(--chalk-dim);font-size:var(--text-md);line-height:1.55}.shelf-coming{padding:var(--space-5);align-items:center;gap:var(--space-3);color:rgba(var(--flowkeys-rgb-chalk), .66);border:1.5px dashed rgba(var(--flowkeys-rgb-chalk), .16);border-radius:20px;line-height:1.5;display:flex}.shelf-coming svg{flex:none;width:20px;height:20px}.course-key.is-warm>button,.course-key.is-warm.is-suggested>button{--key-edge:var(--color-tactile-deep);border-color:rgba(var(--flowkeys-rgb-tactile), .42);background:radial-gradient(120% 90% at 0% 0%, rgba(var(--flowkeys-rgb-tactile), .2), transparent 60%), linear-gradient(160deg, var(--wood-soft), var(--color-tactile-band)) var(--color-tactile-band)}.course-key.is-warm>button:hover,.course-key.is-warm.is-suggested>button:hover{border-color:rgba(var(--flowkeys-rgb-tactile), .7)}.course-key.is-warm.is-available .key-topline>span:last-child{color:var(--tactile-light);background:rgba(var(--flowkeys-rgb-tactile), .12);box-shadow:inset 0 0 0 1px rgba(var(--flowkeys-rgb-tactile), .28)}.course-key.is-warm.is-suggested strong{overflow-wrap:anywhere;font-size:clamp(30px,4.2vw,48px);line-height:1}.course-key.is-warm .key-purpose{color:var(--chalk-dim)}.hub-truth{gap:var(--space-2);margin-top:var(--space-5);flex-wrap:wrap}.hub-truth span,.suggested-lesson>p,.set-label span{min-height:30px;padding:0 var(--space-3) 0 10px;color:var(--signal);background:rgba(var(--flowkeys-rgb-signal), .1);box-shadow:inset 0 0 0 1px rgba(var(--flowkeys-rgb-signal), .22);font-family:var(--mono);font-size:var(--text-xs);letter-spacing:.07em;text-transform:uppercase;white-space:nowrap;border-radius:999px;align-items:center;gap:6px;display:inline-flex}.hub-truth svg,.suggested-lesson>p svg{flex:none;width:15px;height:15px}.next-scene{max-width:620px}.next-scene h2{font-family:var(--display);font-size:var(--display-md);color:var(--chalk);font-weight:600;line-height:1}.next-scene p{margin-top:var(--space-4);color:var(--chalk-dim);font-size:var(--text-md);text-wrap:pretty;line-height:1.55}.hub-language-key{padding:var(--space-3) var(--space-4) var(--space-3) var(--space-3);align-items:start;gap:var(--space-3);color:var(--chalk-dim);background:rgba(var(--flowkeys-rgb-chalk), .035);box-shadow:inset 0 0 0 1px rgba(var(--flowkeys-rgb-chalk), .09);font-size:var(--text-sm);border-radius:18px;grid-template-columns:36px minmax(0,1fr);line-height:1.55;display:grid}.hub-language-key svg{box-sizing:border-box;width:36px;height:36px;color:var(--lavender);background:rgba(var(--flowkeys-rgb-help), .16);border-radius:50%;padding:8px}.hub-language-key p{padding-top:7px}.hub-language-key strong{color:var(--chalk);font-weight:600}.suggested-lesson>p{width:max-content;margin-bottom:var(--space-3);letter-spacing:.1em;display:flex}.suggested-lesson ol,.key-tray,.course-ahead ol,.prototype-library ul{margin:0;padding:0;list-style:none}.course-key{min-width:0}.course-key>button,.course-key.is-planned{width:100%;min-height:190px;padding:var(--space-4);color:var(--chalk);text-align:left;border:1px solid rgba(var(--flowkeys-rgb-chalk), .14);border-radius:24px;flex-direction:column;align-items:stretch;display:flex}.course-key>button{--key-edge:var(--color-hub-key-edge);background:linear-gradient(180deg, var(--color-hub-key-idle-top) 0%, var(--color-hub-key-idle-bottom) 100%) var(--color-hub-key-idle-bottom);box-shadow:0 6px 0 var(--key-edge), 0 24px 40px -20px rgba(var(--flowkeys-rgb-black), .7);transition:transform .18s var(--ease-out), border-color .18s var(--ease-out), box-shadow .18s var(--ease-out)}.course-key>button:hover{border-color:rgba(var(--flowkeys-rgb-signal), .55);box-shadow:0 8px 0 var(--key-edge), 0 30px 46px -20px rgba(var(--flowkeys-rgb-black), .72);transform:translateY(-2px)}.course-key>button:active{box-shadow:0 1px 0 var(--key-edge), 0 10px 18px -12px rgba(var(--flowkeys-rgb-black), .55);transform:translateY(5px)}.course-key.is-suggested>button{--key-edge:var(--color-hub-key-ready-edge);border-color:rgba(var(--flowkeys-rgb-signal), .5);background:radial-gradient(120% 90% at 0% 0%, rgba(var(--flowkeys-rgb-signal), .18), transparent 60%), linear-gradient(180deg, var(--color-hub-key-ready-top) 0%, var(--color-hub-key-ready-bottom) 100%) var(--color-hub-key-ready-bottom);min-height:232px;padding:clamp(22px,3.4vw,32px)}.course-key.is-finished>button{--key-edge:var(--signal-deep);color:var(--night);border-color:var(--signal);background:linear-gradient(180deg, var(--color-signal-light) 0%, var(--signal) 100%) var(--signal);box-shadow:0 6px 0 var(--key-edge), 0 24px 44px -20px rgba(var(--flowkeys-rgb-signal), .5)}.course-key.is-finished>button:hover{border-color:var(--signal);box-shadow:0 8px 0 var(--key-edge), 0 30px 48px -20px rgba(var(--flowkeys-rgb-signal), .55)}.course-key.is-finished>button:active{box-shadow:0 1px 0 var(--key-edge), 0 10px 18px -12px rgba(var(--flowkeys-rgb-signal), .4)}.key-topline{justify-content:space-between;gap:var(--space-3);color:var(--chalk-dim);font-family:var(--mono);font-size:var(--text-xs);letter-spacing:.08em;text-transform:uppercase}.key-topline>span:first-child{background:rgba(var(--flowkeys-rgb-chalk), .07);letter-spacing:.02em;border-radius:999px;place-items:center;min-width:30px;height:30px;padding:0 6px;display:grid}.key-topline>span:last-child{min-height:28px;padding:0 var(--space-3) 0 var(--space-2);background:rgba(var(--flowkeys-rgb-chalk), .07);border-radius:999px;align-items:center;gap:6px;display:inline-flex}.course-key.is-available .key-topline>span:last-child{color:var(--signal);background:rgba(var(--flowkeys-rgb-signal), .12);box-shadow:inset 0 0 0 1px rgba(var(--flowkeys-rgb-signal), .24)}.course-key.is-started .key-topline>span:last-child{color:var(--tactile-light);background:rgba(var(--flowkeys-rgb-tactile), .12);box-shadow:inset 0 0 0 1px rgba(var(--flowkeys-rgb-tactile), .28)}.course-key.is-finished .key-topline{color:var(--ink)}.course-key.is-finished .key-topline>span{background:rgba(var(--flowkeys-rgb-night), .1)}.key-topline svg{width:15px;height:15px}.course-key strong{padding-top:var(--space-6);font-family:var(--display);letter-spacing:-.025em;margin-top:auto;font-size:clamp(30px,4.5vw,52px);font-weight:600;line-height:.9;display:block}.course-key.is-suggested strong{font-size:clamp(46px,7vw,76px)}.key-purpose{margin-top:var(--space-2);color:var(--chalk-dim);font-size:var(--text-sm)}.course-key.is-finished .key-purpose{color:var(--color-signal-title-ink)}.key-action{justify-content:space-between;gap:var(--space-3);margin-top:var(--space-5);padding:var(--space-2) var(--space-2) var(--space-2) var(--space-4);background:rgba(var(--flowkeys-rgb-chalk), .06);font-size:var(--text-base);border-radius:16px;font-weight:600}.key-action svg{box-sizing:border-box;width:34px;height:34px;color:var(--track-accent-ink,var(--night));background:var(--track-accent,var(--signal));transition:transform .2s var(--ease-out);border-radius:50%;flex:none;padding:8px}.course-key>button:hover .key-action svg{transform:translate(3px)}.course-key.is-finished .key-action{background:rgba(var(--flowkeys-rgb-night), .1)}.course-key.is-finished .key-action svg{color:var(--signal);background:var(--ink)}.course-key.is-suggested:not(.is-finished)>button:hover{border-color:color-mix(in srgb, var(--track-accent) 60%, transparent)}.course-key.is-suggested:not(.is-finished) .key-action{color:var(--track-accent-text);background:var(--track-wash);box-shadow:inset 0 0 0 1px var(--track-line)}.current-section{padding-top:var(--space-5);border-top:1px solid rgba(var(--flowkeys-rgb-chalk), .12)}.section-heading-row{align-items:flex-start;gap:var(--space-4);padding-bottom:var(--space-5);border-bottom:1px solid rgba(var(--flowkeys-rgb-chalk), .12)}.section-heading-row>span,.course-ahead li>span{width:36px;height:36px;color:var(--signal);background:rgba(var(--flowkeys-rgb-signal), .12);box-shadow:inset 0 0 0 1px rgba(var(--flowkeys-rgb-signal), .24);font-family:var(--mono);font-size:var(--text-xs);letter-spacing:.04em;border-radius:50%;flex:none;place-items:center;display:grid}.section-heading-row>span{margin-top:2px}.section-heading-row>div{flex:1}.section-heading-row h3,.course-ahead>header h2{font-family:var(--display);font-size:var(--display-md);margin:0;font-weight:600;line-height:1}.section-heading-row p,.course-ahead>header p{max-width:620px;margin-top:var(--space-2);color:var(--chalk-dim);line-height:1.55}.section-heading-row small,.course-ahead li small{min-height:28px;padding:0 var(--space-3);color:var(--chalk-dim);box-shadow:inset 0 0 0 1px rgba(var(--flowkeys-rgb-chalk), .14);font-family:var(--mono);font-size:var(--text-xs);letter-spacing:.08em;text-transform:uppercase;white-space:nowrap;border-radius:999px;align-items:center;display:inline-flex}.section-heading-row small{margin-top:4px}.lesson-set{margin-top:var(--space-6)}.set-label{justify-content:space-between;gap:var(--space-4);margin-bottom:var(--space-4)}.set-label strong{font-size:var(--text-base)}.set-label span{padding-left:var(--space-3)}.key-tray{gap:var(--space-4);grid-template-columns:repeat(4,minmax(0,1fr));display:grid}.course-key.is-planned{min-height:160px;color:rgba(var(--flowkeys-rgb-chalk), .58);border:1.5px dashed rgba(var(--flowkeys-rgb-chalk), .16);background:rgba(var(--flowkeys-rgb-chalk), .02);box-shadow:none;border-radius:20px}.course-key.is-planned strong{font-size:clamp(24px,3vw,34px)}.course-key.is-planned p{margin-top:var(--space-2);color:rgba(var(--flowkeys-rgb-chalk), .46);font-size:var(--text-sm);line-height:1.4}.next-key-set,.prototype-library{margin-top:var(--space-5);padding:0 var(--space-5);background:rgba(var(--flowkeys-rgb-chalk), .025);border:1px solid rgba(var(--flowkeys-rgb-chalk), .1);transition:border-color .2s var(--ease-out), background-color .2s var(--ease-out);border-radius:22px}.next-key-set[open],.prototype-library[open]{background:rgba(var(--flowkeys-rgb-signal), .035);border-color:rgba(var(--flowkeys-rgb-signal), .24)}.next-key-set>summary,.prototype-library>summary{min-height:80px;padding:var(--space-3) 0;justify-content:space-between;align-items:center;gap:var(--space-4);list-style:none;display:flex}.next-key-set>summary::-webkit-details-marker{display:none}.prototype-library>summary::-webkit-details-marker{display:none}.next-key-set summary span,.prototype-library summary span{gap:var(--space-1);display:grid}.next-key-set summary small,.prototype-library summary small{color:var(--chalk-dim);font-size:var(--text-sm);font-weight:400}.next-key-set summary>span:last-child,.prototype-library summary>span:last-child{align-items:center;gap:var(--space-3);color:var(--signal);font-family:var(--mono);font-size:var(--text-xs);letter-spacing:.08em;text-transform:uppercase;white-space:nowrap;display:inline-flex}.next-key-set>summary:hover .disclosure-caret,.prototype-library>summary:hover .disclosure-caret{background:rgba(var(--flowkeys-rgb-signal), .2)}.next-key-set[open]>summary .disclosure-caret,.prototype-library[open]>summary .disclosure-caret{transform:rotate(180deg)}.next-key-set[open] .key-tray{padding:var(--space-2) 0 var(--space-5);grid-template-columns:repeat(5,minmax(0,1fr))}@supports selector(::details-content){.next-key-set,.prototype-library{interpolate-size:allow-keywords}.next-key-set::details-content{block-size:0;transition:block-size .32s var(--ease-out), content-visibility .32s allow-discrete;overflow-y:clip}.prototype-library::details-content{block-size:0;transition:block-size .32s var(--ease-out), content-visibility .32s allow-discrete;overflow-y:clip}.next-key-set[open]::details-content{block-size:auto}.prototype-library[open]::details-content{block-size:auto}}.course-ahead{margin-top:clamp(80px,12vw,144px)}.course-ahead>header{margin-bottom:var(--space-6)}.ahead-columns{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start;gap:clamp(16px,2.4vw,28px);display:grid}.ahead-columns.is-single{grid-template-columns:minmax(0,760px)}.ahead-column[data-track=course]{--ahead-surface:rgba(var(--flowkeys-rgb-chalk), .025);--ahead-edge:rgba(var(--flowkeys-rgb-chalk), .09);--ahead-rule:rgba(var(--flowkeys-rgb-chalk), .08);grid-area:1/1}.ahead-column[data-track=natural]{--ahead-surface:linear-gradient(170deg, rgba(var(--flowkeys-rgb-tactile), .09), rgba(var(--flowkeys-rgb-tactile), .025));--ahead-edge:rgba(var(--flowkeys-rgb-tactile), .24);--ahead-rule:rgba(var(--flowkeys-rgb-tactile), .13);grid-area:1/2}.ahead-columns.is-single .ahead-column{grid-column:1}.ahead-column h3{margin:0 0 var(--space-3) var(--space-2);color:var(--track-accent-text);font-family:var(--mono);font-size:var(--text-xs);letter-spacing:.1em;text-transform:uppercase;font-weight:600}.course-ahead ol{padding:var(--space-1) var(--space-5);background:var(--ahead-surface);box-shadow:inset 0 0 0 1px var(--ahead-edge);border-radius:22px}.course-ahead li{min-height:82px;padding:var(--space-3) 0;align-items:center;gap:var(--space-4);border-bottom:1px solid var(--ahead-rule);grid-template-columns:36px 1fr auto;display:grid}.course-ahead li:last-child{border-bottom:0}.course-ahead li>span{color:var(--track-accent-text);background:var(--track-wash);box-shadow:inset 0 0 0 1px var(--track-line)}.course-ahead li strong{font-family:var(--display);font-size:var(--text-lg);font-weight:600}.course-ahead li p{margin-top:var(--space-1);color:var(--chalk-dim);font-size:var(--text-sm);line-height:1.45}.prototype-library{margin-top:clamp(72px,10vw,120px)}.prototype-library ul{padding:var(--space-2) 0 var(--space-5);gap:var(--space-4);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.prototype-key{--key-edge:var(--color-hub-key-edge);width:100%;min-height:116px;padding:var(--space-4) var(--space-4) var(--space-4) var(--space-5);justify-content:space-between;align-items:center;gap:var(--space-4);color:var(--chalk);text-align:left;background:linear-gradient(180deg, var(--color-hub-key-planned-top) 0%, var(--color-hub-key-planned-bottom) 100%) var(--color-hub-key-planned-bottom);border:1px solid rgba(var(--flowkeys-rgb-chalk), .12);box-shadow:0 5px 0 var(--key-edge), 0 18px 30px -18px rgba(var(--flowkeys-rgb-black), .6);transition:transform .18s var(--ease-out), border-color .18s var(--ease-out), box-shadow .18s var(--ease-out);border-radius:20px;display:flex}.prototype-key:hover{border-color:rgba(var(--flowkeys-rgb-signal), .5);box-shadow:0 7px 0 var(--key-edge), 0 24px 36px -18px rgba(var(--flowkeys-rgb-black), .65);transform:translateY(-2px)}.prototype-key:active{box-shadow:0 1px 0 var(--key-edge), 0 8px 14px -10px rgba(var(--flowkeys-rgb-black), .5);transform:translateY(4px)}.prototype-key>span{gap:var(--space-1);display:grid}.prototype-key small{color:var(--signal);font-family:var(--mono);font-size:var(--text-xs);letter-spacing:.08em;text-transform:uppercase}.prototype-key strong{margin-top:var(--space-1);font-family:var(--display);font-size:var(--text-xl)}.prototype-key span span{color:var(--chalk-dim);font-size:var(--text-sm)}.prototype-key>svg{box-sizing:border-box;width:34px;height:34px;color:var(--signal);background:rgba(var(--flowkeys-rgb-signal), .14);transition:transform .2s var(--ease-out);border-radius:50%;flex:none;padding:8px}.prototype-key:hover>svg{transform:translate(3px)}.hub-support{width:min(1180px,100% - 48px);padding:var(--space-6) 0 var(--space-8);justify-content:center;align-items:center;gap:var(--space-3) var(--space-4);color:var(--chalk-dim);border-top:1px solid rgba(var(--flowkeys-rgb-chalk), .08);font-size:var(--text-sm);text-align:center;flex-wrap:wrap;margin:0 auto;display:flex}.hub-support-actions{justify-content:center;align-items:center;gap:var(--space-3);flex-wrap:wrap;display:flex}.feedback-link{min-height:44px;padding:0 var(--space-4) 0 var(--space-3);align-items:center;gap:var(--space-2);color:var(--lavender-light);background:rgba(var(--flowkeys-rgb-help), .12);border:1px solid rgba(var(--flowkeys-rgb-help), .38);font-family:var(--body);font-size:var(--text-sm);transition:color .16s var(--ease-out), background-color .16s var(--ease-out), border-color .16s var(--ease-out);border-radius:999px;font-weight:700;display:inline-flex}.feedback-link:hover{color:var(--chalk);background:rgba(var(--flowkeys-rgb-help), .2);border-color:rgba(var(--flowkeys-rgb-help), .62)}.feedback-link svg{width:20px;height:20px}.support-link{--support-edge:var(--color-support-edge);min-height:44px;padding:0 var(--space-3) 0 var(--space-2);align-items:center;gap:var(--space-2);color:var(--color-support-ink);background:linear-gradient(180deg, var(--color-support-light) 0%, var(--color-support) 100%) var(--color-support);box-shadow:0 3px 0 var(--support-edge), 0 14px 26px -16px rgba(var(--flowkeys-rgb-support), .7);font-size:var(--text-sm);transition:transform .16s var(--ease-out), box-shadow .16s var(--ease-out);border-radius:999px;font-weight:700;text-decoration:none;display:inline-flex}.support-link:hover{box-shadow:0 4px 0 var(--support-edge), 0 18px 30px -16px rgba(var(--flowkeys-rgb-support), .8);transform:translateY(-1px)}.support-link:active{box-shadow:0 0 0 var(--support-edge), 0 6px 12px -8px rgba(var(--flowkeys-rgb-support), .5);transform:translateY(3px)}.support-link>svg:first-child{box-sizing:border-box;width:30px;height:30px;color:var(--color-support-heart);background:rgba(var(--flowkeys-rgb-white), .5);transition:transform .2s var(--ease-emphasis);border-radius:50%;flex:none;padding:7px}.support-link:hover>svg:first-child{transform:scale(1.12)}.support-link>svg:last-child{opacity:.7;width:14px;height:14px}@media (max-width:560px){.hub-support{flex-direction:column;width:min(100% - 24px,1180px)}.hub-support-actions{flex-direction:column;width:100%}.feedback-link,.support-link{justify-content:center;width:min(100%,280px)}}@media (prefers-reduced-motion:reduce){.support-link,.support-link>svg:first-child{transition:none}.support-link:hover>svg:first-child{transform:none}.feedback-link{transition:none}}.lesson-hub:not([hidden]) .hub-welcome>h1{animation:welcome-words .46s var(--ease-out) backwards}.lesson-hub:not([hidden]) .hub-language-key{animation:welcome-words .46s var(--ease-out) 80ms backwards}.lesson-hub:not([hidden]) .course-door{animation:welcome-settle .46s var(--ease-out) 60ms backwards}.lesson-hub:not([hidden]) .shelf-contents{animation:welcome-settle .38s var(--ease-out) backwards}.lesson-hub:not([hidden]) .next-scene{animation:welcome-words .34s var(--ease-out) 60ms backwards}.lesson-hub:not([hidden]) .suggested-lesson .course-key>button{animation:key-lift .54s var(--ease-out) .14s backwards}@media (max-width:900px){.hub-topbar{grid-template-columns:1fr auto}.hub-context{display:none}.ahead-columns{grid-template-columns:minmax(0,1fr)}.ahead-column[data-track]{grid-area:auto}.door-pair{grid-template-columns:minmax(0,1fr)}.course-door:not(.is-selected){padding:var(--space-3) var(--space-4);border-radius:999px}.course-door:not(.is-selected) .door-tab{flex-direction:row;align-items:center}.course-door:not(.is-selected) .door-tab:after{border-radius:999px}.course-door:not(.is-selected) .door-facts,.course-door:not(.is-selected) .door-ghost,.course-door:not(.is-selected) .door-preview-scene{display:none}.course-door:not(.is-selected) .door-name{font-size:var(--text-lg,20px)}.key-tray,.next-key-set[open] .key-tray{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width:560px){.hub-topbar{min-height:64px;padding:0 var(--space-3)}.hub-tools .quiet-action span,.hub-tools .help-control span{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.hub-tools .quiet-action{justify-content:center;width:44px;padding:0}.hub-tools{gap:var(--space-1)}.hub-main{width:min(100% - 24px,1180px);padding-top:var(--space-7)}.shelf-heading p{font-size:var(--text-base)}.section-heading-row{grid-template-columns:36px 1fr;display:grid}.section-heading-row small{grid-column:2;justify-self:start;margin-top:0}.set-label{align-items:flex-end}.key-tray,.next-key-set[open] .key-tray,.prototype-library ul{grid-template-columns:1fr}.course-key>button,.course-key.is-planned{min-height:154px}.course-key.is-suggested>button{min-height:210px}.next-key-set,.prototype-library{padding:0 var(--space-4)}.course-ahead ol{padding:var(--space-1) var(--space-4)}.course-ahead li{grid-template-columns:36px 1fr}.course-ahead li small{grid-column:2;justify-self:start}}@media (prefers-reduced-motion:reduce){.course-key>button,.prototype-key,.key-action svg,.prototype-key>svg,.next-key-set,.prototype-library,.course-door{transition:none}.lesson-hub:not([hidden]) .hub-welcome>h1,.lesson-hub:not([hidden]) .hub-language-key,.lesson-hub:not([hidden]) .course-door,.lesson-hub:not([hidden]) .shelf-contents,.lesson-hub:not([hidden]) .next-scene,.lesson-hub:not([hidden]) .suggested-lesson .course-key>button{animation:none}}.right-word{gap:var(--space-6);min-height:100dvh;padding:var(--space-5) var(--space-4) var(--space-8);background:radial-gradient(120% 80% at 50% 0%, var(--color-tactile-band), transparent 70%), var(--wood);color:var(--chalk);grid-template-rows:auto 1fr;display:grid}.right-word-bar{width:min(1120px,100%);padding-inline:var(--space-1);justify-content:space-between;align-items:center;gap:var(--space-3);flex-wrap:wrap;margin:0 auto;display:flex}.right-word-back{align-items:center;gap:var(--space-2);min-height:40px;padding:0 var(--space-4) 0 var(--space-3);border:1px solid rgba(var(--flowkeys-rgb-tactile), .32);color:var(--tactile-light);font:500 var(--text-sm)/1 var(--body);cursor:pointer;transition:background .16s var(--ease-out), border-color .16s var(--ease-out);background:0 0;border-radius:999px;display:inline-flex}.right-word-tools{align-items:center;gap:var(--space-3);display:inline-flex}.right-word-sound{min-height:40px;padding:0 var(--space-3);align-items:center;gap:var(--space-2);border:1px solid rgba(var(--flowkeys-rgb-tactile), .32);color:var(--tactile-light);font:500 var(--text-sm)/1 var(--body);cursor:pointer;transition:background .16s var(--ease-out), border-color .16s var(--ease-out);background:0 0;border-radius:999px;display:inline-flex}.right-word-sound svg{width:18px;height:18px}.right-word-sound:hover{background:rgba(var(--flowkeys-rgb-tactile), .12);border-color:rgba(var(--flowkeys-rgb-tactile), .5)}.right-word-sound.is-quiet{color:var(--chalk-dim);border-color:rgba(var(--flowkeys-rgb-chalk), .2)}.right-word-back:hover{background:rgba(var(--flowkeys-rgb-tactile), .12);border-color:rgba(var(--flowkeys-rgb-tactile), .5)}.right-word-mark{align-items:center;gap:var(--space-2);color:var(--chalk);font:600 var(--text-md)/1 var(--display);letter-spacing:.01em;display:inline-flex}.right-word-mark svg{width:18px;height:18px;color:var(--tactile)}.right-word-trial{min-height:26px;padding:0 var(--space-3);background:rgba(var(--flowkeys-rgb-tactile), .14);box-shadow:inset 0 0 0 1px rgba(var(--flowkeys-rgb-tactile), .3);color:var(--tactile-light);font:500 var(--text-xs)/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;border-radius:999px;align-items:center;display:inline-flex}.right-word-stage{align-content:center;justify-items:center;width:min(760px,100%);display:grid}.right-word-actions{gap:var(--space-3);flex-wrap:wrap;display:flex}.right-word-go{align-items:center;gap:var(--space-2);min-height:52px;padding:0 var(--space-6);background:linear-gradient(155deg, var(--tactile-light), var(--tactile));border:1px solid var(--color-reveal-key-border);border-radius:var(--space-3);box-shadow:0 6px 0 var(--color-key-edge), 0 12px 16px rgba(var(--flowkeys-rgb-shadow), .4);color:var(--color-key-ink-strong);font:600 var(--text-md)/1 var(--display);letter-spacing:.02em;cursor:pointer;transition:transform .14s var(--ease-out), box-shadow .14s var(--ease-out);display:inline-flex;position:relative;transform:translateY(-2px)}.right-word-go:after{content:"";position:absolute;inset:0 0 -6px}.right-word-go:hover:not(:disabled){box-shadow:0 8px 0 var(--color-key-edge), 0 14px 20px rgba(var(--flowkeys-rgb-shadow), .45);transform:translateY(-4px)}.right-word-go:active:not(:disabled){box-shadow:0 2px 0 var(--color-key-edge);transform:translateY(0)}.right-word-go:disabled{background:rgba(var(--flowkeys-rgb-white), .06);border-color:rgba(var(--flowkeys-rgb-white), .1);box-shadow:none;color:var(--color-key-ink-disabled);cursor:not-allowed;transform:none}.right-word-go:focus-visible,.right-word-sound:focus-visible{outline:2px solid var(--focus);outline-offset:3px}@media (max-width:40rem){.right-word{padding:var(--space-4) var(--space-4) var(--space-7);gap:var(--space-5)}.right-word-bar{justify-content:flex-start}.right-word-go{justify-content:center;width:100%}}@media (prefers-reduced-motion:reduce){.right-word-back,.right-word-sound,.right-word-go{transition:none}}.scene-load-failed-body{align-self:center;justify-items:start;gap:var(--space-4);width:min(32rem,100%);margin:0 auto;display:grid}.scene-load-failed-body h1{font:600 var(--text-xl)/1.2 var(--display);margin:0}.scene-load-failed-body p{color:var(--chalk-dim);margin:0}.onboarding-brand-row{margin-bottom:0}.onboarding-brand>span,.wordmark>span{border-radius:8px}.onboarding-lessons,.topbar-lessons{padding-inline:var(--space-4);transition:color .16s var(--ease-out), border-color .16s var(--ease-out), background-color .16s var(--ease-out);border-radius:999px}.onboarding-lessons:hover,.topbar-lessons:hover{background:rgba(var(--flowkeys-rgb-signal), .08)}.onboarding-brand-row .onboarding-lessons,.onboarding-brand-row .interface-language-control{background:rgba(var(--flowkeys-rgb-chalk), .05);border-color:#0000}.onboarding-brand-row .onboarding-lessons:is(:hover,:focus-visible),.onboarding-brand-row .interface-language-control:is(:hover,:focus-visible),.onboarding-brand-row .interface-language.is-confirming .interface-language-control{background:rgba(var(--flowkeys-rgb-signal), .14);border-color:#0000}.onboarding-lead{--onboarding-band:var(--color-onboarding-band);--frame-line:rgba(var(--flowkeys-rgb-onboarding-frame), .26);padding-block:72px var(--space-8);text-align:center}.onboarding-stage{isolation:isolate}.onboarding-lead header{padding-inline:var(--space-6);justify-content:center;align-items:center;gap:0 var(--space-3);border:1.5px solid var(--frame-line);border-radius:24px;flex-wrap:wrap;display:flex;position:relative}.onboarding-lead header:before{content:"";z-index:-1;background:var(--onboarding-band);pointer-events:none;width:100vw;position:absolute;top:-32px;bottom:-38px;left:50%;translate:-50%}.onboarding-lead header>h1,.onboarding-lead header>p,.onboarding-promise .translatable-passage-copy{flex:0 0 100%}.onboarding-lead header>.translatable-passage{display:contents}.onboarding-lead header>.onboarding-kicker{min-height:28px;padding:0 var(--space-3) 0 var(--space-2);color:var(--signal);background:linear-gradient(rgba(var(--flowkeys-rgb-signal), .12) 0 0) var(--onboarding-band);box-shadow:0 0 0 var(--space-3) var(--onboarding-band);border-radius:999px;align-items:center;gap:6px;margin-top:-15px;display:inline-flex}.onboarding-lead header>.onboarding-kicker svg{width:15px;height:15px}.onboarding-lead h1{margin-top:var(--space-4);text-wrap:balance;font-size:clamp(48px,8vw,88px)}.onboarding-lead .anchor-token{color:var(--signal)}.onboarding-promise .translatable-passage-copy>p,.onboarding-lead header>p{max-width:34em;margin:var(--space-4) auto 0;color:var(--chalk-dim);font-size:clamp(16px,1.5vw,18px);line-height:1.65}.onboarding-lead .onboarding-quiet{--pill-tint:rgba(var(--flowkeys-rgb-signal), .1);min-height:48px;margin-top:var(--space-5);padding:0 var(--space-4) 0 var(--space-2);align-items:center;gap:var(--space-2);color:var(--signal);background:linear-gradient(var(--pill-tint) 0 0) var(--onboarding-band);box-shadow:0 0 0 var(--space-3) var(--onboarding-band);font-family:var(--body);font-size:var(--text-sm);letter-spacing:0;text-transform:none;transition:background-color .16s var(--ease-out), color .16s var(--ease-out);border-radius:999px;margin-bottom:-25px;font-weight:600;text-decoration:none;display:inline-flex}.onboarding-lead .onboarding-quiet>svg{box-sizing:border-box;background:rgba(var(--flowkeys-rgb-signal), .16);border-radius:50%;flex:none;width:32px;height:32px;padding:7px}.onboarding-lead .onboarding-quiet:hover,.onboarding-lead .onboarding-quiet:focus-visible{--pill-tint:rgba(var(--flowkeys-rgb-signal), .18);text-decoration:none}.onboarding-lead .onboarding-quiet:focus-visible{outline-offset:3px;outline:2px solid}.onboarding-promise .translation-switch{--switch-ink:var(--lavender);--switch-on-ink:var(--night);margin-top:var(--space-5);background:linear-gradient(var(--switch-tint) 0 0) var(--onboarding-band);box-shadow:0 0 0 var(--space-3) var(--onboarding-band);margin-bottom:-25px}.onboarding-lead .onboarding-quiet.is-quiet{--pill-tint:rgba(var(--flowkeys-rgb-tactile), .1);color:var(--tactile)}.onboarding-lead .onboarding-quiet.is-quiet>svg{background:rgba(var(--flowkeys-rgb-tactile), .16)}.onboarding-return{max-width:34em;margin:calc(var(--space-7) + 25px) auto 0;padding:var(--space-3) var(--space-4);box-shadow:inset 0 0 0 1px rgba(var(--flowkeys-rgb-signal), .28);text-align:left;border-left:0;border-radius:16px}.onboarding-return+.onboarding-plan{margin-top:var(--space-6)}.onboarding-plan{margin-top:calc(var(--space-8) + 25px);justify-content:center;align-items:center;gap:var(--space-2) var(--space-4);color:var(--chalk-dim);font-family:var(--mono);font-size:var(--text-xs);letter-spacing:.1em;text-transform:uppercase;flex-wrap:wrap;display:flex}.onboarding-duration{padding-right:var(--space-4);color:var(--signal);border-right:1px solid rgba(var(--flowkeys-rgb-chalk), .16);align-items:center;gap:6px;display:inline-flex}.onboarding-duration svg{width:15px;height:15px}.onboarding-plan ol{justify-content:center;align-items:center;gap:var(--space-2);flex-wrap:wrap;margin:0;padding:0;list-style:none;display:flex}.onboarding-plan li{align-items:center;gap:var(--space-2);display:inline-flex}.onboarding-plan li+li:before{content:"→";content:"→" / "";color:rgba(var(--flowkeys-rgb-signal), .55)}.onboarding-stage .onboarding-detail{margin-top:var(--space-3);border-top:0}.onboarding-stage .onboarding-detail>summary{width:-moz-fit-content;width:fit-content;min-height:44px;padding:0 var(--space-2) 0 var(--space-4);justify-content:center;gap:var(--space-2);color:var(--chalk-dim);font-family:var(--body);font-size:var(--text-base);letter-spacing:0;text-transform:none;transition:color .16s var(--ease-out), background-color .16s var(--ease-out);border-radius:999px;margin-inline:auto;font-weight:600;list-style:none}.onboarding-stage .onboarding-detail>summary:hover,.onboarding-stage .onboarding-detail[open]>summary{color:var(--chalk);background:rgba(var(--flowkeys-rgb-chalk), .05)}.onboarding-stage .onboarding-detail>summary:focus-visible{outline:2px solid var(--signal);outline-offset:3px}.onboarding-detail>summary::-webkit-details-marker{display:none}.disclosure-caret{box-sizing:border-box;width:32px;height:32px;color:var(--signal);background:rgba(var(--flowkeys-rgb-signal), .1);transition:transform .26s var(--ease-out), background-color .16s var(--ease-out);border-radius:50%;flex:none;padding:8px}.onboarding-detail .disclosure-caret{width:28px;height:28px;padding:7px}.onboarding-detail>summary:hover .disclosure-caret{background:rgba(var(--flowkeys-rgb-signal), .2)}.onboarding-detail[open] .disclosure-caret{transform:rotate(180deg)}.onboarding-stage .onboarding-detail-body{max-width:520px;margin:var(--space-3) auto 0;padding:var(--space-5);gap:var(--space-5);text-align:left;background:rgba(var(--flowkeys-rgb-chalk), .04);border-radius:22px;scroll-margin-bottom:120px}.onboarding-detail[open] .onboarding-detail-body{animation:bubble-drop .22s var(--ease-out) backwards}.onboarding-detail-body .onboarding-lesson{background:0 0;margin-top:0;padding:0}.onboarding-detail-body blockquote{padding:var(--space-3) var(--space-4);background:rgba(var(--flowkeys-rgb-black), .18);border-left:0;border-radius:14px}.word-gloss{--gloss-accent:var(--lavender)}.mode-attention .word-gloss{--gloss-accent:var(--lavender-deep)}.mode-tactile .word-gloss{--gloss-accent:var(--lavender-light)}.word-gloss-popover strong{color:var(--lavender)}.word-gloss>button{color:var(--gloss-accent);background:color-mix(in srgb, var(--gloss-accent) 13%, transparent);-webkit-box-decoration-break:clone;box-decoration-break:clone;transition:background-color .14s var(--ease-out);border:0;border-radius:.42em;margin:0;padding:0 .28em .02em;font-weight:600;text-decoration:none}.word-gloss>button:hover,.word-gloss.is-open>button{background:color-mix(in srgb, var(--gloss-accent) 26%, transparent)}.word-gloss-popover{padding:var(--space-2) var(--space-4) var(--space-3);gap:var(--space-1);background:var(--color-onboarding-key);box-shadow:0 18px 36px -14px rgba(var(--flowkeys-rgb-black), .66), 0 0 0 1px rgba(var(--flowkeys-rgb-chalk), .14);font-size:var(--text-base);text-align:left;transform-origin:50% 100%;border-radius:14px}.word-gloss-popover:after{content:"";background:inherit;width:12px;height:12px;box-shadow:1px 1px 0 rgba(var(--flowkeys-rgb-chalk), .14);border-radius:0 0 3px;margin:-6px 0 0 -6px;position:absolute;top:100%;left:50%;transform:rotate(45deg)}.word-gloss.is-open .word-gloss-popover{animation:bubble-pop .2s var(--ease-out) both}@keyframes bubble-pop{0%{opacity:0;translate:0 4px;scale:.94}}.onboarding-dock{align-items:center;column-gap:var(--space-3);grid-template-columns:minmax(0,1fr) min(340px,100%) minmax(0,1fr);display:grid}.onboarding-stage .onboarding-begin{gap:var(--space-3);--key-edge:var(--tactile-deep);width:100%;min-height:60px;color:var(--wood);background:linear-gradient(180deg, var(--tactile-light) 0%, var(--tactile) 100%) var(--tactile-light);box-shadow:0 5px 0 var(--key-edge), 0 18px 30px -16px rgba(var(--flowkeys-rgb-tactile), .55);transition:transform .14s var(--ease-out), box-shadow .14s var(--ease-out), filter .16s var(--ease-out);border-radius:16px;grid-column:2;margin:0;font-size:17px;font-weight:600;display:flex}.onboarding-stage .onboarding-begin svg{box-sizing:border-box;background:rgba(var(--flowkeys-rgb-night), .12);width:30px;height:30px;transition:transform .2s var(--ease-out);border-radius:50%;padding:6px}.onboarding-stage .onboarding-begin:not(:disabled):hover{filter:brightness(1.05)}.onboarding-stage .onboarding-begin:not(:disabled):hover svg{transform:translate(3px)}.onboarding-stage .onboarding-begin:not(:disabled):active{box-shadow:0 1px 0 var(--key-edge), 0 8px 16px -12px rgba(var(--flowkeys-rgb-tactile), .45);transform:translateY(4px)}.onboarding-dock .procedural-help{grid-column:3;justify-self:start}.onboarding-stage .onboarding-dock .procedural-help>.help-control{background:color-mix(in srgb, var(--help-accent) 12%, transparent);border-color:#0000;border-radius:50%;width:60px;min-height:60px;padding:0}.onboarding-stage .onboarding-dock .procedural-help>.help-control:hover,.onboarding-stage .onboarding-dock .procedural-help.is-open>.help-control{background:color-mix(in srgb, var(--help-accent) 22%, transparent);border-color:#0000}.onboarding-dock .help-control svg{width:22px;height:22px}.help-text{transform-origin:100% 0;animation:bubble-drop .2s var(--ease-out) both;border-radius:16px}.onboarding-dock .help-text{top:auto;bottom:calc(100% + var(--space-2));text-align:left;transform-origin:100% 100%}@keyframes bubble-drop{0%{opacity:0;translate:0 -4px;scale:.97}}.onboarding-stage .onboarding-aside{margin-top:var(--space-5);justify-content:center}.onboarding-aside .voice-choices{flex:100%}.onboarding-aside .saved-voice{column-gap:var(--space-3);min-height:0;color:var(--chalk);text-align:left;box-shadow:none;background:0 0;border:0;border-radius:0;flex:0 auto;grid-template-columns:36px auto 44px;padding:0}.onboarding-aside .saved-voice .voice-choice-mark{width:36px;height:36px;color:var(--signal);background:rgba(var(--flowkeys-rgb-signal), .14)}.onboarding-aside .saved-voice .voice-choice-mark svg{width:20px;height:20px}.onboarding-aside .saved-voice strong{font-size:var(--text-md);line-height:1.1}.onboarding-aside .saved-voice small{color:var(--chalk-dim);opacity:1;font-size:var(--text-sm);margin-top:2px}.saved-voice .voice-preview{min-width:44px;min-height:44px;padding:0 var(--space-3);justify-content:center;justify-self:end;align-items:center;gap:var(--space-2);color:var(--signal);background:rgba(var(--flowkeys-rgb-signal), .12);font-family:var(--body);font-size:var(--text-sm);letter-spacing:0;text-transform:none;transition:background-color .16s var(--ease-out);border-radius:999px;grid-column:auto;font-weight:600;display:inline-flex}.saved-voice .voice-preview:hover,.saved-voice .voice-preview.is-speaking{background:rgba(var(--flowkeys-rgb-signal), .24)}.saved-voice .voice-preview:focus-visible{outline:2px solid var(--signal);outline-offset:3px}.saved-voice .voice-preview svg{flex:none;width:18px;height:18px}.saved-voice .voice-preview.is-icon{width:44px;padding:0}.saved-voice .voice-preview.is-icon svg{width:20px;height:20px}.saved-voice .voice-preview.is-speaking svg{animation:.76s ease-in-out infinite alternate voice-breathe}@keyframes voice-breathe{to{scale:.78}}.voice-choice{border-radius:20px}.onboarding-stage .lesson-choices{margin-top:var(--space-6);justify-items:center}.onboarding-stage .lesson-choices-options{justify-content:center}.onboarding-brand-row{animation:chrome-drop .42s var(--ease-out) backwards}.onboarding-lead header>.onboarding-kicker,.onboarding-lead header>h1{animation:welcome-words .46s var(--ease-out) backwards}.onboarding-promise .translatable-passage-copy,.onboarding-lead header>p{animation:passage-ease .46s var(--ease-out) backwards}.onboarding-plan{animation:welcome-words .46s var(--ease-out) .12s backwards}.onboarding-stage .onboarding-begin{animation:key-lift .52s var(--ease-out) .12s backwards}.onboarding-lead .onboarding-detail,.onboarding-stage .onboarding-aside{animation:welcome-settle .52s var(--ease-out) .18s backwards}.lesson-hub:not([hidden]) .hub-main{animation:welcome-settle .48s var(--ease-out) backwards}.app-shell>.lesson-topbar{animation:chrome-drop .42s var(--ease-out) backwards}.app-shell .stage-spine{animation:chrome-slide .48s var(--ease-out) backwards}.translatable-passage-copy[data-swapped]{animation:passage-ease .32s var(--ease-out) backwards}@keyframes welcome-words{0%{opacity:0;transform:translateY(8px)}}@keyframes passage-ease{0%{opacity:.45;transform:translateY(6px)}}@keyframes welcome-settle{0%{transform:translateY(10px)}}@keyframes key-lift{0%{box-shadow:0 0 0 var(--key-edge,var(--signal-deep)), 0 0 0 transparent;transform:translateY(5px)}}@keyframes chrome-drop{0%{transform:translateY(-8px)}}@keyframes chrome-slide{0%{transform:translate(-12px)}}@media (max-width:680px){.onboarding-stage{min-height:calc(100vh - var(--space-4));min-height:calc(100dvh - var(--space-4));flex-direction:column;display:flex}.onboarding-lead{padding-block:var(--space-7) var(--space-5);flex-direction:column;flex:1 0 auto;justify-content:center;display:flex}.onboarding-lead header{padding-inline:var(--space-4)}.onboarding-plan{margin-top:calc(var(--space-6) + 25px)}.onboarding-dock{z-index:20;margin-inline:calc(-1 * var(--space-4));padding:var(--space-5) var(--space-4) calc(var(--space-4) + env(safe-area-inset-bottom));background:linear-gradient(to top, var(--night) 62%, rgba(var(--flowkeys-rgb-night), 0));grid-template-columns:minmax(0,1fr) auto;position:sticky;bottom:0}.onboarding-stage .onboarding-begin{grid-column:1}.onboarding-dock .procedural-help{grid-column:2}.onboarding-stage .onboarding-aside{margin-top:var(--space-2);padding-bottom:var(--space-5)}.onboarding-stage .lesson-choices{padding-bottom:var(--space-6);margin-top:0}.onboarding-duration{border-right:0;padding-right:0}.word-gloss-popover{transform-origin:18px 100%}.word-gloss-popover:after{left:18px}}@media (prefers-reduced-motion:reduce){.onboarding-brand-row,.onboarding-lead header>.onboarding-kicker,.onboarding-lead header>h1,.onboarding-promise .translatable-passage-copy,.onboarding-lead header>p,.onboarding-plan,.onboarding-stage .onboarding-begin,.onboarding-lead .onboarding-detail,.onboarding-stage .onboarding-aside,.onboarding-detail[open] .onboarding-detail-body,.lesson-hub:not([hidden]) .hub-main,.app-shell>.lesson-topbar,.app-shell .stage-spine,.translatable-passage-copy[data-swapped],.word-gloss.is-open .word-gloss-popover,.help-text,.saved-voice .voice-preview.is-speaking svg{animation:none}.disclosure-caret{transition:none}}.procedural-help{--help-accent:var(--lavender)}.mode-attention .lesson-main .procedural-help{--help-accent:var(--lavender-deep)}:is(.lesson-hub,.onboarding-shell,.app-shell) .procedural-help>.help-control{color:var(--help-accent);border-color:color-mix(in srgb, var(--help-accent) 55%, transparent);background:color-mix(in srgb, var(--help-accent) 8%, transparent)}:is(.lesson-hub,.onboarding-shell,.app-shell) .procedural-help>.help-control:is(:hover,:focus-visible),:is(.lesson-hub,.onboarding-shell,.app-shell) .procedural-help.is-open>.help-control{border-color:var(--help-accent);background:color-mix(in srgb, var(--help-accent) 18%, transparent)}.procedural-help>.help-text{box-shadow:0 18px 45px rgba(var(--flowkeys-rgb-black), .4), 0 0 0 1px rgba(var(--flowkeys-rgb-help), .34)}:is(.instrument,.recall-instrument) .procedural-help>.help-text{box-shadow:0 0 0 1px rgba(var(--flowkeys-rgb-help), .34)}.app-shell{--spanish-ink:var(--lavender-deep)}.mode-tactile{--spanish-ink:var(--lavender-light)}.primary-action.is-tactile{--key-edge:var(--tactile-deep);background:linear-gradient(180deg, var(--tactile-light) 0%, var(--tactile) 100%) var(--tactile-light);box-shadow:0 5px 0 var(--key-edge), 0 16px 28px -14px rgba(var(--flowkeys-rgb-tactile), .5);transition:transform .14s var(--ease-out), box-shadow .14s var(--ease-out), filter .16s var(--ease-out), opacity .16s var(--ease-out);border-radius:14px}.primary-action.is-tactile:not(:disabled):hover{filter:brightness(1.04)}.primary-action.is-tactile:not(:disabled):active{box-shadow:0 1px 0 var(--key-edge), 0 8px 16px -12px rgba(var(--flowkeys-rgb-tactile), .4);transform:translateY(4px)}@media (prefers-reduced-motion:reduce){.primary-action.is-tactile{transition:none}}.lesson-topbar{border-bottom:0}.lesson-topbar .topbar-lessons,.lesson-topbar .interface-language-control,.lesson-topbar .comfort-menu summary{background:rgba(var(--flowkeys-rgb-chalk), .05);border-color:#0000;border-radius:999px}.lesson-topbar .comfort-menu summary{padding-inline:var(--space-4);cursor:pointer;transition:color .16s var(--ease-out), background-color .16s var(--ease-out)}.lesson-topbar .topbar-lessons:is(:hover,:focus-visible),.lesson-topbar .interface-language-control:is(:hover,:focus-visible),.lesson-topbar .interface-language.is-confirming .interface-language-control,.lesson-topbar .comfort-menu summary:hover,.lesson-topbar .comfort-menu[open] summary{color:var(--chalk);background:rgba(var(--flowkeys-rgb-signal), .14);border-color:#0000}.lesson-topbar .comfort-menu summary:focus-visible{outline:2px solid var(--signal);outline-offset:3px}@media (max-width:680px){.lesson-topbar{column-gap:var(--space-3)}.lesson-topbar .comfort-menu summary{padding-inline:var(--space-3)}}.app-shell{--lesson-band:var(--color-signal-band);--lesson-frame-line:rgba(var(--flowkeys-rgb-ink), .2);--lesson-frame-pad:clamp(20px, 4vw, 48px)}.mode-tactile{--lesson-band:var(--color-tactile-band);--lesson-frame-line:rgba(var(--flowkeys-rgb-tactile-light), .26)}.lesson-main{isolation:isolate;overflow-x:clip}.lesson-main:has(>.lesson-stage>:is(.listen-guided,.notice-guided)){transition:background .42s var(--ease-state)}.lesson-frame{margin-top:var(--space-7);padding:0 var(--lesson-frame-pad);border:1.5px solid var(--lesson-frame-line);transition:border-color .42s var(--ease-state);border-radius:28px;position:relative}.lesson-frame:before{content:"";z-index:-1;background:var(--lesson-band);width:100vw;transition:background-color .42s var(--ease-state);pointer-events:none;position:absolute;top:-40px;bottom:-40px;left:50%;translate:-50%}.lesson-frame>.mode-signal{margin:-23px 0 var(--space-5);align-items:center;column-gap:var(--space-3);grid-template-columns:minmax(0,1fr) auto auto minmax(0,1fr);display:grid}.lesson-frame>.mode-signal>.mode-icon{width:32px;height:32px;box-shadow:0 0 0 var(--space-3) var(--lesson-band);border-radius:50%;grid-column:2}.lesson-frame>.mode-signal.is-tactile>.mode-icon{box-shadow:0 3px 0 var(--tactile-deep), 0 0 0 var(--space-3) var(--lesson-band);border-radius:9px}.lesson-frame>.mode-signal>.mode-copy{background:var(--lesson-band);box-shadow:0 0 0 var(--space-3) var(--lesson-band);flex:none;grid-column:3}.lesson-frame>.mode-signal>.procedural-help{margin-right:var(--space-5);grid-column:4;justify-self:end}.lesson-frame>.mode-signal .procedural-help>.help-control{background:linear-gradient(color-mix(in srgb, var(--help-accent) 14%, transparent) 0 0) var(--lesson-band);width:44px;box-shadow:0 0 0 var(--space-3) var(--lesson-band);border-color:#0000;border-radius:50%;justify-content:center;padding:0}.lesson-frame>.mode-signal .procedural-help>.help-control:hover,.lesson-frame>.mode-signal .procedural-help.is-open>.help-control{background:linear-gradient(color-mix(in srgb, var(--help-accent) 24%, transparent) 0 0) var(--lesson-band);border-color:#0000}.lesson-frame>.mode-signal .procedural-help>.help-control:focus-visible{outline:2px solid var(--help-accent);outline-offset:3px}.lesson-frame .example-focus{box-shadow:none;background:0 0;border-radius:0;padding:0}.lesson-frame .example-context{border-bottom:0}.lesson-frame .meaning-check{background:0 0;border-left:0;border-radius:0;padding:0}.lesson-frame .reveal-instrument{box-shadow:none;background:0 0;border:0;padding:0}.concept-reveal .lesson-frame{padding-bottom:var(--space-6)}.concept-reveal .lesson-frame .help-control{background:color-mix(in srgb, var(--help-accent) 14%, transparent);border-color:#0000}@media (min-width:761px){.lesson-frame .guided-action{width:-moz-fit-content;width:fit-content;max-width:100%;margin:var(--space-6) auto -27px;padding:0 var(--space-3);gap:var(--space-5);background:var(--lesson-band);position:static}.lesson-frame .guided-action p{text-align:center;flex:none}}@media (max-width:760px){.lesson-frame{padding-bottom:var(--space-3);border-radius:22px}.lesson-frame .guided-action{margin-inline:calc(-1 * var(--lesson-frame-pad));padding:var(--space-5) var(--lesson-frame-pad) var(--space-3);background:linear-gradient(to top, var(--lesson-band) 72%, color-mix(in srgb, var(--lesson-band) 0%, transparent));border-radius:0 0 20px 20px}}.lesson-frame .guided-action .primary-action{border-radius:12px}.lesson-frame+.teacher-console,.lesson-frame+div{margin-top:calc(40px + var(--space-6))}.lesson-frame+div>.teacher-console{margin-top:0}:is(.listen-guided,.notice-guided,.perform-composition,.story-composition,.retrieval-composition,.reflection-composition) .teacher-console{border-top:0;padding-top:0}:is(.listen-guided,.notice-guided,.perform-composition,.story-composition,.retrieval-composition,.reflection-composition) .teacher-console .teacher-mark,:is(.listen-guided,.notice-guided,.perform-composition,.story-composition,.retrieval-composition,.reflection-composition) .teacher-console .listen-icon{background:color-mix(in srgb, currentColor 12%, transparent);box-shadow:none;opacity:1}:is(.perform-composition,.retrieval-composition,.return-composition,.story-composition,.reflection-composition) .lesson-frame .stage-heading{max-width:none;margin:0 auto var(--space-2);text-align:center}:is(.perform-composition,.retrieval-composition,.return-composition,.story-composition,.reflection-composition) .lesson-frame .stage-heading h1{text-wrap:balance;margin-inline:auto}:is(.perform-composition,.retrieval-composition,.return-composition,.story-composition,.reflection-composition) .lesson-frame .stage-heading>p{margin-inline:auto}.lesson-frame .instrument-guidance .help-control{background:color-mix(in srgb, var(--help-accent) 14%, transparent);border-color:#0000;border-radius:50%;justify-content:center;width:44px;padding:0}.lesson-frame .instrument-guidance .help-control:hover,.lesson-frame .instrument-guidance .procedural-help.is-open>.help-control{background:color-mix(in srgb, var(--help-accent) 24%, transparent);border-color:#0000}.lesson-frame .turn-wait{gap:var(--space-1);display:grid}.lesson-frame .turn-wait>.voice-countdown,.lesson-frame .turn-wait>.handoff-escape{margin-top:0}.lesson-frame .turn-wait>.handoff-escape{justify-self:start}@media (min-width:761px){.lesson-frame .instrument-footer{width:-moz-fit-content;width:fit-content;max-width:100%;margin:var(--space-6) auto -27px;padding:0 var(--space-3);background:var(--lesson-band)}}@media (max-width:760px){.lesson-frame .instrument-footer{padding-bottom:var(--space-3);flex-wrap:wrap}}.lesson-frame>.recall-instrument{padding-bottom:var(--space-6)}.lesson-frame>.recall-instrument:has(>.recall-action){padding-bottom:0}@media (max-width:760px){.lesson-frame .recall-action p{text-align:left;font-size:var(--text-xs);flex:1;display:block}}.return-composition .guided-action .help-text{top:auto;right:auto;bottom:calc(100% + var(--space-2));transform-origin:0 100%;left:0}.lesson-frame :is(.recall-prompt-translation,.story-translation){display:grid}.lesson-frame :is(.recall-prompt-translation,.story-translation) .translation-switch{margin:var(--space-4) 0 0;justify-self:center}:is(.lesson-frame .recall-controls,.return-defer) .quiet-action{min-height:44px;padding:0 var(--space-4);color:var(--chalk-dim);background:rgba(var(--flowkeys-rgb-chalk), .06);font-size:var(--text-sm);transition:color .16s var(--ease-out), background-color .16s var(--ease-out);border-radius:999px;font-weight:600}:is(.lesson-frame .recall-controls,.return-defer) .quiet-action:is(:hover,:focus-visible){color:var(--chalk);background:rgba(var(--flowkeys-rgb-tactile-light), .14)}[data-lesson-finished=true] .lesson-main{color:var(--chalk);background:radial-gradient(52rem 30rem at 50% 16rem, rgba(var(--flowkeys-rgb-signal), .15), transparent 70%), linear-gradient(rgba(var(--flowkeys-rgb-signal), .035) 1px, transparent 1px) 0 0 / 100% 32px, var(--night)}[data-lesson-finished=true] .lesson-main .procedural-help{--help-accent:var(--lavender)}[data-lesson-finished=true] .lesson-main button:focus-visible,[data-lesson-finished=true] .lesson-main [tabindex="-1"]:focus-visible{outline-color:var(--focus)}.complete-composition{--complete-band:var(--color-onboarding-band);--complete-line:rgba(var(--flowkeys-rgb-onboarding-frame), .26);width:min(680px,100%);padding-block:var(--space-7) var(--space-6);text-align:center;isolation:isolate;justify-items:center;margin:0 auto;display:grid}.complete-frame{width:100%;padding:0 var(--space-6);border:1.5px solid var(--complete-line);border-radius:24px;justify-items:center;display:grid;position:relative}.complete-frame:before{content:"";z-index:-1;background:var(--complete-band);pointer-events:none;width:100vw;position:absolute;top:-32px;bottom:-38px;left:50%;translate:-50%}.complete-badge{min-height:28px;padding:0 var(--space-3) 0 var(--space-2);color:var(--signal);background:linear-gradient(rgba(var(--flowkeys-rgb-signal), .12) 0 0) var(--complete-band);box-shadow:0 0 0 var(--space-3) var(--complete-band);font-family:var(--mono);font-size:var(--text-xs);letter-spacing:.12em;text-transform:uppercase;border-radius:999px;align-items:center;gap:6px;margin-top:-15px;display:inline-flex}.complete-mark{place-items:center;display:inline-grid;position:relative}.complete-mark>svg{width:17px;height:17px}.complete-frame h1{margin-top:var(--space-5);font-family:var(--display);font-size:var(--display-lg);letter-spacing:-.025em;text-wrap:balance;font-weight:600;line-height:.95}.complete-frame h1:focus{outline:none}.complete-note{max-width:34em;margin-top:var(--space-3);color:var(--chalk-dim);font-size:var(--text-md);line-height:1.6}.complete-record{margin:var(--space-5) 0 0;justify-items:center;gap:var(--space-2);display:grid}.complete-record>div{justify-content:center;align-items:baseline;gap:var(--space-1) var(--space-3);flex-wrap:wrap;display:flex}.complete-record dt{color:var(--signal);font-family:var(--mono);font-size:var(--text-xs);letter-spacing:.1em;text-transform:uppercase}.complete-record dd{color:var(--chalk);font-family:var(--display);font-size:var(--text-xl);margin:0;font-weight:600;line-height:1.2}.complete-frame .evidence-warning{margin-top:var(--space-3)}.complete-frame>.procedural-help{margin:var(--space-5) 0 -23px;justify-items:center;display:grid}.complete-frame>.procedural-help>.help-control{background:linear-gradient(color-mix(in srgb, var(--help-accent) 14%, transparent) 0 0) var(--complete-band);width:44px;box-shadow:0 0 0 var(--space-3) var(--complete-band);border-color:#0000;border-radius:50%;padding:0}.complete-frame>.procedural-help>.help-control:is(:hover,:focus-visible),.complete-frame>.procedural-help.is-open>.help-control{background:linear-gradient(color-mix(in srgb, var(--help-accent) 24%, transparent) 0 0) var(--complete-band);border-color:#0000}.complete-frame>.procedural-help>.help-text{width:min(420px,100%);margin-top:var(--space-4);text-align:left;position:static}.complete-dock{width:100%;margin-top:calc(var(--space-7) + 25px);justify-items:center;gap:var(--space-4);display:grid}.complete-dock .optional-lesson{justify-items:center;gap:var(--space-2);display:grid}.complete-dock .optional-lesson h2{color:var(--chalk);font-family:var(--display);font-size:var(--text-lg);font-weight:600}.complete-dock .optional-lesson p{max-width:44ch;color:var(--chalk-dim);font-size:var(--text-sm);line-height:1.55}.complete-dock .complete-key{width:min(340px,100%);min-height:60px;margin-top:var(--space-2);font-size:var(--text-md);white-space:normal;border-radius:16px}.complete-dock .complete-key svg{box-sizing:border-box;background:rgba(var(--flowkeys-rgb-night), .12);border-radius:50%;flex:none;width:30px;height:30px;padding:6px}.complete-actions{justify-content:center;gap:var(--space-2);flex-wrap:wrap;display:flex}.complete-actions .quiet-action{min-height:44px;padding:0 var(--space-4);color:var(--chalk-dim);background:rgba(var(--flowkeys-rgb-chalk), .06);font-size:var(--text-sm);transition:color .16s var(--ease-out), background-color .16s var(--ease-out);border-radius:999px;font-weight:600}.complete-actions .quiet-action:is(:hover,:focus-visible){color:var(--chalk);background:rgba(var(--flowkeys-rgb-signal), .14)}@media (max-width:680px){.complete-composition{padding-block:var(--space-6) var(--space-5)}.complete-frame{padding:0 var(--space-4);border-radius:22px}}@media (prefers-reduced-motion:reduce){.lesson-frame,.lesson-frame:before{transition:none}}
