.canvas.svelte-12nndbr{position:relative;min-width:0;min-height:0;overflow:hidden;background:#000;border-right:1px solid #171717}svg.svelte-12nndbr{display:block;width:100%;height:100%;touch-action:none;-webkit-user-select:none;user-select:none;cursor:grab;outline:none}svg.svelte-12nndbr.panning{cursor:grabbing}svg.svelte-12nndbr.pickable:not(.panning){cursor:pointer}svg.svelte-12nndbr:focus-visible{outline:1px solid #333;outline-offset:-1px}.tri.svelte-12nndbr{fill:#070707;stroke:#1c1c1c;stroke-width:1;vector-effect:non-scaling-stroke}.tri.svelte-12nndbr.major{fill:#090909}.tri.svelte-12nndbr.minor{fill:#060606}.tri.svelte-12nndbr.in-scale{fill:#101010;stroke:#2a2a2a}.tri.svelte-12nndbr.in-scale.major{fill:#161616}.tri.svelte-12nndbr.in-scale.minor{fill:#0f0f0f}.key-only.svelte-12nndbr .tri:where(.svelte-12nndbr){stroke:none}.chords-off.svelte-12nndbr .tri:where(.svelte-12nndbr){fill:none;pointer-events:all}.chords-off.svelte-12nndbr .tri-label:where(.svelte-12nndbr),.chords-off.svelte-12nndbr .tri-hover:where(.svelte-12nndbr),.chords-off.svelte-12nndbr .tri-selected:where(.svelte-12nndbr){display:none}.key-edge.svelte-12nndbr{stroke:#2a2a2a;stroke-width:1;vector-effect:non-scaling-stroke;pointer-events:stroke}.edges-off.svelte-12nndbr .tri:where(.svelte-12nndbr){stroke:none}.edges-off.svelte-12nndbr .key-edge:where(.svelte-12nndbr),.edges-off.svelte-12nndbr .edge-hover:where(.svelte-12nndbr),.edges-off.svelte-12nndbr .edge-selected:where(.svelte-12nndbr){display:none}.tri-hover.svelte-12nndbr{fill:#1a1a1a;stroke:#777;stroke-width:1;vector-effect:non-scaling-stroke;pointer-events:none}.tri-selected.svelte-12nndbr{fill:#222;stroke:#fff;stroke-width:1.5;vector-effect:non-scaling-stroke;pointer-events:none}.edge-hover.svelte-12nndbr{stroke:#fff;stroke-width:2;vector-effect:non-scaling-stroke;pointer-events:none}.edge-selected.svelte-12nndbr{stroke:#fff;stroke-width:2.5;vector-effect:non-scaling-stroke;pointer-events:none}.p5-label.svelte-12nndbr{pointer-events:none}.p5-label.svelte-12nndbr rect:where(.svelte-12nndbr){fill:#000}.p5-label.svelte-12nndbr text:where(.svelte-12nndbr){fill:#aaa;text-anchor:middle;dominant-baseline:central;font-size:calc(var(--label-font) * .8);font-weight:600}.node.svelte-12nndbr{pointer-events:all}.node.svelte-12nndbr circle:where(.svelte-12nndbr){fill:#050505;stroke:#2a2a2a;stroke-width:1;vector-effect:non-scaling-stroke}.node.svelte-12nndbr text:where(.svelte-12nndbr){fill:#777;text-anchor:middle;dominant-baseline:central;font-weight:500;font-size:var(--node-font);pointer-events:none}.node.svelte-12nndbr.in-scale circle:where(.svelte-12nndbr){stroke:#555}.node.svelte-12nndbr.in-scale text:where(.svelte-12nndbr){fill:#bbb}.node.svelte-12nndbr.tonic circle:where(.svelte-12nndbr){stroke:#aaa}.node.svelte-12nndbr.tonic text:where(.svelte-12nndbr){fill:#fff;font-weight:700}.node.svelte-12nndbr.active circle:where(.svelte-12nndbr){fill:#fff;stroke:#fff}.node.svelte-12nndbr.active text:where(.svelte-12nndbr){fill:#000}.notes-off.svelte-12nndbr .node:where(.svelte-12nndbr),.notes-off.svelte-12nndbr .node-hover:where(.svelte-12nndbr),.notes-off.svelte-12nndbr .node-selected:where(.svelte-12nndbr){display:none}.node-hover.svelte-12nndbr{fill:none;stroke:#fff;stroke-width:1.5;vector-effect:non-scaling-stroke;pointer-events:none}.node-selected.svelte-12nndbr{fill:none;stroke:#fff;stroke-width:2;vector-effect:non-scaling-stroke;pointer-events:none}.tri-label.svelte-12nndbr{fill:#555;text-anchor:middle;dominant-baseline:central;pointer-events:none;font-weight:500;font-size:var(--label-font)}.tri-label.svelte-12nndbr.in-scale{fill:#999}.tri-label.svelte-12nndbr.tonic{fill:#fff}.hide-notes.svelte-12nndbr .node:where(.svelte-12nndbr) text:where(.svelte-12nndbr){display:none}.hide-chords.svelte-12nndbr .tri-label:where(.svelte-12nndbr){display:none}.type-toggles.svelte-12nndbr{position:absolute;top:.6rem;left:50%;transform:translate(-50%);display:flex;gap:.25rem}.type-toggles.svelte-12nndbr button:where(.svelte-12nndbr){min-width:1.8rem;padding:.25rem .4rem;border:1px solid #2a2a2a;background:#000a;color:#777;font:inherit;font-size:.7rem;cursor:pointer}.type-toggles.svelte-12nndbr button:where(.svelte-12nndbr):hover{border-color:#777;color:#fff}.type-toggles.svelte-12nndbr button:where(.svelte-12nndbr).active{background:#fff;border-color:#fff;color:#000}.type-toggles.svelte-12nndbr button:where(.svelte-12nndbr).active:hover{color:#000}.legend.svelte-12nndbr{position:absolute;top:.6rem;right:.6rem;display:flex;gap:.75rem;color:#555;font-size:.65rem;letter-spacing:.06em;text-transform:uppercase;pointer-events:none}.legend.svelte-12nndbr i:where(.svelte-12nndbr){display:inline-block;width:.55rem;height:.55rem;margin-right:.25rem;vertical-align:-.05rem;border:1px solid #333}.legend.svelte-12nndbr i:where(.svelte-12nndbr).major{background:#101010}.legend.svelte-12nndbr i:where(.svelte-12nndbr).minor{background:#060606}.legend.svelte-12nndbr i:where(.svelte-12nndbr).key{background:#222;border-color:#666}.view-controls.svelte-12nndbr{position:absolute;right:.6rem;bottom:.6rem;display:flex;gap:.25rem}.view-controls.svelte-12nndbr button:where(.svelte-12nndbr){min-width:1.8rem;padding:.25rem .4rem;border:1px solid #2a2a2a;background:#000a;color:#777;font:inherit;font-size:.7rem;cursor:pointer}.view-controls.svelte-12nndbr button:where(.svelte-12nndbr):hover{border-color:#777;color:#fff}@media(max-width:860px){.canvas.svelte-12nndbr{border-right:0;border-bottom:1px solid #171717}}.panel.svelte-1wuneq5{min-width:0;min-height:0;overflow-y:auto;padding:.75rem .75rem 2.5rem;display:flex;flex-direction:column;gap:.85rem;background:#050505}.section.svelte-1wuneq5{display:flex;flex-direction:column;gap:.5rem;padding-top:.65rem;border-top:1px solid #171717}.section.svelte-1wuneq5:first-child{padding-top:0;border-top:0}.section-head.svelte-1wuneq5{display:flex;align-items:center;justify-content:space-between;color:#777;font-size:.65rem;letter-spacing:.1em;text-transform:uppercase}.section-head.svelte-1wuneq5 .count:where(.svelte-1wuneq5){color:#fff}.row.svelte-1wuneq5{display:flex;gap:.5rem;justify-content:space-between}.control.svelte-1wuneq5{display:flex;flex-direction:column;gap:.25rem;min-width:0}.control.svelte-1wuneq5>span:where(.svelte-1wuneq5){color:#777;font-size:.65rem;letter-spacing:.08em;text-transform:uppercase}.panel .select-frame{width:100%;height:1.9rem;justify-content:space-between;font-size:.8rem}.env-block.svelte-1wuneq5{display:flex;flex-direction:column;gap:.35rem}.env-row.svelte-1wuneq5{display:grid;grid-template-columns:1.1rem 1fr;align-items:center;gap:.4rem}.env-letter.svelte-1wuneq5{color:#ccc;font-size:.62rem;font-family:ui-monospace,SF Mono,Menlo,Consolas,monospace}.steps-row.svelte-1wuneq5{display:flex;gap:.15rem}.step-btn.svelte-1wuneq5{flex:1;min-width:0;height:1.55rem;padding:0;border:1px solid #222;background:#000;color:#444;font:inherit;font-size:.62rem;cursor:pointer}.step-btn.svelte-1wuneq5:hover{border-color:#777;color:#fff}.step-btn.svelte-1wuneq5.active{border-color:#aaa;background:#222;color:#fff}.btn.svelte-1wuneq5{padding:.35rem .55rem;border:1px solid #2a2a2a;background:#0a0a0a;color:#999;font:inherit;font-size:.72rem;cursor:pointer}.btn.svelte-1wuneq5:hover:not(:disabled){border-color:#777;color:#fff}.btn.svelte-1wuneq5.active{background:#fff;border-color:#fff;color:#000}.btn.svelte-1wuneq5.premute{width:100%}.btn.svelte-1wuneq5:disabled{opacity:.3;cursor:default}.btn.svelte-1wuneq5.tiny{padding:.2rem .4rem}.transport.svelte-1wuneq5{display:flex;flex-wrap:wrap;gap:.3rem}.bpm-row.svelte-1wuneq5{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:.5rem}.mini.svelte-1wuneq5{color:#777;font-size:.65rem;letter-spacing:.08em;text-transform:uppercase}.bpm-value.svelte-1wuneq5{min-width:2.2em;color:#fff;font-size:.75rem;font-variant-numeric:tabular-nums;text-align:right}.transpose-row.svelte-1wuneq5{display:flex;align-items:center;gap:.3rem}.prog-list.svelte-1wuneq5{display:flex;flex-wrap:wrap;gap:.25rem;max-height:10rem;overflow-y:auto}.prog-item.svelte-1wuneq5{display:flex;align-items:stretch;border:1px solid #222;background:#0a0a0a}.prog-item.svelte-1wuneq5.current{border-color:#fff}.prog-play.svelte-1wuneq5{display:flex;align-items:center;gap:.35rem;padding:.2rem .4rem;background:transparent;color:#ccc;font:inherit;font-size:.72rem;cursor:pointer}.prog-play.svelte-1wuneq5:hover{color:#fff}.prog-index.svelte-1wuneq5{color:#555;font-size:.6rem}.prog-remove.svelte-1wuneq5{padding:0 .35rem;border-left:1px solid #222;background:transparent;color:#555;font:inherit;cursor:pointer}.prog-remove.svelte-1wuneq5:hover{color:#fff}.voice-leading.svelte-1wuneq5{display:flex;gap:.75rem;color:#555;font-size:.65rem;letter-spacing:.06em;text-transform:uppercase}@media(max-width:860px){.panel.svelte-1wuneq5{max-height:46dvh}}main.svelte-xclv4p{display:grid;grid-template-columns:minmax(0,1fr) 21rem;width:100%;height:calc(100dvh - var(--site-header-h, 0px));overflow:hidden;background:#000;color:#eee;font-family:JetBrains Mono,SFMono-Regular,Consolas,monospace;font-size:.8rem}@media(max-width:860px){main.svelte-xclv4p{grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) auto}}