.chord-finder{padding:clamp(16px,2.5vw,24px)}.cf-modes{margin-bottom:18px;overflow-x:auto}.cf-modes .seg button{align-items:center;gap:6px;min-height:38px;display:inline-flex}.cf-roots{grid-template-columns:repeat(12,minmax(0,1fr));gap:6px;margin-bottom:16px;display:grid}.cf-root{font:inherit;border:1px solid var(--border-strong);background:var(--surface);min-height:46px;color:var(--ink);cursor:pointer;border-radius:10px;flex-direction:column;justify-content:center;align-items:center;padding:2px;font-size:.98rem;font-weight:700;line-height:1.05;display:flex}.cf-root small{color:var(--muted);font-size:.68rem;font-weight:600}.cf-root:hover{background:var(--surface-3)}.cf-root[aria-pressed=true]{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}.cf-root[aria-pressed=true] small{color:inherit;opacity:.85}.cf-controls{grid-template-columns:minmax(190px,1.3fr) minmax(150px,1fr) auto auto;align-items:end;gap:14px;display:grid}.cf-controls .seg button{min-height:34px}.cf-left{min-height:40px}.cf-result{margin-top:22px}.cf-head{flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:12px 24px;margin-bottom:16px;display:flex}.cf-name{color:var(--chord);margin:0;font-size:clamp(1.8rem,1.4rem + 1.6vw,2.4rem)}.cf-full{color:var(--ink-2);margin:2px 0 0}.cf-tones{flex-wrap:wrap;gap:6px;margin:0;padding:0;list-style:none;display:flex}.cf-tones li{border:1px solid var(--border);background:var(--surface-2);border-radius:10px;flex-direction:column;align-items:center;min-width:46px;padding:5px 8px;display:flex}.cf-int{color:var(--muted);letter-spacing:.03em;font-size:.7rem;font-weight:700}.cf-note{color:var(--ink);font-weight:700}.cf-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;display:grid}.cf-card{border:1px solid var(--border);border-radius:var(--r);background:var(--surface);flex-direction:column;gap:8px;padding:12px 14px;display:flex}.cf-card .chord-diagram{max-width:150px;margin:0 auto}.cf-card-top,.cf-card-foot{justify-content:space-between;align-items:center;gap:6px;display:flex}.cf-pos{color:var(--ink-2);font-size:.8rem;font-weight:650}.cf-badge{padding:2px 8px;font-size:.7rem}.cf-diff{font-size:.78rem;font-weight:700}.cf-diff.d-easy{color:var(--ok)}.cf-diff.d-medium{color:var(--warn)}.cf-diff.d-harder{color:var(--danger)}.cf-none{color:var(--ink-2);background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r);align-items:flex-start;gap:8px;padding:14px;display:flex}.cf-piano{justify-items:start;gap:12px;max-width:520px;display:grid}.cf-id-controls{flex-wrap:wrap;align-items:end;gap:12px 16px;margin-bottom:14px;display:flex}.cf-fret-text{flex:220px;max-width:320px}.cf-fret-text .input{font-family:var(--font-mono);letter-spacing:.08em}.fretboard-wrap{border:1px solid var(--border);border-radius:var(--r);background:var(--surface-2);-webkit-overflow-scrolling:touch;padding:10px 10px 6px;overflow-x:auto}.fretboard{gap:0;min-width:600px;display:grid}.fb-row{grid-template-columns:52px repeat(12,minmax(40px,1fr));align-items:stretch;display:grid}.fb-open{font:inherit;border:0;border-right:5px solid var(--ink-2);min-height:40px;color:var(--ink);cursor:pointer;background:0 0;border-radius:6px 0 0 6px;justify-content:space-between;align-items:center;gap:4px;padding:0 8px;display:flex}.fb-open:hover{background:var(--surface-3)}.fb-name{font-size:.85rem;font-weight:700}.fb-state{color:var(--muted);text-align:center;width:14px;font-weight:700}.fb-open.open .fb-state{color:var(--accent)}.fb-cell{border:0;border-right:2px solid var(--border-strong);cursor:pointer;background:0 0;min-height:40px;padding:0;position:relative}.fb-cell:before{content:"";border-top:1.5px solid var(--muted);opacity:.7;position:absolute;top:50%;left:0;right:0}.fb-cell span{border-radius:50%;width:24px;height:24px;margin:0 auto;display:block;position:relative}.fb-cell:hover span{background:var(--accent-soft);outline:1px solid var(--accent)}.fb-cell.on span{background:var(--ink)}.fb-numbers span{text-align:center;color:var(--muted);padding-top:4px;font-size:.72rem}.fb-numbers span.mark{color:var(--ink-2);font-weight:800}.cf-id-result{margin-top:18px}.cf-id-grid{grid-template-columns:170px 1fr;align-items:start;gap:20px 28px;display:grid}.cf-id-grid .eyebrow{margin:0}.cf-id-grid .cf-tones{margin:10px 0}.cf-alt{color:var(--ink-2);margin:0 0 6px}.cf-notes{font-size:.88rem}@media (width<=860px){.cf-roots{grid-template-columns:repeat(6,minmax(0,1fr))}.cf-controls{grid-template-columns:1fr 1fr}}@media (width<=520px){.cf-controls{grid-template-columns:1fr}.cf-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.cf-id-grid{grid-template-columns:1fr}.cf-id-diagram{max-width:170px}}.gcf-read[data-astro-cid-sfaykmsd]{grid-template-columns:minmax(0,1fr) 200px;align-items:center;gap:32px;display:grid}.gcf-example[data-astro-cid-sfaykmsd]{border:1px solid var(--border);border-radius:var(--r);background:var(--surface);text-align:center;margin:0;padding:18px}.gcf-example[data-astro-cid-sfaykmsd] figcaption[data-astro-cid-sfaykmsd]{color:var(--muted);margin-top:6px;font-size:.85rem}.gcf-types[data-astro-cid-sfaykmsd] th[data-astro-cid-sfaykmsd][scope=row]{text-transform:none;letter-spacing:0;color:var(--ink);white-space:nowrap;font-size:.92rem}.gcf-types[data-astro-cid-sfaykmsd] td[data-astro-cid-sfaykmsd]:nth-child(2) a[data-astro-cid-sfaykmsd]{font-weight:700}@media (width<=640px){.gcf-read[data-astro-cid-sfaykmsd]{grid-template-columns:1fr}.gcf-example[data-astro-cid-sfaykmsd]{max-width:220px}}
