.falling-notes[data-v-29f76ab7]{position:relative;width:100%;height:clamp(260px,42vh,480px);overflow:hidden;background:#070b0e;border-top:1px solid #29333b;contain:strict}svg[data-v-29f76ab7]{display:block;width:100%;height:100%}.lane-grid rect[data-v-29f76ab7]{fill:#ffffff05;stroke:#ffffff09;stroke-width:.7}.lane-grid .c-lane[data-v-29f76ab7]{fill:#ffffff0e}.falling-note rect[data-v-29f76ab7]{fill:hsl(var(--note-hue) 78% var(--note-lightness));stroke:#ffffffe0;stroke-width:1.4}.falling-note.is-repeat rect[data-v-29f76ab7]{stroke:#fff;stroke-width:2.4}.note-layer[data-v-29f76ab7]{will-change:transform}.hit-line[data-v-29f76ab7]{stroke:#f1c75b;stroke-width:4;filter:drop-shadow(0 0 6px #f1c75b)}.visualizer-empty[data-v-29f76ab7]{position:absolute;inset:0;display:grid;place-items:center;padding:2rem;color:#aebbc4;text-align:center}.keyboard-wrap[data-v-4bed73ec]{width:100%;overflow:hidden;border:1px solid var(--line);border-radius:0 0 14px 14px;background:#111820;box-shadow:inset 0 8px 18px #0000003d}.piano-svg[data-v-4bed73ec]{display:block;width:100%;height:auto;aspect-ratio:7.8 / 1;touch-action:none}.piano-key[data-v-4bed73ec]{stroke:#1c2830;stroke-width:1;transition:fill 80ms ease,stroke-width 80ms ease}.interactive .piano-key[data-v-4bed73ec]{cursor:pointer}.interactive .piano-key[data-v-4bed73ec]:focus-visible{outline:none;stroke:#ffd166;stroke-width:5}.white-key[data-v-4bed73ec]{fill:#f7f4eb}.black-key[data-v-4bed73ec]{fill:#18212a}.state-pitch-active[data-v-4bed73ec]{fill:hsl(var(--pitch-hue) 78% 68%)}.state-released[data-v-4bed73ec]{stroke:#7d8c99;stroke-width:4;animation:release-outline-4bed73ec .5s ease-out forwards}.state-pressed[data-v-4bed73ec]{stroke:#0b5f4a;stroke-width:4;filter:brightness(.84)}.state-correct[data-v-4bed73ec]{stroke:#18784f;stroke-width:5}.state-incorrect[data-v-4bed73ec]{stroke:#c92a3a;stroke-width:5}@keyframes release-outline-4bed73ec{0%{stroke-opacity:1;stroke-width:4}to{stroke-opacity:0;stroke-width:1}}.key-label[data-v-4bed73ec],.state-marker[data-v-4bed73ec],.hand-badge-text[data-v-4bed73ec]{text-anchor:middle;pointer-events:none;font-family:var(--font-sans);font-weight:800}.key-label[data-v-4bed73ec]{font-size:7.5px}.state-marker[data-v-4bed73ec]{font-size:12px}.marker-row-text[data-v-4bed73ec]{dominant-baseline:central}.white-label[data-v-4bed73ec],.white-marker[data-v-4bed73ec]{fill:#172027}.black-label[data-v-4bed73ec],.black-marker[data-v-4bed73ec]{fill:#fff}.black-label.active-key-label[data-v-4bed73ec],.black-marker.active-key-label[data-v-4bed73ec]{fill:#172027}.hand-badge[data-v-4bed73ec]{pointer-events:none}.hand-badge rect[data-v-4bed73ec]{stroke-width:1}.hand-badge-text[data-v-4bed73ec]{font-size:7px}.hand-badge-left rect[data-v-4bed73ec]{fill:#dcefff;stroke:#276e9f}.hand-badge-left text[data-v-4bed73ec]{fill:#174b6e}.hand-badge-right rect[data-v-4bed73ec]{fill:#eadff8;stroke:#72509c}.hand-badge-right text[data-v-4bed73ec]{fill:#4f3474}.hand-badge-both rect[data-v-4bed73ec]{fill:#f8fbfc;stroke:#45535c}.hand-badge-both text[data-v-4bed73ec]{fill:#172027}.sustain-indicator[data-v-4bed73ec]{pointer-events:none;stroke:#c68b00;stroke-linecap:round;stroke-width:4}.middle-c-marker[data-v-4bed73ec]{fill:#e14d5a}.song-studio[data-v-29d0d770]{margin:1rem 0;padding:clamp(1rem,2.4vw,1.6rem);border:1px solid var(--line);border-radius:18px;background:var(--card);box-shadow:0 12px 30px #242d3012}.studio-heading[data-v-29d0d770],.transport-source[data-v-29d0d770],.transport-options[data-v-29d0d770],.timeline-row[data-v-29d0d770],.recording-console[data-v-29d0d770]{display:flex;align-items:center;justify-content:space-between;gap:1rem}.studio-heading h2[data-v-29d0d770],.recording-console h3[data-v-29d0d770]{margin-bottom:.25rem}.storage-badge[data-v-29d0d770]{padding:.45rem .7rem;border-radius:999px;background:#e7f1ec;color:var(--green);font-size:.78rem;font-weight:750}.transport-source[data-v-29d0d770]{align-items:end;margin:1rem 0 .65rem}.transport-source label[data-v-29d0d770]{flex:1}.transport-source p[data-v-29d0d770]{max-width:440px;margin-bottom:.55rem;color:var(--muted);font-size:.85rem}.transport[data-v-29d0d770]{padding:.9rem;border-radius:14px;background:#18242c;color:#fff}.transport-buttons[data-v-29d0d770],.transport-options[data-v-29d0d770],.speed-control[data-v-29d0d770]{display:flex;align-items:center;flex-wrap:wrap;gap:.55rem}.transport button.ghost[data-v-29d0d770],.transport button.secondary[data-v-29d0d770]{border-color:#53636e;background:#273640;color:#fff}.timeline-row[data-v-29d0d770]{margin:.8rem 0}.timeline-label[data-v-29d0d770]{flex:1}.timeline-label input[data-v-29d0d770]{min-height:auto;padding:0;accent-color:var(--yellow)}.timeline-row output[data-v-29d0d770]{min-width:3.3rem;color:#dce6eb;font-variant-numeric:tabular-nums;text-align:center}.speed-control strong[data-v-29d0d770]{min-width:3.5rem;text-align:center}.repeat-button.active[data-v-29d0d770]{background:#8a6508;border-color:#f1c75b}.file-workspace[data-v-29d0d770]{display:grid;gap:.65rem;margin-top:1rem;padding:.9rem;border:1px solid #b8d3c6;border-radius:14px;background:#f1f8f5}.file-actions[data-v-29d0d770]{display:flex;flex-wrap:wrap;gap:.55rem}.file-workspace p[data-v-29d0d770]{margin:0;color:var(--muted);font-size:.85rem}.recording-console[data-v-29d0d770]{margin:1rem 0;padding:1rem;border:1px solid #d4b2b8;border-radius:14px;background:#fff7f7}.recording-console>div[data-v-29d0d770]{flex:1}.recording-console p[data-v-29d0d770]{margin-bottom:0;color:var(--muted)}.record-button[data-v-29d0d770]{background:#a52f3d;border-color:#7d1d29}.stop-recording[data-v-29d0d770]{animation:record-pulse-29d0d770 1.4s ease-in-out infinite;background:#7d1d29}.sr-only[data-v-29d0d770]{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@keyframes record-pulse-29d0d770{50%{box-shadow:0 0 0 6px #a52f3d2e}}@media(max-width:900px){.recording-console[data-v-29d0d770],.transport-source[data-v-29d0d770]{align-items:stretch;flex-direction:column}}:root{--ink: var(--tools-text);--muted: var(--tools-muted);--paper: var(--tools-bg);--card: var(--tools-surface);--line: var(--tools-line);--green: var(--tools-action);--green-dark: var(--tools-action-hover);--yellow: #f1c75b;--red: #a52f3d;--left: #4b92c2;--right: #8b68b8;--font-sans: var(--tools-sans);font-family:var(--font-sans);color:var(--ink);background:var(--paper);font-synthesis:none;text-rendering:optimizeLegibility}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-height:100vh;overflow-x:clip;background:radial-gradient(circle at 12% 15%,color-mix(in srgb,var(--green) 8%,transparent),transparent 25rem),var(--paper)}button,input,select{font:inherit}button,.file-button{min-height:44px;border:1px solid var(--green);border-radius:10px;padding:.68rem 1rem;background:var(--green);color:#fff;font-weight:750;cursor:pointer;box-shadow:0 2px #0000001a}button:hover,.file-button:hover{background:var(--green-dark)}button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible,.file-button:focus-within{outline:3px solid #efb936;outline-offset:3px}button:disabled{opacity:.46;cursor:not-allowed}button.secondary,.file-button.secondary{background:var(--card);color:var(--green)}button.secondary:hover{background:#edf5f1}button.ghost{color:var(--ink);background:transparent;border-color:var(--line);box-shadow:none}button.accent,.file-button.accent{background:#e1ad2f;border-color:#b98308;color:#2b210a}button.active{background:#795b09;border-color:#5f4704}.button-with-icon{display:inline-flex;align-items:center;justify-content:center;gap:.45rem}.button-icon{width:1rem;height:1rem;flex:0 0 auto;fill:currentcolor}.app-shell{min-height:100vh}.connection-actions,.control-row{display:flex;align-items:center;flex-wrap:wrap;gap:.65rem}.status-pill{display:inline-flex;align-items:center;gap:.45rem;padding:.52rem .75rem;border:1px solid var(--line);border-radius:999px;font-size:.88rem;background:var(--card)}.status-pill i{width:.62rem;height:.62rem;border-radius:50%;background:#ae7823}.status-pill.connected i{background:#20a476;box-shadow:0 0 0 4px #d5f3e9}.status-pill.simulator i{background:#8266b1}main{width:min(1140px,calc(100% - 40px));margin:0 auto;padding:0 0 4rem}.workspace-intro{max-width:900px;margin:42px auto 50px;text-align:center}.workspace-intro h1{margin-inline:auto;font-family:var(--tools-serif);font-size:clamp(2.7rem,6vw,4.9rem);font-weight:500;line-height:.98;letter-spacing:-.055em}.workspace-intro>div>p:not(.eyebrow,.composer,.compatibility-note){max-width:720px;margin:26px auto 0;color:var(--muted);font-size:clamp(1rem,2vw,1.14rem);line-height:1.7}.setup-workspace{margin-bottom:1.25rem;padding:clamp(1.35rem,3.5vw,2.5rem);border:1px solid var(--line);border-radius:24px;background:color-mix(in srgb,var(--card) 94%,transparent);box-shadow:var(--tools-shadow)}.setup-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:1.5rem}.setup-heading h2{margin-bottom:0;font-family:var(--tools-serif);font-weight:500}.setup-heading .eyebrow{margin-bottom:.65rem}.compatibility-note{max-width:720px;margin:14px auto 0;color:var(--muted);font-size:.82rem;line-height:1.55}h1,h2,h3,p{margin-top:0}h1{max-width:850px;margin-bottom:.2rem;font-size:clamp(2rem,4vw,3.45rem);line-height:.98;letter-spacing:-.045em}h2{font-size:clamp(1.6rem,3vw,2.5rem);line-height:1.08;letter-spacing:-.025em}h3{margin-bottom:.35rem}.eyebrow{color:var(--green);font-size:.77rem;font-weight:850;letter-spacing:.13em;text-transform:uppercase}.workspace-intro>div>.eyebrow,.piano-loading>.eyebrow{margin-bottom:var(--tools-hero-eyebrow-gap)}.composer,.hint,.privacy-note,.user-agent,small{color:var(--muted)}.lesson-card,.panel,.import-review{border:1px solid var(--line);border-radius:18px;background:var(--card);box-shadow:0 12px 30px #242d3012}.lesson-card{border-radius:24px;box-shadow:var(--tools-shadow)}.device-selectors,.settings-grid,.review-settings{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;margin:1rem 0}label{display:flex;flex-direction:column;gap:.42rem;font-weight:720;font-size:.9rem}input,select{width:100%;min-height:42px;padding:.55rem .65rem;border:1px solid #b9b6ae;border-radius:8px;background:#fff;color:var(--ink)}.lesson-tools{display:flex;flex-wrap:wrap;align-items:center;gap:.7rem;margin:1rem 0 0;padding-top:1rem;border-top:1px solid var(--line)}.file-button{position:relative;overflow:hidden}.file-button input{position:absolute;inset:0;opacity:0;cursor:pointer}.validation-errors,.feedback.error{border-left:5px solid var(--red);background:#fff0f0;color:#761b2a}.validation-errors{padding:1rem;margin:1rem 0;border-radius:8px}.lesson-card{position:relative;overflow:hidden;padding:1.25rem 1.5rem;margin:.8rem 0 1rem;background:linear-gradient(145deg,#fffdf8,#f8f2df)}.lesson-card-active{display:flex;min-height:390px;flex-direction:column}.lesson-identity{display:flex;align-items:flex-end;justify-content:space-between;gap:1rem;margin-bottom:1rem;padding-bottom:1rem;border-bottom:1px solid var(--line)}.lesson-identity .eyebrow,.lesson-identity h2,.lesson-identity .composer{margin:0}.lesson-identity .eyebrow{margin-bottom:.7rem}.lesson-identity h2{font-family:var(--tools-serif);font-size:clamp(1.65rem,3vw,2.35rem);font-weight:500}.lesson-step-content{display:grid;grid-template-rows:20px 60px 82px 40px;gap:6px;min-height:0;flex:1;overflow:hidden}.lesson-step-content .eyebrow-row,.lesson-step-content h3,.lesson-step-content .note-cards,.lesson-step-content .feedback{margin:0}.lesson-card h2{margin-bottom:.55rem;font-size:clamp(1.55rem,2.5vw,2.15rem)}.lesson-card-active .lesson-step-content h3{display:-webkit-box;min-height:60px;max-height:60px;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:2}.eyebrow-row,.section-heading,.overview-heading,.review-heading{display:flex;align-items:center;justify-content:space-between;gap:1rem}.eyebrow-row{margin-bottom:.65rem;color:var(--muted);font-size:.9rem}.note-cards{display:flex;flex-wrap:nowrap;gap:.65rem;min-height:0;overflow-x:auto;overflow-y:hidden;margin:.65rem 0;padding-bottom:.2rem;scrollbar-gutter:stable}.note-card{display:grid;box-sizing:border-box;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:minmax(36px,1fr) auto;gap:.15rem .8rem;height:78px;min-width:205px;padding:.4rem .7rem;border:2px solid;border-radius:12px;background:#fff;flex:0 0 205px}.note-card strong{grid-row:1;align-self:center}.note-details{display:grid;align-self:center;line-height:1.15}.note-card.left{border-color:var(--left)}.note-card.right{border-color:var(--right)}.note-card strong{font-size:1.2rem}.note-card span{color:var(--muted);font-size:.83rem}.note-card .missing{grid-column:1 / -1;color:#805a07;font-weight:800}.note-card .matched{grid-column:1 / -1;color:var(--green);font-weight:800}.feedback{margin:.55rem 0;padding:.6rem .8rem;border-radius:8px;background:#edf5f1}.lesson-card-active .feedback{box-sizing:border-box;height:40px;min-width:0;overflow:hidden;padding-block:.45rem;line-height:24px;white-space:nowrap;text-overflow:ellipsis}.feedback.gentle{color:var(--muted);background:transparent;padding-left:0}.progress-row{display:flex;align-items:center;gap:1rem;margin:.7rem 0}.progress-track{flex:1;height:10px;overflow:hidden;border-radius:999px;background:#e2ded2}.progress-track span{display:block;height:100%;background:var(--green);transition:width .16s ease}.completion{text-align:center;padding:1rem}.completion-mark{display:inline-grid;place-items:center;width:68px;height:68px;margin-bottom:1rem;border-radius:50%;background:var(--green);color:#fff;font-size:2.3rem}.results-grid,.import-facts,.diagnostic-summary dl{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.7rem}.results-grid div,.import-facts div,.diagnostic-summary dl div{padding:.8rem;border-radius:10px;background:#f0eee7}dt{color:var(--muted);font-size:.74rem}dd{margin:.2rem 0 0;font-size:1.15rem;font-weight:800}.keyboard-section{width:100vw;margin:1.4rem 0 1.2rem calc(50% - 50vw);padding-top:1.2rem;overflow:hidden;background:#111a20;color:#f8fbfc;border-top:1px solid #26333b;border-bottom:1px solid #26333b}.keyboard-heading-content,.keyboard-code-note{width:min(1320px,calc(100% - 2rem));margin-right:auto;margin-left:auto}.pitch-color-guide{padding:.65rem max(1rem,calc((100vw - 1320px)/2));border-top:1px solid #35434c;background:#111820;color:#dce4e8}.pitch-color-guide summary{width:fit-content;cursor:pointer;color:#fff;font-weight:800}.pitch-color-guide p{margin:.55rem 0;color:#b9c5cc;font-size:.84rem}.pitch-color-swatches{display:grid;grid-template-columns:repeat(auto-fit,minmax(90px,1fr));gap:.35rem}.pitch-color-swatches span{padding:.32rem .15rem;border:1px solid rgb(255 255 255 / 72%);border-radius:7px;color:#111820;text-align:center;font-size:.78rem;font-weight:900}.keyboard-heading-content .eyebrow{color:#8fd5bd}.keyboard-heading-actions{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:.65rem}.keyboard-section .legend span{color:#17242b;background:#f8fbfc;box-shadow:0 1px #ffffff73}.keyboard-section .legend .left{color:#174b6e;background:#dcefff}.keyboard-section .legend .right{color:#4f3474;background:#eadff8}.keyboard-section .legend .pressed{color:#183e34;background:#fff;border-color:#2e7863}.keyboard-section .legend .correct{color:#14603e;background:#fff;border-color:#18784f}.keyboard-section .legend .wrong{color:#7d1d29;background:#fff}.keyboard-section .legend .sustain{color:#694900;background:#fff;border-bottom-width:4px}.keyboard-section .legend .pitch{color:#17242b;background:linear-gradient(90deg,#f3a19b,#f3eb9b,#b0f39b,#9bf3d1,#9bcaf3,#b79bf3,#f39be4);border-color:#fff}.piano-stage{width:100%;border-top:1px solid #35434c}.keyboard-code-note{margin-top:.65rem;margin-bottom:.8rem;color:#b7c3ca;font-size:.82rem}.label-toggle{white-space:nowrap}.section-heading{align-items:end;margin-bottom:.8rem}.section-heading h2{margin-bottom:0}.legend{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:.4rem;font-size:.76rem}.legend span{padding:.3rem .52rem;border-radius:999px;border:1px solid;background:#fff;font-weight:700}.legend .left{border-color:var(--left)}.legend .right{border-color:var(--right)}.legend .wrong{border-color:var(--red)}.legend .sustain{border-color:#b57b00}.overview-heading{margin:1rem .2rem .35rem;color:var(--muted);font-size:.8rem}.pedals{display:grid;grid-template-columns:repeat(3,1fr);gap:.7rem;margin:1rem 0}.pedals article{display:flex;align-items:center;gap:.7rem;padding:.8rem;border:1px solid var(--line);border-radius:12px;background:#fff}.pedals article>span{font-size:1.7rem;color:#90989c}.pedals article.down{border-color:#be8b11;background:#fff5d8}.pedals article.down>span{color:#a57300;transform:rotate(45deg)}.pedals strong,.pedals small{display:block}.panel{margin:.8rem 0;padding:1rem}summary{cursor:pointer;font-weight:820}.count{display:inline-grid;place-items:center;min-width:1.5rem;height:1.5rem;margin-left:.4rem;border-radius:50%;background:#e5e2d9;font-size:.72rem}.danger-link{margin-top:1rem;padding-left:0;color:var(--red);background:transparent;border:0;box-shadow:none}.danger-link:hover{text-decoration:underline;background:transparent}.import-review{padding:clamp(1rem,3vw,2rem);margin:1rem 0;border-color:#b08b2b}.icon-button{width:42px;height:42px;padding:0;font-size:1.5rem}.track-list{display:grid;gap:.6rem;margin:1rem 0}.track-list label{display:grid;grid-template-columns:1fr minmax(220px,.6fr);align-items:center;padding:.75rem;border:1px solid var(--line);border-radius:10px}.track-list span strong,.track-list span small{display:block}.step-preview{max-height:260px;overflow:auto;margin:1rem 0;padding:1rem;border-radius:10px;background:#f2efe6}.step-preview li{margin:.35rem 0}.diagnostics[open],.settings-panel[open],.dev-panel[open]{padding-bottom:1.25rem}.diagnostic-summary{margin-top:1rem}.diagnostics>.privacy-note{margin:.85rem 0 0;line-height:1.5}.diagnostic-playback{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-top:1rem;padding:.9rem;border:1px solid var(--line);border-radius:10px;background:#f7f5ef}.diagnostic-playback h3,.diagnostic-playback p{margin:0}.diagnostic-playback p{margin-top:.2rem;color:var(--muted);font-size:.82rem}.diagnostic-summary dl{grid-template-columns:repeat(3,minmax(0,1fr))}.table-scroll{max-height:360px;overflow:auto;margin:1rem 0;border:1px solid var(--line);border-radius:10px;background:#fff}table{width:100%;border-collapse:collapse;font-size:.78rem}th,td{padding:.55rem;border-bottom:1px solid #e6e2da;text-align:left;white-space:nowrap}th{position:sticky;top:0;background:#efede6}@media(max-width:850px){.setup-heading{align-items:flex-start;flex-direction:column}.connection-actions{justify-content:flex-end}.device-selectors,.settings-grid,.review-settings{grid-template-columns:1fr}.results-grid,.import-facts,.diagnostic-summary dl{grid-template-columns:repeat(2,minmax(0,1fr))}.pedals{grid-template-columns:1fr}.section-heading{display:block}.keyboard-heading-actions{align-items:flex-start;justify-content:flex-start;flex-direction:column}.legend{justify-content:flex-start;margin-top:.7rem}.diagnostic-playback{align-items:flex-start;flex-direction:column}}@media(max-width:560px){main{width:min(100% - 32px,1140px)}.workspace-intro{margin:34px auto 38px}.workspace-intro h1{font-size:clamp(2.45rem,13vw,3.7rem)}.setup-workspace,.lesson-card{border-radius:18px}.connection-actions{width:100%;justify-content:space-between}.status-pill{max-width:60%}.eyebrow-row,.overview-heading{align-items:flex-start;flex-direction:column}.track-list label{grid-template-columns:1fr}.results-grid,.import-facts{grid-template-columns:1fr 1fr}.lesson-card-active{min-height:430px}.lesson-identity{align-items:flex-start;flex-direction:column}.lesson-step-content{grid-template-rows:44px 70px 82px 40px}}@media(prefers-color-scheme:dark){button.secondary:hover{background:var(--tools-surface-soft)}.device-selectors,.settings-grid,.review-settings,.track-list label,.table-scroll,.status-pill,.file-workspace,.recording-console{background:var(--card);border-color:var(--line)}th{background:var(--tools-surface-soft)}th,td{border-color:var(--line)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important}}