/* Guitar tuner, on top of musictools-v2.css tokens. */
.tuner-panel{display:grid;grid-template-columns:minmax(0,1fr);gap:18px}
.tuner-start{display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px}
.listen-button{min-width:190px;min-height:52px;font-weight:700;background:var(--spark);color:#000;border-color:var(--spark)}
.listen-button:hover{background:#000;color:var(--spark)}
.listen-button.is-active{background:#111;color:var(--ink);border-color:var(--spark)}
.privacy-short{flex-basis:100%;font-size:12px;color:var(--muted)}.privacy-short a{display:inline-block;padding:13px 0;margin:-13px 0}
.listen-heading{font:inherit;text-transform:none;letter-spacing:normal;margin:0}
.listen-state{font-size:13px;color:var(--muted)}.listen-state.is-live{color:var(--spark)}
.tuner-display{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:24px;align-items:center}
.dial{width:100%;max-width:560px;margin:0 auto}
.dial svg{display:block;width:100%;height:auto;font-family:ui-monospace,SFMono-Regular,Consolas,"Liberation Mono",monospace}
.dial-arc{fill:none;stroke:var(--muted);stroke-width:2}
.tick{stroke:var(--muted);stroke-width:1.5}.tick-major{stroke-width:2.5}.tick-center{stroke:var(--spark);stroke-width:3}
.dial-zone{fill:none;stroke:var(--spark);stroke-width:1.5}
.dial-label{fill:var(--muted);font-size:12px}.dial-symbol{fill:var(--muted);font-size:20px}
.needle-outline{stroke:#000;stroke-width:8;stroke-linecap:round}.needle-line{stroke:var(--ink);stroke-width:3.5;stroke-linecap:round}
.needle-hub{fill:var(--ink);stroke:#000;stroke-width:2}
.tuner-display[data-tune=in] .dial-zone{fill:var(--spark)}
.tuner-display[data-state=hold] .needle{opacity:.45}
.readout{min-width:0}
.note-name{font:900 clamp(64px,11vw,112px)/1 Impact,Haettenschweiler,"Arial Narrow","Arial Black",sans-serif;letter-spacing:-.01em;color:var(--ink)}
.tuner-display[data-tune=in] .note-name{color:var(--spark)}
.tuner-display[data-state=hold] .note-name,.tuner-display[data-state=hold] .guide{color:var(--muted)}
.note-detail{font-size:13px;color:var(--muted);margin-top:10px;min-height:21px}
.guide{font-size:18px;font-weight:700;margin-top:8px;min-height:29px}
.tuner-display[data-tune=in] .guide{color:var(--spark)}
.level{display:flex;align-items:center;gap:10px;margin-top:14px;font-size:12px;color:var(--muted)}
.level-bar{flex:1;max-width:220px;height:6px;border:1px solid #555;position:relative;overflow:hidden}
.level-bar span{position:absolute;inset:0 auto 0 0;width:0;background:var(--muted)}
.tuner-message{border-left:3px solid var(--spark);padding:8px 12px;font-size:13px;background:#111}
.tuner-message[data-kind=error],.tuner-message[data-kind=blocked]{border-left-color:#fff}
.strings{border-top:1px solid var(--line);padding-top:16px}
.strings-help{font-size:12px;color:var(--muted);margin-bottom:10px}
.string-row{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;max-width:640px}
.string-cell{display:grid;gap:6px;min-width:0}
.string-chip{display:flex;flex-direction:column;align-items:center;gap:2px;padding:8px 2px;min-height:70px;position:relative}
.string-chip strong{font-size:17px}.string-number{font-size:11px;color:var(--muted)}
.string-chip[aria-pressed=true] .string-number{color:#000}
.string-chip.is-target{border-color:var(--spark);box-shadow:inset 0 0 0 1px var(--spark)}
.string-check{position:absolute;top:3px;right:6px;font-size:12px;color:var(--spark)}
.string-chip[aria-pressed=true] .string-check{color:#000}
.string-play{padding:4px 0;min-height:44px;font-size:13px;color:var(--muted)}
.a4-row{display:flex;gap:8px}.a4-row input{flex:1;min-width:0}.a4-row button{flex:none}
.privacy{font-size:13px;color:var(--muted);border:1px solid var(--line);padding:14px 16px;margin:0 0 22px}
.privacy strong{color:var(--ink)}
@media(max-width:800px){.tuner-display{grid-template-columns:1fr;gap:12px}.readout{text-align:center}.level{justify-content:center}.dial{max-width:440px}}
@media(max-width:480px){.listen-heading,.listen-button{width:100%}.tuner-start{gap:8px}.string-row{gap:5px}.string-chip{padding:8px 0}.string-chip strong{font-size:15px}.guide{font-size:16px}}
