.icon-btn.svelte-n2dpzi{display:flex;align-items:center;justify-content:center;border-radius:50%;background:linear-gradient(135deg,#2a2a2a,#1a1a1a,#0d0d0d 60%,#1a1a1a);border:2px solid rgba(0,0,0,.6);color:#ffffffe6;text-decoration:none;cursor:pointer}.icon-btn-sm.svelte-n2dpzi{width:3rem;height:3rem;box-shadow:inset 0 2px 3px #ffffff1a,inset 0 -2px 3px #000c,inset 2px 0 2px #ffffff0d,inset -2px 0 2px #0009,0 3px 6px #00000080}.icon-btn-md.svelte-n2dpzi{width:4rem;height:4rem;box-shadow:inset 0 2px 4px #ffffff1a,inset 0 -2px 4px #000c,inset 2px 0 2px #ffffff0d,inset -2px 0 2px #0009,0 4px 8px #00000080}.icon-btn-primary.svelte-n2dpzi{border-color:var(--color-primary)!important;box-shadow:inset 0 2px 4px #ffffff1a,inset 0 -2px 4px #000c,inset 2px 0 2px #ffffff0d,inset -2px 0 2px #0009,0 4px 12px #0006,0 0 20px #ff6b3580}.icon-btn-sm.icon-btn-primary.svelte-n2dpzi{box-shadow:inset 0 2px 3px #ffffff1a,inset 0 -2px 3px #000c,inset 2px 0 2px #ffffff0d,inset -2px 0 2px #0009,0 4px 12px #0006,0 0 20px #ff6b3580}.icon-btn.svelte-n2dpzi:hover:not(:disabled):not(.icon-btn-disabled){background:linear-gradient(135deg,#3a3a3a,#2a2a2a,#1d1d1d 60%,#2a2a2a);box-shadow:inset 0 2px 3px #ffffff26,inset 0 -2px 3px #000000e6,inset 2px 0 2px #ffffff14,inset -2px 0 2px #000000b3,0 4px 12px #0006}.icon-btn-md.svelte-n2dpzi:hover:not(:disabled):not(.icon-btn-disabled){box-shadow:inset 0 2px 4px #ffffff26,inset 0 -2px 4px #000000e6,inset 2px 0 2px #ffffff14,inset -2px 0 2px #000000b3,0 6px 16px #0006}.icon-btn-primary.svelte-n2dpzi:hover:not(:disabled):not(.icon-btn-disabled){box-shadow:inset 0 2px 3px #ffffff26,inset 0 -2px 3px #000000e6,inset 2px 0 2px #ffffff14,inset -2px 0 2px #000000b3,0 4px 12px #0006,0 0 30px #ff6b35b3}.icon-btn-md.icon-btn-primary.svelte-n2dpzi:hover:not(:disabled):not(.icon-btn-disabled){box-shadow:inset 0 2px 4px #ffffff26,inset 0 -2px 4px #000000e6,inset 2px 0 2px #ffffff14,inset -2px 0 2px #000000b3,0 6px 16px #0006,0 0 30px #ff6b35b3}.icon-btn.svelte-n2dpzi:active:not(:disabled):not(.icon-btn-disabled){box-shadow:inset 0 2px 3px #0009,inset 0 -1px 2px #ffffff0d,inset 1px 0 2px #00000080,inset -1px 0 2px #00000080,0 2px 4px #0006}.icon-btn-md.svelte-n2dpzi:active:not(:disabled):not(.icon-btn-disabled){box-shadow:inset 0 2px 4px #0009,inset 0 -1px 2px #ffffff0d,inset 1px 0 2px #00000080,inset -1px 0 2px #00000080,0 2px 4px #0006}.icon-btn-disabled.svelte-n2dpzi{color:#64646499!important;cursor:not-allowed}.icon-btn-disabled.svelte-n2dpzi svg{color:#64646499!important}.icon-btn-highlighted.svelte-n2dpzi{color:var(--color-primary)!important;box-shadow:inset 0 2px 3px #ffffff1a,inset 0 -2px 3px #000c,inset 2px 0 2px #ffffff0d,inset -2px 0 2px #0009,0 4px 12px #0006,0 0 20px #ff6b3599!important}.icon-btn-md.icon-btn-highlighted.svelte-n2dpzi{box-shadow:inset 0 2px 4px #ffffff1a,inset 0 -2px 4px #000c,inset 2px 0 2px #ffffff0d,inset -2px 0 2px #0009,0 4px 12px #0006,0 0 20px #ff6b3599!important}.icon-btn-highlighted.svelte-n2dpzi svg{color:var(--color-primary)!important}.icon-btn-highlighted.svelte-n2dpzi:hover:not(:disabled):not(.icon-btn-disabled){color:var(--color-primary)!important;box-shadow:inset 0 2px 3px #ffffff26,inset 0 -2px 3px #000000e6,inset 2px 0 2px #ffffff14,inset -2px 0 2px #000000b3,0 6px 16px #0006,0 0 30px #ff6b35cc!important}.icon-btn-md.icon-btn-highlighted.svelte-n2dpzi:hover:not(:disabled):not(.icon-btn-disabled){box-shadow:inset 0 2px 4px #ffffff26,inset 0 -2px 4px #000000e6,inset 2px 0 2px #ffffff14,inset -2px 0 2px #000000b3,0 6px 16px #0006,0 0 30px #ff6b35cc!important}.icon-btn-highlighted.svelte-n2dpzi:hover:not(:disabled):not(.icon-btn-disabled) svg{color:var(--color-primary)!important}.icon-btn-wrapper.svelte-n2dpzi{display:inline-flex;padding:3px;border-radius:50%;border:3px solid rgba(255,255,255,.6);box-shadow:0 0 8px #ffffff1a}.icon-btn-wrapper-highlighted.svelte-n2dpzi{border-color:var(--color-primary)!important}.icon-btn-wrapper-disabled.svelte-n2dpzi{border-color:#64646499!important}.sticker.svelte-16e9aim{position:relative;border-radius:.5rem;background:linear-gradient(135deg,#1a1a1a,#151515,#1a1a1a);border:1px solid rgba(0,0,0,.4);box-shadow:inset 0 1px 2px #ffffff26,inset 0 -1px 1px #0000004d,inset 1px 0 1px #ffffff14,inset -1px 0 1px #0003}.sticker.svelte-16e9aim:before{content:"";position:absolute;inset:0;border-radius:.5rem;background:radial-gradient(ellipse 40% 30% at 20% 25%,rgba(255,255,255,.15) 0%,rgba(255,255,255,.06) 15%,transparent 30%);pointer-events:none;z-index:1}.sticker.svelte-16e9aim svg{position:relative;z-index:2}.indicator-label.svelte-1i0lsv0{font-family:Bahnschrift,Franklin Gothic Medium,Arial Narrow,Helvetica Neue Condensed,Helvetica Neue,Arial,sans-serif;font-size:.57rem;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:#fff9;text-align:center;text-shadow:0 2px 4px rgba(0,0,0,.7)}.hardware-inset.svelte-1495opv{position:relative;display:flex;flex-direction:column;align-items:stretch;justify-content:center;gap:1.5rem;border-radius:.25rem;background:linear-gradient(135deg,#171717,#1c1c1c,#151515);background-size:100% 100%;background-repeat:no-repeat;box-shadow:inset 0 4px 8px #000000b3,inset 0 8px 16px #0009,inset 0 -1px 2px #ffffff05,inset 0 2px 4px #ffffff1f,inset 0 3px 6px #ffffff14,0 0 1px #0000004d;border:2px solid rgba(0,0,0,.7);border-top-color:#000000b3;border-left-color:#000000b3;will-change:transform;transform:translateZ(0);contain:layout style paint;isolation:isolate}.hardware-inset.svelte-1495opv:before{content:"";position:absolute;inset:0;border-radius:.5rem;background:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='grainFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.2' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0.5 0 0 0 0 0.5 0 0 0 0 0.5 0 0 0 1 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23grainFilter)'/%3E%3C/svg%3E");background-size:100px 100px;background-repeat:repeat;filter:contrast(300%) brightness(2000%);mix-blend-mode:overlay;opacity:.7;pointer-events:none;z-index:-1}@media(max-width:768px){.hardware-inset.svelte-1495opv:before{opacity:.3}}.hardware-inset.svelte-1495opv:after{content:"";position:absolute;inset:2px;border-radius:calc(.5rem - 2px);background:linear-gradient(135deg,rgba(255,255,255,.01) 0%,transparent 20%,transparent 80%,rgba(0,0,0,.3) 100%);pointer-events:none;box-shadow:inset 0 1px 2px #ffffff08,inset 0 -1px 2px #0000004d,inset 0 2px 4px #ffffff1f;z-index:-1}.lcd-display.svelte-1g8rtdn{flex:1 1 0%;background:repeating-linear-gradient(0deg,rgba(255,255,255,.03) 0px,transparent 1px,transparent 2px,rgba(0,0,0,.08) 3px,transparent 4px),repeating-linear-gradient(90deg,rgba(255,255,255,.01) 0px,transparent 1px,transparent 2px,rgba(0,0,0,.02) 3px,transparent 4px),linear-gradient(to right,#5fa8b8,#6bb8c8,#77c8d8 40%,#83d8e8,#77c8d8 60%,#6bb8c8,#5fa8b8);border-radius:.15rem;box-shadow:inset 0 2px 4px #0000004d,inset 0 1px 2px #0006,inset 0 4px 8px #00000040,inset 4px 0 8px #0006,inset -4px 0 8px #0006,inset 0 -1px 2px #ffffff0d,inset 1px 0 2px #ffffff0d,inset 0 1px 2px #0000004d,inset -1px 0 2px #0000004d,0 0 1px #0003;border:3px solid #1a1f2e;display:flex;align-items:center;justify-content:center;position:relative;isolation:isolate}.lcd-display.svelte-1g8rtdn:before{content:"";position:absolute;inset:2px;border-radius:calc(.15rem - 2px);background:linear-gradient(135deg,rgba(255,255,255,.01) 0%,transparent 20%,transparent 80%,rgba(0,0,0,.3) 100%);pointer-events:none;box-shadow:inset 0 1px 2px #ffffff0d,inset 0 -1px 2px #0000004d,inset 3px 0 6px #0000004d,inset -3px 0 6px #0000004d;z-index:1}.lcd-display.svelte-1g8rtdn:after{content:"";position:absolute;inset:0;border-radius:.15rem;background:repeating-linear-gradient(0deg,transparent 0px,transparent 2px,rgba(255,255,255,.02) 3px,transparent 4px,transparent 6px,rgba(0,0,0,.06) 7px,transparent 8px),radial-gradient(ellipse at center,rgba(255,240,200,.15) 0%,rgba(255,240,200,.08) 30%,rgba(255,240,200,.03) 50%,transparent 70%);pointer-events:none;opacity:.9;mask:linear-gradient(to right,rgba(0,0,0,.9) 0%,rgba(0,0,0,.3) 15%,rgba(0,0,0,.1) 50%,rgba(0,0,0,.3) 85%,rgba(0,0,0,.9) 100%);-webkit-mask:linear-gradient(to right,rgba(0,0,0,.9) 0%,rgba(0,0,0,.3) 15%,rgba(0,0,0,.1) 50%,rgba(0,0,0,.3) 85%,rgba(0,0,0,.9) 100%)}.lcd-text.svelte-1g8rtdn{font-family:SF Mono,Monaco,Menlo,Consolas,Courier New,Courier,monospace;font-size:1.125rem;font-weight:700;color:#1a1a1a;text-transform:uppercase;letter-spacing:.05em;text-shadow:0 .5px 1px rgba(0,0,0,.15),0 1px 2px rgba(0,0,0,.1);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%;position:relative;z-index:2;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:geometricPrecision}.piano-keyboard-container.svelte-7fwix2{width:100%;position:relative;will-change:transform;transform:translateZ(0);contain:layout style paint}.piano-white-keys-row.svelte-7fwix2{position:relative;z-index:0}.piano-black-keys-row.svelte-7fwix2{position:absolute;top:0;left:0;right:0;z-index:1;padding-bottom:1rem;pointer-events:none}.piano-black-keys-row.svelte-7fwix2 button:where(.svelte-7fwix2){pointer-events:auto}.piano-key.svelte-7fwix2{position:relative;border:none;touch-action:none;font-family:Bahnschrift,Franklin Gothic Medium,Arial Narrow,Helvetica Neue Condensed,Helvetica Neue,Arial,sans-serif;font-weight:600;letter-spacing:.1em;will-change:transform,opacity;transform:translateZ(0)}.piano-key-white.svelte-7fwix2{height:9rem;background:linear-gradient(135deg,#2a2a2a,#1a1a1a,#0d0d0d);border:2px solid rgba(0,0,0,.6);padding-bottom:.5rem;box-shadow:inset 0 2px 3px #ffffff1a,inset 0 -2px 3px #000c,0 3px 6px #00000080;border-radius:.05rem .05rem .5rem .5rem}.piano-key-white.svelte-7fwix2:not(.piano-key-disabled):hover{background:linear-gradient(135deg,#3a3a3a,#2a2a2a,#1d1d1d);box-shadow:inset 0 2px 3px #ffffff26,inset 0 -2px 3px #000000e6,0 4px 12px #0006}.piano-key-black.svelte-7fwix2{height:5rem;position:relative;background:linear-gradient(135deg,#3f3f45,#2f2f35,#222228);padding-bottom:.5rem;border:2px solid rgba(0,0,0,.6);box-shadow:inset 0 2px 3px #ffffff1a,inset 0 -2px 3px #000c,0 3px 6px #00000080;z-index:1;border-radius:.3rem}.piano-key-black.svelte-7fwix2:not(.piano-key-disabled):hover{background:linear-gradient(135deg,#4f4f55,#3f3f45,#323238);box-shadow:inset 0 2px 3px #ffffff26,inset 0 -2px 3px #000000e6,0 4px 12px #0006}.piano-key-letter.svelte-7fwix2{font-size:1rem;font-weight:600;text-align:center;margin-bottom:.1rem}.piano-key-strip.svelte-7fwix2{width:1.5rem;height:.25rem;border-radius:.125rem;margin-bottom:.1rem}.piano-key-selected.svelte-7fwix2,.piano-key-black.piano-key-selected.svelte-7fwix2{box-shadow:inset 0 2px 3px #ffffff1a,inset 0 -2px 3px #000c,0 4px 12px #0006!important}.piano-key-selected.svelte-7fwix2:hover:not(.piano-key-disabled){box-shadow:inset 0 2px 3px #ffffff26,inset 0 -2px 3px #000000e6,0 6px 16px #0006!important}.piano-key-success.svelte-7fwix2,.piano-key-black.piano-key-success.svelte-7fwix2{box-shadow:inset 0 2px 3px #ffffff1a,inset 0 -2px 3px #000c,0 4px 12px #0006!important}.piano-key-success.svelte-7fwix2:hover:not(.piano-key-disabled){box-shadow:inset 0 2px 3px #ffffff26,inset 0 -2px 3px #000000e6,0 6px 16px #0006!important}.piano-key-strip-selected.svelte-7fwix2{box-shadow:0 0 12px #ff6b3599}.piano-key-strip-correct.svelte-7fwix2{box-shadow:0 0 12px #22c55e99}@media(max-width:768px){.piano-key-strip-selected.svelte-7fwix2{box-shadow:0 0 8px #ff6b3580}.piano-key-strip-correct.svelte-7fwix2{box-shadow:0 0 8px #22c55e80}}.piano-key-disabled.svelte-7fwix2{cursor:not-allowed}.progress-track.svelte-1pgfira{background:repeating-linear-gradient(90deg,rgba(255,255,255,.01) 0px,transparent 1px,transparent 2px,rgba(0,0,0,.02) 3px,transparent 4px),#4b5563;box-shadow:inset 0 1px 2px #00000080,inset 0 -1px 1px #ffffff1a;border-radius:.15rem;border:3px solid #1a1f2e;position:relative}.progress-track.svelte-1pgfira:after{content:"";position:absolute;inset:0;border-radius:inherit;background:repeating-linear-gradient(90deg,transparent 0px,transparent 2px,rgba(255,255,255,.02) 3px,transparent 4px,transparent 6px,rgba(0,0,0,.06) 7px,transparent 8px);pointer-events:none;opacity:.8}.progress-fill.svelte-1pgfira{background:repeating-linear-gradient(90deg,rgba(255,255,255,.01) 0px,transparent 1px,transparent 2px,rgba(0,0,0,.02) 3px,transparent 4px),radial-gradient(#ff6b35 30%,#ff8c42);border-radius:.15rem;box-shadow:0 0 3px #ff6b35cc,0 0 6px #ff6b3580,0 0 9px #ff6b354d;position:relative}.progress-fill.svelte-1pgfira:after{content:"";position:absolute;inset:0;border-radius:inherit;background:repeating-linear-gradient(90deg,transparent 0px,transparent 2px,rgba(255,255,255,.02) 3px,transparent 4px,transparent 6px,rgba(0,0,0,.06) 7px,transparent 8px);pointer-events:none;opacity:.8}.indicator-label.svelte-1u7rbt7{font-family:Bahnschrift,Franklin Gothic Medium,Arial Narrow,Helvetica Neue Condensed,Helvetica Neue,Arial,sans-serif;font-size:.57rem;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:#fff9;text-align:center;text-shadow:0 2px 4px rgba(0,0,0,.7)}.speaker-holes.svelte-1rn9tzu{flex-shrink:0;min-height:100%}.speaker-hole.svelte-1rn9tzu{width:100%;height:.4rem;background:#00000080;border-radius:9999px;box-shadow:inset 0 1px 2px #0009,inset 0 -1px 1px #ffffff26,inset -1px 0 1px #ffffff26,0 0 2px #0000004d}