.volume-control.svelte-16j7f9b.svelte-16j7f9b{display:flex;align-items:center;gap:10px}.volume-control.svelte-16j7f9b input[type=range].svelte-16j7f9b{width:200px}@media (min-width: 912px) and (max-width: 1660px){.piano-keys.svelte-16j7f9b>button.svelte-16j7f9b:nth-child(n+30){display:none}.wrapper.svelte-16j7f9b.svelte-16j7f9b{width:-moz-max-content;width:max-content;padding-top:9rem;padding-bottom:1rem;padding-inline:4rem;border-radius:20px;background:#7b3e06;background-repeat:no-repeat;background-position:top}}@media (min-width: 740px) and (max-width: 912px){.piano-keys.svelte-16j7f9b>button.svelte-16j7f9b:nth-child(n+25){display:none}.wrapper.svelte-16j7f9b.svelte-16j7f9b{width:-moz-max-content;width:max-content;padding-top:9rem;padding-bottom:1rem;padding-inline:4rem;border-radius:20px;background:#7b3e06;background-repeat:no-repeat;background-position:top}}@media (max-width: 740px){.piano-keys.svelte-16j7f9b .white.svelte-16j7f9b{height:280px!important;display:flex;flex-direction:row;justify-content:center;align-items:flex-end;width:70px;font-weight:600;border:1px solid #000;border-left:1px solid #fff2;border-bottom:1px solid #bababa;border-radius:0 0 5px 5px;box-shadow:-1px 0 #fffc inset,0 0 3px #0003,inset -15px 0 20px #0006,inset 3px 0 20px #fff,0 5px 5px #000!important;background:linear-gradient(to bottom,#ededed,#fff);color:#0000004d}.piano-keys.svelte-16j7f9b .black.svelte-16j7f9b{z-index:2;width:44px;height:180px!important;margin:0 -22px;border:1px solid #000;border-radius:0 0 20px 20px;box-shadow:-1px -1px 2px #fff3 inset,0 -5px 2px 3px #0009 inset,0 2px 4px #00000080;background:#3e3f42;color:#ffffff80}.piano-keys.svelte-16j7f9b .white.svelte-16j7f9b:active{height:250px;width:70px;border:1px solid #000;border-left:1px solid #fff2;border-bottom:1px solid #bababa;border-radius:0 0 5px 5px;box-shadow:-1px 0 #fffc inset,0 0 3px #0003,inset -15px 0 20px #0006,inset 3px 0 20px #fff,0 5px 5px #000;background:linear-gradient(to bottom,#ffffff4d,#fff);color:#0000004d}.piano-keys.svelte-16j7f9b>button.svelte-16j7f9b:nth-child(n+13){display:none}.wrapper.svelte-16j7f9b.svelte-16j7f9b{width:20em!important;padding-top:9rem;padding-bottom:1rem;padding-inline:1rem;border-radius:20px;background:#7b3e06;background-repeat:no-repeat;background-position:top}}.wrapper.svelte-16j7f9b.svelte-16j7f9b{width:-moz-max-content;width:max-content;padding-top:9rem;padding-bottom:1rem;padding-inline:1rem;border-radius:20px;background:#7b3e06;background-repeat:no-repeat;background-position:top}.piano-keys.svelte-16j7f9b.svelte-16j7f9b{padding:0;margin:0;display:flex;list-style:none}.piano-keys.svelte-16j7f9b .white.svelte-16j7f9b{height:180px;display:flex;flex-direction:row;justify-content:center;align-items:flex-end;width:50px;font-weight:600;border:1px solid #000;border-left:1px solid #fff2;border-bottom:5px solid #bababa;border-radius:0 0 20px 20px;box-shadow:-1px 0 #fffc inset,0 0 3px #fff3,inset -15px 0 20px #c2bebe66,inset 3px 0 20px #fff,0 5px 5px #ffffff1a;background:linear-gradient(to bottom,#ededed,#fff);color:#0000004d}.piano-keys.svelte-16j7f9b .white.svelte-16j7f9b:active{height:182px;width:50px;border-left:1px solid #fff2;border-bottom:1px solid #bababa;border-radius:0 0 20px 20px;box-shadow:-1px 0 #fffc inset,0 0 3px #0003,inset -15px 0 20px #0006,inset 3px 0 20px #fff,0 5px 5px #000;background:linear-gradient(to bottom,#dddada,#fdfafa);color:#0000004d}.piano-keys.svelte-16j7f9b .key span.svelte-16j7f9b{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-16j7f9b.svelte-16j7f9b{color:#bababa;width:100%;text-align:center;padding-top:2em;font:-webkit-mini-control}.piano-keys.svelte-16j7f9b .black.svelte-16j7f9b{z-index:2;width:44px;height:110px;margin:0 -22px;border:1px solid #000;border-radius:0 0 20px 20px;box-shadow:-1px -1px 2px #fff3 inset,0 -5px 2px 3px #0009 inset,0 2px 4px #00000080;background:#3e3f42;color:#ffffff80}.piano-keys.svelte-16j7f9b .black.svelte-16j7f9b:active{z-index:2;width:44px;height:115px;margin:0 -22px;border:1px solid #000;border-radius:0 0 20px 20px;box-shadow:-1px -1px 2px #fff3 inset,0 -5px 2px 3px #0009 inset,0 2px 4px #00000080;background:linear-gradient(45deg,#595959,#545454);color:#ffffff80}