.circle-of-thirds-container.svelte-b1shy7{display:flex;flex-direction:column;height:100%;padding:var(--space-sm)}.svg-container.svelte-b1shy7{flex:1;display:flex;align-items:center;justify-content:center;max-width:100%;aspect-ratio:1}svg.svelte-b1shy7{width:100%;height:100%;min-width:300px;min-height:300px;max-width:500px;max-height:500px}@media (max-width: 640px){svg.svelte-b1shy7{min-width:250px;min-height:250px}}.note-group.svelte-b1shy7{cursor:pointer;transition:all .2s ease}.note-circle.svelte-b1shy7{transition:all .2s ease}.note-group.svelte-b1shy7:hover .note-circle:where(.svelte-b1shy7){fill:var(--bg-tertiary);stroke:var(--accent-primary);stroke-width:4}.note-circle.selected.svelte-b1shy7{fill:var(--accent-primary);stroke:var(--accent-primary);stroke-width:4}.note-label.svelte-b1shy7{pointer-events:none;font-weight:600;font-size:18px;fill:var(--text-primary);transition:all .2s ease}.note-label.selected-text.svelte-b1shy7{fill:#fff;font-weight:700}.interval-symbol.svelte-b1shy7{pointer-events:none;font-weight:700;font-size:16px;fill:var(--text-secondary);-webkit-user-select:none;user-select:none}.interval-symbol.major.svelte-b1shy7{fill:#22c55e}.interval-symbol.minor.svelte-b1shy7{fill:#3b82f6}.treble-clef-center.svelte-b1shy7{pointer-events:none}.treble-clef-center.svelte-b1shy7 image:where(.svelte-b1shy7){filter:brightness(0) invert(.5);opacity:.7}.note-group.svelte-b1shy7:focus{outline:none}.note-group.svelte-b1shy7:focus .note-circle:where(.svelte-b1shy7){stroke:var(--accent-primary);stroke-width:4}@media (max-width: 500px){.note-label.svelte-b1shy7{font-size:22px}.interval-symbol.svelte-b1shy7{font-size:20px}}.triads-container.svelte-11nrf6y{display:flex;flex-direction:column;height:100%;padding:var(--space-md);align-items:center;justify-content:center}.key-selector.svelte-11nrf6y{display:flex;align-items:center;gap:var(--space-sm);margin-bottom:var(--space-md);padding:var(--space-sm);background:var(--bg-secondary);border-radius:var(--radius-md);border:1px solid var(--border-primary)}.key-selector.svelte-11nrf6y label:where(.svelte-11nrf6y){font-weight:600;color:var(--text-primary);font-size:.9rem}.key-selector.svelte-11nrf6y select:where(.svelte-11nrf6y){padding:var(--space-xs) var(--space-sm);background:var(--bg-primary);border:1px solid var(--border-primary);border-radius:var(--radius-sm);color:var(--text-primary);font-size:.9rem;font-weight:500;cursor:pointer;transition:all .2s ease}.key-selector.svelte-11nrf6y select:where(.svelte-11nrf6y):hover{border-color:var(--accent-primary)}.key-selector.svelte-11nrf6y select:where(.svelte-11nrf6y):focus{outline:none;border-color:var(--accent-primary);box-shadow:0 0 0 2px #22c55e33}.triads-grid.svelte-11nrf6y{display:flex;gap:var(--space-sm);flex-wrap:wrap;justify-content:center;align-items:center;max-width:100%}.triad-rectangle.svelte-11nrf6y{display:flex;flex-direction:column;align-items:center;justify-content:space-between;background:var(--bg-secondary);border:2px solid var(--border-primary);border-radius:var(--radius-md);padding:var(--space-sm);width:90px;height:200px;cursor:pointer;transition:all .2s ease;position:relative}.triad-rectangle.svelte-11nrf6y:hover{background:var(--bg-tertiary);border-color:var(--accent-primary);transform:translateY(-2px);box-shadow:0 4px 12px #0000001a}.roman-numeral.svelte-11nrf6y{font-size:18px;font-weight:700;text-align:center;margin-bottom:var(--space-xs)}.note-circles.svelte-11nrf6y{display:flex;flex-direction:column;gap:var(--space-xs);flex:1;justify-content:center;align-items:center}.note-circle.svelte-11nrf6y{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;background:var(--bg-primary);border:2px solid var(--border-primary);transition:all .2s ease}.triad-rectangle.svelte-11nrf6y:hover .note-circle:where(.svelte-11nrf6y){background:var(--bg-secondary);border-width:3px}.note-label.svelte-11nrf6y{font-size:14px;font-weight:600;color:var(--text-primary);pointer-events:none}.quality-label.svelte-11nrf6y{font-size:12px;font-weight:500;text-align:center;margin-top:var(--space-xs);opacity:.8}.triad-rectangle.svelte-11nrf6y:focus{outline:none;border-color:var(--accent-primary);box-shadow:0 0 0 3px #22c55e33}@media (max-width: 768px){.triads-grid.svelte-11nrf6y{gap:var(--space-xs)}.triad-rectangle.svelte-11nrf6y{width:75px;height:170px;padding:var(--space-xs)}.note-circle.svelte-11nrf6y{width:30px;height:30px}.note-label.svelte-11nrf6y{font-size:12px}.roman-numeral.svelte-11nrf6y{font-size:16px}.quality-label.svelte-11nrf6y{font-size:10px}}@media (max-width: 640px){.triads-grid.svelte-11nrf6y{flex-wrap:wrap;justify-content:center;max-width:100%}.triad-rectangle.svelte-11nrf6y{width:70px;height:150px}.note-circle.svelte-11nrf6y{width:28px;height:28px}.note-label.svelte-11nrf6y{font-size:13px}.roman-numeral.svelte-11nrf6y{font-size:14px}}.circle-visualization-container.svelte-he6hyr{display:flex;flex-direction:column;height:100%}.tab-header.svelte-he6hyr{flex-shrink:0;display:flex;border-bottom:1px solid var(--border-primary)}.tab-button.svelte-he6hyr{display:flex;align-items:center;gap:var(--space-xs);padding:var(--space-sm) var(--space-md);background:none;border:none;color:var(--text-secondary);cursor:pointer;transition:all .2s ease;font-size:1rem;font-weight:500;font-family:inherit;border-bottom:2px solid transparent}.tab-button.svelte-he6hyr:hover{background:var(--bg-secondary);color:var(--text-primary)}.tab-button.active.svelte-he6hyr{color:var(--accent-primary);border-bottom-color:var(--accent-primary);background:var(--bg-secondary)}.tab-title.svelte-he6hyr{font-weight:600}.tab-content.svelte-he6hyr{flex:1;display:flex;flex-direction:column;min-height:0}@media (max-width: 640px){.tab-button.svelte-he6hyr{padding:var(--space-xs) var(--space-sm);font-size:.8125rem}.tab-title.svelte-he6hyr{display:none}}@media (max-width: 480px){.tab-button.svelte-he6hyr{padding:var(--space-xs)}}.progression-sidebar.svelte-ufgvlj{background:var(--bg-secondary);border-radius:var(--radius-md);border:1px solid var(--border-secondary);overflow:hidden;min-width:160px;height:100%;display:flex;flex-direction:column}.sidebar-header.svelte-ufgvlj{display:flex;align-items:center;justify-content:space-between;padding:var(--space-xs) var(--space-sm);background:var(--bg-tertiary);border-bottom:1px solid var(--border-secondary)}.sidebar-title.svelte-ufgvlj{font-size:.75rem;font-weight:600;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.5px}.clear-btn.svelte-ufgvlj{display:flex;align-items:center;justify-content:center;width:22px;height:22px;border:none;background:transparent;color:var(--text-muted);cursor:pointer;border-radius:var(--radius-sm);transition:all .15s ease}.clear-btn.svelte-ufgvlj:hover:not(:disabled){color:#ef4444;background:#ef44441a}.clear-btn.svelte-ufgvlj:disabled{opacity:.5;cursor:not-allowed}.chord-list.svelte-ufgvlj{padding:var(--space-xs);display:flex;flex-direction:column;gap:4px;flex:1;overflow-y:auto;min-height:0}.empty-state.svelte-ufgvlj{padding:var(--space-sm);text-align:center;color:var(--text-muted);font-size:.75rem;line-height:1.4}.chord-item.svelte-ufgvlj{display:flex;flex-direction:column;gap:2px;padding:4px 8px;background:var(--bg-primary);border-radius:var(--radius-sm);border:1px solid var(--border-primary)}.chord-main-row.svelte-ufgvlj{display:flex;align-items:center;gap:var(--space-xs)}.chord-number.svelte-ufgvlj{font-size:.75rem;font-weight:500;color:var(--text-muted);min-width:18px}.chord-name.svelte-ufgvlj{flex:1;font-size:.875rem;font-weight:600;color:var(--text-primary)}.chord-name.minor.svelte-ufgvlj{color:var(--text-secondary)}.chord-actions.svelte-ufgvlj{display:flex;align-items:center;gap:2px}.chord-beats-row.svelte-ufgvlj{display:flex;align-items:center;gap:4px;padding-left:18px}.beats-btn.svelte-ufgvlj{display:flex;align-items:center;justify-content:center;width:16px;height:16px;border:none;background:var(--bg-secondary);color:var(--text-muted);cursor:pointer;border-radius:var(--radius-xs);transition:all .15s ease}.beats-btn.svelte-ufgvlj:hover:not(:disabled){color:var(--text-primary);background:var(--bg-tertiary)}.beats-btn.svelte-ufgvlj:disabled{opacity:.4;cursor:not-allowed}.beats-value.svelte-ufgvlj{font-size:.6875rem;font-weight:600;color:var(--text-primary);min-width:14px;text-align:center}.beats-label.svelte-ufgvlj{font-size:.625rem;color:var(--text-muted)}.action-btn.svelte-ufgvlj{display:flex;align-items:center;justify-content:center;width:20px;height:20px;border:none;background:transparent;color:var(--text-muted);cursor:pointer;border-radius:var(--radius-xs);transition:all .15s ease}.action-btn.svelte-ufgvlj:hover:not(:disabled){color:var(--text-primary);background:var(--bg-tertiary)}.action-btn.remove.svelte-ufgvlj:hover:not(:disabled){color:#ef4444;background:#ef44441a}.action-btn.svelte-ufgvlj:disabled{opacity:.5;cursor:not-allowed}.action-placeholder.svelte-ufgvlj{width:20px;height:20px}.chord-list.svelte-ufgvlj::-webkit-scrollbar{width:6px}.chord-list.svelte-ufgvlj::-webkit-scrollbar-track{background:var(--bg-tertiary);border-radius:3px}.chord-list.svelte-ufgvlj::-webkit-scrollbar-thumb{background:var(--border-secondary);border-radius:3px}.chord-list.svelte-ufgvlj::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}.sidebar-footer.svelte-ufgvlj{display:flex;justify-content:flex-end;padding:var(--space-xs) var(--space-sm);border-top:1px solid var(--border-secondary);background:var(--bg-tertiary)}.use-btn.svelte-ufgvlj{padding:6px 16px;border-radius:var(--radius-sm);border:none;background:#22c55e;color:#fff;font-size:.75rem;font-weight:600;cursor:pointer;transition:all .15s ease}.use-btn.svelte-ufgvlj:hover:not(:disabled){background:#16a34a}.use-btn.svelte-ufgvlj:disabled{opacity:.6;cursor:not-allowed}.drawer.svelte-m5djt2{position:fixed;bottom:0;left:0;right:0;background:var(--bg-primary);border-radius:var(--radius-lg) var(--radius-lg) 0 0;box-shadow:0 -4px 20px #00000026;transform:translateY(calc(100% - var(--collapsed-height)));transition:transform .3s cubic-bezier(.32,.72,0,1);z-index:1001;display:flex;flex-direction:column;max-height:80vh;padding-bottom:env(safe-area-inset-bottom,0)}.drawer.expanded.svelte-m5djt2{transform:translateY(calc(100% - var(--expanded-height)))}.handle.svelte-m5djt2{flex-shrink:0;cursor:pointer;touch-action:none;-webkit-user-select:none;user-select:none}.handle-bar.svelte-m5djt2{width:40px;height:4px;background:var(--border-secondary);border-radius:2px;margin:12px auto 8px}.preview.svelte-m5djt2{padding:0 var(--space-md) var(--space-sm);font-size:.875rem;font-weight:500;color:var(--text-secondary);text-align:center}.content.svelte-m5djt2{flex:1;overflow-y:auto;padding:0 var(--space-md) var(--space-md);min-height:0}.handle.svelte-m5djt2:active .handle-bar:where(.svelte-m5djt2){background:var(--text-muted)}