:root{--nav-height: 60px;--bg-color: #18181B;--surface-color: #27272A;--surface-hover: #27272A;--text-primary: #E4E4E7;--text-secondary: #A1A1AA;--text-muted: #52525B;--primary-color: #EAB308;--border-color: #27272A;--spacing-xs: .25rem;--spacing-sm: .5rem;--spacing-md: 1rem;--spacing-lg: 1.5rem;--spacing-xl: 2rem;--radius-sm: .25rem;--radius-md: .5rem;--radius-lg: .75rem;--font-sans: "Inter", "system-ui", "-apple-system", "BlinkMacSystemFont", "Segoe UI", "Roboto", "Helvetica Neue", "Arial", sans-serif;--font-mono: "JetBrains Mono", "Fira Code", "Menlo", "Monaco", "Consolas", "Courier New", monospace}.clickable-chord{cursor:pointer;transition:transform .1s,color .2s;text-decoration:underline;text-decoration-color:transparent}.clickable-chord:hover{transform:translateY(-1px);text-decoration-color:var(--primary-color)}.modal-overlay{position:fixed;inset:0;background:#000c;display:flex;align-items:center;justify-content:center;z-index:1000;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.modal-content{background:var(--surface-color);border-radius:var(--radius-lg);max-width:500px;width:90%;max-height:90vh;overflow:auto;box-shadow:0 20px 60px #00000080;color:var(--text-primary)}.modal-header{display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-lg);border-bottom:1px solid var(--border-color)}.modal-header h2{margin:0;font-size:1.5rem}.modal-close{font-size:2rem;line-height:1;color:var(--text-secondary);background:none;border:none;cursor:pointer;padding:0;width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:background .2s}.modal-close:hover{background:var(--surface-hover);color:var(--text-primary)}.modal-body{padding:var(--spacing-xl)}.variation-selector{display:flex;gap:var(--spacing-sm);justify-content:center;margin-top:var(--spacing-lg);flex-wrap:wrap}.variation-selector button{padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--radius-sm);background:var(--surface-hover);color:var(--text-secondary);border:1px solid transparent;transition:all .2s}.variation-selector button:hover{border-color:var(--primary-color);color:var(--text-primary)}.variation-selector button.active{background:var(--primary-color);color:#000;font-weight:700}