svg.svelte-4p3ll1{width:100%;height:100%}.pedal-shape.svelte-4p3ll1{fill:#666}.active-pedal-shape.svelte-4p3ll1{fill:#f8fbd0;filter:drop-shadow(0px 0px 4px hsla(65,85%,90%,1))}.debug.svelte-12pebb9{display:grid;grid-auto-flow:column;font-family:var(--music-font);font-size:12px}.keyboard-box.svelte-12pebb9{padding:0;display:grid;gap:8px;background-color:none;border:none;border-radius:16px;width:100%;grid-template-columns:min-content 1fr;grid-template-columns:1fr;font-size:10px}.controls-border.svelte-12pebb9{padding:8px;border:1px solid var(--border-4);background-color:var(--bg-4)}.player-border.svelte-12pebb9{padding:8px;border:1px solid var(--border-4);border-radius:40px 12px 12px;background-color:var(--bg-4)}.borderless.svelte-12pebb9{padding:0;border:none}.keyboard-controls.svelte-12pebb9{grid-column:1 / 3;background:var(--bg-3);border:1px solid var(--border-6);border-radius:12px;box-shadow:var(--inset-box-shadow-4);padding:8px;display:grid;height:min-content;gap:8px}.panel.svelte-12pebb9{display:grid;height:min-content;grid-auto-flow:column;gap:8px;align-items:center;grid-template-rows:repeat(2,1fr);grid-template-columns:1fr 1fr}.main-panel.svelte-12pebb9{grid-template-rows:repeat(1,min-content);grid-template-columns:repeat(6,min-content) 1fr}.sub-panel.svelte-12pebb9{background:var(--bg-2);border:1px solid var(--border-4);border-radius:8px;box-shadow:var(--inset-box-shadow-4);padding:8px;display:grid;grid-auto-flow:column;gap:8px;white-space:nowrap;align-items:center;height:100%}.status-panel.svelte-12pebb9,.global-buttons.svelte-12pebb9{display:grid;grid-auto-flow:row}.status-light.svelte-12pebb9{display:grid;grid-template-columns:min-content min-content 1fr;align-items:center;gap:4px}.computer-keyboard.svelte-12pebb9{width:min-content;height:min-content;display:grid;grid-template-columns:1fr;grid-template-rows:1fr}.midi-color-buttons.svelte-12pebb9{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.entity-panel.svelte-12pebb9{grid-template-columns:min-content 1fr min-content 1fr min-content 1fr min-content 1fr min-content 1fr}.min-content.svelte-12pebb9{width:min-content}.key-sizes.svelte-12pebb9{grid-template-columns:min-content min-content 1fr min-content 1fr min-content 1fr min-content 1fr}.key-overlays.svelte-12pebb9{grid-template-rows:min-content 1fr;grid-template-columns:min-content}.overlay-buttons.svelte-12pebb9{display:grid;grid-template-rows:1fr 1fr;grid-template-columns:1fr 1fr;gap:6px}.keyboard-colors.svelte-12pebb9,.key-colors.svelte-12pebb9{grid-template-columns:min-content repeat(4,1fr);grid-template-rows:repeat(2,min-content);grid-template-columns:min-content}.midi-info.svelte-12pebb9{grid-template-columns:min-content min-content 1fr min-content 1fr min-content 1fr min-content 1fr}.keyboard-range.svelte-12pebb9{grid-row:1 / 3;grid-column:1 / 3;display:grid;grid-auto-flow:row}.range-controls.svelte-12pebb9{padding:0 8px;display:grid;grid-auto-flow:column;grid-template-columns:repeat(9,min-content) repeat(9,1fr);column-gap:8px;align-items:center}.range-selector.svelte-12pebb9{border:1px solid #333;border-radius:6px;background-color:#000;gap:0px;padding:8px;display:grid;grid-template-rows:1fr;width:100%;height:min-content;grid-auto-flow:column;grid-template-columns:repeat(10,7fr) 5fr}.range-white-key.svelte-12pebb9{width:100%;height:48px;border:1px solid black;border-radius:0 0 2px 2px;background-color:#333;font-family:var(--music-font);font-weight:700;color:#000;display:grid;align-items:end;justify-items:center}.range-white-key.svelte-12pebb9:hover{background-color:#666}.range-white-key-selected.svelte-12pebb9{background-color:#fff}.range-black-key.svelte-12pebb9{width:100%;height:32px;border:1px solid black;border-radius:0 0 2px 2px;background-color:#000;font-size:4px;pointer-events:none}.label.svelte-12pebb9{font-family:var(--music-font);font-weight:700;text-align:center}.field.svelte-12pebb9{width:48px;height:28px;border:1px solid #333;border-radius:4px;background-color:#111;display:grid;font-family:var(--music-font);place-items:center;color:#fff;text-align:center}.entity.svelte-12pebb9{width:100%;height:24px;border:1px solid var(--border-1);border-radius:6px;background-color:var(--bg-1);display:grid;font-family:var(--music-font);place-items:center;color:#fff;justify-items:start;box-shadow:var(--inset-box-shadow-4);padding-left:8px}.text.svelte-12pebb9{font-family:var(--music-font)}.input-thing.svelte-12pebb9{width:64px;height:32px;display:grid;grid-template-columns:1fr;grid-template-rows:1fr;border:1px solid #333;border-radius:8px;background-color:#000;place-items:center}.input-thing-input.svelte-12pebb9{grid-row:1/2;grid-column:1/2;z-index:2;width:100%;height:100%;background-color:#0000;border:none;display:grid;place-content:center;color:#fff;font-family:var(--music-font);text-align:center;opacity:0}.input-thing-input.svelte-12pebb9:focus{opacity:1}.input-thing-display.svelte-12pebb9{grid-row:1/2;grid-column:1/2;z-index:1;width:100%;height:100%;background-color:#0000;border:none;display:grid;place-content:center;color:#999;font-family:var(--music-font)}button.svelte-12pebb9{padding:4px 6px;border-radius:4px;font-family:var(--music-font)}.active.svelte-12pebb9{background-color:#fff;color:#000}.title.svelte-12pebb9,.label.svelte-12pebb9{color:var(--text-color);font-family:var(--music-font);line-height:1}.highlight.svelte-12pebb9{padding:.5rem;display:grid;grid-auto-flow:column;grid-template-columns:min-content;align-items:center;column-gap:.5rem;background:var(--bg-2);border:1px solid var(--border-2);border-radius:8px;box-shadow:var(--inset-box-shadow-4)}.controls.svelte-12pebb9{grid-row:2 / 3;grid-column:1 / 2;padding:.5rem;width:4rem;background:var(--bg-3);border:1px solid var(--border-3);border-radius:8px;box-shadow:var(--inset-box-shadow-4);display:grid;grid-auto-flow:row;grid-auto-rows:min-content;row-gap:.5rem}@media screen and (orientation:portrait){.controls.svelte-12pebb9{display:none}}.note-button.svelte-12pebb9{padding:.4rem 0;width:100%;height:100%;line-height:1.25;background-color:var(--bg-4);border:1px solid var(--border-4);border-radius:4px;font-family:var(--music-font);text-transform:capitalize;outline:none;box-shadow:var(--box-shadow-2)}.color-scheme.svelte-12pebb9{background:var(--bg-2);border:1px solid var(--border-2);border-radius:6px;padding:.3rem;display:grid;gap:.3rem;box-shadow:var(--inset-box-shadow-2)}.scheme-button.svelte-12pebb9{padding:.4rem 0;width:100%;height:100%;font-size:8px;line-height:1.25;font-family:var(--music-font);text-transform:capitalize;outline:none;background-color:var(--bg-4);border:1px solid var(--border-4);border-radius:4px;box-shadow:var(--box-shadow-2)}.color-button.svelte-12pebb9{width:14px;height:60px;background-color:#333;outline:none;border-radius:2px;border:2px solid black;padding:0}.active-color-button.svelte-12pebb9{outline:2px solid white}.active-scheme.svelte-12pebb9{background-color:#aaa;color:#000}.scroll.svelte-12pebb9{height:24px;padding:0 8px;overflow:scroll;background-color:var(--bg-1);border:1px solid var(--border-1);border-radius:6px;font-size:8px;display:grid;align-items:center;grid-auto-flow:column;grid-auto-columns:min-content;column-gap:4px;justify-items:start;box-shadow:var(--inset-box-shadow-4)}.midi-status-light.svelte-12pebb9{width:10px;height:10px;background:#000;border:1px solid #333;border-radius:50%;align-self:center}.midi-status-on.svelte-12pebb9{background:#87ffc5;box-shadow:0 0 4px #87ffc5}.keyboard-container.svelte-12pebb9{grid-column:1 / 3;border:1px solid #444;border-radius:10px;background-color:#000;padding:9px 8px;display:grid;height:fit-content;width:min-content;width:100%;overflow-y:scroll}.keyboard-with-controls.svelte-12pebb9{grid-column:1 / 3}.fit-content.svelte-12pebb9{width:min-content}.keyboard-grid.svelte-12pebb9,.octave-grid.svelte-12pebb9{display:grid;grid-template-rows:1fr;width:min-content;height:min-content;grid-auto-flow:column}.range-octave-grid.svelte-12pebb9{display:grid;grid-template-rows:1fr;width:100%;height:min-content;grid-auto-flow:column}.white-key-grid.svelte-12pebb9{grid-row:1 / 2;grid-column:1 / 2;z-index:1;display:grid;grid-template-rows:min-content;width:100%;height:100%}.black-key-grid.svelte-12pebb9,.range-black-key-grid.svelte-12pebb9{grid-row:1 / 2;grid-column:1 / 2;z-index:2;display:grid;grid-template-rows:min-content;pointer-events:none}.white-key.svelte-12pebb9{background:#fff;background:linear-gradient(180deg,#bfbfbf,#fff);border:1px solid black;border-top:0px;border-bottom:0px;display:grid;grid-auto-rows:min-content;align-content:end;justify-content:center;justify-items:center;row-gap:2px;color:#bbb;font-family:var(--music-font),sans-serif;cursor:pointer;will-change:background-color}.white-key-inverted.svelte-12pebb9{background:#333;background:linear-gradient(180deg,#262626,#333)}@media screen and (orientation:portrait){.white-key.svelte-12pebb9{width:20px;height:60px}}.first-white-key.svelte-12pebb9{border-top-left-radius:6px!important;border-bottom-left-radius:6px!important}.last-white-key.svelte-12pebb9{border-top-right-radius:6px!important;border-bottom-right-radius:6px!important}.black-key.svelte-12pebb9{background-color:#000;border:2px solid black;border-top:0px;display:grid;row-gap:2px;color:#eee;font-family:var(--music-font),sans-serif;pointer-events:auto;cursor:pointer;grid-template-rows:1fr;grid-template-columns:1fr;width:100%;height:100%;background-repeat:no-repeat;background-size:100% 100%;background-position:center center}.note-names-key.svelte-12pebb9{background:#0d0d0d;background:linear-gradient(180deg,#0d0d0d,#1a1a1a);color:#fff;text-shadow:0px 0px 3px black}.focus-key.svelte-12pebb9{background:#595959;background:linear-gradient(180deg,#262626,#333);color:#fff;text-shadow:0px 0px 3px black}.selected-key.svelte-12pebb9{background:#595959;background:linear-gradient(180deg,#b9b9b9,#fff);text-shadow:none;color:#000}.selected-black-key.svelte-12pebb9{background:#000;color:#fff}.diminished-key.svelte-12pebb9,.dim.svelte-12pebb9{background:purple;background:linear-gradient(180deg,#303,#606);color:#fff;text-shadow:0px 0px 3px black}.minor-key.svelte-12pebb9,.mi.svelte-12pebb9{background:#00f;background:linear-gradient(180deg,#009,#00f);color:#fff;text-shadow:0px 0px 3px black}.major-key.svelte-12pebb9,.ma.svelte-12pebb9{background:#c50;background:linear-gradient(180deg,#b34a00,#ff791a);color:#fff;text-shadow:0px 0px 3px black}.perfect-key.svelte-12pebb9,.P.svelte-12pebb9{background:#b30000;background:linear-gradient(180deg,maroon,#b30000);color:#fff;text-shadow:0px 0px 3px black}.augmented-key.svelte-12pebb9,.aug.svelte-12pebb9{background:#ffa600;background:linear-gradient(180deg,#cc8500,#ffa600);color:#fff;text-shadow:0px 0px 3px black}.dim-aug-key.svelte-12pebb9{background:#e6bf00;background-image:linear-gradient(#e6bf00,#190099);color:#fff;text-shadow:0px 0px 4px black}.dim-aug.svelte-12pebb9{background:#b39500;background-image:linear-gradient(#b39500,#190099);color:#fff;text-shadow:0px 0px 4px black}.midi-note.svelte-12pebb9{background:#00a303;background-image:linear-gradient(0deg,#00a303,#006602);color:#fff;text-shadow:0px 0px 3px black}.harvest.svelte-12pebb9{background:#c65202;background:linear-gradient(180deg,#c65202,#ff9400)}.surf.svelte-12pebb9{background:#00428e;background:linear-gradient(180deg,#00428e,#00a5c2)}.shore.svelte-12pebb9{background:#e4c598;background:linear-gradient(180deg,#e4c598,#e9d5b8 3%,#f8f2e9 15%,#fdfbf8 20%,#f4fdff,#ecfcff 26%,#d7f9ff 31%,#c7f7ff,#a4f3ff 39%,#86e5ff 45%,#78cef5 53%,#69b6eb 62%,#4f8dd9 73%,#2c4e8b)}.festive.svelte-12pebb9{background:#900000;background:linear-gradient(165deg,#900000 0% 10%,#007419 10% 20%,#900000 20% 30%,#007419 30% 40%,#900000 40% 50%,#007419 50% 60%,#900000 60% 70%,#007419 70% 80%,#900000 80% 90%,#007419 90%)}.violet.svelte-12pebb9{background:#a40099;background:linear-gradient(0deg,#a40099,#650064)}.cane.svelte-12pebb9{background:#900;background:linear-gradient(145deg,#900 0% 10%,#e6e6e6 10% 20%,#008015 20% 30%,#e6e6e6 30% 40%,#900 40% 50%,#e6e6e6 50% 60%,#008015 60% 70%,#e6e6e6 70% 80%,#900 80% 90%,#e6e6e6 90%)}.correct.svelte-12pebb9{background:#008002;background:linear-gradient(180deg,#004d01,#009903)}.incorrect.svelte-12pebb9{background:#c00;background:linear-gradient(0deg,#c00,#900)}button.svelte-12pebb9{font-size:10px}.highlight-label.svelte-12pebb9{display:grid;justify-items:center;row-gap:8px}.white-key-text.svelte-12pebb9{font-size:14px;font-size:calc(8px + (14 - 8) * ((100vw - 300px) / (1600 - 300)))}.black-key-text.svelte-12pebb9{font-size:11px;font-size:calc(6px + (12 - 6) * ((100vw - 300px) / (1600 - 300)))}.player.svelte-12pebb9{grid-row:1 / 2;grid-column:1 / 3;z-index:2;padding-left:8px;background:var(--bg-3);border:1px solid var(--border-3);border-radius:10px;border-radius:4rem 16px 16px 4rem;height:64px;box-shadow:var(--inset-box-shadow-4);display:grid;grid-auto-flow:column;grid-column-gap:8px;align-items:center;justify-items:start;font-family:var(--music-font)}.round-player-border.svelte-12pebb9{grid-row:1 / 2;grid-column:1 / 9;z-index:1;margin:-9px 0 0 -49px;padding:0;width:81px;height:81px;border:1px solid #333;border-radius:81px 0 0 81px}.play-button.svelte-12pebb9{width:48px;height:48px}.keyboard-color-button.svelte-12pebb9{display:grid;gap:4px;justify-items:center;background:none;border-radius:2px;padding:0;border:none}.active-keyboard-color-button.svelte-12pebb9{outline:2px solid white}.example-keyboard.svelte-12pebb9{width:min-content;display:grid;grid-auto-flow:column;grid-template-columns:1fr 1fr;border:1px solid black}.example-white-key.svelte-12pebb9{width:14px;height:60px;border:1px solid black;background-color:#fff;z-index:1}.example-white-key-1.svelte-12pebb9{grid-row:1 / 2;grid-column:1 / 2;z-index:1;border-radius:2px 0 0 2px}.example-white-key-2.svelte-12pebb9{grid-row:1 / 2;grid-column:2 / 3;z-index:1;border-radius:0 2px 2px 0}.example-black-key.svelte-12pebb9{grid-row:1 / 2;grid-column:1 / 3;z-index:2;width:10px;height:40px;justify-self:center;align-self:start;border-left:2px solid black;border-right:2px solid black;border-bottom:2px solid black;border-top:1px solid black;background-color:#333}.dark-example-key.svelte-12pebb9{background-color:#333}.light-example-key.svelte-12pebb9{background-color:#eee}.selector-panel.svelte-12pebb9{display:grid;grid-auto-flow:column;gap:4px;width:min-content}.overlay-buttons.svelte-12pebb9>button:where(.svelte-12pebb9){height:100%;height:24px;width:76px}.pedal-button.svelte-12pebb9{width:36px;height:36px;margin:0;padding:2px;border:2px solid #666;border-radius:8px;box-shadow:0 0 4px #0000,inset 0 0 4px #0000}.active-pedal-button.svelte-12pebb9{box-shadow:0 0 4px #f8fbd0,inset 0 0 4px #f8fbd0;border:2px solid hsla(65,85%,90%,1)}.new-key-sizes.svelte-12pebb9{display:grid;grid-template-rows:min-content 1fr;grid-template-columns:48px 1fr min-content}.slider-group.svelte-12pebb9{grid-row:2 / 3;grid-column:2 / 4;z-index:1;display:grid;grid-template-rows:repeat(3,1fr);grid-template-columns:1fr;gap:8px}.slider-box.svelte-12pebb9{display:grid;gap:6px;grid-template-columns:72px 1fr;align-self:center}.main-slider.svelte-12pebb9{grid-row:1 / 2;grid-column:2 / 3;grid-auto-flow:column;gap:12px;grid-template-columns:min-content 1fr}.slider-box.svelte-12pebb9>.label:where(.svelte-12pebb9){justify-self:start}.keyboard-size-reset-button.svelte-12pebb9{grid-row:1 / 2;grid-column:3 / 4;z-index:2}.key-size-title.svelte-12pebb9{grid-row:1 / 2;grid-column:2 / 3;z-index:2;align-self:start;justify-self:center}.keyboard-example-size-box.svelte-12pebb9{grid-row:1 / 3;grid-column:1 / 2;z-index:3;border:1px solid #000;background-color:var(--bg-1);width:100%;height:100%;display:grid;justify-items:start;align-items:end;padding:0;border-radius:4px;overflow:hidden}.keyboard-example-size.svelte-12pebb9{justify-self:start;align-self:end}.color-selector.svelte-12pebb9{grid-row:1 / 3;grid-column:2 / 3}.inline-svg.svelte-12pebb9{grid-row:1 / 2;grid-column:1 / 2;z-index:5;width:100%;height:100%;display:grid;grid-template-rows:1fr;grid-template-columns:1fr}.black-key-text-holder.svelte-12pebb9{grid-row:1 / 2;grid-column:1 / 2;z-index:6;width:100%;height:100%;display:grid;grid-auto-rows:min-content;align-content:end;justify-content:center;justify-items:center;will-change:background-color}svg.svelte-4nwqr8{width:100%;height:100%;background:none}path.svelte-4nwqr8{stroke:#666;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}.active-shape.svelte-4nwqr8{stroke:#f8fbd0}.slider.svelte-1kmnczj{display:grid;width:100%;height:28px;gap:4px;font-size:8px;grid-template-rows:repeat(2,min-content);grid-template-columns:repeat(2,1fr);padding:0 4px}.radial.svelte-1kmnczj{width:min-content;height:min-content;display:grid}.label.svelte-1kmnczj{grid-row:1 / 2;grid-column:1 / 2;justify-self:start;align-self:center;font-size:8px}.value.svelte-1kmnczj{grid-row:1 / 2;grid-column:2 / 3;justify-self:end;align-self:center;font-size:8px}button.svelte-1kmnczj{width:96px;height:28px;border-radius:16px;font-family:var(--text-font);font-size:10px;background-color:var(--bg-2);border:1px solid var(--border-8);margin:0}.sub-section-title.svelte-1kmnczj{font-family:var(--title-font);text-shadow:0px 0px 6px hsla(65,85%,90%,1)}.sub-section-title.svelte-1kmnczj{grid-row:1 / 2;grid-column:1 / 2;font-size:16px}.slider-box.svelte-1kmnczj{grid-row:2 / 3;grid-column:1 / 3}canvas.svelte-1kmnczj{border:1px solid var(--border-8);border-radius:8px}.new-piano-samples.svelte-1kmnczj{font-size:12px;border:1px solid var(--border-8);display:grid;padding:2px 6px;place-content:center;width:min-content;height:min-content;white-space:nowrap;border-radius:6px;font-size:8px;width:80px;cursor:pointer}.samples-not-loaded.svelte-1kmnczj{border:1px solid hsla(0,100%,40%,.6);background-color:#3009;color:#ff3333b3}.samples-loading.svelte-1kmnczj{border:1px solid hsla(50,100%,40%,.5);background-color:#332b0080;color:#ffd50080}.samples-loaded.svelte-1kmnczj{border:1px solid hsla(120,100%,40%,.5);background-color:#00330080;color:#00ff0080}.radials.svelte-1kmnczj{display:grid;grid-auto-flow:column;width:min-content;height:min-content;gap:8px}.curve-controls.svelte-1kmnczj{grid-auto-flow:column;border:1px solid var(--border-2);border-radius:8px;background-color:var(--bg-0);padding:8px;gap:8px;display:grid;box-shadow:var(--inset-box-shadow-4)}.new-pedal-button.svelte-1kmnczj{width:24px;height:24px;padding:2px}.active-pedal-button.svelte-1kmnczj{box-shadow:0 0 4px #f8fbd0,inset 0 0 4px #f8fbd0;border:1px solid hsla(65,85%,90%,1)}.new-piano-controls.svelte-1kmnczj{display:grid;width:min-content;height:80px;grid-template-rows:min-content 1fr 1fr;gap:4px;font-family:var(--text-font);height:100%}.row.svelte-1kmnczj{display:grid;grid-auto-flow:column;gap:6px;align-items:center}.power-button.svelte-1kmnczj{width:24px;height:24px;border:1px solid #666;border-radius:16px;display:grid;place-items:center;padding:4px}.active-pedal-button.svelte-1kmnczj{box-shadow:0 0 3px #f8fbd0,inset 0 0 3px #f8fbd0;border:1px solid hsla(65,85%,90%,1)}.sound-title.svelte-1kmnczj{font-family:var(--music-font);font-size:10px;text-align:center}.settings-panel.svelte-1kmnczj{width:min-content;height:min-content}