section.keyed.svelte-rpz5ir{display:flex;flex-direction:row;max-width:95dvw;--disabled: #090909}.panel.svelte-rpz5ir{display:flex;flex-direction:column;justify-content:center}svg.svelte-rpz5ir{touch-action:none;padding:0;margin:0}svg.svelte-rpz5ir text:where(.svelte-rpz5ir){text-anchor:middle;dominant-baseline:middle;font-size:.85em;-webkit-user-select:none;user-select:none;pointer-events:none}svg.svelte-rpz5ir text.octave:where(.svelte-rpz5ir){font-size:.8em;fill:#aaa}svg.svelte-rpz5ir rect:where(.svelte-rpz5ir){rx:.3em;stroke:#000;stroke-width:.15rem;transition:height ease .05}svg.svelte-rpz5ir #whites:where(.svelte-rpz5ir) rect:where(.svelte-rpz5ir){fill:#fff}svg.svelte-rpz5ir #whites:where(.svelte-rpz5ir) rect.highlighted:where(.svelte-rpz5ir){fill:#bbb;height:90%}svg.svelte-rpz5ir #whites:where(.svelte-rpz5ir) text:where(.svelte-rpz5ir){fill:#000}svg.svelte-rpz5ir #whites:where(.svelte-rpz5ir) .disabled:where(.svelte-rpz5ir) rect:where(.svelte-rpz5ir){fill:var(--disabled)}svg.svelte-rpz5ir #blacks:where(.svelte-rpz5ir) rect:where(.svelte-rpz5ir){fill:url(#keyed-blacks-gradient)}svg.svelte-rpz5ir #blacks:where(.svelte-rpz5ir) rect.highlighted:where(.svelte-rpz5ir){filter:contrast(120%);height:55.5%}svg.svelte-rpz5ir #blacks:where(.svelte-rpz5ir) text:where(.svelte-rpz5ir){fill:#fff}svg.svelte-rpz5ir #blacks:where(.svelte-rpz5ir)>g.disabled:where(.svelte-rpz5ir) rect:where(.svelte-rpz5ir){fill:var(--disabled)}svg.svelte-rpz5ir #blacks:where(.svelte-rpz5ir)>g:where(.svelte-rpz5ir):not(.disabled){filter:drop-shadow(0 .35rem .1rem rgba(0,0,0,.3333333333))}main.svelte-719b69{display:flex;width:100%;max-width:min(90rem,97dvw);justify-content:center;gap:.5rem}.panel.svelte-719b69{display:flex;right:0;flex-direction:column;justify-content:center;align-items:center;gap:1em}.panel.svelte-719b69>div:where(.svelte-719b69){display:flex;flex-direction:column;justify-content:center;align-items:center}.panel.svelte-719b69 .disabled:where(.svelte-719b69){opacity:.5}.stringed-svg.svelte-719b69{touch-action:none;width:100%;padding-left:1em}line.svelte-719b69{stroke:#fff}#dots_face.svelte-719b69>circle:where(.svelte-719b69){fill:#222;r:.5em}#dots_side.svelte-719b69>circle:where(.svelte-719b69){fill:#999;r:.1em}#strings.svelte-719b69>circle:where(.svelte-719b69){fill:#fff;r:.1em}#notes.svelte-719b69 circle:where(.svelte-719b69){fill:url(#stringed-note-gradient);r:.5em;stroke-width:.05em;stroke:#0000;transition:stroke ease .1s,r ease 75ms}#notes.svelte-719b69 circle:where(.svelte-719b69):hover{stroke:#fff;fill:#000;r:.8em}#notes.svelte-719b69 circle:where(.svelte-719b69):hover+text:where(.svelte-719b69){font-size:1.05em}#notes.svelte-719b69 text:where(.svelte-719b69){transition:font-size ease .1s;fill:#fff;pointer-events:none;font-size:.8em}text.svelte-719b69{text-anchor:middle;dominant-baseline:middle;-webkit-user-select:none;user-select:none}text.octave.svelte-719b69{pointer-events:none;fill:#bbb;font-size:.9rem}text.tune.svelte-719b69{fill:#777}text.tune.svelte-719b69:hover{fill:var(--theme-fg);font-weight:600}[data-select-viewport],[data-combobox-viewport]{scrollbar-width:none!important;-ms-overflow-style:none!important;-webkit-overflow-scrolling:touch!important}[data-combobox-viewport]::-webkit-scrollbar{display:none!important}[data-select-viewport]::-webkit-scrollbar{display:none!important}.panel.svelte-3x57tk{display:flex;flex-direction:row;align-items:center;gap:1rem}.radial-wrap.svelte-3x57tk{position:relative;height:13rem}.radial-wrap.svelte-3x57tk .around-buttons:where(.svelte-3x57tk){display:flex;justify-content:center;align-items:center;width:2em;height:2em;position:absolute;background:none;color:var(--theme-fg);font-weight:700;font-size:1.1rem;z-index:1;cursor:pointer;transform-origin:center;border-radius:100%}.radial-wrap.svelte-3x57tk .around-buttons:where(.svelte-3x57tk):hover{border:solid 1px #999;transform:scale(1.2)}.radial-wrap.svelte-3x57tk .around-buttons.quinted-button:where(.svelte-3x57tk){top:.5em;left:.5em}.radial-wrap.svelte-3x57tk .around-buttons.alter-button:where(.svelte-3x57tk){bottom:.5em;right:.5em}.radial-wrap.svelte-3x57tk .root-indicator:where(.svelte-3x57tk){position:absolute;top:1rem;left:50%;transform:translate(-50%);width:1.1em;height:1.1em;border-radius:50%;background:var(--theme-fg);z-index:10;pointer-events:none;mix-blend-mode:difference}svg.svelte-3x57tk{touch-action:none;height:100%;cursor:grab}svg.svelte-3x57tk:active{cursor:grabbing}svg.svelte-3x57tk text:where(.svelte-3x57tk){text-anchor:middle;dominant-baseline:middle}svg.svelte-3x57tk .note-button:where(.svelte-3x57tk){cursor:pointer}svg.svelte-3x57tk .note-button:where(.svelte-3x57tk):hover{transform-box:fill-box;transform-origin:center;transform:scale(1.1)}svg.svelte-3x57tk .note-button:where(.svelte-3x57tk) text:where(.svelte-3x57tk){font-size:.7rem;-webkit-user-select:none;user-select:none}main.svelte-uzj233{display:flex;flex-direction:column;margin:.75rem;overflow-x:auto;overflow-y:hidden;max-width:100dvw}main.svelte-uzj233 table:where(.svelte-uzj233){margin:.5em;font-size:.85rem}main.svelte-uzj233 table:where(.svelte-uzj233) th:where(.svelte-uzj233){text-align:right;padding-right:1rem;color:#666;height:0}main.svelte-uzj233 table:where(.svelte-uzj233) td:where(.svelte-uzj233){padding:0 .1rem}main.svelte-uzj233 table:where(.svelte-uzj233) td:where(.svelte-uzj233):hover{transform:scale(1.1);font-weight:500}main.svelte-iafj7n{width:100%;display:flex;justify-content:center}.sheet-wrap.svelte-iafj7n{height:10rem;position:relative}.sheet-wrap.svelte-iafj7n .sheet:where(.svelte-iafj7n){width:100%;height:100%}.clef.svelte-iafj7n{position:absolute}.clef.treble.svelte-iafj7n{bottom:11.5%;height:72%}.clef.bass.svelte-iafj7n{top:30%;height:30%}.note.svelte-iafj7n{position:absolute;left:65%;height:40%}.alter.svelte-iafj7n{position:absolute;left:50%;height:20%}main.svelte-w91zfd{-webkit-user-select:none;user-select:none;background:var(--theme-bg);display:flex;flex-direction:column;justify-content:flex-start;align-items:center;width:100%;color:#fff;font-size:1.5em}