.volume-control.svelte-1ihojgt.svelte-1ihojgt{display:flex;align-items:center;gap:10px}.volume-control.svelte-1ihojgt input[type=range].svelte-1ihojgt{width:200px}.wrapper.svelte-1ihojgt.svelte-1ihojgt{--white-w:50px;--visible-white:14;width:-moz-max-content;width:max-content;padding-top:9rem;padding-bottom:1.25rem;padding-inline:1.25rem;border-radius:20px;background:url(https://a.storyblok.com/f/114532/1053x187/4518081de8/harmonium-reed.png) top center no-repeat,linear-gradient(180deg,#8f4d15,#6f3a08 52%,#532a05);box-shadow:inset 0 1px #ffffff2b,inset 0 -2px 6px #00000073,0 1px #00000073,0 20px 42px -14px #000000b3}@media (min-width: 1660px){.wrapper.svelte-1ihojgt.svelte-1ihojgt{--visible-white:22}}@media (max-width: 740px){.wrapper.svelte-1ihojgt.svelte-1ihojgt{--white-w:70px;--visible-white:7}.piano-keys.svelte-1ihojgt .white.svelte-1ihojgt{height:260px}.piano-keys.svelte-1ihojgt .white.svelte-1ihojgt:active{height:262px}.piano-keys.svelte-1ihojgt .black.svelte-1ihojgt{height:170px}.piano-keys.svelte-1ihojgt .black.svelte-1ihojgt:active{height:175px}}.piano-viewport.svelte-1ihojgt.svelte-1ihojgt{overflow:hidden;width:calc(var(--visible-white) * var(--white-w));max-width:100%;padding-bottom:6px}.piano-felt.svelte-1ihojgt.svelte-1ihojgt{width:calc(var(--visible-white) * var(--white-w));max-width:100%;height:3px;margin:0 auto;border-radius:2px 2px 0 0;background:linear-gradient(90deg,#5c1922,#7e2634 22%,#6b1f2b,#7e2634 78%,#5c1922);box-shadow:0 1px 3px #00000073,inset 0 1px #ffffff1a}.piano-topbar.svelte-1ihojgt.svelte-1ihojgt{display:flex;flex-direction:column;align-items:center;width:100%}.controls-row.svelte-1ihojgt.svelte-1ihojgt{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:14px;padding:.65rem 0 1rem}.lang-toggle.svelte-1ihojgt.svelte-1ihojgt{padding:.4em .95em;border-radius:7px;font-size:13px;font-weight:600;letter-spacing:.04em;color:#f3e6d5;cursor:pointer;background:linear-gradient(180deg,#6a3a10,#4a2707);border:1px solid #2c1803;box-shadow:0 2px 4px #00000059,inset 0 1px 1px #ffffff2e;transition:transform .15s ease,box-shadow .15s ease,color .15s ease}.lang-toggle.svelte-1ihojgt.svelte-1ihojgt:hover{transform:translateY(-1px);color:#fff;box-shadow:0 4px 9px #00000073,inset 0 1px 1px #ffffff40}.lang-toggle.svelte-1ihojgt.svelte-1ihojgt:active{transform:translateY(1px);box-shadow:inset 0 2px 4px #000000a6}.octave-controls.svelte-1ihojgt.svelte-1ihojgt{display:flex;align-items:center;gap:14px}.octave-btn.svelte-1ihojgt.svelte-1ihojgt{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;color:#d7d7de;background:radial-gradient(125% 125% at 50% 22%,#57575f,#34343a 46%,#1d1d21);border:1px solid #0c0c0f;box-shadow:0 2px 5px #000000a6,inset 0 1px 1px #ffffff45,inset 0 -3px 4px #00000080;cursor:pointer;transition:transform .15s ease,box-shadow .15s ease,color .15s ease,opacity .2s ease}.octave-btn.svelte-1ihojgt.svelte-1ihojgt:hover:not(:disabled){transform:translateY(-1px);color:#fff;box-shadow:0 5px 11px #000000b8,inset 0 1px 1px #ffffff5c,inset 0 -3px 4px #00000080}.octave-btn.svelte-1ihojgt.svelte-1ihojgt:active:not(:disabled){transform:translateY(1px);box-shadow:0 1px 2px #0009,inset 0 2px 4px #000000b3}.octave-btn.svelte-1ihojgt.svelte-1ihojgt:disabled{opacity:.28;cursor:not-allowed}.octave-label.svelte-1ihojgt.svelte-1ihojgt{min-width:108px;text-align:center;padding:.35em .9em;border-radius:7px;color:#cdd8d0;font-family:ui-monospace,SF Mono,Roboto Mono,Courier New,monospace;font-size:13px;font-weight:600;letter-spacing:.1em;font-variant-numeric:tabular-nums;background:linear-gradient(180deg,#101012,#17171b);border:1px solid #000000;box-shadow:inset 0 1px 3px #000c,inset 0 -1px #ffffff12,0 1px #ffffff0d}.piano-keys.svelte-1ihojgt.svelte-1ihojgt{padding:0;margin:0;display:flex;width:-moz-max-content;width:max-content;list-style:none;transition:transform .55s cubic-bezier(.22,.61,.36,1);will-change:transform}.piano-keys.svelte-1ihojgt .pianoKey.svelte-1ihojgt{flex:0 0 auto}.piano-keys.svelte-1ihojgt .white.svelte-1ihojgt{height:180px;display:flex;flex-direction:row;justify-content:center;align-items:flex-end;width:var(--white-w);font-weight:600;border:1px solid #0000001f;border-radius:0 0 20px 20px;box-shadow:inset 0 1px #fff,inset -5px 0 7px -4px #0000002e,inset 5px 0 6px -4px #fff,inset 0 -7px 6px -5px #00000024,0 4px 5px #00000038;background:linear-gradient(to bottom,#fff,#f4f4f1 90%,#e8e8e3);color:#00000059}.piano-keys.svelte-1ihojgt .white.svelte-1ihojgt:active{height:182px;width:var(--white-w);border-radius:0 0 20px 20px;box-shadow:inset 0 1px #fff,inset -5px 0 7px -4px #00000040,inset 0 8px 12px -6px #0003,0 1px 2px #0000004d;background:linear-gradient(to bottom,#efefeb,#e0e0da);color:#00000059}.piano-keys.svelte-1ihojgt .key span.svelte-1ihojgt{position:absolute;bottom:20px;width:100%;color:#a2a2a2;font-size:18px;text-align:center;color:#0000004d;font-family:Roboto;font-weight:500}.piano-header.svelte-1ihojgt.svelte-1ihojgt{margin:0;width:100%;text-align:center;padding-top:0;font-family:Georgia,Times New Roman,serif;font-size:14px;font-weight:600;letter-spacing:.32em;text-transform:uppercase;color:#f2ddc0;text-shadow:0 1px 2px #000000a6}.piano-keys.svelte-1ihojgt .black.svelte-1ihojgt{z-index:2;width:44px;height:110px;margin:0 -22px;border:1px solid #000000;border-radius:0 0 20px 20px;background:linear-gradient(180deg,#46464b,#26262a 7%,#141417 55%,#060607);box-shadow:inset 0 2px 1px #ffffff30,inset 2px 0 3px -1px #ffffff1a,inset -2px 0 3px -1px #0009,inset 0 -7px 6px -3px #000000a6,0 4px 5px #000000a6;color:#ffffffb3}.piano-keys.svelte-1ihojgt .black.svelte-1ihojgt:active{z-index:2;width:44px;height:115px;margin:0 -22px;border:1px solid #000000;border-radius:0 0 20px 20px;background:linear-gradient(180deg,#3a3a3f,#1b1b1e 55%,#0a0a0b);box-shadow:inset 0 2px 1px #ffffff26,inset 0 -5px 5px -3px #000000a6,0 2px 3px #000000a6;color:#ffffffb3}