.octo{flex:none;display:block}.octo__move,.octo__wave{transform-origin:0 0}.octo--moving.octo--happy .octo__move{animation:2.4s ease-in-out infinite octo-bob}.octo--moving.octo--happy .octo__wave{animation:.9s ease-in-out infinite alternate octo-wave}.octo--moving.octo--cheer .octo__move{animation:1.1s ease-in-out infinite octo-hop}.octo--moving.octo--listen .octo__move{animation:2.8s ease-in-out infinite octo-sway}.octo--moving.octo--oops .octo__move{animation:3.6s ease-in-out infinite octo-bob}@keyframes octo-bob{0%,to{transform:translateY(0)}50%{transform:translateY(-1.6px)}}@keyframes octo-hop{0%,60%,to{transform:translateY(0)scale(1)}20%{transform:translateY(0)scale(1.04,.96)}40%{transform:translateY(-4px)scale(.98,1.02)}}@keyframes octo-sway{0%,to{transform:rotate(-3deg)}50%{transform:rotate(3deg)}}@keyframes octo-wave{0%{transform:rotate(-9deg)}to{transform:rotate(7deg)}}@media (prefers-reduced-motion:reduce){.octo .octo__move,.octo .octo__wave{animation:none!important}}:root{--brand-cream:#f6efdd;--brand-teal:#2fb5a3;--brand-teal-under:#1d8f81;--brand-teal-behind:#177a6e;--brand-teal-shine:#8fe3d5;--brand-orange:#f28a2e;--brand-orange-cushion:#cf6519;--brand-navy:#16334a;--brand-coral:#f47e6b;--bg:#0f1117;--panel:#171a22;--panel-2:#1f232d;--line:#2a2f3b;--text:#e8eaf0;--muted:#8f97aa;--accent:#5b8cff;--next:#5b8cff;--next-soft:#5b8cff2e;--ok:#3ecf8e;--ok-soft:#c9f2dc;--ok-ink:#157347;--warn:#f0b429;--error:#ff6b6b;--star:#d8b24a;--paper:#f6f4ee;--paper-ink:#1f2937;--shadow:0 1px 2px #00000059, 0 8px 24px #00000040;--r-sm:8px;--r-md:12px;--r-lg:16px;--font:system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--font-display:var(--font);--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}body{background:var(--bg);color:var(--text);font:15px/1.5 var(--font);-webkit-font-smoothing:antialiased;margin:0}button,select,input{font-family:inherit}.app{flex-direction:column;min-height:100vh;display:flex}.topbar{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;gap:16px;padding:14px 20px 12px;display:flex}.topbar__title{font-family:var(--font-display);letter-spacing:.2px;align-items:center;gap:8px;margin:0;font-size:19px;display:flex}.topbar__mark{flex:none;width:20px;height:20px}.topbar__sub{color:var(--muted);margin:2px 0 0;font-size:13px}.segmented--mode .segmented__btn{padding:7px 16px;font-weight:600}.app-loading{place-items:center;display:grid}.app-loading .octo{animation:.4s ease-out .7s both app-loading-in}@keyframes app-loading-in{0%{opacity:0}to{opacity:1}}.unlock{border:0;border-bottom:1px solid var(--line);background:var(--accent);color:#fff;cursor:pointer;text-align:center;width:100%;padding:10px 20px;font-size:14px;font-weight:600}[data-mode=kids] .unlock{padding:14px 20px;font-size:18px;font-weight:800}.devicebar{background:var(--panel);border-bottom:1px solid var(--line);flex-wrap:wrap;align-items:center;gap:12px 18px;padding:10px 20px;display:flex}.devicebar__group{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.devicebar__group--grow{flex:1;min-width:240px}.devicebar__label{color:var(--muted);text-transform:uppercase;letter-spacing:.07em;font-size:11px;font-weight:600}.devicebar__octave{text-align:center;font-variant-numeric:tabular-nums;min-width:34px}.devicebar__tempo{text-align:center;font-variant-numeric:tabular-nums;min-width:96px}.devicebar__hint{color:var(--muted);font-size:12px}kbd{border:1px solid var(--line);background:var(--panel-2);font:inherit;border-bottom-width:2px;border-radius:4px;padding:1px 5px;font-size:11px}.segmented{border:1px solid var(--line);border-radius:var(--r-sm);background:var(--panel-2);display:inline-flex;overflow:hidden}.segmented__btn{color:var(--muted);cursor:pointer;background:0 0;border:0;padding:6px 12px;font-size:13px;transition:background .12s,color .12s}.segmented__btn:hover{color:var(--text)}.segmented__btn--on{background:var(--accent);color:#fff}.select{border:1px solid var(--line);border-radius:var(--r-sm);background:var(--panel-2);color:var(--text);max-width:280px;padding:6px 28px 6px 10px;font-size:13px}.select--compact{max-width:130px;padding:3px 24px 3px 8px;font-size:12px}.btn{border:1px solid var(--line);border-radius:var(--r-sm);background:var(--panel-2);color:var(--text);cursor:pointer;padding:6px 12px;font-size:13px;transition:border-color .12s,background .12s,transform 80ms}.btn:active{transform:translateY(1px)}.btn--ghost:hover{border-color:var(--accent)}.btn--primary{background:var(--accent);border-color:var(--accent);color:#fff;width:100%;padding:10px;font-weight:600}.btn--primary:hover{filter:brightness(1.08)}.btn--inline{width:auto;padding:7px 16px}.linkbtn{color:var(--accent);font:inherit;cursor:pointer;background:0 0;border:0;padding:0;text-decoration:underline}.toggle{color:var(--muted);cursor:pointer;align-items:center;gap:6px;font-size:13px;display:inline-flex}.toggle input{accent-color:var(--accent)}.pill{background:var(--panel-2);color:var(--muted);border-radius:12px;max-width:460px;padding:4px 10px;font-size:12px;line-height:1.4}.pill--ok{color:var(--ok);background:#3ecf8e24}.pill--warn{color:var(--warn);background:#f0b42924}.pill--error{color:var(--error);background:#ff6b6b24}.notice{border-radius:var(--r-sm);color:var(--warn);background:#f0b42924;margin:0;padding:8px 12px;font-size:13px}.main,.stats{padding:16px;overflow-y:auto}.stats{border-left:1px solid var(--line)}.main{flex-direction:column;gap:12px;min-width:0;display:flex}.main__head{flex-wrap:wrap;align-items:baseline;gap:10px;display:flex}.main__head h2{font-family:var(--font-display);margin:0;font-size:18px}.main__head span{color:var(--muted);font-size:13px}.main__stars{letter-spacing:1px;font-size:14px;color:var(--star)!important}.main__stars svg path{fill:var(--star);stroke:none}.topbar__settings{border:1px solid var(--line);border-radius:var(--r-sm);background:var(--panel-2);width:40px;height:40px;color:var(--text);cursor:pointer;flex:none;justify-content:center;align-items:center;padding:0;display:none;position:relative}.topbar__settings[aria-expanded=true]{border-color:var(--accent);color:var(--accent)}.topbar__dot{background:var(--accent);border-radius:50%;width:8px;height:8px;position:absolute;top:6px;right:6px}.instr{flex:none;position:relative}.instr__button{border:1px solid var(--line);border-radius:var(--r-sm);background:var(--panel-2);cursor:pointer;justify-content:center;align-items:center;width:40px;height:40px;padding:0;display:inline-flex}.instr__button[aria-expanded=true]{border-color:var(--accent)}.instr__menu{z-index:40;border:1px solid var(--line);border-radius:var(--r-md);background:var(--panel);grid-template-columns:repeat(2,minmax(0,1fr));gap:4px;width:280px;max-width:calc(100vw - 24px);padding:6px;animation:.14s ease-out instr-in;display:grid;position:absolute;top:calc(100% + 8px);right:0;box-shadow:0 12px 32px #0006}.instr__item{border-radius:var(--r-sm);color:var(--text);font:inherit;text-align:left;cursor:pointer;background:0 0;border:1px solid #0000;align-items:center;gap:8px;padding:6px 8px;font-size:13px;display:flex}.instr__item:hover{background:var(--panel-2)}.instr__item--on{border-color:var(--accent);background:var(--panel-2)}.instr__item--loading{opacity:.6}@keyframes instr-in{0%{opacity:0;transform:translateY(-4px)}}@media (prefers-reduced-motion:reduce){.instr__menu{animation:none}}.score{background:var(--paper);border-radius:var(--r-md);min-height:160px;box-shadow:var(--shadow);padding:10px 12px 6px}.score__canvas{width:100%}.score__canvas svg{display:block}.score__notice{color:#444;margin:8px;font-size:13px}.score__notice--error{color:#b42318}.coach{border:1px solid var(--line);border-left:4px solid var(--line);border-radius:var(--r-md);background:var(--panel);align-items:center;gap:12px;min-height:56px;padding:10px 14px;transition:border-color .12s,background .12s;display:flex;position:relative;overflow:hidden}.coach__body{flex-direction:column;gap:2px;min-width:0;display:flex}.coach__icon{flex-shrink:0;font-size:34px;line-height:1}.coach__text{font-size:16px;font-weight:600;line-height:1.35}.coach__detail{color:var(--muted);font-size:13px}.coach--good{border-left-color:var(--ok)}.coach--good .coach__text{color:var(--ok)}.coach--oops{border-left-color:var(--error)}.coach--oops .coach__text{color:var(--error)}.coach--hold{border-left-color:var(--next)}.coach--hold .coach__text{color:var(--next)}.coach--done{border-left-color:var(--ok)}.coach--done .coach__text{color:var(--ok)}.playarea{grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:14px;display:grid}.piano-scroll{overscroll-behavior-x:contain;min-width:0;overflow-x:auto}.piano{--key-held:#b9c2d6;--key-demo:color-mix(in srgb, var(--next) 32%, #f4f5f7);--key-demo-black:color-mix(in srgb, var(--next) 55%, #23262e);-webkit-user-select:none;user-select:none;touch-action:pan-x;width:100%;height:auto;max-height:150px;display:block}.key{cursor:pointer;transform-box:fill-box;transform-origin:50%;transition:fill 90ms linear}.key--white{fill:#f4f5f7;stroke:#9aa0ad;stroke-width:1px}.key--black{fill:#23262e;stroke:#0c0e12;stroke-width:1px}.key--expected{fill:var(--next)}.key--satisfied{fill:var(--ok-soft)}.key--black.key--satisfied{fill:#2f8f5e}.key--held{fill:var(--key-held)}.key--wrong{fill:var(--error)}.key__hold{fill:var(--ok);opacity:.75;pointer-events:none}.key__tick{fill:var(--ok-ink);text-anchor:middle;pointer-events:none;font-size:22px;font-weight:800}.key__tick--black{fill:#fff;font-size:16px}.key__label{fill:#6b7280;text-anchor:middle;pointer-events:none;font-size:9px}.key--expected~.key__label{fill:#fff}.key__tip rect{fill:var(--next);stroke:#fff;stroke-width:2.5px;pointer-events:none}.key__tip--done rect{fill:var(--ok-ink)}.key__tip-number{fill:#fff;text-anchor:middle;pointer-events:none;font-size:19px;font-weight:800}.key__tip-number--black{font-size:12px}.key__strip{opacity:.85;pointer-events:none}.key__letter{fill:#4b5563;text-anchor:middle;pointer-events:none;font-size:13px;font-weight:700}.marker{pointer-events:none}.piano--kids .marker,.activity--kids .marker{animation:.7s ease-in-out infinite bounce}.marker__letter{text-anchor:middle;font-size:18px;font-weight:800}.key--demo{fill:var(--key-demo)}.key--black.key--demo{fill:var(--key-demo-black)}.piano--kids .key--demo{fill:#ffd60a;animation:.5s ease-in-out infinite pulse}.hint-arrow__path{fill:none;stroke:var(--next);stroke-width:3.5px;stroke-linecap:round;stroke-dasharray:6 6}.hint-arrow__head{fill:var(--next)}.piano--kids .hint-arrow__path{animation:.7s linear infinite dash}.piano--kids .hint-arrow__head{animation:.7s ease-in-out infinite bounce}.piano:not(.piano--kids) .hint-arrow{animation:.16s ease-out hint-in}.piano:not(.piano--kids) .hint-arrow__path{stroke-width:2.5px;stroke-dasharray:5 4}@keyframes hint-in{0%{opacity:0}}@keyframes dash{to{stroke-dashoffset:-24px}}.legend{color:var(--muted);flex-wrap:wrap;gap:14px;margin:0;padding:0;font-size:12px;list-style:none;display:flex}.legend li{align-items:center;gap:6px;display:inline-flex}.legend__swatch{border-radius:4px;justify-content:center;align-items:center;width:16px;height:16px;font-size:11px;font-weight:800;display:inline-flex}.legend__swatch--next{background:var(--next)}.legend__swatch--done{background:var(--ok-soft);color:var(--ok-ink)}.legend__swatch--wrong{background:var(--error)}.legend__swatch--hold{background:linear-gradient(to top, var(--ok) 55%, var(--ok-soft) 55%)}:root{--hand-skin:#fde7d0;--hand-edge:#d9ae86;--hand-ink:#8a6546}.hand__outline{fill:var(--hand-edge);stroke:var(--hand-edge);stroke-width:3.2px;stroke-linejoin:round}.hand__palm,.hand__finger{fill:var(--hand-skin);transition:fill .12s linear}.hand__finger--active{fill:var(--next);animation:.9s ease-in-out infinite pulse}.hand__finger--done{fill:var(--ok-soft)}.hand__number{fill:var(--hand-ink);text-anchor:middle;pointer-events:none;font-size:10px;font-weight:800}.hand__number--active{fill:#fff}.hand__number--done{fill:var(--ok-ink)}.stats{flex-direction:column;gap:16px;display:flex}.stats__bar{background:var(--panel-2);border-radius:999px;height:6px;overflow:hidden}.stats__fill{background:var(--accent);height:100%;transition:width .12s linear}.stats__progress-label{color:var(--muted);font-variant-numeric:tabular-nums;margin-top:6px;font-size:13px;display:block}.stats__progress-label strong{color:var(--text);font-size:18px}.stats__caption{text-transform:uppercase;letter-spacing:.06em;color:var(--muted);font-size:11px}.stats__done{border-radius:var(--r-sm);color:var(--ok);background:#3ecf8e1f;flex-direction:column;gap:3px;padding:11px;font-size:13px;display:flex}.stats__grid{grid-template-columns:1fr 1fr;gap:12px 10px;margin:0;display:grid}.stats__grid dt{color:var(--muted);text-transform:uppercase;letter-spacing:.05em;font-size:11px}.stats__grid dd{font-variant-numeric:tabular-nums;margin:1px 0 0;font-size:20px;font-weight:600}.stats__trouble ul{flex-direction:column;gap:4px;margin:6px 0 0;padding:0;font-size:12px;list-style:none;display:flex}.stats__trouble li{color:var(--muted);justify-content:space-between;display:flex}.kids{text-align:center;align-items:stretch}.kids__bar{background:var(--panel-2);border-radius:999px;height:14px;overflow:hidden}.kids__fill{background:linear-gradient(90deg,#f4832b,#f2c230);border-radius:999px;height:100%;transition:width .16s ease-out}.kids__count{color:var(--muted);margin-top:8px;font-size:18px}.kids__count strong{color:var(--text);font-size:30px}.kids__streak{flex-direction:column;align-items:center;padding:10px 0;display:flex}.kids__streak-num{color:var(--accent);font-size:44px;font-weight:800;line-height:1}.kids__streak-label{color:var(--muted);font-size:14px}.kids__stars{letter-spacing:4px;padding:6px 0;font-size:44px}.kids__star{color:#e5d9c8}.kids__star--on{color:#f2c230;text-shadow:0 2px #00000014}.kids__best{color:var(--muted);font-size:14px}.kids__restart{border-radius:var(--r-lg);padding:13px;font-size:17px}.activity{border-radius:var(--r-md);background:var(--paper);min-height:200px;color:var(--paper-ink);box-shadow:var(--shadow);justify-content:center;align-items:center;padding:16px;display:flex}.activity__keys{filter:drop-shadow(0 2px 4px #00000026);width:min(420px,100%);height:auto}.activity__key{fill:#fff;stroke:#b8bcc6}.activity__key--lit{stroke:#1f2937;stroke-width:2px}.activity__key-letter{fill:#1f2937;text-anchor:middle;font-size:18px;font-weight:800}.activity__black{fill:#2f2a3a;stroke:#1e1a26}.activity__black--lit{fill:var(--next);stroke:#1f2937;stroke-width:2px}.activity--kids .activity__black--lit{animation:.9s ease-in-out infinite pulse}.pic{flex-direction:column;align-items:center;gap:14px;display:flex}.pic__pair{align-items:center;gap:18px;display:flex}.pic__pair--left{flex-direction:row-reverse}.pic__dyn,.pic__ear,.pic__finger{align-items:center;gap:12px;display:flex}.pic__number{background:var(--next);color:#fff;border-radius:50%;justify-content:center;align-items:center;width:84px;height:84px;font-size:52px;font-weight:800;display:inline-flex}.mini{width:min(320px,100%);height:auto}.mini__key{fill:#fff;stroke:#b8bcc6}.mini__key--lit{fill:var(--next);stroke:#1f2937;animation:.9s ease-in-out infinite pulse}.mini__black{fill:#2f2a3a}.activity__black-marker{fill:var(--next)}.prestaff{width:100%;max-height:180px}.prestaff__note--todo{opacity:.45}.prestaff__note--done{opacity:.85}.prestaff__ring{fill:none;stroke:var(--next);stroke-width:3px;animation:.9s ease-in-out infinite pulse}.prestaff__head{fill:var(--note)}.activity:not(.activity--kids) .prestaff__head{fill:var(--paper-ink)}.activity:not(.activity--kids) .prestaff__note--current .prestaff__head{fill:var(--next)}.activity:not(.activity--kids) .prestaff__ring{animation:none}.prestaff__letter{fill:#fff;text-anchor:middle;pointer-events:none;font-size:15px;font-weight:800}.beat{border-radius:var(--r-md);background:var(--paper);color:var(--paper-ink);box-shadow:var(--shadow);padding:16px}.beat__stage{flex-direction:column;align-items:center;gap:14px;display:flex}.beat__pulse{border:4px solid var(--next);background:#eef3ff;border-radius:50%;justify-content:center;align-items:center;width:120px;height:120px;font-size:48px;font-weight:800;display:flex}.beat__pulse--live{animation:.26s ease-out beatpulse}.beat__pulse--accent{background:#dbe6ff}.beat__dots{flex-wrap:wrap;justify-content:center;gap:8px;display:flex}.beat__dot{background:#e5e7eb;border-radius:50%;width:14px;height:14px}.beat__dot--on{background:var(--ok)}.beat__status{text-align:center;min-height:24px;font-size:16px}.pic__hand{width:min(260px,40vw);height:auto;overflow:visible}.pic__finger--left{flex-direction:row-reverse}.pic__hands{justify-content:space-between;align-items:flex-end;gap:8%;width:min(640px,100%);display:flex}.pic__hands .pic__hand{width:44%;transition:opacity .2s,transform .2s}.pic__hand--off{opacity:.25;transform:scale(.85)}.pic__hand--on{transform:scale(1.05)}.activity__keys--adult{filter:none}.activity__keys--adult .activity__key{fill:#fff;stroke:color-mix(in srgb, var(--paper-ink) 45%, transparent)}.activity__keys--adult .activity__key--lit{fill:color-mix(in srgb, var(--next) 28%, #fff);stroke:var(--next);stroke-width:2px}.activity__keys--adult .activity__key-letter{fill:var(--paper-ink)}.activity__keys--adult .activity__black{fill:var(--paper-ink);stroke:var(--paper-ink)}.activity__keys--adult .activity__black--lit{fill:var(--next);stroke:var(--paper-ink);stroke-width:2px}.activity__marker{fill:var(--next)}.mini--adult .mini__key{fill:#fff;stroke:color-mix(in srgb, var(--paper-ink) 40%, transparent)}.mini--adult .mini__key--lit{fill:color-mix(in srgb, var(--next) 30%, #fff);stroke:var(--next);animation:none}.mini--adult .mini__black{fill:var(--paper-ink)}.pic__caption{color:#5f6470;font-size:14px}.pic__dynamic{color:var(--paper-ink);font-family:Georgia,Times New Roman,serif;font-size:64px;font-style:italic;font-weight:700;line-height:1}.pic__listen{color:var(--paper-ink)}.steps{width:min(220px,100%);height:auto}.steps__step{fill:color-mix(in srgb, var(--paper-ink) 18%, transparent)}.steps__step--on{fill:var(--next)}.chips{flex-direction:column;align-items:center;gap:8px;display:flex}.chips__label{color:#5f6470;font-size:13px;font-weight:600}.chips__row{gap:6px;display:flex}.chips__chip{border:1.5px solid color-mix(in srgb, var(--paper-ink) 35%, transparent);border-radius:var(--r-sm);width:32px;height:32px;color:var(--paper-ink);font-variant-numeric:tabular-nums;justify-content:center;align-items:center;font-size:15px;font-weight:600;transition:background-color .15s,border-color .15s,color .15s;display:inline-flex}.chips__chip--on{background:var(--next);border-color:var(--next);color:#fff}.chips--muted{opacity:.4}.pic__chips-pair{flex-wrap:wrap;justify-content:center;align-items:flex-end;gap:16px 40px;display:flex}.beat__pulse--start{cursor:pointer;width:180px;height:180px;font-size:84px;animation:1.6s ease-in-out infinite pulse}.pic__hand{width:auto;height:min(190px,25dvh)}.pic__hands{--pic-hand:min(170px, 23dvh, 36vw);gap:calc(var(--pic-hand) * .16);max-width:100%}.pic__hands .pic__hand{width:auto;height:var(--pic-hand)}@keyframes shake{0%,to{transform:translate(0)}20%{transform:translate(-4px)}40%{transform:translate(4px)}60%{transform:translate(-3px)}80%{transform:translate(3px)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.72}}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-7px)}}@keyframes pop{0%{transform:scale(.97)}60%{transform:scale(1.02)}to{transform:scale(1)}}@keyframes beatpulse{0%{transform:scale(1.18);box-shadow:0 0 #5b8cff73}to{transform:scale(1);box-shadow:0 0 0 26px #5b8cff00}}@media (prefers-reduced-motion:reduce){.marker,.key--expected,.key--wrong,.key--demo,.hint-arrow__path,.hint-arrow__head,.hand__finger--active,.prestaff__ring,.activity__black--lit,.mini__key--lit,.kids__dot--now,.beat__pulse--live,.beat__pulse--start,.picker__button--loading,.start__play,.coach--oops,.coach--good{animation:none!important}}:root[data-mode=kids]{--bg:#fff6ea;--panel:#fff;--panel-2:#ffefdc;--line:#f0d9bf;--text:#2b2d42;--muted:#7d7169;--accent:#ff8c42;--next:#3b6cff;--next-soft:#3b6cff24;--ok:#2fb573;--warn:#c98a00;--error:#ef476f;--paper:#fff;--shadow:0 1px 2px #50321414, 0 8px 24px #50321414;--r-sm:12px;--r-md:16px;--r-lg:20px;--font-display:"Nunito", var(--font);--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}:root[data-mode=kids] body{font-family:"Nunito", var(--font);font-size:17px;font-weight:600}[data-mode=kids] .topbar__title{font-size:24px;font-weight:800}[data-mode=kids] .topbar__sub{font-size:15px}[data-mode=kids] .devicebar{background:var(--panel)}[data-mode=kids] .lesson{padding:10px}[data-mode=kids] .lesson__icon{border-radius:10px;width:34px;height:34px;font-size:20px}[data-mode=kids] .lesson__title{font-size:15px;font-weight:800}[data-mode=kids] .lesson--on{border-color:var(--accent);background:#fff1df}[data-mode=kids] .lesson__next{color:#c85f12;background:#ff8c422e}[data-mode=kids] .level__blurb,[data-mode=kids] .level__age{font-size:12px}[data-mode=kids] .score,[data-mode=kids] .activity,[data-mode=kids] .beat{border:2px solid var(--line);box-shadow:none}[data-mode=kids] .coach{text-align:center;border-width:2px;justify-content:center;min-height:90px;padding:14px 20px}[data-mode=kids] .coach__icon{font-size:44px}[data-mode=kids] .hand__finger--active{transform-box:fill-box;transform-origin:bottom;animation:.6s ease-in-out infinite wiggle}@keyframes wiggle{0%,to{transform:rotate(-4deg)}50%{transform:rotate(4deg)}}.kids__dots{flex-wrap:wrap;justify-content:center;gap:6px;display:flex}.kids__dot{background:var(--panel-2);border:2px solid var(--line);border-radius:50%;width:16px;height:16px}.kids__dot--on{background:var(--ok);border-color:var(--ok)}.kids__dot--now{border-color:var(--next);animation:.9s ease-in-out infinite pulse}.kids__stars--won .kids__star--on{animation:.5s cubic-bezier(.34,1.56,.64,1) both star-in;animation-delay:calc(var(--i) * .18s);display:inline-block}@keyframes star-in{0%{transform:scale(0)rotate(-30deg)}to{transform:scale(1)rotate(0)}}[data-mode=kids] .coach__text{font-family:var(--font-display);font-size:26px;font-weight:800}[data-mode=kids] .coach__detail{font-size:16px}[data-mode=kids] .coach--oops{background:#fff0f3;border-color:#ef476f73;animation:.26s ease-out pop}[data-mode=kids] .coach--good{background:#eefaf3;border-color:#2fb57373;animation:.22s ease-out pop}[data-mode=kids] .coach--hold{background:#eef3ff;border-color:#3b6cff73}[data-mode=kids] .piano{max-height:260px}[data-mode=kids] .key--white{fill:#fffdf9;stroke:#d9cbb8}[data-mode=kids] .key--black{fill:#2f2a3a;stroke:#1e1a26}[data-mode=kids] .key--expected{stroke:var(--next);stroke-width:3px;animation:.9s ease-in-out infinite pulse}[data-mode=kids] .key--wrong{stroke:#b3123f;stroke-width:2px;animation:.32s ease-out shake}[data-mode=kids] .key--satisfied{stroke:#1c7a4c;stroke-width:2px}[data-mode=kids] .legend{justify-content:center;font-size:14px}[data-mode=kids] .legend__swatch{border-radius:6px;width:20px;height:20px}[data-mode=kids] .beat__pulse{width:160px;height:160px;font-size:64px}[data-mode=kids] .beat__status{font-size:22px;font-weight:800}[data-mode=kids] .btn--primary{font-weight:800}[data-mode=kids] .key--white.key--many{fill:#fff;stroke-width:4px}[data-mode=kids] .key--black.key--many,[data-mode=kids] .key--black.key--expected{fill:#2f2a3a;stroke-width:4px}[data-mode=kids] .key--white.key--expected{stroke:#2b2d42;stroke-width:4px}@media (width<=1000px){.stats{border-left:0;border-top:1px solid var(--line)}.playarea{grid-template-columns:1fr}.hands{justify-content:center}}@media (width<=700px){.topbar,.devicebar,.main,.stats{padding-left:16px;padding-right:16px}.topbar{flex-wrap:wrap;gap:8px 16px}.topbar__settings{display:inline-flex}.app:not(.app--focus)>.settings-panel:not(.settings-panel--open),.topbar__sub,.devicebar__hint{display:none}.piano-body{min-width:var(--piano-min)}.piano{max-height:190px}[data-mode=kids] .piano{max-height:260px}[data-mode=kids] .coach__text{font-size:21px}.activity__big{font-size:40px}[data-mode=kids] .activity__big{font-size:48px}}@media (width<=560px){.topbar{flex-wrap:nowrap;gap:8px;padding:10px 12px}.topbar__text{display:none}.topbar .segmented--tab{margin-left:0}.topbar .segmented__btn{padding:7px 11px}.topbar__settings{margin-left:auto}}@media (width<=700px){.app:not(.app--focus) .main>.score{overscroll-behavior:contain;max-height:44dvh;overflow-y:auto}}.piano--gentle .key--wrong{fill:#f6c56b;stroke:#c98a00;stroke-width:2px;animation:none}.kids__streak--quiet{opacity:.5;font-size:40px}.tip{border-radius:var(--r-md);background:var(--panel-2);text-align:left;margin-top:auto;padding:10px 12px}.tip__label{text-transform:uppercase;letter-spacing:.06em;color:var(--muted);font-size:11px;font-weight:700;display:block}.tip__text{color:var(--text);margin:4px 0 0;font-size:13px;font-weight:500;line-height:1.4}.done{border:1px solid var(--line);border-left:4px solid var(--ok);border-radius:var(--r-md);background:var(--panel);flex-wrap:wrap;align-items:center;gap:18px;padding:14px 16px;display:flex}.done__stars{letter-spacing:2px;font-size:30px}.done__star{color:var(--line)}.done__star--on{color:var(--star);display:inline-block}.done--kids .done__star--on{color:#f2c230;animation:.5s cubic-bezier(.34,1.56,.64,1) both star-in;animation-delay:calc(var(--i) * .16s)}.done:not(.done--kids) .done__star svg path{fill:var(--line);stroke:none}.done:not(.done--kids) .done__star--on svg path{fill:var(--star)}.done__secondary{gap:8px;display:flex}[data-mode=kids] .done{background:#eefaf3;border-width:2px;border-color:#2fb57373;justify-content:center;padding:18px 20px}[data-mode=kids] .done__stars{font-size:48px}@media (prefers-reduced-motion:reduce){.done--kids .done__star--on{animation:none}}body:has(.app--focus){overscroll-behavior:none;overflow:hidden}.app--focus{touch-action:manipulation;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;height:100dvh;min-height:0;overflow:hidden}.app--focus .focus__stage.songs-scroll,.app--focus .focus__stage>.score{touch-action:pan-y}.app--focus input,.app--focus textarea,.app--focus select{-webkit-user-select:auto;user-select:auto}.focus{box-sizing:border-box;height:100dvh;padding:max(12px, env(safe-area-inset-top)) max(16px, env(safe-area-inset-right)) max(12px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left));flex-direction:column;gap:12px;display:flex}.focus__top{flex:none;align-items:center;gap:12px;min-width:0;min-height:48px;display:flex}.focus__top>*{flex:none}.focus__top>.focus__nav{flex:0 auto;min-width:0}.focus__top>.focus__dots{flex:1 .1 120px;min-width:44px;overflow:hidden}.focus .kids__dots{flex-wrap:nowrap;justify-content:flex-start;gap:clamp(2px,4%,5px)}.focus .kids__dot{aspect-ratio:1;flex:1 1 0;min-width:2px;max-width:16px;height:auto}.focus__listen{border:2px solid var(--line);background:var(--panel);cursor:pointer;border-radius:50%;flex:none;width:52px;height:52px;font-size:26px}.focus__listen[aria-pressed=true]{border-color:var(--next);color:var(--next)}@property --hold-deg{syntax:"<angle>";inherits:false;initial-value:0deg}.hold{width:44px;height:44px;color:var(--muted);opacity:.45;cursor:pointer;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;background:0 0;border:0;border-radius:50%;flex:none;margin-left:auto;position:relative}.hold:hover,.hold:focus-visible,.hold--on{opacity:1}.hold__glyph{font-size:20px;position:relative}.hold__ring{background:conic-gradient(var(--accent) var(--hold-deg), transparent 0);border-radius:50%;position:absolute;inset:0;-webkit-mask:radial-gradient(circle,#0000 17px,#000 18px);mask:radial-gradient(circle,#0000 17px,#000 18px)}.hold--on .hold__ring{animation:hold-fill var(--hold-ms,1.5s) linear forwards}@keyframes hold-fill{to{--hold-deg:360deg}}.focus__stage{flex-direction:column;flex:auto;min-height:0;display:flex;overflow:hidden}.focus__stage>.activity,.focus__stage>.beat{flex:1;min-height:0}.focus__stage>.score{-webkit-overflow-scrolling:touch;flex:1;min-height:0;overflow:hidden auto}.focus>.coach,.focus>.done,.focus>.playarea{flex:none}.app--focus .piano{max-height:min(260px,30dvh)}.app--focus{position:relative}.art{z-index:0;pointer-events:none;width:100%;height:100%;position:absolute;inset:0}.focus{z-index:1;position:relative}.art--front{z-index:2}.app--focus .activity,.app--focus .coach,.app--focus .done,.app--focus .beat{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#ffffffd1;border-color:#ffffffe6;box-shadow:0 6px #2b2d4214}.freestyle{box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none;background:0 0;border-color:#0000;flex:1}.app--focus .activity:has(.activity__free){box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none;background:0 0;border-color:#0000;flex:1}.app--focus .focus__listen,.app--focus .hold{opacity:1;background:#ffffffd9}.picker{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#ffffffd1;border-radius:22px;flex-wrap:wrap;flex:none;justify-content:center;gap:10px 22px;padding:10px 14px;display:flex;box-shadow:0 6px #2b2d4214}.picker__group{gap:8px;display:flex}.picker__button{cursor:pointer;background:#fff;border:3px solid #0000;border-radius:20px;place-items:center;width:64px;height:64px;padding:0;transition:transform .12s;display:grid;box-shadow:0 4px #d9dbe6}.picker__button:active{transform:translateY(3px);box-shadow:0 1px #d9dbe6}.picker__button[aria-pressed=true]{border-color:var(--next);box-shadow:0 4px #2f55c9}.picker__button--loading{animation:1.2s ease-in-out infinite pulse}@media (width<=700px){.picker{gap:8px 12px;padding:8px}.picker__button{border-radius:16px;width:50px;height:50px}.picker__button canvas,.picker__button svg{transform:scale(.8)}}.start{z-index:50;cursor:pointer;background:#fff6eaf0;border:0;place-items:center;display:grid;position:fixed;inset:0}.start__invite{--octo:min(150px, 30vw, 26vh);justify-items:center;display:grid}.start__octo{z-index:1;width:var(--octo);height:var(--octo);margin-bottom:calc(var(--octo) * -.16);position:relative}.start__play{background:var(--accent);color:#fff;border-radius:50%;place-items:center;width:160px;height:160px;padding-left:12px;font-size:72px;animation:1.6s ease-in-out infinite pulse;display:grid;box-shadow:0 10px 30px #ff8c4259}.drawer{border:0;border-left:1px solid var(--line);background:var(--bg);width:min(480px,100vw);max-width:100vw;height:100dvh;max-height:100dvh;color:var(--text);overscroll-behavior:contain;margin:0 0 0 auto;padding:0;overflow-y:auto}.drawer::backdrop{background:#281e1459}.drawer__inner{padding:max(16px, env(safe-area-inset-top)) max(18px, env(safe-area-inset-right)) max(24px, env(safe-area-inset-bottom)) 18px;flex-direction:column;gap:18px;display:flex}.drawer__head{justify-content:space-between;align-items:center;display:flex}.drawer__title{margin:0;font-size:20px}.drawer__section{flex-direction:column;gap:10px;display:flex}.drawer__heading{text-transform:uppercase;letter-spacing:.07em;color:var(--muted);margin:0;font-size:12px;font-weight:700}.drawer__desc{color:var(--muted);margin:2px 0 0;font-size:14px;font-weight:500}.drawer__actions{flex-wrap:wrap;gap:8px;display:flex}.drawer__actions .btn{min-height:44px}.drawer .devicebar{background:0 0;border:0;flex-direction:column;align-items:stretch;gap:12px;padding:0}.drawer .devicebar__group--grow{min-width:0}@media (width<=700px){.focus{gap:10px}.app--focus .piano{max-height:min(200px,28dvh)}}@media (height<=520px) and (orientation:landscape){.focus{grid-template-rows:auto minmax(0,1fr) auto;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:8px 12px;display:grid}.focus__top{grid-column:1/-1;min-height:40px}.focus__stage{grid-area:2/1}.focus>.coach,.focus>.done{grid-area:2/2;align-self:stretch;min-height:0}.focus>.playarea{grid-area:3/1/auto/-1}.app--focus .piano{max-height:40dvh}[data-mode=kids] .focus .coach__text{font-size:19px}[data-mode=kids] .focus .coach__icon{font-size:30px}.focus__listen{width:40px;height:40px;font-size:20px}}@media (prefers-reduced-motion:reduce){.hold--on .hold__ring{animation-duration:1ms}}.focus__stage .activity{align-items:stretch}.focus__stage .prestaff{width:100%;height:100%;max-height:none}@media (width>=701px) and (height>=700px){.app--focus .piano{max-height:min(320px,34dvh)}}.playarea{grid-template-columns:minmax(0,1fr)!important}.piano-body{width:100%}.handrow-box{width:100%;max-height:clamp(110px, calc(var(--hand-full,190px) * .6), 22dvh);margin:6px auto 0;position:relative;overflow:hidden}.handrow{position:absolute;inset:0}.handrow__hand{height:100%;transition:left .22s;position:absolute;top:0}@media (height<=520px) and (orientation:landscape){.handrow-box{display:none}}@media (prefers-reduced-motion:reduce){.handrow__hand{transition:none}}.focus__nav{align-items:center;gap:4px;display:flex}.focus__nav>*{flex:none}.focus__nav>.focus__lesson{flex:0 auto;min-width:0}.focus__step,.focus__lesson{color:var(--text);cursor:pointer;background:#ffffffd9;border:0;align-items:center;display:inline-flex;box-shadow:0 3px #2b2d421a}.focus__step{border-radius:50%;flex:none;justify-content:center;width:40px;height:40px}.focus__lesson{height:48px;font:inherit;border-radius:24px;gap:6px;padding:0 14px 0 6px;font-size:15px;font-weight:800}.focus__lesson>*{flex:none}.focus__lesson canvas{display:block}.focus__lesson>.focus__lesson-title{white-space:nowrap;text-overflow:ellipsis;flex:0 auto;min-width:0;max-width:180px;overflow:hidden}.focus__step:active,.focus__lesson:active{transform:translateY(2px);box-shadow:0 1px #2b2d421a}.focus__top .segmented--mode{background:#ffffffd9;border:0;border-radius:20px;flex:none;box-shadow:0 3px #2b2d421a}.focus__top .segmented--mode .segmented__btn{min-height:40px;padding:8px 14px;font-weight:800}@media (width<=700px){.focus__lesson-title,.focus__lesson-more{display:none}.focus__lesson{padding:0 4px}.focus__top{gap:8px}.focus__top .segmented--mode .segmented__btn{padding:6px 9px;font-size:12px}}@media (width<=600px) and (orientation:portrait){.focus__top{flex-wrap:wrap;row-gap:0}.focus__top>.focus__nav,.focus__top>.focus__lesson{order:1}.focus__top>.segmented--mode:not(.segmented--tab){order:2;margin-left:auto}.focus__top>.hold{order:3;margin-left:0}.focus__top:after{content:"";flex:0 0 100%;order:4;height:8px}.focus__top>.segmented--tab{order:5}.focus__top>.focus__dots{flex-basis:44px;order:6}.focus__top>.focus__listen,.focus__top>.songs-play{order:7}}@media (width<=340px){.focus__top{column-gap:4px}}@media (width<=700px){.app--focus .coach__detail{display:none}}.app--focus .focus:has(.handrow-box){padding-bottom:0}.app--focus .handrow-box{max-height:calc(clamp(110px, calc(var(--hand-full,190px) * .6), 22dvh) + max(12px, env(safe-area-inset-bottom)))}.app--focus .instr__button{background:#ffffffd9;border:0;border-radius:50%;width:48px;height:48px;box-shadow:0 2px 8px #2b2d421f}.app--focus .instr__menu{background:#fff;border:0;border-radius:22px;grid-template-columns:repeat(4,64px);gap:8px;width:auto;padding:10px;box-shadow:0 14px 36px #2b2d4238}.app--focus .instr__item{background:#f6f1ea;border:3px solid #0000;border-radius:18px;justify-content:center;width:64px;height:64px;padding:0}.app--focus .instr__item--on{border-color:var(--accent);background:#fff}@media (width<=600px) and (orientation:portrait){.focus__top>.instr{order:7}.app--focus .instr__menu{grid-template-columns:repeat(4,56px)}.app--focus .instr__item{width:56px;height:56px}}.pic__critter{display:block;overflow:visible}.pic__critter--bob{animation:2.4s ease-in-out infinite critter-bob}.pic__critter--breathe{transform-origin:50% 90%;animation:3.2s ease-in-out infinite critter-breathe}.pic__critter--faded{opacity:.32}.pic__critter--fly{animation:2.6s ease-in-out infinite critter-fly}.pic__critter--fly .critter__wings{transform-box:fill-box;transform-origin:50%;animation:.42s ease-in-out infinite alternate critter-flap}.pic__critter--stomp{transform-origin:50% 95%;animation:1.8s cubic-bezier(.45,0,.55,1) infinite critter-stomp}@keyframes critter-bob{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}@keyframes critter-breathe{0%,to{transform:scale(1)}50%{transform:scale(1.03,.97)}}@keyframes critter-fly{0%,to{transform:translateY(0)rotate(-3deg)}50%{transform:translateY(-14px)rotate(3deg)}}@keyframes critter-flap{0%{transform:scaleY(1)}to{transform:scaleY(.55)}}@keyframes critter-stomp{0%,60%,to{transform:translateY(0)scale(1)}30%{transform:translateY(-10px)scale(.96,1.04)}45%{transform:translateY(0)scale(1.08,.9)}}.pic__pair{align-items:flex-end}.pic__curve{align-self:center;animation:1.6s ease-in-out infinite critter-bob}.pic__dyn--soft .pic__rings{width:30px}.pic__rings{width:70px;overflow:visible}.pic__rings path{opacity:0;animation:1.6s ease-out infinite ring-out}@keyframes ring-out{0%{opacity:0;transform:translate(-6px)}30%{opacity:1}to{opacity:0;transform:translate(10px)}}.pic__notes{width:110px;height:120px;position:relative}.pic__note{opacity:0;animation:1.8s ease-in-out infinite note-drift;position:absolute;top:55%;left:0}@keyframes note-drift{0%{opacity:0;transform:translate(0)scale(.8)}25%{opacity:1}to{opacity:0;transform:translate(90px,-40px)scale(.6)}}.stairs{aspect-ratio:210/140;width:min(320px,72%);position:relative}.stairs__steps{width:100%;height:100%;display:block}.stairs__walker{width:26%;height:auto;margin-bottom:-2%;margin-left:-13%;animation:4.2s cubic-bezier(.45,0,.55,1) infinite stairs-up;position:absolute}.stairs--down .stairs__walker{animation-name:stairs-down}@keyframes stairs-up{0%{opacity:0;bottom:20%;left:9.5%}4%{opacity:1;bottom:20%;left:9.5%}12%{opacity:1;bottom:51.1%;left:19.5%}20%{opacity:1;bottom:37.1%;left:29.5%}28%{opacity:1;bottom:68.3%;left:39.5%}36%{opacity:1;bottom:54.3%;left:49.5%}44%{opacity:1;bottom:85.4%;left:59.5%}52%{opacity:1;bottom:71.4%;left:69.5%}60%{opacity:1;bottom:102.6%;left:79.5%}68%{opacity:1;bottom:88.6%;left:89.5%}92%{opacity:1;bottom:88.6%;left:89.5%}to{opacity:0;bottom:88.6%;left:89.5%}}@keyframes stairs-down{0%{opacity:0;bottom:88.6%;left:89.5%}4%{opacity:1;bottom:88.6%;left:89.5%}12%{opacity:1;bottom:102.6%;left:79.5%}20%{opacity:1;bottom:71.4%;left:69.5%}28%{opacity:1;bottom:85.4%;left:59.5%}36%{opacity:1;bottom:54.3%;left:49.5%}44%{opacity:1;bottom:68.3%;left:39.5%}52%{opacity:1;bottom:37.1%;left:29.5%}60%{opacity:1;bottom:51.1%;left:19.5%}68%{opacity:1;bottom:20%;left:9.5%}92%{opacity:1;bottom:20%;left:9.5%}to{opacity:0;bottom:20%;left:9.5%}}@media (prefers-reduced-motion:reduce){.pic__critter,.pic__critter--fly .critter__wings,.pic__curve,.pic__rings path,.pic__note,.stairs__walker{animation:none}.pic__rings path,.pic__note{opacity:1}}.activity--kids .pic__critter{width:auto;height:min(180px,24dvh)}.activity--kids .pic__critter--faded{height:min(100px,13dvh)}.activity--kids .pic__dyn--loud .pic__critter{height:min(210px,27dvh)}.activity--kids .pic__dyn--soft .pic__critter{height:min(130px,17dvh)}.critter__flag{transform-box:fill-box;transform-origin:0 0;animation:.62s ease-in-out infinite alternate flag-wave}@keyframes flag-wave{0%{transform:rotate(-8deg)}to{transform:rotate(10deg)}}@media (prefers-reduced-motion:reduce){.critter__flag{animation:none}}.gym{flex-direction:column;display:flex;position:relative}.gym__page{flex-direction:column;animation:.38s ease-out gym-page-in;display:flex}.focus__stage>.gym,.gym__page,.gym__page>.score,.gym__page>.activity{flex:1;min-height:0}.focus__stage .gym__page>.score{overflow:hidden auto}@keyframes gym-page-in{0%{opacity:0;transform:translate(48px)}to{opacity:1;transform:none}}@media (prefers-reduced-motion:reduce){.gym__page{animation:none}}.gym__tally{background:color-mix(in srgb, var(--panel) 85%, transparent);border:1px solid var(--line);color:var(--muted);font-variant-numeric:tabular-nums;pointer-events:none;border-radius:999px;align-items:center;gap:6px;padding:3px 10px;font-size:13px;display:flex;position:absolute;top:8px;right:10px}.gym__count{color:var(--text);font-weight:700}.gym__page:has(.score)~.gym__tally{color:#5f6470;background:#ffffffd9}.gym__page:has(.score)~.gym__tally .gym__count{color:#1f2937}.gym__teach{color:var(--muted);text-align:center;margin:8px 0 0;font-size:14px}.heat{flex-direction:column;gap:8px;font-size:13px;display:flex}.heat__stage,.heat__why,.heat__note{margin:0}.heat__accidental{fill:var(--text);font-size:10px}.heat__step,.heat__note{color:var(--muted)}.heat__row{margin:0}.heat__svg{width:100%;max-height:120px;display:block}.heat__line{stroke:var(--muted);stroke-width:.8px;opacity:.55}.heat__clef{fill:var(--muted);font-size:13px;font-weight:700}.heat__hit{fill:#0000}.heat__cell:hover .heat__note{stroke:var(--text);stroke-width:1.5px}.heat__note{stroke:var(--warn);stroke-width:.8px}.heat__note--new{fill:none;stroke:var(--muted);stroke-dasharray:2 1.5}.heat__cell:not(.heat__cell--open){opacity:.55}.heat__legend{color:var(--muted);align-items:center;gap:6px;font-size:12px;display:flex}.heat__ramp{background:linear-gradient(to right, color-mix(in srgb, var(--warn) 12%, var(--panel)), var(--warn));border-radius:4px;width:64px;height:8px}.heat__swatch--new{border:1px dashed var(--muted);border-radius:50%;width:10px;height:8px;margin-left:8px}.gymctl{flex-direction:column;align-items:flex-start;gap:8px;margin-top:10px;font-size:13px;display:flex}.gymctl__row{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.gymctl__label{color:var(--muted)}.gymctl .select{max-width:100%}.gymctl__confirm{border:1px solid var(--line);border-radius:var(--r-sm);flex-direction:column;gap:6px;padding:8px 10px;display:flex}.gymctl__question{margin:0}.gymctl__danger{color:var(--error);border-color:color-mix(in srgb, var(--error) 50%, var(--line))}.gym__card{background:var(--paper);color:var(--paper-ink);gap:18px}.card__staff{flex:0 auto;width:auto;min-width:0;max-width:100%;height:min(40dvh,460px);min-height:200px;animation:.2s ease-out card-in}.activity--kids .card__staff{animation:.26s ease-out pop}@keyframes card-in{0%{opacity:0}}.focus__stage .card__staff{height:100%;min-height:0}.card__friend{flex:none;align-self:center}.card__line{stroke:currentColor;stroke-width:1.2px;opacity:.8}.card__line--bar{stroke-width:2px}.card__accidental{fill:currentColor;font-size:22px;font-weight:700}.card__note--found{opacity:.55}@media (prefers-reduced-motion:reduce){.card__staff,.activity--kids .card__staff{animation:none}}:root{--path-green:#58c236;--path-green-lip:#3f9423;--path-green-soft:#58c23629;--path-blue:#3aa8f0;--path-blue-lip:#1f80c0;--path-blue-soft:#3aa8f029;--path-purple:#a57cf4;--path-purple-lip:#7c55cc;--path-purple-soft:#a57cf429;--path-orange:#ff9b2f;--path-orange-lip:#cf720f;--path-orange-soft:#ff9b2f29;--path-pink:#f06aa2;--path-pink-lip:#c2487b;--path-pink-soft:#f06aa229;--path-gold:#f9c630;--path-gold-lip:#cf9a09;--path-gold-light:#ffe07a;--path-locked:#353b49;--path-locked-lip:#252a35;--path-locked-ink:#5d657a;--path-due:#f0b429;--path-glyph:#fff;--path-face-w:80px;--path-face-h:72px;--path-lip:7px;--path-card-lip:5px;--path-radius:16px;--path-radius-sm:12px;--path-press:90ms ease-out;--path-weight:800;--path-text-eyebrow:12px;--path-text-small:13px;--path-text-body:15px;--path-text-title:20px;--path-text-display:28px;--path-eyebrow-spacing:.09em;--path-surface:#1b1f29;--path-surface-line:#323848;--path-surface-text:#e8eaf0;--path-surface-muted:#8f97aa;--path-ring-track:#2a2f3b;--path-shadow:0 10px 24px #00000059;--path-paper:#f6f4ee;--path-paper-ink:#1f2937;--path-ground:#1c2130;--path-star-empty:#2e3442;--path-star-on:#d8b24a;--path-ill-ink:#2b2d42;--path-ill-wood:#c47a45;--path-ill-wood-dark:#97572c;--path-ill-wood-light:#dd9760;--path-ill-paper:#f3ead8;--path-ill-paper-dark:#d6c8aa;--path-ill-brass:#efb840;--path-ill-brass-dark:#c28a1c;--path-ill-leaf:#5bbf4e;--path-ill-leaf-dark:#3f963a;--path-ill-clay:#e06a4b;--path-ill-clay-dark:#b34d33;--path-ill-lamp:#ffd66b;--path-ill-metal:#7d8598;--path-ill-metal-dark:#5a6174;--path-ill-china:#eef2f9;--path-ill-china-dark:#c8d1e0;--path-ill-blue:#4f8fe6;--path-ill-blue-dark:#3570c2;--path-ill-red:#e5574b;--path-ill-red-dark:#b73e34;--path-ill-tea:#b0703a}:root[data-mode=kids]{--path-face-w:96px;--path-face-h:86px;--path-lip:8px;--path-card-lip:6px;--path-radius:20px;--path-radius-sm:16px;--path-text-title:22px;--path-text-display:30px;--path-locked:#e3ddd4;--path-locked-lip:#c9c1b4;--path-locked-ink:#b1a898;--path-surface:#fff;--path-surface-line:#ebe3d7;--path-surface-text:#2b2d42;--path-surface-muted:#7d7169;--path-ring-track:#2b2d421a;--path-shadow:0 10px 24px #50321424;--path-paper:#fff;--path-ground:#28321e24;--path-star-empty:#2b2d4229;--path-star-on:#ffc83d}[data-unit-colour=green]{--unit:var(--path-green);--unit-lip:var(--path-green-lip);--unit-soft:var(--path-green-soft)}[data-unit-colour=blue]{--unit:var(--path-blue);--unit-lip:var(--path-blue-lip);--unit-soft:var(--path-blue-soft)}[data-unit-colour=purple]{--unit:var(--path-purple);--unit-lip:var(--path-purple-lip);--unit-soft:var(--path-purple-soft)}[data-unit-colour=orange]{--unit:var(--path-orange);--unit-lip:var(--path-orange-lip);--unit-soft:var(--path-orange-soft)}[data-unit-colour=pink]{--unit:var(--path-pink);--unit-lip:var(--path-pink-lip);--unit-soft:var(--path-pink-soft)}.habits{--h-surface:var(--path-surface,#1b1f29);--h-line:var(--path-surface-line,#323848);--h-text:var(--path-surface-text,#e8eaf0);--h-muted:var(--path-surface-muted,#8f97aa);--h-track:var(--path-ring-track,#2a2f3b);--h-flame:var(--path-orange,#ff9b2f);--h-flame-lip:var(--path-orange-lip,#cf720f);--h-flame-core:var(--path-gold-light,#ffe07a);--h-idle:var(--path-locked,#353b49);--h-idle-lip:var(--path-locked-lip,#252a35);--h-idle-core:var(--path-locked-ink,#5d657a);--h-gold:var(--path-gold,#f9c630);--h-gold-lip:var(--path-gold-lip,#cf9a09);--h-go:var(--path-green,#58c236);--h-go-lip:var(--path-green-lip,#3f9423);--h-due:var(--path-due,#f0b429);--h-paper:var(--path-paper,#f6f4ee);--h-ink:var(--path-paper-ink,#1f2937);--h-radius:var(--path-radius,16px);--h-radius-sm:var(--path-radius-sm,12px);--h-lip:var(--path-card-lip,5px);color:var(--h-text)}.habits-hidden{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.habits-bar{min-height:36px;font:inherit;background:0 0;border:0;align-items:center;gap:4px;padding:0;display:inline-flex}.habits-bar--button{border-radius:var(--h-radius-sm);cursor:pointer;-webkit-tap-highlight-color:transparent}.habits-bar--button:hover .habits-chip{background:color-mix(in srgb, var(--h-line) 60%, transparent)}.habits-bar--button:focus-visible{outline:3px solid var(--accent,#5b8cff);outline-offset:2px}.habits-chip{border-radius:var(--h-radius-sm);height:36px;font-size:15px;font-weight:var(--path-weight,800);font-variant-numeric:tabular-nums;white-space:nowrap;align-items:center;gap:5px;padding:0 8px;transition:background .12s ease-out;display:inline-flex}.habits-chip--streak{color:var(--h-flame)}.habits-chip--waiting{color:var(--h-muted)}.habits-chip--goal{color:var(--h-text)}.habits-chip--reached{color:var(--h-gold)}.habits-chip__figure small{color:var(--h-muted);margin-left:1px;font-size:12px;font-weight:700}.habits-ring__fill{transition:stroke-dashoffset .6s cubic-bezier(.3,.8,.3,1)}@media (width<=480px){.habits-chip{padding:0 5px}.habits-chip__figure small{display:none}}.habits-cheer{border:2px solid color-mix(in srgb, var(--h-gold) 55%, transparent);border-radius:var(--h-radius);background:color-mix(in srgb, var(--h-gold) 12%, var(--h-surface));width:100%;box-shadow:0 var(--h-lip) 0 color-mix(in srgb, var(--h-gold-lip) 55%, transparent);text-align:left;align-items:center;gap:14px;padding:12px 16px;animation:.42s cubic-bezier(.3,1.3,.5,1) both habits-rise;display:flex}.habits-cheer__ring{flex:none;overflow:visible}.habits-cheer__track{animation:.2s .9s both habits-fade-out}.habits-cheer__disc{transform-box:fill-box;transform-origin:50%;animation:.42s cubic-bezier(.3,1.7,.5,1) .82s both habits-pop}.habits-cheer__sweep{animation:.7s cubic-bezier(.4,0,.3,1) .18s both habits-sweep}.habits-cheer__check{stroke-dasharray:1 1;animation:.3s ease-out 1.1s both habits-draw}.habits-cheer__title{color:var(--h-gold);font-size:18px;font-weight:var(--path-weight,800);margin:0}.habits-cheer__line{color:var(--h-muted);align-items:center;gap:5px;margin:2px 0 0;font-size:14px;font-weight:700;display:flex}.habits-cheer__flame{flex:none}.habits-sheet-back{z-index:40;background:#080a108c;justify-content:center;align-items:flex-end;padding:0;animation:.16s ease-out both habits-fade-in;display:flex;position:fixed;inset:0}.habits--kids.habits-sheet-back{background:#3c281447}.habits-sheet{width:100%;max-width:520px;max-height:calc(100dvh - 24px);padding:22px 16px calc(20px + env(safe-area-inset-bottom,0px));border:2px solid var(--h-line);border-radius:var(--h-radius) var(--h-radius) 0 0;background:var(--h-surface);box-shadow:var(--path-shadow,0 10px 24px #00000059);text-align:center;border-bottom:0;flex-direction:column;align-items:center;gap:14px;animation:.26s cubic-bezier(.2,.9,.3,1) both habits-sheet-up;display:flex;position:relative;overflow-y:auto}@media (width>=700px) and (height>=560px){.habits-sheet-back{align-items:center;padding:24px}.habits-sheet{border-bottom:2px solid var(--h-line);border-radius:var(--h-radius);box-shadow:0 var(--h-lip) 0 var(--h-line), var(--path-shadow,0 10px 24px #00000059);padding:26px 28px;animation-name:habits-rise}}.habits-sheet__close{width:44px;height:44px;color:var(--h-muted);cursor:pointer;background:0 0;border:0;border-radius:50%;place-items:center;padding:0;display:grid;position:absolute;top:10px;right:10px}.habits--kids .habits-sheet__close{width:56px;height:56px}.habits-sheet__close:hover{color:var(--h-text)}.habits-sheet__close:focus-visible{outline:3px solid var(--h-go);outline-offset:1px}.habits-sheet__head{padding:0 36px}.habits-sheet__eyebrow{color:var(--h-go);font-size:var(--path-text-eyebrow,12px);font-weight:var(--path-weight,800);letter-spacing:var(--path-eyebrow-spacing,.09em);text-transform:uppercase;margin:0 0 4px}.habits-sheet__title{font-size:var(--path-text-title,20px);font-weight:var(--path-weight,800);margin:0;line-height:1.25}.habits-sheet__sub{color:var(--h-muted);font-size:var(--path-text-body,15px);margin:6px 0 0;line-height:1.4}.habits-sheet__meta{color:var(--h-muted);font-size:var(--path-text-small,13px);margin:0;font-weight:700}.habits-paper{border-radius:var(--h-radius-sm);background:var(--h-paper);width:100%;box-shadow:0 4px 0 color-mix(in srgb, var(--h-paper) 72%, #000);color:var(--h-ink);margin:0;padding:10px 14px 8px}.habits--kids .habits-paper{padding:14px 16px 6px}.habits-paper__key{color:color-mix(in srgb, var(--h-ink) 62%, transparent);justify-content:center;align-items:center;gap:6px;margin-top:2px;font-size:12px;font-weight:700;display:flex}.habits-paper__dot{background:var(--h-due);border-radius:50%;width:8px;height:8px}.habits-btn{--face:var(--h-go);--face-lip:var(--h-go-lip);--depth:4px;min-height:50px;margin:0 0 var(--depth);border-radius:var(--h-radius-sm);background:var(--face);box-shadow:0 var(--depth) 0 var(--face-lip);color:#fff;letter-spacing:.06em;text-transform:uppercase;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation;transition:transform var(--path-press,90ms ease-out), box-shadow var(--path-press,90ms ease-out), filter .12s ease-out;border:0;justify-content:center;align-items:center;padding:0 22px;font-family:inherit;font-size:16px;font-weight:800;line-height:1;display:inline-flex}.habits-btn:hover{filter:brightness(1.07)}.habits-btn:active{transform:translateY(var(--depth));box-shadow:0 0 0 var(--face-lip)}.habits-btn:focus-visible{outline:3px solid color-mix(in srgb, var(--face) 55%, #fff);outline-offset:3px}.habits-btn:disabled{--face:var(--h-idle);--face-lip:var(--h-idle-lip);cursor:default}.habits-btn--wide{width:min(340px,100%)}.habits-btn--round{--depth:6px;border-radius:50%;width:92px;height:92px;padding:0}.habits-settings{flex-wrap:wrap;align-items:flex-end;gap:12px 24px;display:flex}.habits-settings__goal{border:0;min-width:0;margin:0;padding:0}.habits-settings__label{color:var(--h-muted);font-size:var(--path-text-eyebrow,12px);font-weight:var(--path-weight,800);letter-spacing:var(--path-eyebrow-spacing,.09em);text-transform:uppercase;margin:0 0 6px;padding:0;display:block}.habits-choices{flex-wrap:wrap;gap:6px;display:flex}.habits-choice{display:inline-flex;position:relative}.habits-choice input,.habits-switch input{opacity:0;cursor:pointer;width:100%;height:100%;margin:0;position:absolute;inset:0}.habits-choice span{border:2px solid var(--h-line);border-radius:var(--h-radius-sm);min-height:40px;box-shadow:0 3px 0 var(--h-line);color:var(--h-text);white-space:nowrap;align-items:center;padding:0 12px;font-size:14px;font-weight:800;display:inline-flex}.habits-choice input:checked+span{border-color:var(--h-go-lip);background:var(--h-go);box-shadow:0 3px 0 var(--h-go-lip);color:#fff}.habits-choice input:focus-visible+span,.habits-switch input:focus-visible+.habits-switch__track{outline:3px solid var(--accent,#5b8cff);outline-offset:2px}.habits-switch{flex-direction:column;align-items:flex-start;display:inline-flex;position:relative}.habits-switch__track{background:var(--h-idle);width:54px;height:32px;box-shadow:inset 0 -3px 0 var(--h-idle-lip);border-radius:16px;align-items:center;padding:3px;transition:background .14s ease-out;display:inline-flex}.habits-switch__thumb{background:#fff;border-radius:50%;width:26px;height:26px;transition:transform .16s ease-out;box-shadow:0 2px #0000002e}.habits-switch input:checked+.habits-switch__track{background:var(--h-go);box-shadow:inset 0 -3px 0 var(--h-go-lip)}.habits-switch input:checked+.habits-switch__track .habits-switch__thumb{transform:translate(22px)}.habits-week{flex-direction:column;gap:10px;display:flex}.habits-week__title{font-size:17px;font-weight:var(--path-weight,800);margin:0}.habits-week__days{grid-template-columns:repeat(7,minmax(0,44px));gap:6px;margin:0;padding:0;list-style:none;display:grid}.habits-week__day{flex-direction:column;align-items:center;gap:4px;display:flex}.habits-week__dot{border:3px solid var(--h-line);border-radius:50%;width:26px;height:26px}.habits-week__day--played .habits-week__dot{border-color:var(--h-go-lip);background:var(--h-go);box-shadow:0 3px 0 var(--h-go-lip)}.habits-week__letter{color:var(--h-muted);font-size:12px;font-weight:800}.habits-week__day--today .habits-week__letter{color:var(--h-text);text-underline-offset:3px;text-decoration:underline;text-decoration-thickness:2px}.habits-week__sentence{color:var(--h-muted);margin:0;font-size:14px}.habits-week__caption{color:color-mix(in srgb, var(--h-ink) 62%, transparent);letter-spacing:.09em;text-transform:uppercase;margin:0 0 4px;font-size:12px;font-weight:800}.habits-paper--week{text-align:center}.habits-staff{width:100%;height:auto;color:var(--h-ink);margin:0 auto;display:block}.habits .engr__lines line,.habits .engr__ledgers line{stroke:currentColor;stroke-width:1.3px;stroke-linecap:round;opacity:.78}.habits .engr__ledgers line{stroke-width:1.6px;opacity:.9}.habits .engr__barline{stroke:currentColor;stroke-width:1.6px;opacity:.78}.habits .engr__hollow{fill:var(--h-paper)}.habits .engr__letter{fill:color-mix(in srgb, var(--h-ink) 62%, transparent);letter-spacing:.08em;font-size:12px;font-weight:800}.habits-staff__due{fill:var(--h-due)}.habits-staff__note{animation:.3s both habits-fade-in;animation-delay:calc(.12s + var(--i) * 60ms)}@keyframes habits-fade-in{0%{opacity:0}}@keyframes habits-fade-out{to{opacity:0}}@keyframes habits-rise{0%{opacity:0;transform:translateY(10px)scale(.98)}}@keyframes habits-sheet-up{0%{opacity:0;transform:translateY(40px)}}@keyframes habits-sweep{0%{stroke-dashoffset:100px}to{stroke-dashoffset:0}}@keyframes habits-pop{0%{opacity:0;transform:scale(.6)}}@keyframes habits-draw{0%{stroke-dashoffset:1px}to{stroke-dashoffset:0}}@media (prefers-reduced-motion:reduce){.habits,.habits *,.habits-sheet-back,.habits-sheet-back *{transition:none!important;animation:none!important}}.band{--band-h:84px;--band-board:9px;--band-lip:5px;--band-wood:var(--path-ill-wood-light,#dd9760);--band-wood-lip:var(--path-ill-wood,#c47a45);--band-wall:#fffaf2;--band-waiting:#2b2d4221;height:var(--band-h);pointer-events:none;touch-action:manipulation;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;min-width:0;position:relative}.band--jungle{--band-wall:#f1faea}.band--ocean{--band-wall:#eaf7fd}.band--space{--band-wall:#f2eefc;--band-waiting:#3c286e24}.band__shell,.band__glow,.band__riser,.band__boards{pointer-events:none;position:absolute}.band__shell{inset:0 0 calc(var(--band-lip) / 2);border-radius:var(--path-radius,20px) var(--path-radius,20px) 14px 14px;background:var(--band-wall);box-shadow:0 3px #2b2d4214}.band__glow{inset:0 0 calc(var(--band-lip) / 2);border-radius:var(--path-radius,20px) var(--path-radius,20px) 14px 14px;opacity:0;background:radial-gradient(60% 90% at 50% 100%,#ffd84d61,#0000 70%);transition:opacity .22s ease-out}.band--chord .band__glow{opacity:1}.band__boards{left:0;right:0;bottom:var(--band-lip);height:var(--band-board);background:repeating-linear-gradient(90deg, transparent 0 46px, #97572c38 46px 48px), var(--band-wood);box-shadow:0 var(--band-lip) 0 var(--band-wood-lip);border-radius:8px 8px 10px 10px}.band__riser{left:10px;right:10px;bottom:calc(var(--band-lip) + var(--band-board) - 2px);height:var(--band-riser);background:color-mix(in srgb, var(--band-wood) 55%, var(--band-wall));border-radius:8px 8px 0 0}.band__floor{top:4px;left:8px;right:8px;bottom:calc(var(--band-lip) + var(--band-board) - 4px);pointer-events:none;position:absolute;overflow:clip visible}.band__spot{line-height:0;display:block;position:absolute}.band__hop,.band__body{transform-origin:50% 96%;display:block}.band__hop svg{display:block;overflow:visible}.band__spot--waiting{color:var(--band-waiting)}.band__friend{appearance:none;font:inherit;pointer-events:auto;cursor:pointer;-webkit-tap-highlight-color:transparent;background:0 0;border:0;border-radius:40% 40% 30% 30%;margin:0;padding:0}.band__friend:focus-visible{outline:3px solid var(--accent);outline-offset:2px}.band__note{pointer-events:none;width:max(12px,42%);animation:.9s ease-out both band-note;position:absolute;bottom:100%;left:58%}.band__note-art{width:100%;height:auto;display:block}.band__friend--arriving{animation:band-walk-on 1.3s cubic-bezier(.3, .6, .35, 1) var(--delay,0s) both}.band__friend--arriving .band__body{animation:band-step .16s ease-in-out var(--delay,0s) 8 alternate, band-wave .9s ease-in-out calc(var(--delay,0s) + 1.3s) 1}.home__top:has(>.band){flex-wrap:wrap;row-gap:8px}.home__top>.band{flex:1 0 100%;order:20;max-width:760px;margin:2px auto 0}@media (width>=900px),(orientation:landscape) and (height<=520px){.home__top>.band{flex:1 1 0;order:0;max-width:720px;margin:0 auto}.home__top>.band~.hold{margin-left:0}}@media (width>=1440px){.home__top:has(>.band){min-height:calc(var(--home-band-h,76px) + 22px)}.home__top>.band{width:720px;margin:calc(var(--home-band-h,76px) / -2 + 1px) 0 0 -360px;position:absolute;top:50%;left:50%}.home__top>.band~.hold{margin-left:auto}}@media (width>=900px){.band{--band-h:76px}}@media (width<=600px) and (orientation:portrait){.band{--band-h:66px;--band-board:8px;--band-lip:4px}.home__top:has(>.band){row-gap:0}.home__top>.band{margin-top:8px}}@media (orientation:landscape) and (height<=520px){.band{--band-h:54px;--band-board:7px;--band-lip:4px}}@keyframes band-note{0%{opacity:0;transform:translateY(4px)rotate(-6deg)}25%{opacity:1}to{opacity:0;transform:translate(6px,-16px)rotate(8deg)}}@keyframes band-walk-on{0%{opacity:0;transform:translateX(var(--walk,-80px))}12%{opacity:1}to{opacity:1;transform:translate(0)}}@keyframes band-step{0%{transform:translateY(0)rotate(-3deg)}to{transform:translateY(-3px)rotate(3deg)}}@keyframes band-wave{0%,to{transform:rotate(0)}20%{transform:rotate(-9deg)}45%{transform:rotate(8deg)}70%{transform:rotate(-6deg)}}@keyframes band-appear{0%{opacity:0}to{opacity:1}}@media (prefers-reduced-motion:reduce){.band__friend--arriving{animation:band-appear .5s ease-out var(--delay,0s) both}.band__friend--arriving .band__body{animation:none}.band__note{animation:none;transform:translateY(-4px)}.band__glow{transition:none}}.path{color:var(--text);position:relative}.path--adult{background:var(--bg)}.path__world{position:relative}.path__column{z-index:1;width:100%;max-width:640px;margin:0 auto;padding:20px 16px 48px;position:relative}.path--kids .path__column{max-width:600px;padding-top:24px;padding-bottom:64px}.path-unit+.path-unit{margin-top:28px}.path-head{top:var(--path-sticky-top,12px);z-index:5;margin-bottom:var(--path-card-lip);border-radius:var(--path-radius);background:var(--unit);box-shadow:0 var(--path-card-lip) 0 var(--unit-lip);color:#fff;position:sticky}.path--adult .path-head{box-shadow:0 var(--path-card-lip) 0 var(--unit-lip), 0 -18px 0 4px var(--bg)}.path-head__bar{align-items:center;gap:12px;min-height:76px;padding:12px 12px 12px 18px;display:flex}.path-head__text{flex:1;min-width:0}.path-head__eyebrow{font-size:var(--path-text-eyebrow);font-weight:var(--path-weight);letter-spacing:var(--path-eyebrow-spacing);text-transform:uppercase;opacity:.88;margin:0}.path-head__title{font-family:inherit;font-size:var(--path-text-title);font-weight:var(--path-weight);text-shadow:0 1px 0 var(--unit-lip);overflow-wrap:anywhere;margin:2px 0 0;line-height:1.2}.path-head__jump{border-radius:var(--path-radius-sm);min-height:40px;box-shadow:0 3px 0 var(--unit-lip);color:var(--unit-lip);font:inherit;font-size:13px;font-weight:var(--path-weight);letter-spacing:var(--path-eyebrow-spacing);text-transform:uppercase;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation;transition:transform var(--path-press), box-shadow var(--path-press);background:#fff;border:0;align-items:center;margin:8px 0 3px;padding:0 16px;display:inline-flex}.path-head__jump:hover{filter:brightness(.96)}.path-head__jump:active{box-shadow:0 0 0 var(--unit-lip);transform:translateY(3px)}.path-head__jump:focus-visible{outline-offset:2px;outline:3px solid #fff}.path-offer{border:2px solid var(--path-surface-line);border-radius:var(--path-radius);background:var(--path-surface);box-shadow:0 var(--path-card-lip) 0 var(--path-surface-line);color:var(--path-surface-text);margin:0 0 28px;padding:18px 18px 20px}.path-offer__title{font-family:inherit;font-size:var(--path-text-title);font-weight:var(--path-weight);margin:0 0 8px;line-height:1.2}.path-offer__line{color:var(--path-surface-muted);font-size:var(--path-text-body);margin:4px 0 0;font-weight:600;line-height:1.45}.path-offer__line strong{color:var(--path-surface-text)}.path-offer__actions{flex-wrap:wrap;gap:12px;margin-top:16px;display:flex}.path-offer__btn{--face:var(--path-green);--face-lip:var(--path-green-lip);border-radius:var(--path-radius-sm);background:var(--face);min-height:50px;box-shadow:0 5px 0 var(--face-lip);color:#fff;font:inherit;font-size:15px;font-weight:var(--path-weight);letter-spacing:.06em;text-transform:uppercase;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation;transition:transform var(--path-press), box-shadow var(--path-press);border:0;flex:180px;margin:0 0 5px;padding:0 18px}.path-offer__btn--test{--face:var(--path-blue);--face-lip:var(--path-blue-lip)}.path-offer__btn:hover{filter:brightness(1.07)}.path-offer__btn:active{box-shadow:0 0 0 var(--face-lip);transform:translateY(5px)}.path-offer__btn:focus-visible{outline:3px solid color-mix(in srgb, var(--face) 55%, #fff);outline-offset:3px}.path-head__divider{background:var(--unit-lip);opacity:.7;border-radius:1px;align-self:stretch;width:2px;margin:6px 0}.path-head__guide{--glyph-cut:var(--unit);border-radius:var(--path-radius-sm);color:#fff;min-width:48px;min-height:48px;font:inherit;font-size:14px;font-weight:var(--path-weight);letter-spacing:var(--path-eyebrow-spacing);text-transform:uppercase;cursor:pointer;-webkit-tap-highlight-color:transparent;background:0 0;border:0;flex:none;align-items:center;gap:8px;padding:0 12px;display:inline-flex}.path-head__guide:hover{background:#ffffff24}.path-head__guide[aria-expanded=true]{--glyph-cut:var(--unit-lip);background:var(--unit-lip)}.path-head__guide:focus-visible{outline-offset:2px;outline:3px solid #fff}.path-head__guide-panel{padding:0 18px 18px;animation:.18s ease-out path-fade-in}.path-head__blurb{font-size:var(--path-text-body);text-shadow:0 1px 0 var(--unit-lip);margin:0 0 12px;font-weight:600;line-height:1.45}.path--kids .path-head__blurb{font-size:var(--path-text-small)}.path-head__sheet{border-radius:var(--path-radius-sm);background:var(--path-paper);box-shadow:0 3px 0 var(--unit-lip);justify-content:center;padding:12px 16px 10px;display:flex}.path-head__progress{font-size:var(--path-text-small);opacity:.92;margin:12px 0 0;font-weight:700}.path-staff{width:100%;max-width:300px;height:auto;color:var(--path-paper-ink);display:block;overflow:visible}.path-staff__line{stroke:var(--path-paper-ink);stroke-width:1.1px;opacity:.75}.path-staff__line--ledger{opacity:.9}.path-staff__clef,.path-staff__brace{color:var(--path-paper-ink)}.path-staff__brace{fill:none;stroke:var(--path-paper-ink);stroke-width:2.2px;stroke-linecap:round}.path-staff__note--landmark{color:var(--unit-lip)}.path-staff__hollow{fill:var(--path-paper)}.path-staff__letter{fill:currentColor;letter-spacing:.06em;font-size:11px;font-weight:800}.path-staff__caret{fill:none;stroke:currentColor;stroke-width:1.8px;stroke-linecap:round;stroke-linejoin:round}.path-unit__rows{--path-swing:min(75px, 19cqw);--path-illo-w:min(150px, 40cqw);--path-illo-x:min(calc(var(--path-swing) + 118px), calc(50cqw - var(--path-illo-w) / 2 - 4px));position:relative;container-type:inline-size}.path--kids .path-unit__rows{--path-swing:min(90px, 17cqw);--path-illo-w:min(190px, 46cqw);--path-illo-x:min(calc(var(--path-swing) + 150px), calc(50cqw - var(--path-illo-w) / 2 - 4px))}.path-unit__list{margin:0;padding:0;list-style:none}.path-node,.path-chest{z-index:2;left:calc(50% + var(--k) * var(--path-swing));width:var(--path-face-w);height:calc(var(--path-face-h) + var(--path-lip));margin-left:calc(var(--path-face-w) / -2);pointer-events:none;position:absolute}.path-node__button,.path-bubble__body{pointer-events:auto}.path-node__button{--face:var(--unit);--face-lip:var(--unit-lip);--glyph-cut:var(--face);z-index:1;width:100%;height:100%;color:var(--path-glyph);cursor:pointer;-webkit-tap-highlight-color:transparent;background:0 0;border:0;border-radius:50%;padding:0;display:block;position:relative}.path-node__lip,.path-node__face{width:100%;height:var(--path-face-h);border-radius:50%;position:absolute;left:0}.path-node__lip{top:var(--path-lip);background:var(--face-lip)}.path-node__face{background:var(--face);transition:transform var(--path-press);place-items:center;display:grid;top:0}.path-node__face:before{content:"";background:#ffffff4d;border-radius:50%;width:26%;height:17%;position:absolute;top:11%;left:19%;transform:rotate(-28deg)}.path-node__face svg{position:relative}.path-node__button:active:not(:disabled) .path-node__face{transform:translateY(var(--path-lip))}.path-node__button:focus-visible{outline:3px solid var(--text);outline-offset:6px}.path-node--gold .path-node__button{--face:var(--path-gold);--face-lip:var(--path-gold-lip)}.path-node--needs-visit .path-node__button{--face:color-mix(in srgb, var(--unit) 72%, var(--path-locked));--face-lip:color-mix(in srgb, var(--unit-lip) 72%, var(--path-locked-lip))}.path-node--gold.path-node--needs-visit .path-node__button{--face:color-mix(in srgb, var(--path-gold) 72%, var(--path-locked));--face-lip:color-mix(in srgb, var(--path-gold-lip) 72%, var(--path-locked-lip))}.path-node--locked .path-node__button{--face:var(--path-locked);--face-lip:var(--path-locked-lip);color:var(--path-locked-ink);cursor:default}.path-node--locked .path-node__face:before{opacity:.25}.path-node__badge{z-index:2;background:var(--path-due);width:24px;height:24px;box-shadow:0 0 0 3px var(--bg);color:#2b2410;pointer-events:none;border-radius:50%;place-items:center;display:grid;position:absolute;top:-3px;right:-3px}.path--kids .path-node__badge{width:28px;height:28px;box-shadow:0 0 0 3px #fff}.path-node__ring{top:calc((var(--path-face-h) + var(--path-lip)) / 2);pointer-events:none;position:absolute;left:50%;overflow:visible;transform:translate(-50%,-50%)}.path-node__ring-track,.path-node__ring-fill{fill:none;stroke-width:8px}.path-node__ring-track{stroke:var(--path-ring-track)}.path-node__ring-fill{stroke:var(--unit);stroke-linecap:round}.path-node__caption{z-index:4;top:calc(var(--path-face-h) / 2 - 14px);border:1px solid var(--path-surface-line);background:var(--path-surface);color:var(--path-surface-text);font-size:var(--path-text-small);white-space:nowrap;opacity:0;pointer-events:none;border-radius:8px;padding:4px 10px;font-weight:700;transition:opacity .12s ease-out;position:absolute}.path-node--right .path-node__caption{right:calc(100% + 14px)}.path-node--left .path-node__caption,.path-node--middle .path-node__caption{left:calc(100% + 14px)}.path-node:hover .path-node__caption,.path-node:focus-within .path-node__caption{opacity:1}.path-node--current .path-node__caption{display:none}@media (hover:none){.path-node:hover .path-node__caption{opacity:0}}.path-node__friends{pointer-events:none;position:absolute;inset:0}.path-node__friend{position:absolute;top:-30px}.path-node__friend--a{left:2px;transform:rotate(-14deg)}.path-node__friend--b{right:2px;transform:rotate(14deg)}.path-bubble{z-index:3;position:absolute;bottom:calc(100% + 22px)}.path-bubble--centre{left:50%;transform:translate(-50%)}.path-bubble--end{right:calc(50% - 30px)}.path-bubble--start{left:calc(50% - 30px)}.path-bubble__body{border:2px solid var(--path-surface-line);border-radius:var(--path-radius-sm);background:var(--path-surface);box-shadow:0 3px 0 var(--path-surface-line);font-size:14px;font-weight:var(--path-weight);white-space:nowrap;cursor:pointer;padding:8px 14px;animation:1.9s ease-in-out infinite alternate path-bob;display:block;position:relative}.path-bubble__body:after{content:"";border:2px solid var(--path-surface-line);background:var(--path-surface);border-top:0;border-left:0;width:12px;height:12px;position:absolute;top:100%;transform:translateY(-5px)rotate(45deg)}.path-bubble--centre .path-bubble__body:after{left:calc(50% - 6px)}.path-bubble--end .path-bubble__body:after{right:24px}.path-bubble--start .path-bubble__body:after{left:24px}.path-bubble__go{color:var(--unit);letter-spacing:.04em}.path-bubble__title{color:var(--path-surface-text);font-weight:700}.path--kids .path-bubble__body{padding:9px 16px;font-size:17px}.path--kids .path-bubble__go{color:var(--unit-lip);letter-spacing:.08em}.path-chest{--path-face-w:88px;--chest-face:var(--path-locked);--chest-top:color-mix(in srgb, var(--path-locked) 88%, #fff);--chest-lip:var(--path-locked-lip);--chest-band:var(--path-locked-lip);--chest-inside:#000;--chest-spark:#fff;height:80px}.path-chest--open{--chest-face:var(--path-gold);--chest-top:var(--path-gold-light);--chest-lip:var(--path-gold-lip);--chest-band:#b98405;--chest-inside:#6b4300;--chest-spark:#fff3b0}.path-chest__art{width:100%;height:100%;display:block;overflow:visible}.path-chest--fresh .path-chest__art{transform-origin:50% 100%;animation:.72s cubic-bezier(.3,1.5,.5,1) both path-chest-open}.path-chest--fresh .path-chest__sparkles{animation:.5s ease-out .3s both path-fade-in}.path-illo{z-index:1;top:calc(var(--ground) - var(--path-illo-w) * 141 / 160);left:calc(50% + var(--side) * var(--path-illo-x));width:var(--path-illo-w);margin-left:calc(var(--path-illo-w) / -2);pointer-events:none;position:absolute}.path-illo--left{--side:-1}.path-illo--right{--side:1}.path-illo__art{width:100%;height:auto;display:block;overflow:visible}.path__dock{z-index:6;pointer-events:none;flex-direction:column;justify-content:flex-end;align-items:flex-end;gap:12px;max-width:800px;height:0;margin:0 auto;padding-right:16px;display:flex;position:sticky;bottom:16px}.path__float{border:2px solid var(--path-surface-line);border-radius:var(--path-radius-sm);background:var(--path-surface);min-width:52px;height:52px;box-shadow:0 4px 0 var(--path-surface-line);color:var(--path-surface-text);font:inherit;font-size:15px;font-weight:var(--path-weight);pointer-events:auto;cursor:pointer;transition:transform var(--path-press);-webkit-tap-highlight-color:transparent;justify-content:center;align-items:center;gap:8px;padding:0 14px;display:inline-flex}.path__float:active{transform:translateY(4px)}.path__float:focus-visible{outline:3px solid var(--text);outline-offset:3px}.path__float--scroll{--glyph-cut:var(--path-surface);animation:.2s ease-out path-rise}.path__float--practice{--glyph-cut:var(--accent);background:var(--accent);box-shadow:0 4px 0 color-mix(in srgb, var(--accent) 68%, #000);color:#fff;border-color:#0000}.path--kids .path__float{border-radius:var(--path-radius);min-width:64px;height:64px}.path__world--jungle{background:linear-gradient(#bfe9ff,#dff5dc 60%,#eaf9d6)}.path__world--ocean{background:linear-gradient(#bdf0ff,#86d3f3 35%,#3a9ae0)}.path__world--space{background:linear-gradient(#f3c69e 0,#8a62b3 140px,#2a2a66 420px,#1b1f4b 60%,#3d2b72)}.path-scenery{pointer-events:none;position:absolute;inset:0;overflow:hidden}.path-scenery>*{display:block;position:absolute}.path-scenery__sun{background:#ffd84d;border-radius:50%;width:64px;height:64px;top:28px;right:7%;box-shadow:0 0 0 14px #ffe06659,0 0 0 32px #ffe06626}.path-scenery__vine{width:120px;height:260px;top:0}.path-scenery__vine--left{left:-18px}.path-scenery__vine--right{top:34%;right:-18px;transform:scaleX(-1)}.path-scenery__fronds{width:120px;height:200px;bottom:70px;left:0}.path-scenery__hills{width:100%;height:110px;bottom:0;left:0}.path-scenery__waves{width:100%;height:40px;top:0;left:0}.path-scenery__dots{width:100%;height:100%;inset:0}.path-scenery__weed{width:80px;height:160px;bottom:60px}.path-scenery__weed--left{left:2%}.path-scenery__weed--right{bottom:50px;right:3%}.path-scenery__sand{width:100%;height:90px;bottom:0;left:0}.path-scenery__star{width:34px;height:34px;bottom:24px;right:12%;transform:rotate(-12deg)}.path-scenery__planet{width:140px;height:100px;top:150px;left:3%}.path-scenery__moon{width:80px;height:80px;top:44%;right:4%}@media (width<=600px){.path-scenery__vine,.path-scenery__fronds,.path-scenery__weed{opacity:.6;scale:.7}.path-scenery__planet{width:96px;height:70px}.path-scenery__moon{width:52px;height:52px}.path-scenery__sun{width:48px;height:48px}}@keyframes path-bob{0%{transform:translateY(0)}to{transform:translateY(-4px)}}@keyframes path-fade-in{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}@keyframes path-rise{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}@keyframes path-chest-open{0%{transform:scale(.86)translateY(4px)}55%{transform:scale(1.08)translateY(-8px)}to{transform:none}}@media (prefers-reduced-motion:reduce){.path-bubble__body,.path-head__guide-panel,.path__float--scroll,.path-chest--fresh .path-chest__art,.path-chest--fresh .path-chest__sparkles{animation:none}.path-node__face,.path-node__caption,.path__float{transition:none}}.session{--s-unit:var(--path-unit,#58cc02);--s-unit-lip:var(--path-unit-lip,#46a302);--s-ok:var(--path-ok,#58cc02);--s-ok-lip:var(--path-ok-lip,#46a302);--s-wrong:var(--path-wrong,#ff4b4b);--s-wrong-lip:var(--path-wrong-lip,#d93a3a);--s-amber:var(--path-amber,#ffb020);--s-amber-lip:var(--path-amber-lip,#d99100);--s-listen:var(--path-blue,#1cb0f6);--s-listen-lip:var(--path-blue-lip,#1899d6);--s-star:var(--path-star,#ffc800);--s-star-lip:var(--path-star-lip,#e5a500);--s-lip:var(--path-lip,6px);--s-lip-sm:var(--path-lip-sm,4px);--s-radius:var(--path-radius-lg,18px);--s-radius-md:var(--path-radius-md,14px);--s-ease-press:90ms ease-out;color:var(--s-text);font-family:var(--s-font)}.session[data-unit-colour]{--path-unit:var(--unit);--path-unit-lip:var(--unit-lip)}.session--adult{--s-bg:var(--path-bg,#0f1117);--s-surface:var(--path-surface,#1f232d);--s-border:var(--path-border,#333a48);--s-text:var(--path-text,#e8eaf0);--s-muted:var(--path-muted,#8f97aa);--s-track:var(--path-track,#2c3340);--s-locked:var(--path-locked,#3a4150);--s-locked-lip:var(--path-locked-lip,#2a303c);--s-paper:var(--path-paper,#f6f4ee);--s-paper-lip:var(--path-paper-lip,#d6cfbf);--s-ink:var(--path-ink,#1f2937);--s-font:var(--path-font,system-ui, -apple-system, "Segoe UI", Roboto, sans-serif);--s-tint:17%}.session--kids{--s-bg:var(--path-bg,#fff6ea);--s-surface:var(--path-surface,#fff);--s-border:var(--path-border,#f0d9bf);--s-text:var(--path-text,#2b2d42);--s-muted:var(--path-muted,#7d7169);--s-track:var(--path-track,#f1dfc8);--s-locked:var(--path-locked,#e6ddd1);--s-locked-lip:var(--path-locked-lip,#cfc2b0);--s-paper:var(--path-paper,#fff);--s-paper-lip:var(--path-paper-lip,#ecdcc6);--s-ink:var(--path-ink,#2b2d42);--s-font:var(--path-font,"Nunito", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif);--s-tint:24%}.session .sbtn{--face:var(--s-unit);--face-lip:var(--s-unit-lip);--depth:var(--s-lip-sm);min-height:50px;margin:0 0 var(--depth);border-radius:var(--s-radius-md);background:var(--face);color:#fff;box-shadow:0 var(--depth) 0 var(--face-lip);font:800 16px/1 var(--s-font);letter-spacing:.06em;text-transform:uppercase;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation;transition:transform var(--s-ease-press), box-shadow var(--s-ease-press), filter .12s ease-out;border:0;justify-content:center;align-items:center;gap:10px;padding:0 22px;display:inline-flex}.session .sbtn:hover{filter:brightness(1.07)}.session .sbtn:active{transform:translateY(var(--depth));box-shadow:0 0 0 var(--face-lip)}.session .sbtn:focus-visible{outline:3px solid color-mix(in srgb, var(--face) 55%, #fff);outline-offset:3px}.session .sbtn--right{--face:var(--s-ok);--face-lip:var(--s-ok-lip)}.session .sbtn--wrong{--face:var(--s-wrong);--face-lip:var(--s-wrong-lip)}.session .sbtn--gentle{--face:var(--s-amber);--face-lip:var(--s-amber-lip)}.session .sbtn--listen{--face:var(--s-listen);--face-lip:var(--s-listen-lip)}.session .sbtn--wide{min-width:200px}.session .sbtn--round{--depth:5px;border-radius:50%;width:76px;height:76px;padding:0}.session .sbtn--big{--depth:6px;width:92px;height:92px}.session__frame{background:var(--s-bg);flex-direction:column;height:100dvh;min-height:0;display:flex;position:relative;overflow:hidden}.session__top{flex:none;align-items:center;gap:18px;width:100%;max-width:1040px;margin:0 auto;padding:22px 28px 10px;display:flex}.session__close{width:44px;height:44px;color:var(--s-muted);cursor:pointer;-webkit-tap-highlight-color:transparent;background:0 0;border:0;border-radius:12px;flex:none;place-items:center;padding:0;display:grid}.session__close:hover{color:var(--s-text);background:color-mix(in srgb, var(--s-text) 8%, transparent)}.session__close:focus-visible{outline:3px solid var(--s-listen);outline-offset:2px}.session--kids .session__close{width:52px;height:52px;color:color-mix(in srgb, var(--s-muted) 70%, transparent)}.session__track{--p:0;background:var(--s-track);border-radius:999px;flex:1;height:16px;position:relative}.session__clip{border-radius:inherit;position:absolute;inset:0;overflow:hidden}.session__fill{border-radius:inherit;background:var(--s-unit);transform:translateX(calc((var(--p) - 1) * 100%));transition:transform .65s cubic-bezier(.3,1.25,.5,1);position:absolute;inset:0}.session__fill:after{content:"";background:#ffffff52;border-radius:999px;height:4px;position:absolute;top:4px;left:12px;right:12px}.session__count{min-width:3.6em;color:var(--s-muted);font-variant-numeric:tabular-nums;text-align:right;flex:none;margin:0;font-size:15px;font-weight:800}.session--kids .session__top{padding-top:26px;padding-right:40px}.session--kids .session__track{height:22px}.session--kids .session__fill:after{height:5px;top:5px}.session__rider{pointer-events:none;transform:translateX(calc(var(--p) * 100%));transition:transform .65s cubic-bezier(.3,1.25,.5,1);position:absolute;inset:0}.session__rider-hop{transform-origin:50% 100%;animation:.52s cubic-bezier(.3,1.2,.5,1) rider-hop;position:absolute;bottom:2px;left:-20px}.session__rider-hop svg{display:block}@keyframes rider-hop{0%{transform:none}35%{transform:translateY(-14px)scale(.96,1.05)}70%{transform:translateY(0)scale(1.06,.92)}to{transform:none}}.session__body{width:100%;min-height:0;padding:12px 24px calc(16px + env(safe-area-inset-bottom));flex-direction:column;flex:1;align-items:center;gap:16px;display:flex;overflow-y:auto}.session__body>:first-child{margin-top:auto}.session__body>:last-child{margin-bottom:auto}.session__dock{z-index:5;pointer-events:none;position:absolute;bottom:0;left:0;right:0}.session__feedback{--tone:var(--s-ok);pointer-events:auto;padding:22px 28px calc(24px + env(safe-area-inset-bottom));background:color-mix(in srgb, var(--tone) var(--s-tint), var(--s-bg));color:var(--tone);animation:.3s cubic-bezier(.2,.9,.3,1.05) feedback-up}.session__feedback--wrong{--tone:var(--s-wrong)}.session__feedback--gentle{--tone:var(--s-amber)}.session--kids .session__feedback{background:color-mix(in srgb, var(--tone) var(--s-tint), #fff)}.session__feedback-inner{align-items:center;gap:18px;max-width:1040px;margin:0 auto;display:flex}.session--kids .session__feedback-inner{justify-content:space-between;max-width:720px}.session__badge{flex:none;animation:.42s cubic-bezier(.3,1.6,.5,1) 90ms both badge-pop;display:grid}.session__badge svg{display:block}.session__words{flex:1;min-width:0}.session__headline{flex-wrap:wrap;align-items:center;gap:4px 12px;margin:0;font-size:24px;font-weight:800;line-height:1.2;display:flex}.session__note{background:color-mix(in srgb, var(--tone) 22%, transparent);font-variant-numeric:tabular-nums;border-radius:10px;padding:3px 10px;font-size:18px}.session__line{color:color-mix(in srgb, var(--tone) 55%, var(--s-text));margin:4px 0 0;font-size:17px;font-weight:700;line-height:1.35}.session__next{flex-direction:column;flex:none;align-items:center;gap:4px;display:flex}.session__hint{color:color-mix(in srgb, var(--tone) 45%, var(--s-muted));font-size:12px;font-weight:700}.session__hint kbd{font:inherit;opacity:.8;border:1px solid;border-radius:5px;padding:1px 6px}@media (hover:none){.session__hint{display:none}}@keyframes feedback-up{0%{transform:translateY(100%)}}@keyframes badge-pop{0%{opacity:0;transform:scale(.4)rotate(-12deg)}}.meet{flex-direction:column;align-items:center;gap:18px;width:min(900px,100%);display:flex;container-type:inline-size}.meet__card{border:2px solid var(--s-paper-lip);border-radius:var(--s-radius);background:var(--s-paper);width:100%;color:var(--s-ink);box-shadow:0 var(--s-lip) 0 var(--s-paper-lip);grid-template-areas:"head""art""actions";gap:14px 32px;padding:20px 22px 22px;animation:.36s cubic-bezier(.3,1.2,.5,1) meet-in;display:grid}@container (width>=780px){.session--adult .meet__card{grid-template-columns:minmax(210px,250px) 1fr;grid-template-areas:"head art""actions art";align-items:center;padding:28px 32px 30px}.session--adult .meet__actions{align-self:end}}.meet__head{grid-area:head;min-width:0}.meet__tag{background:var(--s-unit);color:#fff;box-shadow:0 3px 0 var(--s-unit-lip);letter-spacing:.1em;text-transform:uppercase;border-radius:10px;padding:6px 11px 5px;font-size:12px;font-weight:800;display:inline-block}.meet__title{align-items:baseline;gap:12px;margin:12px 0 0;display:flex}.meet__letter{letter-spacing:-.02em;font-size:clamp(60px,11cqi,104px);font-weight:800;line-height:.9}.meet__name{color:color-mix(in srgb, var(--s-ink) 55%, transparent);font-variant-numeric:tabular-nums;font-size:20px;font-weight:800}.meet__relation{color:color-mix(in srgb, var(--s-ink) 75%, transparent);margin:10px 0 0;font-size:16px;font-weight:600;line-height:1.4}.meet__memory{color:color-mix(in srgb, var(--s-ink) 60%, transparent);margin:8px 0 0;font-size:14px;font-weight:500;line-height:1.45}@media (height<=560px){.meet__memory{display:none}}.meet__art{grid-area:art;width:100%;height:auto;max-height:min(44dvh,380px);margin:0 auto;display:block;overflow:visible}.meet__actions{flex-wrap:wrap;grid-area:actions;align-items:center;gap:12px 18px;display:flex}.meet__prompt{align-items:center;gap:8px;margin:0;font-size:18px;font-weight:800;display:flex}.meet__prompt-arrow{color:var(--s-unit);animation:1.3s ease-in-out infinite point-bob}.session--kids .meet__card{border-radius:28px;padding:14px 18px 16px}.session--kids .meet__art{max-height:min(40dvh,440px)}.session--kids .meet__actions{justify-content:center;gap:28px}.meet__point{place-items:center;width:76px;height:76px;animation:1.2s ease-in-out infinite point-bob;display:grid}@keyframes meet-in{0%{opacity:0;transform:translateY(14px)scale(.98)}}@keyframes point-bob{50%{transform:translateY(6px)}}.session .engr__lines line,.session .engr__ledgers line{stroke:currentColor;stroke-width:1.3px;stroke-linecap:round;opacity:.78}.session .engr__ledgers line{stroke-width:1.6px;opacity:.9}.session .engr__barline{stroke:currentColor;stroke-width:1.6px;opacity:.78}.session .engr__hollow{fill:var(--s-paper)}.session .engr__white{fill:#fff;stroke:color-mix(in srgb, var(--s-ink) 38%, transparent);stroke-width:1px}.session .engr__black{fill:var(--s-ink)}.session .engr__middle-c{fill:color-mix(in srgb, var(--s-ink) 40%, transparent)}.session .engr__letter{fill:color-mix(in srgb, var(--s-ink) 62%, transparent);font-family:var(--s-font);letter-spacing:.08em;font-size:12px;font-weight:800}.meet__settle{transform-box:fill-box;transform-origin:50%;animation:.7s cubic-bezier(.3,1.4,.5,1) .14s both note-settle}.meet__leader{stroke-width:2.2px;stroke-linecap:round;stroke-dasharray:.1 6;opacity:.85;animation:.42s ease-out .62s both fade-in}.meet__halo{fill:var(--s-unit);opacity:.22;transform-box:fill-box;transform-origin:50%;animation:1.6s ease-in-out infinite halo}.meet--play .engr__key--lit{animation:1.4s ease-in-out infinite key-glow}.meet__friend{transform-box:fill-box;transform-origin:50% 100%;animation:.9s cubic-bezier(.3,1,.5,1) both friend-hop}.meet--play .meet__friend{animation:1.8s ease-in-out infinite friend-sway}.session--kids .meet__settle{animation:none}@keyframes note-settle{0%{opacity:0;transform:translateY(-16px)}50%{opacity:1}}@keyframes fade-in{0%{opacity:0}}@keyframes halo{50%{opacity:.08;transform:scale(1.25)}}@keyframes key-glow{50%{opacity:.6}}@keyframes friend-hop{0%{opacity:0;transform:translate(80px,-70px)rotate(12deg)}25%{opacity:1}50%{transform:translate(28px,-46px)rotate(-6deg)}76%{transform:translate(0)scale(1.08,.88)}88%{transform:translateY(-4px)scale(.97,1.04)}to{transform:none}}@keyframes friend-sway{0%,to{transform:rotate(-4deg)}50%{transform:rotate(4deg)translateY(-3px)}}.summary{width:100%;min-height:100dvh;padding:28px 20px calc(28px + env(safe-area-inset-bottom));background:var(--s-bg);flex-direction:column;align-items:center;display:flex;overflow-y:auto}.summary__inner{text-align:center;flex-direction:column;align-items:center;gap:14px;width:min(580px,100%);margin:auto 0;display:flex}.summary__picture{width:min(210px,56vw);height:auto;animation:.7s cubic-bezier(.3,1.5,.5,1) both picture-in}.summary .pic__ground{fill:#0000004d}.session--kids .pic__ground{fill:#78501e1f}.summary .pic__sparkle{fill:var(--s-star);transform-box:fill-box;transform-origin:50%;animation:2.4s ease-in-out infinite twinkle}.summary .pic__sparkle:nth-of-type(2n){animation-delay:-1.2s}.summary .pic__pendulum{transform-origin:129px 104px;animation:1.1s ease-in-out infinite alternate tick}.summary__title{color:var(--s-star);margin:2px 0 0;font-size:clamp(26px,5vw,34px);font-weight:800;line-height:1.15}.summary__sub{color:var(--s-muted);margin:-6px 0 0;font-size:16px;font-weight:700}.summary__tiles{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;width:100%;margin-top:10px;display:grid}.summary--placement .summary__sub{max-width:34em;line-height:1.45}.summary--placement .summary__tiles{grid-template-columns:repeat(2,minmax(0,1fr));max-width:360px}.tile{--tone:var(--s-ok);--tone-lip:var(--s-ok-lip);background:var(--tone);box-shadow:0 var(--s-lip-sm) 0 var(--tone-lip);border-radius:16px;padding:2px;animation:.48s cubic-bezier(.3,1.4,.5,1) both tile-in}.tile:nth-child(2){animation-delay:90ms}.tile:nth-child(3){animation-delay:.18s}.tile--time{--tone:var(--s-listen);--tone-lip:var(--s-listen-lip)}.tile--star{--tone:var(--s-star);--tone-lip:var(--s-star-lip)}.tile__label{color:var(--s-bg);letter-spacing:.09em;text-transform:uppercase;margin:5px 0 6px;font-size:12px;font-weight:800}.tile__face{background:var(--s-bg);min-height:62px;color:var(--tone);border-radius:14px;justify-content:center;align-items:center;gap:8px;padding:10px 6px;display:flex}.tile__face--crowns{gap:0}.tile__value{font-variant-numeric:tabular-nums;white-space:nowrap;font-size:23px;font-weight:800}.tile__icon,.tile__ring{flex:none}.tile__ring-track,.tile__ring-fill{fill:none;stroke-width:5px}.tile__ring-track{stroke:color-mix(in srgb, var(--tone) 25%, transparent)}.tile__ring-fill{stroke:var(--tone);stroke-linecap:round;stroke-dasharray:100 100;transform-box:fill-box;transform-origin:50%;animation:1.1s cubic-bezier(.3,.8,.3,1) .38s both ring-fill;transform:rotate(-90deg)}.summary__crown--new{transform-origin:50% 60%;animation:.56s cubic-bezier(.3,1.7,.5,1) both crown-in;animation-delay:calc(.76s + var(--i) * .3s)}.summary__sheet{border:2px solid var(--s-paper-lip);border-radius:var(--s-radius);background:var(--s-paper);width:100%;color:var(--s-ink);box-shadow:0 var(--s-lip) 0 var(--s-paper-lip);margin:8px 0 0;padding:12px 16px;animation:.48s cubic-bezier(.3,1.4,.5,1) .26s both tile-in}.summary__caption{color:color-mix(in srgb, var(--s-ink) 58%, transparent);letter-spacing:.09em;text-align:left;text-transform:uppercase;font-size:12px;font-weight:800}.summary__staff{max-width:100%;height:auto;margin:2px auto 0;display:block}.summary .engr__practised{animation:.4s both fade-in;animation-delay:calc(.42s + var(--i) * .11s)}.summary__continue{width:min(340px,100%);margin-top:14px}.session--kids.summary{justify-content:center;gap:22px}.summary__stage{place-items:center;width:min(680px,100%);display:grid;position:relative}.summary__dance{width:100%;height:auto;max-height:42dvh;color:var(--s-ink);display:block;position:relative;overflow:visible}.summary__dancer{transform-box:fill-box;transform-origin:50% 100%;animation:.76s ease-in-out infinite alternate dance;animation-delay:calc(var(--i) * -380ms)}.summary__rays{aspect-ratio:1;pointer-events:none;z-index:0;width:130%;max-width:820px;animation:50s linear infinite spin;position:absolute}.summary__stars,.summary .sbtn{z-index:1;position:relative}.summary--unit{overflow:clip}.summary .pic__rays path{fill:var(--s-star);opacity:.2}.summary__stars{align-items:center;gap:4px;display:flex}.summary__star--on{animation:.56s cubic-bezier(.3,1.7,.5,1) both star-pop;animation-delay:calc(.36s + var(--i) * .28s)}@keyframes picture-in{0%{opacity:0;transform:translateY(18px)scale(.85)}}@keyframes tile-in{0%{opacity:0;transform:translateY(12px)}}@keyframes ring-fill{0%{stroke-dashoffset:100px}}@keyframes crown-in{0%{filter:grayscale()brightness(.55);transform:scale(.85)}55%{filter:none;transform:scale(1.22)rotate(-6deg)}to{filter:none;transform:none}}@keyframes star-pop{0%{opacity:0;transform:scale(.2)rotate(-30deg)}}@keyframes twinkle{50%{opacity:.35;transform:scale(.7)}}@keyframes tick{0%{transform:rotate(-16deg)}to{transform:rotate(16deg)}}@keyframes dance{0%{transform:rotate(-7deg)}to{transform:translateY(-10px)rotate(7deg)}}@keyframes spin{to{transform:rotate(360deg)}}@media (width<=600px){.session__top{gap:12px;padding:14px 16px 8px}.session--kids .session__top{padding:18px 26px 8px 12px}.session__body{padding-left:16px;padding-right:16px}.session__feedback{padding:18px 16px calc(18px + env(safe-area-inset-bottom))}.session--adult .session__feedback-inner{flex-wrap:wrap;gap:12px 14px}.session--adult .session__next{flex-basis:100%}.session--adult .session__next .sbtn{width:100%}.session__headline{font-size:21px}.session__line{font-size:16px}.meet__card{padding:16px 16px 18px}.session--kids .meet__card{border-radius:22px;padding:10px 10px 12px}.summary{padding:20px 16px calc(20px + env(safe-area-inset-bottom))}.summary__tiles{gap:8px}.tile__label{letter-spacing:.06em;font-size:11px}.tile__face{flex-direction:column;gap:4px;min-height:74px}.tile__value{font-size:20px}.summary .tile__face--crowns{flex-direction:row}.summary .tile__face--crowns svg{width:26px;height:26px}}@media (prefers-reduced-motion:reduce){.session,.session *,.session :before,.session :after{transition:none!important;animation:none!important}}.app--home{height:100dvh;min-height:0;position:relative;overflow:hidden}body:has(.app--home){overscroll-behavior:none;overflow:hidden}.home__scroll{overscroll-behavior:contain;-webkit-overflow-scrolling:touch;flex:auto;min-height:0;position:relative;overflow:hidden auto}.app--focus .home__scroll{touch-action:pan-y}.home__top{z-index:8;padding:max(12px, env(safe-area-inset-top)) max(16px, env(safe-area-inset-right)) 10px max(16px, env(safe-area-inset-left));flex:none;position:relative}.home__play{z-index:7;left:max(16px, env(safe-area-inset-left));bottom:max(16px, env(safe-area-inset-bottom));background:var(--brand-cream);cursor:pointer;-webkit-tap-highlight-color:transparent;width:88px;height:88px;transition:transform var(--path-press,90ms ease-out), box-shadow var(--path-press,90ms ease-out);border:0;border-radius:50%;place-items:center;padding:0;display:grid;position:absolute;box-shadow:0 6px #2b2d4224,0 12px 26px #50321429}.home__play svg{display:block}.home__play:active{transform:translateY(5px);box-shadow:0 1px #2b2d4224,0 6px 14px #5032141f}.home__play:focus-visible{outline:3px solid var(--accent);outline-offset:3px}@media (width<=600px){.home__play{width:76px;height:76px}.home__play svg{width:58px;height:58px}}.session__frame.session__frame--clear{background:0 0}.app--focus>.session__frame{z-index:1;position:relative}.session__spacer{flex:1}.session__actions{flex:none;align-items:center;gap:8px;display:flex}.session__tool{width:40px;height:40px;color:var(--s-muted);cursor:pointer;-webkit-tap-highlight-color:transparent;background:0 0;border:0;border-radius:12px;flex:none;place-items:center;padding:0;display:inline-grid;position:relative}.session__tool:hover{color:var(--s-text);background:color-mix(in srgb, var(--s-text) 8%, transparent)}.session__tool[aria-expanded=true],.session__tool[aria-pressed=true]{color:var(--s-listen)}.session__tool:focus-visible{outline:3px solid var(--s-listen);outline-offset:2px}.session__overlay{z-index:8;overscroll-behavior:contain;max-height:calc(100dvh - 96px);position:absolute;top:76px;left:0;right:0;overflow-y:auto;box-shadow:0 18px 30px #00000059}.session__overlay .devicebar{border-top:1px solid var(--line)}.session__body.session__body--fill{align-items:stretch;gap:0;padding:0;overflow:hidden}.session__body.session__body--fill>:first-child,.session__body.session__body--fill>:last-child{margin-top:0;margin-bottom:0}.focus.focus--session{flex:auto;width:100%;max-width:1180px;height:auto;min-height:0;margin:0 auto;padding-top:4px}.main.session-lesson{width:100%;max-width:1040px;min-height:0;padding:8px 28px calc(16px + env(safe-area-inset-bottom));flex:auto;margin:0 auto;overflow-y:auto}.app--session{height:100dvh;min-height:0;overflow:hidden}.app--session>.summary{height:100dvh;min-height:0}.path-item{flex-direction:column;flex:auto;justify-content:center;align-items:center;width:100%;min-height:0;display:flex}.path-phrase{flex-direction:column;flex:0 auto;justify-content:center;width:100%;max-width:1000px;min-height:0;display:flex}.path-phrase>.score{flex:0 auto;min-height:0;max-height:100%;overflow:hidden auto}.path-keys{flex:none;width:100%;max-width:960px}.session--kids .path-keys .piano{max-height:min(240px,28dvh)}@media (width<=600px){.main.session-lesson{padding-left:16px;padding-right:16px}}@media (width<=560px){.session__frame--tools .session__count{display:none}.session__frame--tools .session__top{gap:10px;padding-left:10px;padding-right:10px}}@media (width<=600px){.session__overlay{top:66px}}.path-close{width:44px;height:44px;color:var(--muted);cursor:pointer;background:0 0;border:0;border-radius:12px;flex:none;place-items:center;padding:0;display:inline-grid}.path-close:hover{color:var(--text)}.path-close:focus-visible{outline:3px solid var(--accent);outline-offset:2px}.focus__step.path-close{background:#ffffffd9;border-radius:50%;width:48px;height:48px}.topbar--path-song{justify-content:flex-start}.topbar--path-song .topbar__text{flex:1;min-width:0}.topbar--path-song .topbar__settings{margin-left:auto}.session__keys-hint{color:color-mix(in srgb, var(--tone) 45%, var(--s-muted));white-space:nowrap;font-size:12px;font-weight:700}.summary.summary{position:relative}.summary__close{z-index:2;top:max(12px, env(safe-area-inset-top));left:max(12px, env(safe-area-inset-left));position:absolute}.summary__keys-hint{color:var(--s-muted);text-align:center;margin:10px 0 0;font-size:13px;font-weight:700}.path-bubble__hint{color:var(--path-surface-text);opacity:.7;text-align:center;margin-top:2px;font-size:11px;font-weight:600;display:block}.home__head{z-index:9;flex:none;position:relative}.app--home .topbar__settings{display:inline-flex}.home__head>.settings-panel{display:none}.home__head>.settings-panel.settings-panel--open{overscroll-behavior:contain;border-bottom:1px solid var(--line);background:var(--panel,var(--bg));max-height:calc(100dvh - 96px);display:block;position:absolute;top:100%;left:0;right:0;overflow-y:auto;box-shadow:0 18px 30px #00000059}.home__head .habits-bar{flex:none}.path-song{--songs-gap:10px;gap:var(--songs-gap);width:100%;max-width:1100px;min-height:0;padding:4px 20px calc(10px + env(safe-area-inset-bottom));flex-direction:column;flex:auto;margin:0 auto;display:flex}.path-song__stage{flex:auto;min-height:140px}.path-song__keys{flex:none}.session--kids .path-song__keys .piano{max-height:min(240px,28dvh)}.path-song__credit{color:var(--s-muted,var(--muted));text-align:center;flex:none;margin:0;font-size:12px}@media (width<=600px){.path-song{padding-left:10px;padding-right:10px}}.session__frame--keys>.session__body{padding-bottom:8px}.session__dock.session__dock--docked{z-index:5;flex:none;width:100%;max-width:1040px;margin:0 auto;padding:0 24px;position:relative;bottom:auto;left:auto;right:auto}.session__feedback.session__feedback--docked{border-radius:var(--s-radius);box-shadow:0 var(--s-lip-sm) 0 color-mix(in srgb, var(--tone) 35%, transparent);padding:12px 18px;animation:.26s cubic-bezier(.2,.9,.3,1.05) feedback-rise}.session__feedback--docked .session__headline{font-size:21px}.session__feedback--docked .session__line{font-size:16px}.session__keys{width:100%;padding:10px 24px calc(12px + env(safe-area-inset-bottom));flex:none;justify-content:center;display:flex}.session__keys>.path-keys{max-width:960px}.session__keys--correcting .key--expected{fill:var(--s-listen);stroke:color-mix(in srgb, var(--s-listen) 55%, #000);stroke-width:4px;animation:1.1s ease-in-out infinite key-call}.session--kids .session__keys--correcting .key--expected{stroke:var(--s-amber-lip);stroke-width:5px}@keyframes feedback-rise{0%{opacity:0;transform:translateY(14px)}}@keyframes key-call{50%{opacity:.72}}@media (width<=600px){.session__dock.session__dock--docked,.session__keys{padding-left:10px;padding-right:10px}.session__feedback.session__feedback--docked{padding:10px 12px}.session--adult .session__feedback--docked .session__feedback-inner{flex-wrap:wrap;gap:8px 12px}}@media (prefers-reduced-motion:reduce){.session__keys--correcting .key--expected{animation:none}}.summary__close{align-items:center;gap:4px;display:flex}.path-phrase__along{color:var(--s-muted);text-align:center;margin:8px 0 0;font-size:14px;font-weight:700}.path-circles{width:min(720px,100%)}.circle-card-wrap{width:min(360px,100%)}.circle-card{--rise:.5;width:100%;height:min(34dvh,280px);position:relative}.circle-card__friend{left:50%;bottom:calc(var(--rise) * (100% - 140px));transition:bottom .3s ease-out;position:absolute;transform:translate(-50%)}.circle-card__friend--found{animation:.26s ease-out pop}.chord-card .chord-card__note{color:var(--s-ink,#1f2937)}.chord-card .chord-card__note--found{color:var(--s-ok)}.path-skip{margin-top:10px}@media (width<=560px){.app--home .shortcuts-btn{display:none}}@media (width<=440px){.app--home .topbar{gap:6px;padding-left:10px;padding-right:10px}.app--home .topbar .segmented__btn{padding:7px;font-size:12px}.app--home .topbar .instr__button,.app--home .topbar .topbar__settings{width:34px;height:34px}.app--home .habits-bar{gap:2px}.app--home .habits-chip{gap:3px;height:34px;padding:0 3px;font-size:14px}.app--home .habits-chip svg{width:18px;height:auto}.app--home .habits-chip--goal .habits-chip__figure{display:none}}.session__close-slot{flex:none;display:inline-flex;position:relative}.dlg{border:1px solid var(--line);border-radius:var(--r-lg);background:var(--panel);width:min(520px,100vw - 32px);color:var(--text);box-shadow:var(--shadow);padding:22px 24px}.dlg::backdrop{background:#080a0e9e}.dlg__title{margin:0 0 8px;font-size:18px}.dlg__body{color:var(--muted);margin:0;font-size:14px}.dlg__steps{color:var(--muted);margin:14px 0 0;padding-left:20px;font-size:14px}.dlg__steps li{margin-bottom:6px}.dlg__steps strong,.dlg__body strong{color:var(--text);font-weight:600}.dlg__shortcut{border:1px solid var(--line);border-radius:var(--r-sm);background:var(--bg);margin-top:16px;padding:11px 12px}.dlg__shortcut-label{text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin-bottom:6px;font-size:11px;display:block}.dlg__shortcut-row{align-items:center;gap:8px;display:flex}.dlg__url{white-space:nowrap;min-width:0;color:var(--accent);flex:1;font-family:ui-monospace,Cascadia Code,Consolas,monospace;font-size:12px;overflow-x:auto}.dlg__actions{flex-wrap:wrap;align-items:center;gap:10px;margin-top:18px;display:flex}.dlg__later{color:var(--muted);margin-top:12px;font-size:12px;text-decoration:none}:root{--keyhint-size:20px}.keyhint,.keycap{border:1px solid var(--line);background:var(--bg);min-width:1.6em;height:1.6em;color:var(--muted);vertical-align:middle;white-space:nowrap;border-bottom-width:2px;border-radius:5px;justify-content:center;align-items:center;padding:0 .4em;font:600 11px/1 ui-sans-serif,system-ui,sans-serif;display:inline-flex}.keyhint{min-width:var(--keyhint-size);height:var(--keyhint-size);letter-spacing:0;text-transform:none;opacity:.85;margin-left:8px;padding:0 4px;font-family:Georgia,Times New Roman,serif;font-size:12px}button>.keyhint:not(.keyhint--under){margin-left:0}.sbtn--wide:has(>.keyhint:not(.keyhint--under)):before{content:"";width:var(--keyhint-size);flex:none}.sbtn .keyhint:not(.keyhint--under){color:#fff;background:#ffffff2e;border-color:#ffffff8c}.keyhint--under{pointer-events:none;margin:0;position:absolute;top:calc(100% + 6px);left:50%;transform:translate(-50%)}.keycap--note{font-family:Georgia,Times New Roman,serif;font-size:12px}.shortcuts-btn{border:1px solid var(--line);border-radius:var(--r-sm);background:var(--panel-2);width:40px;height:40px;color:var(--muted);cursor:pointer;flex:none;justify-content:center;align-items:center;padding:0;transition:border-color .12s,color .12s;display:inline-flex}.shortcuts-btn:hover,.shortcuts-btn[aria-expanded=true]{border-color:var(--accent);color:var(--text)}@media (hover:none) and (pointer:coarse){.shortcuts-btn{display:none}}.shortcuts{max-height:calc(100dvh - 32px);overflow-y:auto}.shortcuts__head{justify-content:space-between;align-items:center;gap:12px;margin-bottom:6px;display:flex}.shortcuts__head .dlg__title{margin:0}.shortcuts__section{border-top:1px solid var(--line);margin-top:14px;padding-top:14px}.shortcuts__heading{letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin:0 0 8px;font-size:11px;font-weight:600}.shortcuts__list{gap:6px;margin:0;display:grid}.shortcuts__row{grid-template-columns:minmax(96px,max-content) 1fr;align-items:center;gap:14px;display:grid}.shortcuts__row dt{flex-wrap:wrap;align-items:center;gap:2px;display:flex}.shortcuts__row dd{margin:0;font-size:14px}.shortcuts__or{color:var(--muted);font-size:12px}.shortcuts__note{color:var(--muted);margin:0 0 8px;font-size:13px;line-height:1.6}.shortcuts__note strong{color:var(--text);font-weight:600}
