.chord-diagram{width:100%;max-width:190px;height:auto;margin:0 auto;display:block;overflow:visible}.chord-diagram-fret{stroke:color-mix(in srgb, var(--ink) 40%, transparent);stroke-width:1.5px}.chord-diagram-nut{stroke:var(--ink);stroke-width:5px;stroke-linecap:round}.chord-diagram-string{stroke:color-mix(in srgb, var(--ink) 70%, transparent);stroke-width:1.4px}.chord-diagram-dot,.chord-diagram-barre{fill:var(--ink)}.chord-diagram-dot.is-root{fill:var(--ed-accent,var(--pink))}.chord-diagram-finger{fill:var(--paper);font-size:11px;font-weight:800}.chord-diagram-open{fill:none;stroke:var(--ink);stroke-width:1.6px}.chord-diagram-marker{fill:var(--ink);font-size:16px}.chord-diagram-base{fill:var(--ink-soft);font-size:12px;font-weight:800}.chord-diagram-note{fill:var(--ink-soft);font-size:8.5px;font-weight:600}.piano-keyboard{width:100%;max-width:680px;height:auto;display:block}.piano-white{fill:#fff;stroke:#9a8cab;stroke-width:1px}.piano-black{fill:#1d1528}.piano-white.is-on{fill:color-mix(in srgb, var(--ed-accent,var(--pink)) 38%, #fff)}.piano-black.is-on{fill:color-mix(in srgb, var(--ed-accent,var(--pink)) 70%, #1d1528)}.piano-white.is-root,.piano-black.is-root{fill:var(--ed-accent,var(--pink))}.piano-label{fill:#2a1b3d;font-size:10px;font-weight:800}.piano-label--black{fill:#fff;font-size:7px}.fretboard-wrap{padding-bottom:4px;overflow-x:auto}.fretboard{width:100%;min-width:620px;height:auto;display:block}.fretboard-string{stroke:color-mix(in srgb, var(--ink) 55%, transparent);stroke-width:1.3px}.fretboard-fret{stroke:color-mix(in srgb, var(--ink) 28%, transparent);stroke-width:2px}.fretboard-nut{stroke:var(--ink);stroke-width:5px}.fretboard-inlay{fill:color-mix(in srgb, var(--ink) 12%, transparent)}.fretboard-dot{fill:var(--paper);stroke:var(--ink);stroke-width:1.5px}.fretboard-dot.is-root{fill:var(--ed-accent,var(--pink));stroke:var(--ed-accent,var(--pink))}.fretboard-dot-label{fill:var(--ink);font-size:8px;font-weight:800}.fretboard-dot.is-root+.fretboard-dot-label{fill:#fff}.fretboard-number,.fretboard-string-label{fill:var(--ink-soft);font-size:11px;font-weight:700}.music-panel{border:1px solid color-mix(in srgb, var(--ink) 16%, transparent);border-top:6px solid var(--ed-accent,var(--pink));border-radius:var(--radius-card);background:var(--paper);gap:20px;margin-top:32px;padding:clamp(20px,4vw,36px);display:grid}.music-panel h2{margin:0;font-size:clamp(22px,3vw,28px)}.music-panel-head{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;display:flex}.music-notes,.prose .music-notes{flex-wrap:wrap;gap:8px;margin:0 0 16px;padding:0;list-style:none;display:flex}.music-notes li{border:1px solid color-mix(in srgb, var(--ink) 16%, transparent);border-radius:14px;justify-items:center;min-width:64px;padding:10px 12px;display:grid}.music-notes li.is-root{border-color:var(--ed-accent,var(--pink));background:color-mix(in srgb, var(--ed-accent,var(--pink)) 14%, transparent)}.music-notes strong{font-size:20px;line-height:1.2}.music-notes span{color:var(--ink-soft);font-size:12px}.voicing-grid{grid-template-columns:repeat(auto-fill,minmax(160px,200px));gap:16px;margin:0;padding:0;list-style:none;display:grid}.voicing-grid figure{border:1px solid color-mix(in srgb, var(--ink) 12%, transparent);text-align:center;border-radius:16px;gap:8px;margin:0;padding:14px 10px 12px;display:grid}.voicing-grid figcaption{color:var(--ink-soft);font-size:13px;line-height:1.3}.voicing-grid--compact{grid-template-columns:repeat(auto-fill,minmax(130px,170px))}@media (max-width:560px){.voicing-grid,.voicing-grid--compact{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}}.music-panel-split{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start;gap:clamp(20px,3vw,40px);display:grid}.music-panel-split .prose h3:first-child{margin-top:0}@media (max-width:1000px){.music-panel-split{grid-template-columns:minmax(0,1fr)}}.voicing-grid a{color:inherit;text-decoration:none}.voicing-grid a:hover figure,.voicing-grid a:focus-visible figure{border-color:var(--ed-accent,var(--pink))}.voicing-grid a strong{font-size:17px}.play-notes-button{gap:8px}.play-notes-button:disabled{opacity:.7;cursor:progress}.music-index th,.music-index td{white-space:nowrap}.music-index td a{font-weight:600}.music-chip-groups{gap:18px;display:grid}.music-chip-groups h3{margin:0 0 8px;font-size:16px}.fifths-tool{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:clamp(20px,4vw,48px);display:grid}.fifths-wheel{width:100%;max-width:460px;height:auto;margin:0 auto;display:block}.fifths-wheel button{cursor:pointer}.fifths-segment{fill:var(--paper);stroke:color-mix(in srgb, var(--ink) 30%, transparent);stroke-width:1.2px;transition:fill .15s}.fifths-segment.is-minor{fill:color-mix(in srgb, var(--ink) 6%, var(--paper))}.fifths-segment.is-neighbour{fill:color-mix(in srgb, var(--ed-accent,var(--pink)) 22%, var(--paper))}.fifths-segment.is-selected{fill:var(--ed-accent,var(--pink))}.fifths-key:hover .fifths-segment:not(.is-selected),.fifths-key:focus-visible .fifths-segment:not(.is-selected){fill:color-mix(in srgb, var(--ed-accent,var(--pink)) 35%, var(--paper))}.fifths-key{outline:none}.fifths-label{fill:var(--ink);pointer-events:none;font-size:15px;font-weight:800}.fifths-label.is-minor{font-size:12px;font-weight:700}.fifths-label.is-selected,.fifths-signature.is-selected{fill:#fff}.fifths-signature{fill:var(--ink-soft);pointer-events:none;font-size:10px;font-weight:700}.fifths-center{fill:var(--ink);font-size:13px;font-weight:700}.fifths-details{gap:16px;display:grid}.fifths-details h2{margin:0;font-size:clamp(26px,3.4vw,34px)}.fifths-details dl{grid-template-columns:auto minmax(0,1fr);gap:8px 16px;margin:0;display:grid}.fifths-details dt{color:var(--ink-soft);font-weight:600}.fifths-details dd{margin:0;font-weight:700}.fifths-chords,.prose .fifths-chords{flex-wrap:wrap;gap:8px;margin:0 0 12px;padding:0;list-style:none;display:flex}.fifths-chords a,.fifths-chords span{border:1px solid color-mix(in srgb, var(--ink) 16%, transparent);min-width:58px;color:var(--ink);border-radius:12px;justify-items:center;padding:8px 10px;text-decoration:none;display:grid}.fifths-chords a:hover,.fifths-chords a:focus-visible{border-color:var(--ed-accent,var(--pink))}.fifths-chords small{color:var(--ink-soft);font-size:11px}@media (max-width:860px){.fifths-tool{grid-template-columns:minmax(0,1fr)}}
