.debug.svelte-f4rf3m{display:grid;grid-auto-flow:column;font-family:var(--music-font);font-size:12px}.keyboard-box.svelte-f4rf3m{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-f4rf3m{padding:8px;border:1px solid var(--border-4);background-color:var(--bg-4)}.player-border.svelte-f4rf3m{padding:8px;border:1px solid var(--border-4);border-radius:40px 12px 12px;background-color:var(--bg-4)}.borderless.svelte-f4rf3m{padding:0;border:none}.keyboard-controls.svelte-f4rf3m{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-f4rf3m{display:grid;height:min-content;grid-auto-flow:column;gap:8px;align-items:center}.midi-panel.svelte-f4rf3m{grid-template-columns:min-content min-content 1fr}.vertical.svelte-f4rf3m{grid-template-columns:min-content;grid-template-rows:min-content 1fr;height:100%}.sub-panel.svelte-f4rf3m{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%}.vertical-subpanel.svelte-f4rf3m{display:grid;grid-template-columns:1fr;grid-auto-flow:row;gap:16px;height:100%}.midi-color-buttons.svelte-f4rf3m{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.entity-panel.svelte-f4rf3m{grid-template-columns:min-content 1fr min-content 1fr min-content 1fr min-content 1fr min-content 1fr}.min-content.svelte-f4rf3m{width:min-content}.key-sizes.svelte-f4rf3m{grid-template-columns:min-content min-content 1fr min-content 1fr min-content 1fr min-content 1fr}.key-overlays.svelte-f4rf3m,.key-colors.svelte-f4rf3m{grid-template-columns:min-content repeat(4,1fr)}.midi-info.svelte-f4rf3m{grid-template-columns:min-content min-content 1fr min-content 1fr min-content 1fr min-content 1fr}.keyboard-range.svelte-f4rf3m{display:grid;grid-auto-flow:row}.range-controls.svelte-f4rf3m{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-f4rf3m{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-f4rf3m{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-f4rf3m:hover{background-color:#666}.range-white-key-selected.svelte-f4rf3m{background-color:#fff}.range-black-key.svelte-f4rf3m{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-f4rf3m{font-family:var(--music-font);font-weight:700}.field.svelte-f4rf3m{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-f4rf3m{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-f4rf3m{font-family:var(--music-font)}.input-thing.svelte-f4rf3m{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-f4rf3m{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-f4rf3m:focus{opacity:1}.input-thing-display.svelte-f4rf3m{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-f4rf3m{padding:4px 6px;border-radius:4px;font-family:var(--music-font)}.active.svelte-f4rf3m{background-color:#fff;color:#000}.title.svelte-f4rf3m,.label.svelte-f4rf3m{color:var(--text-color);font-family:var(--music-font);line-height:1}.highlight.svelte-f4rf3m{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-f4rf3m{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-f4rf3m{display:none}}.note-button.svelte-f4rf3m{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-f4rf3m{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-f4rf3m{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-f4rf3m{width:1rem;height:1rem;font-size:12px;line-height:1.25;background-color:#333;font-family:Share Tech,impact,sans-serif;outline:none;border-radius:1rem}.active-color-button.svelte-f4rf3m{box-shadow:0 0 0 2px var(--bg-3),0 0 0 4px var(--text-color)}.active-scheme.svelte-f4rf3m{background-color:#aaa;color:#000}.scroll.svelte-f4rf3m{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)}.scroll.svelte-f4rf3m>p:where(.svelte-f4rf3m){font-size:12px;line-height:1;color:var(--text-color);font-family:var(--music-font)}.midi-status-light.svelte-f4rf3m{width:16px;height:16px;background:#000;border:1px solid #333;border-radius:50%;align-self:center}.midi-status-on.svelte-f4rf3m{background:#87ffc5;box-shadow:0 0 4px #87ffc5}.keyboard-container.svelte-f4rf3m{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-f4rf3m{grid-column:2 / 3}.fit-content.svelte-f4rf3m{width:min-content}.keyboard-grid.svelte-f4rf3m,.octave-grid.svelte-f4rf3m{display:grid;grid-template-rows:1fr;width:min-content;height:min-content;grid-auto-flow:column}.range-octave-grid.svelte-f4rf3m{display:grid;grid-template-rows:1fr;width:100%;height:min-content;grid-auto-flow:column}.white-key-grid.svelte-f4rf3m{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-f4rf3m{grid-row:1 / 2;grid-column:1 / 2;z-index:2;display:grid;grid-template-rows:min-content}.range-black-key-grid.svelte-f4rf3m{grid-row:1 / 2;grid-column:1 / 2;z-index:2;display:grid;grid-template-rows:min-content;pointer-events:none}.white-key.svelte-f4rf3m{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}.white-key-inverted.svelte-f4rf3m{background:#333;background:linear-gradient(180deg,#262626,#333)}@media screen and (orientation:portrait){.white-key.svelte-f4rf3m{width:20px;height:60px}}.first-white-key.svelte-f4rf3m{border-top-left-radius:6px!important;border-bottom-left-radius:6px!important}.last-white-key.svelte-f4rf3m{border-top-right-radius:6px!important;border-bottom-right-radius:6px!important}.black-key.svelte-f4rf3m{background-color:#000;border:2px solid black;border-top:0px;display:grid;grid-auto-rows:min-content;align-content:end;justify-content:center;justify-items:center;row-gap:2px;padding-bottom:4px;color:#eee;font-family:var(--music-font),sans-serif;background-repeat:no-repeat;background-size:100% 100%;background-position:center center;background-size:stretch stretch;background-image:url("data:image/svg+xml,%3Csvg width='14' height='84' viewBox='0 0 14 84' preserveAspectRatio='none' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 0H14V83H0V0Z' fill='%23262626'/%3E%3Cpath d='M14 83C14 82 12 77 10 77H4C2 77 0 82 0 83C0 84 1 84 1 84H13C13 84 14 84 14 83Z' fill='url(%23paint0_linear)'/%3E%3Cpath d='M12 0V68C12 68 12 76 10 76H4C2 76 2 68 2 68V0H12Z' fill='url(%23paint1_linear)'/%3E%3Cdefs%3E%3ClinearGradient id='paint0_linear' x1='7' y1='84' x2='7' y2='77' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23666666'/%3E%3Cstop offset='0.139'/%3E%3Cstop offset='1' stop-color='%23595959'/%3E%3C/linearGradient%3E%3ClinearGradient id='paint1_linear' x1='7' y1='74.556' x2='7' y2='2.35397' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23595959'/%3E%3Cstop offset='1' stop-color='%23535353'/%3E%3C/linearGradient%3E%3C/defs%3E%3C/svg%3E")}.black-key-inverted.svelte-f4rf3m{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='84' fill='none' viewBox='0 0 14 84' preserveAspectRatio='none'%3E%3Cpath fill='%23000' d='M0 0h14v84H0z'/%3E%3Cpath fill='%23666666' d='M0 0h14v83H0V0z'/%3E%3Cpath fill='url(%23paint0_linear)' d='M14 83c0-1-2-6-4-6H4c-2 0-4 5-4 6s1 1 1 1h12s1 0 1-1z'/%3E%3Cpath fill='url(%23paint1_linear)' d='M12 0v68s0 8-2 8H4c-2 0-2-8-2-8V0h10z'/%3E%3Cdefs%3E%3ClinearGradient id='paint0_linear' x1='7' x2='7' y1='84' y2='77' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23fff'/%3E%3Cstop offset='.139' stop-color='%237A7A7A'/%3E%3Cstop offset='1' stop-color='%23fff'/%3E%3C/linearGradient%3E%3ClinearGradient id='paint1_linear' x1='7' x2='7' y1='74.556' y2='2.354' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23fff'/%3E%3Cstop offset='1' stop-color='%23E8E8E8'/%3E%3C/linearGradient%3E%3C/defs%3E%3C/svg%3E%0A")}.black-key-korg-blood.svelte-f4rf3m{background-image:url("data:image/svg+xml,%3Csvg width='14' height='84' viewBox='0 0 14 84' preserveAspectRatio='none' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 0H14V83H0V0Z' fill='%23660000'/%3E%3Cpath d='M14 83C14 82 12 77 10 77H4C2 77 0 82 0 83C0 84 1 84 1 84H13C13 84 14 84 14 83Z' fill='url(%23paint0_linear)'/%3E%3Cpath d='M12 0V68C12 68 12 76 10 76H4C2 76 2 68 2 68V0H12Z' fill='url(%23paint1_linear)'/%3E%3Cdefs%3E%3ClinearGradient id='paint0_linear' x1='7' y1='84' x2='7' y2='77' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23CC0000'/%3E%3Cstop offset='0.139' stop-color='%23660000'/%3E%3Cstop offset='1' stop-color='%23CC0000'/%3E%3C/linearGradient%3E%3ClinearGradient id='paint1_linear' x1='7' y1='74.556' x2='7' y2='2.35397' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23BF0000'/%3E%3Cstop offset='1' stop-color='%23B30000'/%3E%3C/linearGradient%3E%3C/defs%3E%3C/svg%3E")}.note-names-key.svelte-f4rf3m{background:#0d0d0d;background:linear-gradient(180deg,#0d0d0d,#1a1a1a);color:#fff;text-shadow:0px 0px 3px black}.focus-key.svelte-f4rf3m{background:#595959;background:linear-gradient(180deg,#262626,#333);color:#fff;text-shadow:0px 0px 3px black}.selected-key.svelte-f4rf3m{background:#595959;background:linear-gradient(180deg,#b9b9b9,#fff);text-shadow:none;color:#000}.ommited-key.svelte-f4rf3m{background:#595959;background:linear-gradient(180deg,gray,#b3b3b3);text-shadow:none;color:#000}.selected-black-key.svelte-f4rf3m{background:#000;color:#fff}.diminished-key.svelte-f4rf3m,.dim.svelte-f4rf3m{background:purple;background:linear-gradient(180deg,#303,#606);color:#fff;text-shadow:0px 0px 3px black}.minor-key.svelte-f4rf3m,.mi.svelte-f4rf3m{background:#00f;background:linear-gradient(180deg,#009,#00f);color:#fff;text-shadow:0px 0px 3px black}.major-key.svelte-f4rf3m,.ma.svelte-f4rf3m{background:#c50;background:linear-gradient(180deg,#b34a00,#ff791a);color:#fff;text-shadow:0px 0px 3px black}.perfect-key.svelte-f4rf3m,.P.svelte-f4rf3m{background:#b30000;background:linear-gradient(180deg,maroon,#b30000);color:#fff;text-shadow:0px 0px 3px black}.augmented-key.svelte-f4rf3m,.aug.svelte-f4rf3m{background:#ffa600;background:linear-gradient(180deg,#cc8500,#ffa600);color:#fff;text-shadow:0px 0px 3px black}.dim-aug-key.svelte-f4rf3m{background:#e6bf00;background-image:linear-gradient(#e6bf00,#190099);color:#fff;text-shadow:0px 0px 4px black}.dim-aug.svelte-f4rf3m{background:#b39500;background-image:linear-gradient(#b39500,#190099);color:#fff;text-shadow:0px 0px 4px black}.midi-note.svelte-f4rf3m{background:#00a303;background-image:linear-gradient(0deg,#00a303,#006602);color:#fff;text-shadow:0px 0px 3px black}.harvest.svelte-f4rf3m{background:#c65202;background:linear-gradient(180deg,#c65202,#ff9400)}.surf.svelte-f4rf3m{background:#00428e;background:linear-gradient(180deg,#00428e,#00a5c2)}.shore.svelte-f4rf3m{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-f4rf3m{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-f4rf3m{background:#a40099;background:linear-gradient(0deg,#a40099,#650064)}.cane.svelte-f4rf3m{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-f4rf3m{background:#008002;background:linear-gradient(180deg,#004d01,#009903)}.incorrect.svelte-f4rf3m{background:#c00;background:linear-gradient(0deg,#c00,#900)}button.svelte-f4rf3m{font-size:10px}.highlight-label.svelte-f4rf3m{display:grid;justify-items:center;row-gap:8px}.white-key-text.svelte-f4rf3m{font-size:14px;font-size:calc(8px + (14 - 8) * ((100vw - 300px) / (1600 - 300)))}.black-key-text.svelte-f4rf3m{font-size:11px;font-size:calc(6px + (12 - 6) * ((100vw - 300px) / (1600 - 300)))}.player.svelte-f4rf3m{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-f4rf3m{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-f4rf3m{width:48px;height:48px}