.circle-wrapper[data-v-897b83ce]{display:flex;flex-direction:column;align-items:center;gap:8px}.pitch-circle[data-v-897b83ce]{-webkit-user-select:none;user-select:none;touch-action:none}.pitch-circle.note-dragging[data-v-897b83ce]{cursor:grabbing}.inner-circle[data-v-897b83ce]{cursor:grab}.inner-circle.inner-dragging[data-v-897b83ce]{cursor:grabbing}.inner-circle.inner-dragging .note-dot[data-v-897b83ce]{transition:none}.scale-sector-inner[data-v-897b83ce]{fill:var(--accent);opacity:0;pointer-events:none}.scale-ring[data-v-897b83ce]{cursor:grab}.scale-ring.dragging[data-v-897b83ce]{cursor:grabbing}.scale-sector-ring[data-v-897b83ce]{fill:var(--accent);opacity:.3;stroke:#00000080;stroke-width:1.5}.scale-sector-root[data-v-897b83ce]{fill:var(--accent);opacity:.7;stroke:#00000080;stroke-width:1.5}.preview-sector[data-v-897b83ce]{fill:var(--accent);opacity:.3;stroke:#00000080;stroke-width:1.5}.preview-sector-root[data-v-897b83ce]{fill:var(--accent);opacity:.7;stroke:#00000080;stroke-width:1.5}.bg-ring[data-v-897b83ce]{fill:var(--surface);stroke:var(--border);stroke-width:1}.interval-line[data-v-897b83ce]{opacity:.75;stroke-linecap:round}.interval-line-hover[data-v-897b83ce]{cursor:default}.interval-tooltip{position:fixed;background:var(--surface2);border:1px solid var(--border);color:var(--text);padding:4px 10px;border-radius:6px;font-size:12px;pointer-events:none;z-index:1000;white-space:pre-line;box-shadow:0 2px 6px #00000059}.note-group[data-v-897b83ce]{cursor:pointer}.note-group:hover .note-dot[data-v-897b83ce]:not(.faded){filter:brightness(1.15)}.note-dot[data-v-897b83ce]{fill:var(--surface2);stroke:var(--border);stroke-width:1;transition:fill .15s,stroke .15s,opacity .1s}.note-dot.active[data-v-897b83ce]{fill:var(--text-muted);stroke:var(--text-muted);cursor:grab}.note-dot.root[data-v-897b83ce]{fill:var(--note-root);stroke:var(--note-root);cursor:grab}.note-dot.faded[data-v-897b83ce]{opacity:.25}.note-dot-high[data-v-897b83ce]{opacity:.8}.drag-ghost[data-v-897b83ce]{fill:var(--text-muted);opacity:.7;pointer-events:none}.drag-ghost.root[data-v-897b83ce]{fill:var(--note-root)}.drag-target-ring[data-v-897b83ce]{fill:none;stroke:#fff;stroke-width:1.5;stroke-dasharray:4 3;opacity:.6;pointer-events:none}.root-ring[data-v-897b83ce]{fill:none;stroke:var(--note-root);stroke-width:3;opacity:.9}.ring-band-bg[data-v-897b83ce]{stroke:var(--bg);opacity:.8}.ring-band[data-v-897b83ce]{stroke:var(--surface2);transition:stroke .15s}.preview-ring-band[data-v-897b83ce]{stroke:var(--surface2)}.scale-ring:hover .ring-band[data-v-897b83ce]{stroke:color-mix(in srgb,var(--accent) 30%,var(--surface2))}.scale-ring.dragging .ring-band[data-v-897b83ce]{stroke:color-mix(in srgb,var(--accent) 50%,var(--surface2))}.ring-sep[data-v-897b83ce]{stroke:var(--border);stroke-width:1;opacity:.6}.ring-label[data-v-897b83ce]{font-size:11px;font-weight:500;fill:var(--text);transition:fill .1s}.ring-label.tonic[data-v-897b83ce]{fill:var(--text);font-weight:700;font-size:12px}.ring-tick[data-v-897b83ce]{stroke:var(--border);stroke-width:1}.ring-tick.tonic[data-v-897b83ce]{stroke:var(--accent);stroke-width:1.5}.keyboard-wrapper[data-v-34a3b2ed]{display:flex;flex-direction:column;align-items:center;gap:8px}.keyboard-svgs[data-v-34a3b2ed]{display:flex;flex-direction:column;gap:0;line-height:0}.piano-svg[data-v-34a3b2ed]{cursor:pointer;-webkit-user-select:none;user-select:none;touch-action:none}.white-key[data-v-34a3b2ed]{fill:#e8e8f0;stroke:#aac;stroke-width:1;transition:fill .1s}.white-key[data-v-34a3b2ed]:hover{fill:#d0d0ee}.white-key.active[data-v-34a3b2ed]{fill:var(--note-active);stroke:#333}.white-key.root[data-v-34a3b2ed]{fill:var(--note-root);stroke:#333}.black-key[data-v-34a3b2ed]{fill:#1a1a2e;stroke:#0a0a1a;stroke-width:1;transition:fill .1s}.black-key[data-v-34a3b2ed]:hover{fill:#2a2a4e}.black-key.active[data-v-34a3b2ed]{fill:var(--note-active);stroke:#000}.black-key.root[data-v-34a3b2ed]{fill:var(--note-root);stroke:#000}.scale-stripe[data-v-34a3b2ed]{fill:var(--accent);stroke:#00000080;stroke-width:1.5;transition:opacity .4s ease}.scale-stripe-root[data-v-34a3b2ed]{opacity:.7}.preview-stripe[data-v-34a3b2ed]{fill:var(--accent);opacity:.3;stroke:#00000080;stroke-width:1.5}.preview-stripe-root[data-v-34a3b2ed]{opacity:.7}.view-3d-wrapper[data-v-c4e26e62]{display:flex;flex-direction:column;align-items:center;-webkit-user-select:none;user-select:none}.scene-svg[data-v-c4e26e62]{cursor:grab;border-radius:12px;display:block}.scene-svg[data-v-c4e26e62]:active{cursor:grabbing}.hint-3d[data-v-c4e26e62]{font-size:11px;color:var(--text-muted);margin-top:4px;opacity:.6}.chord-display[data-v-1bca942c]{display:flex;flex-direction:column;gap:12px;min-width:260px}.chord-section[data-v-1bca942c]{display:flex;flex-direction:column;gap:6px}.dissonance-row[data-v-1bca942c]{display:flex;align-items:center;gap:10px;padding:8px 12px;background:var(--surface);border-radius:8px;border:1px solid var(--border)}.dissonance-bar-wrap[data-v-1bca942c]{flex:1;height:6px;background:var(--surface2);border-radius:3px;overflow:hidden}.dissonance-bar[data-v-1bca942c]{height:100%;border-radius:3px;transition:width .3s,background .3s}.dissonance-value[data-v-1bca942c]{font-size:12px;color:var(--text-muted);min-width:32px;text-align:right}.iv-label[data-v-1bca942c]{font-size:11px;color:var(--text-muted);white-space:nowrap}.empty-hint[data-v-1bca942c]{color:var(--text-muted);font-size:13px;padding:12px;text-align:center}.chord-row[data-v-1bca942c]{display:flex;align-items:center;gap:12px;padding:8px 12px;border-radius:8px;border:1px solid var(--border);background:var(--surface);transition:border-color .15s}.chord-row.highlight[data-v-1bca942c]{border-color:var(--note-root);background:color-mix(in srgb,var(--note-root) 8%,var(--surface))}.chord-symbol[data-v-1bca942c]{font-size:17px;font-weight:700;color:var(--text);min-width:70px}.chord-name[data-v-1bca942c]{font-size:13px;color:var(--text-muted);flex:1}.chord-roman[data-v-1bca942c]{font-size:13px;color:var(--accent);font-style:italic;min-width:50px;text-align:right}.scale-occurrences[data-v-1bca942c]{margin-top:4px;padding:10px 12px;background:var(--surface);border:1px solid var(--border);border-radius:10px;display:flex;flex-direction:column;gap:4px}.scale-occ-label[data-v-1bca942c]{font-size:11px;color:var(--text-muted)}.scale-occ-row[data-v-1bca942c]{display:flex;align-items:baseline;gap:8px;font-size:12px;flex-wrap:nowrap}.scale-occ-name[data-v-1bca942c]{color:var(--text-muted);min-width:110px;flex-shrink:0;font-size:11px}.scale-occ-roots[data-v-1bca942c]{display:flex;flex-wrap:nowrap;gap:2px}.scale-occ-root[data-v-1bca942c]{color:var(--text-muted);opacity:.35;padding:1px 4px;border-radius:4px;font-size:11px;cursor:pointer;transition:background .12s}.scale-occ-root[data-v-1bca942c]:hover{background:color-mix(in srgb,var(--text-muted) 15%,transparent);opacity:.6}.scale-occ-root.match[data-v-1bca942c]{color:var(--accent);font-weight:600;opacity:1;cursor:pointer;transition:background .12s}.scale-occ-root.match[data-v-1bca942c]:hover{background:color-mix(in srgb,var(--accent) 20%,transparent)}.scale-occ-root.selected[data-v-1bca942c]{outline:1.5px solid var(--accent);outline-offset:1px;border-radius:4px}.collapsible-header[data-v-1bca942c]{display:flex;justify-content:space-between;align-items:center;cursor:pointer;-webkit-user-select:none;user-select:none;gap:6px}.collapse-toggle[data-v-1bca942c]{color:var(--text-muted);font-size:1.1em;line-height:1;flex-shrink:0;transition:transform .2s}.collapse-toggle.collapsed[data-v-1bca942c]{transform:rotate(-90deg)}.similar-scales[data-v-1bca942c]{border:1px solid var(--border);border-radius:10px;background:var(--surface);padding:10px 12px;margin-top:4px;display:flex;flex-direction:column;gap:4px;position:relative}.heat-tooltip[data-v-1bca942c]{position:absolute;transform:translate(-50%,calc(-100% - 6px));background:#222;color:#fff;border-radius:5px;padding:4px 9px;font-size:11px;white-space:nowrap;pointer-events:none;z-index:20}.heat-tooltip[data-v-1bca942c]:after{content:"";position:absolute;top:100%;left:50%;transform:translate(-50%);border:4px solid transparent;border-top-color:#222}.similar-scales-label[data-v-1bca942c]{color:var(--text-muted);font-size:11px}.similar-heat-cell[data-v-1bca942c]{color:var(--text-muted);opacity:.35;padding:1px 4px;border-radius:4px;font-size:11px;cursor:pointer;transition:background .12s}.similar-heat-cell[data-v-1bca942c]:hover{background:color-mix(in srgb,var(--text-muted) 15%,transparent);opacity:.6}.similar-legend[data-v-1bca942c]{display:flex;flex-wrap:wrap;gap:8px;font-size:10px;color:var(--text-muted);margin-bottom:4px}.similar-legend-item[data-v-1bca942c]{display:flex;align-items:center;gap:3px}.similar-legend-swatch[data-v-1bca942c]{display:inline-block;width:10px;height:10px;border-radius:2px;border:1px solid rgba(0,0,0,.15)}.similar-heat-cell.diff-0[data-v-1bca942c]{background:#9f9;opacity:1}.similar-heat-cell.diff-1[data-v-1bca942c]{background:#ff9;opacity:1}.similar-heat-cell.diff-2[data-v-1bca942c]{background:#fca;opacity:1}.similar-heat-cell.ref[data-v-1bca942c]{outline:1.5px solid var(--accent);outline-offset:1px;border-radius:4px;opacity:1}.midi-status[data-v-6a2870b0]{display:inline-flex;align-items:center;gap:7px;padding:5px 12px;border-radius:20px;border:1px solid var(--border);background:var(--surface);font-size:12px;color:var(--text-muted);cursor:pointer;transition:border-color .15s;-webkit-user-select:none;user-select:none}.midi-status[data-v-6a2870b0]:hover{border-color:var(--accent)}.dot[data-v-6a2870b0]{width:7px;height:7px;border-radius:50%;background:var(--text-muted);flex-shrink:0}.connected .dot[data-v-6a2870b0]{background:#4caf7d}.connected[data-v-6a2870b0]{color:#4caf7d;border-color:#4caf7d44}.unsupported .dot[data-v-6a2870b0]{background:#888}.denied .dot[data-v-6a2870b0]{background:var(--accent2)}.help-overlay[data-v-9fdb1dde]{position:fixed;top:0;right:0;bottom:0;left:0;background:#0009;display:flex;align-items:center;justify-content:center;z-index:1000;padding:24px}.help-modal[data-v-9fdb1dde]{background:var(--surface);border:1px solid var(--border);border-radius:12px;width:100%;max-width:680px;max-height:80vh;display:flex;flex-direction:column;overflow:hidden}.help-header[data-v-9fdb1dde]{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--border);flex-shrink:0}.help-header h2[data-v-9fdb1dde]{font-size:16px;font-weight:700;color:var(--accent)}.help-close[data-v-9fdb1dde]{background:none;border:none;color:var(--text-muted);font-size:16px;cursor:pointer;padding:4px 8px;border-radius:6px;line-height:1}.help-close[data-v-9fdb1dde]:hover{background:var(--surface2);color:var(--text)}.help-content[data-v-9fdb1dde]{overflow-y:auto;padding:20px;display:flex;flex-direction:column;gap:24px}.feature-heading[data-v-9fdb1dde]{font-size:13px;font-weight:700;color:var(--accent);margin-bottom:6px}.feature-body[data-v-9fdb1dde]{font-size:13px;color:var(--text-muted);line-height:1.6}.feature-body[data-v-9fdb1dde] p{margin:0 0 6px}.feature-body[data-v-9fdb1dde] ul{margin:4px 0 6px 16px;padding:0}.feature-body[data-v-9fdb1dde] li{margin-bottom:2px}.feature-body[data-v-9fdb1dde] strong{color:var(--text);font-weight:600}.recordings-panel[data-v-c739ed10]{border:1px solid var(--border);border-radius:10px;background:var(--surface);overflow:hidden;display:flex;flex-direction:column}.recordings-header[data-v-c739ed10]{padding:6px 10px 6px 14px;border-bottom:1px solid var(--border);background:var(--surface2);display:flex;align-items:center;justify-content:space-between;gap:8px}.recordings-title[data-v-c739ed10]{font-size:12px;font-weight:600;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;flex-shrink:0}.recordings-header-controls[data-v-c739ed10]{display:flex;align-items:center;gap:4px}.panel-playback-stop-btn[data-v-c739ed10]{padding:3px 10px;border-radius:12px;border:1px solid #e05555;background:#e05555;color:#fff;cursor:pointer;font-size:11px;transition:all .15s}.panel-playback-stop-btn[data-v-c739ed10]:hover{background:#c03030;border-color:#c03030}.panel-rec-btn[data-v-c739ed10]{padding:3px 10px;border-radius:12px;border:1px solid #e05555;background:color-mix(in srgb,#e05555 12%,transparent);color:#e05555;cursor:pointer;font-size:11px;transition:all .15s}.panel-rec-btn[data-v-c739ed10]:hover{background:#e05555;color:#fff}.panel-stop-btn[data-v-c739ed10]{padding:3px 10px;border-radius:12px;border:1px solid #e05555;background:#e05555;color:#fff;cursor:pointer;font-size:11px;animation:rec-pulse-c739ed10 1s ease-in-out infinite alternate}@keyframes rec-pulse-c739ed10{0%{opacity:1}to{opacity:.6}}.panel-rec-timer[data-v-c739ed10]{font-size:11px;font-variant-numeric:tabular-nums;color:#e05555;min-width:32px;text-align:center}.panel-loop-btn[data-v-c739ed10]{padding:3px 7px;border-radius:12px;border:1px solid var(--border);background:transparent;color:var(--text-muted);cursor:pointer;font-size:13px;transition:all .15s}.panel-loop-btn[data-v-c739ed10]:hover{border-color:var(--accent2);color:var(--accent2)}.panel-loop-btn.active[data-v-c739ed10]{border-color:var(--accent2);background:color-mix(in srgb,var(--accent2) 20%,transparent);color:var(--accent2)}.recordings-scroll[data-v-c739ed10]{max-height:220px;overflow-y:auto}.recordings-empty[data-v-c739ed10]{font-size:12px;color:var(--text-muted);padding:14px;margin:0;text-align:center}.recording-item[data-v-c739ed10]{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 14px;border-bottom:1px solid var(--border);transition:background .1s}.recording-item[data-v-c739ed10]:last-child{border-bottom:none}.recording-item[data-v-c739ed10]:hover{background:var(--surface2)}.recording-item.playing[data-v-c739ed10]{background:color-mix(in srgb,var(--accent2) 8%,var(--surface))}.recording-item.live[data-v-c739ed10]{background:color-mix(in srgb,#e05555 6%,var(--surface))}.rec-live-dot[data-v-c739ed10]{color:#e05555;margin-right:4px;animation:live-pulse-c739ed10 1s ease-in-out infinite alternate}@keyframes live-pulse-c739ed10{0%{opacity:1}to{opacity:.3}}.rec-info[data-v-c739ed10]{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}.rec-name[data-v-c739ed10]{font-size:13px;color:var(--text);font-weight:500;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;border-radius:3px;padding:1px 3px;margin:-1px -3px;transition:background .1s}.rec-name[data-v-c739ed10]:hover{background:color-mix(in srgb,var(--accent) 12%,transparent)}.rec-name-input[data-v-c739ed10]{font-size:13px;font-weight:500;color:var(--text);background:var(--surface2);border:1px solid var(--accent);border-radius:4px;padding:1px 6px;outline:none;width:100%}.rec-meta[data-v-c739ed10]{font-size:11px;color:var(--text-muted)}.rec-actions[data-v-c739ed10]{display:flex;gap:4px;flex-shrink:0}.rec-action-btn[data-v-c739ed10]{padding:3px 8px;border-radius:6px;border:1px solid var(--border);background:transparent;color:var(--text-muted);cursor:pointer;font-size:11px;transition:all .1s;white-space:nowrap}.rec-action-btn[data-v-c739ed10]:hover{border-color:var(--accent);color:var(--accent)}.rec-action-btn.play[data-v-c739ed10]{border-color:#3b8c3b;color:#3b8c3b;background:color-mix(in srgb,#3b8c3b 10%,transparent)}.rec-action-btn.play[data-v-c739ed10]:hover{background:#3b8c3b;color:#fff;border-color:#3b8c3b}.rec-action-btn.delete[data-v-c739ed10]:hover{border-color:#e05555;color:#e05555}.driver-active .driver-overlay,.driver-active *{pointer-events:none}.driver-active .driver-active-element,.driver-active .driver-active-element *,.driver-popover,.driver-popover *{pointer-events:auto}@keyframes animate-fade-in{0%{opacity:0}to{opacity:1}}.driver-fade .driver-overlay{animation:animate-fade-in .2s ease-in-out}.driver-fade .driver-popover{animation:animate-fade-in .2s}.driver-popover{all:unset;box-sizing:border-box;color:#2d2d2d;margin:0;padding:15px;border-radius:5px;min-width:250px;max-width:300px;box-shadow:0 1px 10px #0006;z-index:1000000000;position:fixed;top:0;right:0;background-color:#fff}.driver-popover *{font-family:Helvetica Neue,Inter,ui-sans-serif,"Apple Color Emoji",Helvetica,Arial,sans-serif}.driver-popover-title{font:19px/normal sans-serif;font-weight:700;display:block;position:relative;line-height:1.5;zoom:1;margin:0}.driver-popover-close-btn{all:unset;position:absolute;top:0;right:0;width:32px;height:28px;cursor:pointer;font-size:18px;font-weight:500;color:#d2d2d2;z-index:1;text-align:center;transition:color;transition-duration:.2s}.driver-popover-close-btn:hover,.driver-popover-close-btn:focus{color:#2d2d2d}.driver-popover-title[style*=block]+.driver-popover-description{margin-top:5px}.driver-popover-description{margin-bottom:0;font:14px/normal sans-serif;line-height:1.5;font-weight:400;zoom:1}.driver-popover-footer{margin-top:15px;text-align:right;zoom:1;display:flex;align-items:center;justify-content:space-between}.driver-popover-progress-text{font-size:13px;font-weight:400;color:#727272;zoom:1}.driver-popover-footer button{all:unset;display:inline-block;box-sizing:border-box;padding:3px 7px;text-decoration:none;text-shadow:1px 1px 0 #fff;background-color:#fff;color:#2d2d2d;font:12px/normal sans-serif;cursor:pointer;outline:0;zoom:1;line-height:1.3;border:1px solid #ccc;border-radius:3px}.driver-popover-footer .driver-popover-btn-disabled{opacity:.5;pointer-events:none}:not(body):has(>.driver-active-element){overflow:hidden!important}.driver-no-interaction,.driver-no-interaction *{pointer-events:none!important}.driver-popover-footer button:hover,.driver-popover-footer button:focus{background-color:#f7f7f7}.driver-popover-navigation-btns{display:flex;flex-grow:1;justify-content:flex-end}.driver-popover-navigation-btns button+button{margin-left:4px}.driver-popover-arrow{content:"";position:absolute;border:5px solid #fff}.driver-popover-arrow-side-over{display:none}.driver-popover-arrow-side-left{left:100%;border-right-color:transparent;border-bottom-color:transparent;border-top-color:transparent}.driver-popover-arrow-side-right{right:100%;border-left-color:transparent;border-bottom-color:transparent;border-top-color:transparent}.driver-popover-arrow-side-top{top:100%;border-right-color:transparent;border-bottom-color:transparent;border-left-color:transparent}.driver-popover-arrow-side-bottom{bottom:100%;border-left-color:transparent;border-top-color:transparent;border-right-color:transparent}.driver-popover-arrow-side-center{display:none}.driver-popover-arrow-side-left.driver-popover-arrow-align-start,.driver-popover-arrow-side-right.driver-popover-arrow-align-start{top:15px}.driver-popover-arrow-side-top.driver-popover-arrow-align-start,.driver-popover-arrow-side-bottom.driver-popover-arrow-align-start{left:15px}.driver-popover-arrow-align-end.driver-popover-arrow-side-left,.driver-popover-arrow-align-end.driver-popover-arrow-side-right{bottom:15px}.driver-popover-arrow-side-top.driver-popover-arrow-align-end,.driver-popover-arrow-side-bottom.driver-popover-arrow-align-end{right:15px}.driver-popover-arrow-side-left.driver-popover-arrow-align-center,.driver-popover-arrow-side-right.driver-popover-arrow-align-center{top:50%;margin-top:-5px}.driver-popover-arrow-side-top.driver-popover-arrow-align-center,.driver-popover-arrow-side-bottom.driver-popover-arrow-align-center{left:50%;margin-left:-5px}.driver-popover-arrow-none{display:none}.app[data-v-2325c67e]{height:100vh;display:flex;flex-direction:column;overflow:hidden}.app-header[data-v-2325c67e]{display:flex;align-items:center;justify-content:space-between;padding:16px 32px;border-bottom:1px solid var(--border);background:var(--surface);flex-wrap:wrap;gap:12px}.logo[data-v-2325c67e]{font-size:18px;font-weight:700;color:var(--accent);letter-spacing:-.5px}.header-right[data-v-2325c67e]{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.velocity-label[data-v-2325c67e]{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--text-muted);white-space:nowrap;min-width:32px}.velocity-slider[data-v-2325c67e]{width:72px;accent-color:var(--accent);cursor:pointer}.help-btn[data-v-2325c67e]{padding:5px 14px;border-radius:20px;border:1px solid var(--border);background:transparent;color:var(--text-muted);cursor:pointer;font-size:13px;transition:all .15s;text-decoration:none}.help-btn[data-v-2325c67e]:hover{border-color:var(--accent);color:var(--accent)}.nav-link[data-v-2325c67e]{display:inline-flex;align-items:center}.play-btn[data-v-2325c67e]{padding:5px 14px;border-radius:20px;border:1px solid var(--accent);background:color-mix(in srgb,var(--accent) 15%,transparent);color:var(--accent);cursor:pointer;font-size:13px;transition:all .15s}.play-btn[data-v-2325c67e]:hover:not(:disabled){background:var(--accent);color:#fff}.play-btn.arp[data-v-2325c67e]{border-color:var(--accent2);background:color-mix(in srgb,var(--accent2) 15%,transparent);color:var(--accent2)}.play-btn.arp[data-v-2325c67e]:hover:not(:disabled){background:var(--accent2);color:#fff}.play-btn[data-v-2325c67e]:disabled{opacity:.4;cursor:default}.clear-btn[data-v-2325c67e]{padding:5px 14px;border-radius:20px;border:1px solid var(--border);background:transparent;color:var(--text-muted);cursor:pointer;font-size:13px;transition:all .15s}.clear-btn[data-v-2325c67e]:hover:not(:disabled){border-color:var(--accent2);color:var(--accent2)}.clear-btn[data-v-2325c67e]:disabled{opacity:.4;cursor:default}.app-main[data-v-2325c67e]{flex:1;min-height:0;display:flex;gap:40px;padding:40px 32px;flex-wrap:wrap;justify-content:center;overflow-y:auto}.viz-section[data-v-2325c67e]{display:flex;flex-direction:column;align-items:center;gap:32px;zoom:1.1;align-self:flex-start}.chord-section[data-v-2325c67e]{display:flex;flex-direction:column;gap:16px;min-width:380px;max-width:460px;flex:1;min-height:0}.chord-display-wrapper[data-v-2325c67e]{flex:1;min-height:0;overflow-y:auto}.piano-bottom[data-v-2325c67e]{margin-top:auto}[data-testid=dual-octave-checkbox][data-v-2325c67e]{accent-color:var(--accent);width:14px;height:14px;cursor:pointer}.controls-panel[data-v-2325c67e]{display:flex;flex-direction:column;gap:8px;padding:12px 16px;background:var(--surface);border:1px solid var(--border);border-radius:10px}.control-row[data-v-2325c67e]{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:13px;color:var(--text-muted)}.disabled-row[data-v-2325c67e]{opacity:.4;pointer-events:none}.ctrl-select[data-v-2325c67e]{background:var(--surface2);border:1px solid var(--border);color:var(--text);border-radius:6px;padding:4px 8px;font-size:13px;cursor:pointer;min-width:180px}.patterns-page[data-v-9989fc6f]{min-height:100vh;display:flex;flex-direction:column;background:var(--bg);padding:24px 32px;gap:20px}.patterns-header[data-v-9989fc6f]{display:flex;align-items:baseline;gap:20px;flex-wrap:wrap}.back-link[data-v-9989fc6f]{color:var(--text-muted);text-decoration:none;font-size:13px;padding:4px 10px;border:1px solid var(--border);border-radius:16px;transition:all .15s;white-space:nowrap}.back-link[data-v-9989fc6f]:hover{color:var(--accent);border-color:var(--accent)}.patterns-title[data-v-9989fc6f]{font-size:22px;font-weight:700;color:var(--accent);margin:0}.patterns-subtitle[data-v-9989fc6f]{font-size:13px;color:var(--text-muted);margin:0}.patterns-tabs[data-v-9989fc6f]{display:flex;gap:6px;flex-wrap:wrap}.tab-btn[data-v-9989fc6f]{padding:6px 14px;border-radius:20px;border:1px solid var(--border);background:transparent;color:var(--text-muted);cursor:pointer;font-size:13px;display:flex;align-items:center;gap:6px;transition:all .15s}.tab-btn[data-v-9989fc6f]:hover{border-color:var(--accent);color:var(--accent)}.tab-btn.active[data-v-9989fc6f]{background:color-mix(in srgb,var(--accent) 15%,transparent);border-color:var(--accent);color:var(--accent);font-weight:600}.tab-count[data-v-9989fc6f]{font-size:11px;opacity:.7}.filter-row[data-v-9989fc6f]{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--text-muted);cursor:pointer;-webkit-user-select:none;user-select:none}.filter-row input[type=checkbox][data-v-9989fc6f]{accent-color:var(--accent);width:14px;height:14px;cursor:pointer}.filter-hint[data-v-9989fc6f]{font-size:11px;opacity:.6}.patterns-grid[data-v-9989fc6f]{display:flex;flex-wrap:wrap;gap:12px}.pattern-cell[data-v-9989fc6f]{display:flex;flex-direction:column;align-items:center;gap:4px;padding:8px;border:1px solid var(--border);border-radius:10px;background:var(--surface);cursor:pointer;transition:border-color .15s,box-shadow .15s;width:120px}.pattern-cell[data-v-9989fc6f]:hover{border-color:var(--accent);box-shadow:0 2px 8px color-mix(in srgb,var(--accent) 20%,transparent)}.pattern-label[data-v-9989fc6f]{font-size:10px;color:var(--text-muted);text-align:center;max-width:100%;display:flex;flex-direction:column;align-items:center;gap:1px;line-height:1.3}.pattern-label em[data-v-9989fc6f]{font-style:normal;font-size:9px;color:var(--accent);opacity:.85}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--bg: #0f0f13;--surface: #1a1a24;--surface2: #24243a;--accent: #7c6af7;--accent2: #f77c6a;--text: #e8e8f0;--text-muted: #7878a0;--border: #2e2e48;--note-active: #7c6af7;--note-root: #f77c6a}html,body{background:var(--bg);color:var(--text);font-family:Inter,system-ui,sans-serif;min-height:100vh}#app{min-height:100vh}