.dock-placed.svelte-85nbck{--dock-nav-gap:16px}@media (width<48rem),(orientation:landscape) and (height<=30rem){.dock-grip.svelte-85nbck{display:none}.dock-placed.svelte-85nbck{--dock-nav-gap:8px}}div.score-scroller.svelte-13scbj8{touch-action:pan-x pan-y;scrollbar-width:none}div.score-scroller.svelte-13scbj8::-webkit-scrollbar{display:none}div.osmd-horizontal.svelte-13scbj8 svg{max-width:none}.completion-backdrop.svelte-1j5xe4z{-webkit-backdrop-filter:blur();backdrop-filter:blur();overscroll-behavior:contain;background-color:#0d101400;transition:background-color .25s ease-out,-webkit-backdrop-filter .25s ease-out,backdrop-filter .25s ease-out}.completion-backdrop.opened.svelte-1j5xe4z{-webkit-backdrop-filter:blur(1.5px);backdrop-filter:blur(1.5px);background-color:#0d101473}.completion-dialog.svelte-1j5xe4z{overscroll-behavior:contain;background:var(--color-paper);border:1px solid var(--color-rule-strong);opacity:0;border-radius:20px;width:560px;max-width:calc(100vw - 24px);max-height:calc(100dvh - 24px);padding:20px 20px 18px;transition:opacity .25s ease-out,transform .25s ease-out;overflow-y:auto;transform:translateY(6px)scale(.96);box-shadow:0 30px 60px -20px #0d10144d,0 4px #0d10140a}@media (width>=768px){.completion-dialog.svelte-1j5xe4z{padding:32px 40px 28px}}.completion-dialog.opened.svelte-1j5xe4z{opacity:1;transform:translateY(0)scale(1)}.completion-star.svelte-1j5xe4z{transform-origin:50%;transition:transform .2s ease-out,opacity .2s ease-out}@media (prefers-reduced-motion:reduce){.completion-backdrop.svelte-1j5xe4z,.completion-dialog.svelte-1j5xe4z,.completion-star.svelte-1j5xe4z{transition:none}}.piano-keyboard.svelte-16prh1e{--white-key-width:2.5rem;--black-key-width:1.45rem;--white-key-height:12rem;--black-key-height:calc(var(--white-key-height) * .63);width:calc(52 * var(--white-key-width));height:var(--white-key-height);touch-action:none;-webkit-user-select:none;user-select:none;display:flex;position:relative}.piano-key.svelte-16prh1e{cursor:pointer;border:none;flex-direction:column;flex-shrink:0;justify-content:flex-end;align-items:center;padding:0;transition:background 60ms,box-shadow 90ms,transform 90ms;display:flex}.white-key.svelte-16prh1e{width:var(--white-key-width);height:var(--white-key-height);z-index:1;background:linear-gradient(#fff 0%,#f7f7f7 82%,#e8e8e8 100%);border:1px solid #d1d1d1;border-radius:0 0 6px 6px;padding-bottom:.45rem;box-shadow:inset 0 -6px 8px -6px #00000059,inset -2px 0 3px -2px #0000001f}.white-key.svelte-16prh1e+.white-key:where(.svelte-16prh1e){border-left:none}.white-key.key-pressed.svelte-16prh1e{transform-origin:top;background:linear-gradient(#ededed 0%,#e3e3e3 60%,#d6d6d6 100%);transform:translateY(1px)scaleY(.995);box-shadow:inset 0 8px 10px -8px #00000080,inset 0 -2px 4px -2px #0000004d}.white-key.state-active.svelte-16prh1e,.white-key.key-pressed.state-active.svelte-16prh1e{background:linear-gradient(#e5f0fa 0%,#d4e6f7 70%,#c0d9f2 100%)}.white-key.state-correct.svelte-16prh1e{background:linear-gradient(#e3f7ec 0%,#c9edd8 100%)}.white-key.state-wrong.svelte-16prh1e{background:linear-gradient(#fae6e6 0%,#f3cece 100%)}.white-key.state-inactive.svelte-16prh1e{opacity:.5}.white-key.active-zone.svelte-16prh1e{border-bottom:2px solid #3380cc}.black-key.svelte-16prh1e{width:var(--black-key-width);height:var(--black-key-height);z-index:2;background:linear-gradient(#424242 0%,#292929 55%,#171717 88%,#333 100%);border:none;border-radius:0 0 4px 4px;padding-bottom:.35rem;position:absolute;top:0;box-shadow:inset 0 1px #6b6b6b,inset 1px 0 #575757,inset -1px 0 #0f0f0f,inset 0 -3px 2px -2px #616161,2px 4px 6px -2px #0000008c,0 2px 3px #00000073}.black-key.key-pressed.svelte-16prh1e{background:linear-gradient(#2e2e2e 0%,#1c1c1c 60%,#0f0f0f 100%);transform:translateY(2px);box-shadow:inset 0 2px 3px #000000b3,inset 0 -1px #424242,1px 1px 2px #0006}.black-key.state-active.svelte-16prh1e,.black-key.key-pressed.state-active.svelte-16prh1e{background:linear-gradient(#275786 0%,#16385a 100%)}.black-key.state-correct.svelte-16prh1e{background:linear-gradient(#267346 0%,#164b2c 100%)}.black-key.state-wrong.svelte-16prh1e{background:linear-gradient(#862727 0%,#5a1616 100%)}.black-key.state-inactive.svelte-16prh1e{opacity:.5}.key-label.svelte-16prh1e,.octave-label.svelte-16prh1e{pointer-events:none}.key-label.svelte-16prh1e{flex-direction:column;align-items:center;gap:1px;display:flex}.white-key.svelte-16prh1e .label-row:where(.svelte-16prh1e){color:#2e73b8;font-family:monospace;font-size:.6rem;font-weight:600;line-height:1.3}.black-key.svelte-16prh1e .label-row:where(.svelte-16prh1e){color:#70a6db;font-family:monospace;font-size:.55rem;font-weight:600;line-height:1.3}.octave-label.svelte-16prh1e{letter-spacing:.01em;color:#8c8c8c;margin-top:.2rem;font-family:ui-sans-serif,system-ui,sans-serif;font-size:.6rem;font-weight:600;line-height:1}@media (pointer:coarse) and (orientation:portrait){.piano-keyboard.svelte-16prh1e{--white-key-height:clamp(6.5rem, calc(20dvh - 3.75rem), 15rem)}}@media (pointer:coarse) and (orientation:landscape) and (height>=501px){.piano-keyboard.svelte-16prh1e{--white-key-height:clamp(6.5rem, calc(30dvh - 3.75rem), 15rem)}}@media (pointer:coarse) and (orientation:landscape) and (height<=500px){.piano-keyboard.svelte-16prh1e{--white-key-height:clamp(4.75rem, calc(40dvh - 3.2rem), 9rem)}}@media (width>=64rem) and (pointer:fine){.piano-keyboard.svelte-16prh1e{--white-key-height:min(12rem, 34dvh)}}@media (width<=63.999rem),(pointer:coarse){.label-row.svelte-16prh1e{display:none}.white-key.state-inactive.svelte-16prh1e,.black-key.state-inactive.svelte-16prh1e{opacity:1}.white-key.active-zone.svelte-16prh1e{border-bottom:none}}@media (prefers-reduced-motion:reduce){.piano-key.svelte-16prh1e{transition:none}.white-key.key-pressed.svelte-16prh1e,.black-key.key-pressed.svelte-16prh1e{transform:none}}.keyboard-panel.svelte-1jffmd{z-index:40;transform:translateY(calc(100% + var(--sr-keyboard-drag,0px)));visibility:hidden;transition:transform .2s ease-out,visibility 0s .2s;position:fixed;left:0;right:0}.keyboard-panel-open.svelte-1jffmd{transform:translateY(var(--sr-keyboard-drag,0px));visibility:visible;transition:transform .2s ease-out,visibility}.keyboard-panel-dragging.svelte-1jffmd{transition:none}@media (width>=64rem) and (pointer:fine){.virtual-piano-fab-wrapper.svelte-1jffmd,.keyboard-panel.svelte-1jffmd{--sr-bottom-nav-h:0px}.keyboard-panel.svelte-1jffmd{left:var(--sr-sidebar-w,0px)}}.virtual-piano-fab-wrapper.svelte-1jffmd{right:1.5rem;bottom:calc(var(--sr-bottom-nav-h,0px) + env(safe-area-inset-bottom) + 1.75rem);z-index:45;width:3.25rem;height:3.25rem;position:fixed}.virtual-piano-fab.svelte-1jffmd{color:#fff;cursor:pointer;background:#5b21b6;border:none;border-radius:9999px;justify-content:center;align-items:center;width:100%;height:100%;transition:background .15s,transform .15s,box-shadow .15s;display:flex;box-shadow:0 8px 20px -6px #4c1d9599}.virtual-piano-fab-wrapper.svelte-1jffmd:hover .virtual-piano-fab:where(.svelte-1jffmd){background:#4c1d95;transform:translateY(-3px)scale(1.08);box-shadow:0 14px 26px -8px #4c1d95b3}.virtual-piano-fab.svelte-1jffmd:active{background:#4c1d95;transform:translateY(-1px)scale(.96)}.close-btn.svelte-1jffmd{color:#8a94a8;cursor:pointer;background:0 0;border:1px solid #0000;border-radius:6px;justify-content:center;align-items:center;width:28px;height:28px;padding:0;display:inline-flex}.close-btn.svelte-1jffmd:hover{color:#fff;background:#303541}.controls-left.svelte-1jffmd{align-items:center;min-width:0;display:flex}.keybind-btn.svelte-1jffmd{color:#8a94a8;cursor:pointer;background:0 0;border:1px solid #414958;border-radius:9999px;align-items:center;gap:6px;padding:4px 10px;font-size:11.5px;display:inline-flex}.keybind-btn.svelte-1jffmd:hover{color:#c4c9d4;border-color:#626d84}.keybind-btn-on.svelte-1jffmd{color:#fff;background:#343a46;border-color:#626d84}.keybind-label.svelte-1jffmd{white-space:nowrap}@media (width<=47.999rem){.keybind-label.svelte-1jffmd{display:none}.keybind-btn.svelte-1jffmd{padding:4px 8px}}.controls-right.svelte-1jffmd{justify-content:flex-end;align-items:center;gap:10px;min-width:0;display:flex}.keyboard-panel-content.svelte-1jffmd{background:#1a1d23;border-top:1px solid #363d49;padding:8px 0 12px;position:relative;box-shadow:0 -2px 12px #0000002e}.keyboard-grab.svelte-1jffmd{touch-action:none;cursor:grab}.keyboard-grab.svelte-1jffmd:active{cursor:grabbing}.keyboard-grabber.svelte-1jffmd{background:#4a5264;border-radius:9999px;width:36px;height:3px;position:absolute;top:3px;left:50%;translate:-50%}.keyboard-controls.svelte-1jffmd{grid-template-columns:1fr auto 1fr;align-items:center;gap:8px;padding:0 16px 8px;display:grid}.octave-controls.svelte-1jffmd{justify-content:center;align-items:center;gap:16px;display:flex}.octave-btn.svelte-1jffmd{color:#b6bcc9;cursor:pointer;background:#303541;border:1px solid #4c5567;border-radius:6px;align-items:center;gap:6px;padding:4px 12px;font-size:12px;display:flex}.octave-btn.svelte-1jffmd:hover:not(:disabled){color:#fff;background:#3d4452}.octave-btn.svelte-1jffmd:disabled{opacity:.35;cursor:default}.octave-arrow.svelte-1jffmd{font-size:14px}kbd.svelte-1jffmd{background:#414958;border-radius:3px;padding:1px 5px;font-family:monospace;font-size:10px}.volume-control.svelte-1jffmd{align-items:center;gap:6px;display:none}@media (width>=640px){.volume-control.svelte-1jffmd{display:flex}}.volume-icon.svelte-1jffmd{color:#8a94a8;flex-shrink:0}.volume-slider.svelte-1jffmd{accent-color:#7b879d;cursor:pointer;width:80px;height:4px}.range-label.svelte-1jffmd{color:#8a94a8;text-align:center;min-width:100px;font-size:13px}.keyboard-scroll.svelte-1jffmd{-webkit-overflow-scrolling:touch;padding:0 12px;overflow:auto hidden}.keyboard-scroll.svelte-1jffmd::-webkit-scrollbar{height:6px}.keyboard-scroll.svelte-1jffmd::-webkit-scrollbar-track{background:#21242c}.keyboard-scroll.svelte-1jffmd::-webkit-scrollbar-thumb{background:#414958;border-radius:3px}@media (pointer:coarse){.octave-btn.svelte-1jffmd kbd:where(.svelte-1jffmd){display:none}}@media (orientation:landscape) and (height<=500px){.keyboard-panel-content.svelte-1jffmd{padding-bottom:6px}.keyboard-grab.svelte-1jffmd{padding-top:4px}.keyboard-grabber.svelte-1jffmd{margin-bottom:4px}.keyboard-controls.svelte-1jffmd{padding-bottom:4px}.octave-btn.svelte-1jffmd{padding:2px 10px}}
