:root{--ink:#212529;--ink-soft:#5c5f66;--paper:#fff6e9;--line:#eadfce;--purple:#7048e8;--teal:#12b886;--green:#40c057;--red:#fa5252;--orange:#fd7e14;color:var(--ink);-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent;font-family:"Baloo 2",system-ui,-apple-system,Segoe UI,sans-serif;font-size:18px}*{box-sizing:border-box}html,body,#app{background:var(--paper);overscroll-behavior:none;height:100%;margin:0}#app{overflow:auto}button{font:inherit;color:inherit;cursor:pointer;touch-action:manipulation}button:focus-visible{outline-offset:2px;outline:4px solid #4dabf7}.btn{border:3px solid var(--line);background:#fff;border-radius:18px;min-height:52px;padding:10px 18px;font-size:20px;font-weight:700}.btn.square{min-width:56px;padding:6px 10px;font-size:26px}.btn.ghost{background:#fff}.btn.primary{background:var(--purple);color:#fff;border-color:var(--purple);box-shadow:0 5px #4527a0}.btn.big{border-radius:24px;padding:14px 30px;font-size:26px}.btn:active{transform:translateY(3px)}.pulse{animation:1.1s ease-in-out infinite pulse}@keyframes pulse{0%,to{box-shadow:0 0 #7048e88c}50%{box-shadow:0 0 0 12px #7048e800}}@media (prefers-reduced-motion:reduce){.pulse{outline:4px solid var(--purple);animation:none}}.clef.svelte-1daj87o{display:block;overflow:visible}.body.svelte-1daj87o{transform-origin:60px 170px;animation:2.6s ease-in-out infinite svelte-1daj87o-bob}.happy.svelte-1daj87o .body:where(.svelte-1daj87o){animation:.5s ease-out 2 svelte-1daj87o-jump}.dance.svelte-1daj87o .body:where(.svelte-1daj87o){animation:svelte-1daj87o-dance var(--beat) ease-in-out infinite alternate}@keyframes svelte-1daj87o-dance{0%{transform:translateY(0)rotate(-8deg)}to{transform:translateY(-10px)rotate(8deg)}}.talking.svelte-1daj87o .mouth:where(.svelte-1daj87o){transform-origin:47px 101px;animation:.28s ease-in-out infinite alternate svelte-1daj87o-talk}.eye.svelte-1daj87o{transform-box:fill-box;transform-origin:50%;animation:4s infinite svelte-1daj87o-blink}@keyframes svelte-1daj87o-bob{0%,to{transform:translateY(0)rotate(-2deg)}50%{transform:translateY(-5px)rotate(2deg)}}@keyframes svelte-1daj87o-jump{0%{transform:translateY(0)scale(1)}40%{transform:translateY(-22px)scale(1.06,.96)}to{transform:translateY(0)scale(1)}}@keyframes svelte-1daj87o-talk{0%{transform:scaleY(1)}to{transform:scaleY(1.9)}}@keyframes svelte-1daj87o-blink{0%,92%,to{transform:scaleY(1)}95%{transform:scaleY(.1)}}@media (prefers-reduced-motion:reduce){.body.svelte-1daj87o,.eye.svelte-1daj87o,.mouth.svelte-1daj87o{animation:none!important}}.screen.svelte-wuhoor{flex-direction:column;justify-content:center;align-items:center;gap:20px;min-height:100%;padding:24px 16px 48px;display:flex}.hero.svelte-wuhoor{align-items:center;gap:16px;display:flex}h1.svelte-wuhoor{color:var(--purple);margin:0;font-size:clamp(40px,7vw,64px);line-height:1}.tagline.svelte-wuhoor{color:var(--ink-soft);margin:4px 0 0;font-size:22px}h2.svelte-wuhoor{margin:8px 0 0;font-size:30px}.faces.svelte-wuhoor{flex-wrap:wrap;justify-content:center;gap:16px;max-width:900px;display:flex}.face-card.svelte-wuhoor{border:4px solid var(--line);width:160px;box-shadow:0 6px 0 var(--line);background:#fff;border-radius:28px;flex-direction:column;align-items:center;gap:4px;padding:18px 10px 14px;transition:transform .12s;display:flex}.face-card.svelte-wuhoor:active{box-shadow:0 2px 0 var(--line);transform:translateY(4px)}.face-card.new.svelte-wuhoor{border-style:dashed}.face.svelte-wuhoor{font-size:64px;line-height:1.1}.name.svelte-wuhoor{min-height:1.3em;font-size:22px;font-weight:700}.stars.svelte-wuhoor{min-height:1.2em;font-size:16px}.face-pick.svelte-wuhoor{border:4px solid var(--line);background:#fff;border-radius:24px;width:92px;height:92px;font-size:54px}.face-pick.selected.svelte-wuhoor{border-color:var(--purple);background:#f3f0ff;transform:scale(1.08)}.name-input.svelte-wuhoor{font:inherit;border:3px solid var(--line);text-align:center;border-radius:18px;width:min(420px,100%);padding:14px 20px;font-size:22px}.row.svelte-wuhoor{gap:12px;display:flex}.home.svelte-1ary22t{flex-direction:column;align-items:center;min-height:100%;padding:16px 16px 48px;display:flex}header.svelte-1ary22t{justify-content:flex-end;align-self:stretch;display:flex}.player.svelte-1ary22t .face:where(.svelte-1ary22t){font-size:30px}.greeting.svelte-1ary22t{margin:8px 0 16px}.choices.svelte-1ary22t{flex-wrap:wrap;justify-content:center;gap:28px;display:flex}.choice.svelte-1ary22t{color:#fff;text-align:center;border:none;border-radius:36px;flex-direction:column;align-items:center;gap:6px;width:min(340px,90vw);padding:28px 24px;transition:transform .12s;display:flex}.choice.svelte-1ary22t:active{transform:translateY(5px)}.learn.svelte-1ary22t{background:var(--purple);box-shadow:0 8px #4527a0}.compose.svelte-1ary22t{background:var(--teal);box-shadow:0 8px #087f5b}.icon.svelte-1ary22t{font-size:84px;line-height:1.1}.title.svelte-1ary22t{font-size:40px;font-weight:800}.text.svelte-1ary22t{opacity:.95;font-size:19px;line-height:1.3}.map.svelte-1eyrebe{max-width:1200px;margin:0 auto;padding:12px 20px 48px}header.svelte-1eyrebe{align-items:center;gap:12px;display:flex}h1.svelte-1eyrebe{text-align:center;flex:1;margin:0;font-size:36px}.spacer.svelte-1eyrebe{width:64px}.path.svelte-1eyrebe{border:3px solid var(--line);background:#fff;border-radius:32px;margin-top:24px;padding:18px 20px 22px}.path.code.svelte-1eyrebe{background:#f3f0ff;border-color:#d0bfff}.path.theory.svelte-1eyrebe{background:#e6fcf5;border-color:#96f2d7}h2.svelte-1eyrebe{margin:0 0 14px;font-size:28px}ol.svelte-1eyrebe{flex-wrap:wrap;gap:14px;margin:0;padding:0 0 6px;list-style:none;display:flex}.bubble.svelte-1eyrebe{border:4px solid var(--line);width:148px;min-height:168px;box-shadow:0 6px 0 var(--line);background:#fff;border-radius:28px;flex-direction:column;justify-content:center;align-items:center;gap:4px;padding:12px 8px;display:flex;position:relative}.bubble.svelte-1eyrebe:active:not(:disabled){box-shadow:0 2px 0 var(--line);transform:translateY(4px)}.bubble.done.svelte-1eyrebe{border-color:#fab005;box-shadow:0 6px #f08c00}.bubble.locked.svelte-1eyrebe{opacity:.55;box-shadow:none}.num.svelte-1eyrebe{color:var(--ink-soft);font-weight:800;position:absolute;top:8px;left:12px}.icon.svelte-1eyrebe{font-size:52px;line-height:1.1}.name.svelte-1eyrebe{text-align:center;font-size:18px;font-weight:700;line-height:1.15}.star.svelte-1eyrebe{font-size:26px;position:absolute;top:4px;right:8px}.soon.svelte-1eyrebe{background:var(--line);border-radius:99px;padding:2px 8px;font-size:13px}.workspace.svelte-i100rl{position:absolute;inset:0}.flash.svelte-i100rl .blocklyFlyoutBackground{animation:1.2s ease-in-out infinite alternate svelte-i100rl-glow}@keyframes svelte-i100rl-glow{0%{fill:#fff1dc}to{fill:#ffd8a8}}.workspace.svelte-i100rl .blocklyFlyoutBackground{fill-opacity:1}.workspace.svelte-i100rl .sb-step{cursor:pointer}.workspace.svelte-i100rl .sb-hit>.blocklyPath{animation:.3s ease-out svelte-i100rl-hit}.workspace.svelte-i100rl .sb-step-hit{animation:.3s ease-out svelte-i100rl-step-hit}@keyframes svelte-i100rl-hit{0%{filter:brightness(1.45)drop-shadow(0 0 6px #ffd43b)}to{filter:none}}@keyframes svelte-i100rl-step-hit{0%{stroke:#ffd43b;stroke-width:6px}to{stroke-width:2px}}.workspace.svelte-i100rl .blocklyText{font-size:17px!important}.lesson.svelte-3w49qy{border-right:3px solid var(--line);background:#f8f0fc;flex-direction:column;gap:14px;height:100%;padding:14px;display:flex;overflow-y:auto}.clef-row.svelte-3w49qy{flex-direction:column;align-items:center;gap:6px;display:flex}.bubble.svelte-3w49qy{background:#fff;border:3px solid #d0bfff;border-radius:22px;padding:14px 16px;font-size:19px;font-weight:600;line-height:1.35;position:relative}.bubble.svelte-3w49qy:before{content:"";border:12px solid #0000;border-top:0;border-bottom-color:#d0bfff;position:absolute;top:-14px;left:50%;transform:translate(-50%)}.bubble.svelte-3w49qy p:where(.svelte-3w49qy){margin:0 0 4px}.icon-btn.svelte-3w49qy{background:#f3f0ff;border:none;border-radius:12px;min-width:48px;min-height:44px;font-size:22px}.dots.svelte-3w49qy{justify-content:center;gap:8px;margin:0;padding:0;list-style:none;display:flex}.dots.svelte-3w49qy li:where(.svelte-3w49qy){background:#e9ecef;border-radius:50%;width:16px;height:16px}.dots.svelte-3w49qy li.done:where(.svelte-3w49qy){background:var(--teal)}.dots.svelte-3w49qy li.current:where(.svelte-3w49qy){background:var(--purple);transform:scale(1.3)}.action.svelte-3w49qy{color:#fff;border-radius:24px;padding:18px;font-size:28px;animation:1.4s ease-in-out infinite svelte-3w49qy-wiggle}.listen.svelte-3w49qy{background:var(--orange);box-shadow:0 6px #d9480f}.confirm.svelte-3w49qy{background:var(--teal);box-shadow:0 6px #087f5b}@keyframes svelte-3w49qy-wiggle{0%,to{transform:rotate(0)}10%{transform:rotate(-3deg)}20%{transform:rotate(3deg)}30%{transform:rotate(0)}}.target.svelte-3w49qy{background:#fff;border:3px dashed #b197fc;border-radius:18px;padding:8px 6px 2px}.target.svelte-3w49qy .label:where(.svelte-3w49qy){padding-left:6px;font-size:17px;font-weight:800}.hint.svelte-3w49qy{background:#fff9db;border-radius:16px;margin:0;padding:12px 14px;font-size:17px;line-height:1.35}.footer.svelte-3w49qy{justify-content:space-between;align-items:center;margin-top:auto;display:flex}.help.svelte-3w49qy{font-size:20px}.skip.svelte-3w49qy{opacity:.45;background:0 0;border:none;min-width:44px;min-height:44px;font-size:18px}.piano.svelte-1oh5js9{border-top:3px solid var(--line);background:#2b2a33;padding:4px 12px 8px}.board.svelte-1oh5js9{height:56px;position:relative}svg.svelte-1oh5js9{width:100%;height:100%;display:block}.white.svelte-1oh5js9{fill:#fff;stroke:#c9c3b8;stroke-width:1px;transition:fill 60ms}.white.middle.svelte-1oh5js9{fill:#fff8e1}.black.svelte-1oh5js9{fill:#212529;transition:fill 60ms}.label.svelte-1oh5js9,.dot.svelte-1oh5js9{pointer-events:none;position:absolute;transform:translate(-50%)}.label.svelte-1oh5js9{color:#8a8478;font-family:"Baloo 2",system-ui,sans-serif;font-size:10px;font-weight:700;line-height:1;bottom:2px}.label.mid.svelte-1oh5js9{color:var(--purple);font-weight:800}.dot.svelte-1oh5js9{border-radius:50%;width:7px;height:7px;bottom:16px}.dot.on-black.svelte-1oh5js9{width:6px;height:6px;top:46%;bottom:auto}.kit.svelte-8ykw0g{justify-content:center;align-items:center;height:100%;padding:6px;display:flex}svg.svelte-8ykw0g{width:100%;height:100%;max-height:260px;overflow:visible}.part.svelte-8ykw0g{cursor:pointer;transform-box:fill-box;transform-origin:50%;-webkit-tap-highlight-color:transparent;outline:none;transition:transform 80ms}.part.on.svelte-8ykw0g{transform:scale(1.06)}.part.svelte-8ykw0g:focus-visible :is(.head:where(.svelte-8ykw0g),.cymbal-disc:where(.svelte-8ykw0g),.shell:where(.svelte-8ykw0g),.pedal-plate:where(.svelte-8ykw0g)){stroke:#4dabf7;stroke-width:5px}.shell.svelte-8ykw0g{fill:#339af0;stroke:#1864ab;stroke-width:3px}.hoop.svelte-8ykw0g{fill:#1864ab}.on.svelte-8ykw0g .shell:where(.svelte-8ykw0g){fill:var(--glow)}.head.svelte-8ykw0g{fill:#fff;stroke:#343a40;stroke-width:4px;transition:fill 60ms}.inner.svelte-8ykw0g{fill:none;stroke:#dee2e6;stroke-width:2px}.on.svelte-8ykw0g .head:where(.svelte-8ykw0g){fill:var(--glow)}.cymbal-disc.svelte-8ykw0g{fill:#f2b45a;stroke:#c9852c;stroke-width:3px;transition:fill 60ms}.groove.svelte-8ykw0g{fill:none;stroke:#a0641e59;stroke-width:1.5px}.bell.svelte-8ykw0g{fill:#e09b3d;stroke:#a86a1c;stroke-width:1.5px}.nut.svelte-8ykw0g{fill:#495057}.on.svelte-8ykw0g .cymbal-disc:where(.svelte-8ykw0g){fill:#ffe066;filter:drop-shadow(0 0 6px #ffd43b)}.pedal-plate.svelte-8ykw0g{fill:#adb5bd;stroke:#868e96;stroke-width:2px}.on.svelte-8ykw0g .pedal-plate:where(.svelte-8ykw0g){fill:var(--glow)}.name.svelte-8ykw0g{text-anchor:middle;fill:#fff;stroke:#212529;stroke-width:5px;paint-order:stroke;pointer-events:none;font-family:"Baloo 2",system-ui,sans-serif;font-size:17px;font-weight:800}@media (prefers-reduced-motion:reduce){.part.svelte-8ykw0g,.part.on.svelte-8ykw0g{transition:none;transform:none}}.panel.svelte-1w7k9wh{border-top:3px solid var(--line);background:#fff;min-width:0;display:flex}.views.svelte-1w7k9wh{flex-direction:column;flex:1;min-width:0;display:flex}.corner.svelte-1w7k9wh{background:#2b2a33;border-top-left-radius:22px;flex:none;width:150px}.open.svelte-1w7k9wh .corner:where(.svelte-1w7k9wh){width:clamp(200px,22vw,290px)}.panel.open.svelte-1w7k9wh{height:clamp(280px,40vh,410px)}.tabs.svelte-1w7k9wh{align-items:center;gap:8px;padding:8px 12px;display:flex}.tabs.svelte-1w7k9wh button[role=tab]:where(.svelte-1w7k9wh){border:3px solid var(--line);background:var(--paper);min-height:50px;color:var(--ink-soft);border-radius:16px;padding:6px 16px;font-size:19px;font-weight:700}.tabs.svelte-1w7k9wh button.active:where(.svelte-1w7k9wh){color:var(--ink);background:#f3f0ff;border-color:#b197fc}.explain.svelte-1w7k9wh{color:var(--ink-soft);flex:1;min-width:0;margin:0 0 0 8px;font-size:17px}.close.svelte-1w7k9wh{background:var(--paper);border:none;border-radius:14px;min-width:52px;min-height:48px;margin-left:auto;font-size:26px}.content.svelte-1w7k9wh{flex:1;min-height:0;padding:0 16px 14px;overflow:auto}.code.svelte-1w7k9wh{color:#f8f9fa;white-space:pre-wrap;word-break:break-word;background:#1f1d2b;border-radius:16px;margin:0;padding:14px 18px;font-family:JetBrains Mono,ui-monospace,monospace;font-size:21px;line-height:1.5}.code.svelte-1w7k9wh .tok-fn{color:#b197fc}.code.svelte-1w7k9wh .tok-str{color:#8ce99a}.code.svelte-1w7k9wh .tok-num{color:#ffc078}.code.svelte-1w7k9wh mark{color:#1f1d2b;background:#ffe066;border-radius:4px;padding:0 3px;animation:1s ease-in-out infinite alternate svelte-1w7k9wh-shine}@keyframes svelte-1w7k9wh-shine{0%{box-shadow:0 0 #ffe06699}to{box-shadow:0 0 0 5px #ffe06633}}.empty.svelte-1w7k9wh{background:var(--paper);border-radius:14px;margin:0;padding:12px 14px;font-size:18px}.staff-row.svelte-1w7k9wh{align-items:flex-start;gap:16px;display:flex}.staff.svelte-1w7k9wh{overflow-x:auto}.staff.svelte-1w7k9wh .sb-now{animation:.45s ease-out svelte-1w7k9wh-now}@keyframes svelte-1w7k9wh-now{0%{filter:drop-shadow(0 0 5px #fab005)drop-shadow(0 0 3px #fab005)}to{filter:none}}.staff-side.svelte-1w7k9wh{min-width:200px}.toggle.svelte-1w7k9wh{align-items:center;gap:8px;font-size:17px;display:inline-flex}.toggle.svelte-1w7k9wh input:where(.svelte-1w7k9wh){width:24px;height:24px}.small.svelte-1w7k9wh{color:var(--ink-soft);margin:8px 0 4px;font-size:15px}.key.svelte-1w7k9wh{margin:0;padding:0;font-size:17px;font-weight:700;list-style:none}.overlay.svelte-mz0xiy{z-index:50;background:#21252973;place-items:center;padding:16px;display:grid;position:fixed;inset:0}.card.svelte-mz0xiy{background:#fff;border-radius:36px;width:min(760px,100%);max-height:100%;padding:24px;animation:.4s cubic-bezier(.3,1.6,.6,1) svelte-mz0xiy-pop;overflow:auto}@keyframes svelte-mz0xiy-pop{0%{opacity:0;transform:scale(.6)}to{opacity:1;transform:scale(1)}}.top.svelte-mz0xiy{align-items:center;gap:16px;display:flex}.star.svelte-mz0xiy{font-size:54px;line-height:1;animation:1.2s ease-out svelte-mz0xiy-spin}@keyframes svelte-mz0xiy-spin{0%{transform:rotate(-200deg)scale(0)}to{transform:rotate(0)scale(1)}}h2.svelte-mz0xiy{margin:4px 0 0;font-size:30px}.pair.svelte-mz0xiy{grid-template-columns:1fr 1fr;gap:14px;margin:18px 0;display:grid}@media (width<=640px){.pair.svelte-mz0xiy{grid-template-columns:1fr}}.half.svelte-mz0xiy{border-radius:24px;flex-direction:column;gap:6px;padding:16px;display:flex}.music.svelte-mz0xiy{background:#fff4e6}.code.svelte-mz0xiy{background:#f3f0ff}.label.svelte-mz0xiy{color:var(--ink-soft);font-weight:700}strong.svelte-mz0xiy{font-size:30px;line-height:1.1}p.svelte-mz0xiy{margin:0;font-size:18px;line-height:1.35}pre.svelte-mz0xiy{color:#f8f9fa;white-space:pre-wrap;background:#1f1d2b;border-radius:12px;margin:6px 0 0;padding:12px;font-family:JetBrains Mono,ui-monospace,monospace;font-size:17px}pre.svelte-mz0xiy .tok-fn{color:#b197fc}pre.svelte-mz0xiy .tok-str{color:#8ce99a}pre.svelte-mz0xiy .tok-num{color:#ffc078}.actions.svelte-mz0xiy{justify-content:space-between;gap:12px;display:flex}.studio.svelte-1wtn9tm{flex-direction:column;height:100%;display:flex}.bar.svelte-1wtn9tm{padding:8px 12px;padding-top:max(8px, env(safe-area-inset-top));border-bottom:3px solid var(--line);background:#fff;align-items:center;gap:10px;min-height:76px;display:flex}.title.svelte-1wtn9tm{white-space:nowrap;text-overflow:ellipsis;flex:1;margin:0;font-size:clamp(20px,2.4vw,28px);overflow:hidden}.tempo.svelte-1wtn9tm{background:var(--paper);border-radius:18px;gap:2px;padding:4px;display:flex}.tempo.svelte-1wtn9tm button:where(.svelte-1wtn9tm){opacity:.5;background:0 0;border:none;border-radius:14px;width:52px;height:48px;font-size:26px}.tempo.svelte-1wtn9tm button.active:where(.svelte-1wtn9tm){opacity:1;box-shadow:0 2px 0 var(--line);background:#fff}.play.svelte-1wtn9tm{font:inherit;color:#fff;background:var(--green);border:none;border-radius:22px;min-width:150px;min-height:60px;padding:8px 24px;font-size:26px;font-weight:800;box-shadow:0 6px #2b8a3e}.play.playing.svelte-1wtn9tm{background:var(--red);box-shadow:0 6px #c92a2a}.play.svelte-1wtn9tm:active{transform:translateY(4px);box-shadow:0 2px #2b8a3e}.who.svelte-1wtn9tm{font-size:36px}.body.svelte-1wtn9tm{flex:1;grid-template-columns:1fr;min-height:0;display:grid}.body.has-lesson.svelte-1wtn9tm{grid-template-columns:270px 1fr}.main.svelte-1wtn9tm{flex-direction:column;min-width:0;min-height:0;display:flex}.canvas.svelte-1wtn9tm{flex:1;min-height:0;position:relative}.toast.svelte-1wtn9tm{z-index:5;background:#fff3bf;border:3px solid #ffd43b;border-radius:18px;padding:10px 18px;font-size:18px;font-weight:700;position:absolute;bottom:16px;left:50%;transform:translate(-50%)}@media (width<=1100px){.body.has-lesson.svelte-1wtn9tm{grid-template-columns:236px 1fr}.play.svelte-1wtn9tm span:where(.svelte-1wtn9tm){display:none}.play.svelte-1wtn9tm{min-width:80px}}@media (width<=700px){.tempo.svelte-1wtn9tm{display:none}.body.has-lesson.svelte-1wtn9tm{grid-template-rows:auto 1fr;grid-template-columns:1fr}}