.chord-chart.svelte-n5yy72{margin:1.5rem 0;max-width:100%;display:flex;flex-direction:column;align-items:center}.chord-container.svelte-n5yy72{display:inline-flex;flex-direction:column;position:relative;background:#ffffffe0;backdrop-filter:blur(12px) saturate(150%);-webkit-backdrop-filter:blur(12px) saturate(150%);border:1px solid rgba(255,255,255,.4);border-radius:1rem;box-shadow:0 8px 32px #0000001f,0 2px 8px #00000014,inset 0 1px #fff9;padding:1rem 1.5rem;min-height:4rem}.chord-grid.desktop.svelte-n5yy72{display:flex;flex-wrap:nowrap;justify-content:center;align-items:center;gap:.25rem .5rem}.chord-grid-mobile.mobile.svelte-n5yy72{display:none}@media(max-width:639px){.chord-grid.desktop.svelte-n5yy72{display:none}.chord-grid-mobile.mobile.svelte-n5yy72{display:flex;flex-direction:column;gap:.75rem}}.chord-row.svelte-n5yy72{display:flex;justify-content:center;align-items:center;gap:.25rem .5rem;flex-wrap:nowrap}.chord-pair.svelte-n5yy72{display:flex;flex-direction:column;align-items:center;gap:.2rem;min-width:2.75rem;padding:.375rem .5rem;border-radius:.5rem;transition:all .15s ease;background:none;border:none;font:inherit}.chord-pair.playable.svelte-n5yy72{cursor:pointer}.chord-pair.playable.svelte-n5yy72:hover{background:#6366f114;transform:translateY(-1px)}.chord-pair.playable.svelte-n5yy72:active{transform:translateY(0);background:#6366f126}.chord-pair.svelte-n5yy72:disabled{cursor:default}.chord-pair.active.svelte-n5yy72,.chord-pair.active.svelte-n5yy72:hover{background:#6366f138;transform:translateY(-1px);box-shadow:0 0 0 1px #6366f173,0 4px 14px #6366f147}.chord-pair.active.svelte-n5yy72 .numeral:where(.svelte-n5yy72),.chord-pair.active.svelte-n5yy72 .chord:where(.svelte-n5yy72){color:#4338ca}.numeral.svelte-n5yy72{font-family:ui-monospace,SFMono-Regular,SF Mono,Menlo,Consolas,monospace;font-size:.8125rem;font-weight:600;color:#6366f1;letter-spacing:.025em;white-space:nowrap;line-height:1.2}.chord.svelte-n5yy72{font-size:1.125rem;font-weight:700;color:#1f2937;white-space:nowrap;letter-spacing:-.01em;line-height:1.2}.separator.svelte-n5yy72{color:#00000040;font-weight:300;align-self:flex-end;padding-bottom:.25rem;-webkit-user-select:none;user-select:none}figcaption.svelte-n5yy72{text-align:center;font-size:.875rem;color:color-mix(in oklab,var(--color-base-content) 60%,transparent);font-style:italic;margin-top:.75rem}.play-progression.svelte-n5yy72{align-self:center;margin-top:.75rem;display:inline-flex;align-items:center;gap:.4rem;padding:.3rem .75rem;border-radius:9999px;background:#6366f114;border:1px solid rgba(99,102,241,.35);color:#6366f1;font-size:.75rem;font-weight:600;letter-spacing:.01em;line-height:1;cursor:pointer;transition:background-color .15s ease,border-color .15s ease,transform .15s ease}.play-progression.svelte-n5yy72:hover{background:#6366f129;border-color:#6366f18c;transform:translateY(-1px)}.play-progression.svelte-n5yy72:active{transform:translateY(0);background:#6366f138}.play-progression.svelte-n5yy72:focus-visible{outline:2px solid #6366f1;outline-offset:2px}.play-progression.svelte-n5yy72:disabled{opacity:.5;cursor:progress}.play-progression.svelte-n5yy72:disabled:hover{background:#6366f114;border-color:#6366f159;transform:none}.play-progression.is-playing.svelte-n5yy72{background:#6366f138;border-color:#6366f199}.play-icon.svelte-n5yy72{width:.625rem;height:.625rem;flex-shrink:0}.player-caption.svelte-n5yy72{margin-top:.625rem;max-width:24rem;text-align:center;font-size:.8125rem;font-weight:500;line-height:1.4;color:#475569}@media(prefers-reduced-motion:reduce){.play-progression.svelte-n5yy72{transition:none}.play-progression.svelte-n5yy72:hover{transform:none}}.chord-chart.compact.svelte-n5yy72 .chord-container:where(.svelte-n5yy72){padding:.75rem 1.25rem;min-height:3.5rem}.chord-chart.compact.svelte-n5yy72 .chord-pair:where(.svelte-n5yy72){min-width:2.5rem;padding:.25rem .375rem}.chord-chart.compact.svelte-n5yy72 .numeral:where(.svelte-n5yy72){font-size:.75rem}.chord-chart.compact.svelte-n5yy72 .chord:where(.svelte-n5yy72){font-size:1rem}@media(max-width:639px){.chord-container.svelte-n5yy72{padding:.875rem 1rem;border-radius:.75rem}.chord-pair.svelte-n5yy72{min-width:2.25rem;padding:.25rem .375rem}.numeral.svelte-n5yy72{font-size:.6875rem}.chord.svelte-n5yy72{font-size:.9375rem}.separator.svelte-n5yy72{font-size:.875rem}}@media(prefers-reduced-motion:reduce){.chord-pair.svelte-n5yy72{transition:none}.chord-pair.svelte-n5yy72:hover{transform:none}}@supports not (backdrop-filter: blur(12px)){.chord-container.svelte-n5yy72{background:#fffffff5;box-shadow:0 4px 16px #0000001a,0 2px 4px #0000000d}}.playback-diagram.svelte-n5yy72{position:absolute;left:50%;transform:translate(-50%);z-index:50;pointer-events:none}.playback-diagram[data-position=above].svelte-n5yy72{bottom:calc(100% + .75rem)}.playback-diagram[data-position=below].svelte-n5yy72{top:calc(100% + .75rem)}.diagram-card.svelte-n5yy72{background:linear-gradient(145deg,#1e1e2e,#2a2a3e);border:1px solid rgba(255,255,255,.15);border-radius:.5rem;padding:.5rem .75rem;box-shadow:0 10px 40px #00000080,inset 0 0 0 1px #ffffff0d;color:#e0e0e0}.diagram-chord-name.svelte-n5yy72{font-size:1rem;font-weight:600;color:#fff;text-align:center;margin-bottom:.25rem;line-height:1}.diagram-svg.svelte-n5yy72{display:flex;justify-content:center}