.switch.svelte-fmc4wc.svelte-fmc4wc{position:relative;display:inline-block;width:60px;height:34px}.bigText.svelte-fmc4wc.svelte-fmc4wc{font-size:1.4rem}.switch.svelte-fmc4wc input.svelte-fmc4wc{opacity:0;width:0;height:0}.slider.svelte-fmc4wc.svelte-fmc4wc{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:#ccc;-webkit-transition:.4s;transition:.4s}.slider.svelte-fmc4wc.svelte-fmc4wc:before{position:absolute;content:"";height:26px;width:26px;left:4px;bottom:4px;background-color:#fff;-webkit-transition:.4s;transition:.4s}input.svelte-fmc4wc:checked+.slider.svelte-fmc4wc{background-color:#000}input.svelte-fmc4wc:focus+.slider.svelte-fmc4wc{box-shadow:0 0 1px #000}input.svelte-fmc4wc:checked+.slider.svelte-fmc4wc:before{-webkit-transform:translateX(26px);-ms-transform:translateX(26px);transform:translate(26px)}.slider.round.svelte-fmc4wc.svelte-fmc4wc{border-radius:34px}.slider.round.svelte-fmc4wc.svelte-fmc4wc:before{border-radius:50%}.button.svelte-ir8efi{background-color:#000;color:#fff;border:none;border-radius:10px;padding:10px 20px;font-size:16px;font-weight:700;cursor:pointer;box-shadow:0 0 10px #ffffff80;transition:box-shadow .3s ease-in-out;height:3rem}.button.svelte-ir8efi:hover{box-shadow:0 0 20px #fffc}.svelte-n9fcu3.svelte-n9fcu3{--size:2}body{background-color:#b5aab8}.score.svelte-n9fcu3.svelte-n9fcu3{width:calc(1.5rem * var(--size));height:calc(1.5rem * var(--size));background-color:#7fffd4;border-radius:calc(.25rem * var(--size));display:grid;justify-items:center;align-items:center}.score.correct.svelte-n9fcu3.svelte-n9fcu3{background-color:#78d9a3}.score.wrong.svelte-n9fcu3.svelte-n9fcu3{background-color:#f75f5f}.score-text.svelte-n9fcu3.svelte-n9fcu3{margin-left:2rem;font-weight:600;font-size:1.2rem}h1.svelte-n9fcu3.svelte-n9fcu3{margin:0;padding:0;font-size:4rem;font-weight:400;letter-spacing:.033em}.main-grid.svelte-n9fcu3.svelte-n9fcu3{display:grid;grid-template-areas:"header" "play-controls" "keyboard" "settings";gap:1rem;justify-items:center;padding-top:6rem}.keyboard.svelte-n9fcu3.svelte-n9fcu3{border:1px solid black;display:flex;height:calc(10rem * var(--size));width:fit-content;font-size:calc(.75rem * var(--size));font-weight:700;max-width:95vw;overflow-x:auto}.keyboard.svelte-n9fcu3>.svelte-n9fcu3{flex-shrink:0}.white-key.correct.svelte-n9fcu3.svelte-n9fcu3,.black-key.correct.svelte-n9fcu3.svelte-n9fcu3{background-color:#78d9a3}.key.svelte-n9fcu3.svelte-n9fcu3{--brightness:1;padding:calc(.5rem * var(--size));background-color:rgba(255,255,240,var(--brightness));border:1px solid black;display:flex;flex-direction:column-reverse;align-items:center}.key.svelte-n9fcu3.svelte-n9fcu3:hover{--brightness:.5}.note.svelte-n9fcu3.svelte-n9fcu3{background-color:#a592ea;border-radius:calc(.25rem * var(--size));width:calc(1.5rem * var(--size));height:calc(1.5rem * var(--size));display:flex;color:#fff}.note.svelte-n9fcu3 span.svelte-n9fcu3{margin:auto}.white-key.svelte-n9fcu3.svelte-n9fcu3{width:calc(1.5rem * var(--size))}.black-key.svelte-n9fcu3.svelte-n9fcu3{background-color:hsl(0,0%,calc(13% * var(--brightness)));height:65%;position:absolute;transform:translate(-50%);width:calc(1rem * var(--size));border-bottom-left-radius:calc(.5rem * var(--size));border-bottom-right-radius:calc(.5rem * var(--size));color:#fff}.settings.svelte-n9fcu3.svelte-n9fcu3{display:flex;gap:1rem}@media screen and (max-width: 550px){.settings.svelte-n9fcu3.svelte-n9fcu3{flex-direction:column}.score-text.svelte-n9fcu3.svelte-n9fcu3{margin-left:0rem}}