.tuner-widget{--t-in-tune: #059669;--t-sharp: var(--accent);--t-flat: color-mix(in srgb, var(--accent) 60%, #2563eb);width:100%;max-width:460px;margin-inline:auto;color:var(--foreground)}.tuner-article{width:100%;max-width:68ch;margin:clamp(3rem,8vw,5rem) auto 0;border-top:1px solid var(--border);padding-top:clamp(2rem,5vw,3rem)}.tuner-equation{margin:1.25rem 0;border:1px solid var(--border);border-inline-start:3px solid var(--accent);border-radius:var(--radius);background:var(--surface-soft);padding:.9rem 1rem;overflow-x:auto}.tuner-equation math{min-width:max-content;margin-inline:auto;color:var(--heading);font-size:clamp(1.05rem,3vw,1.25rem)}.equation-copy-button{display:block;margin:0 0 .5rem auto}html[data-theme=dark] .tuner-widget{--t-in-tune: #34d399}.tuner-widget *,.tuner-widget *:before,.tuner-widget *:after{margin:0;padding:0;box-sizing:border-box}.tuner-widget .tuning-toggle{display:flex;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface-soft);padding:3px;gap:3px;margin-bottom:18px}.tuner-widget .tuning-btn{flex:1;padding:8px 6px;border:none;border-radius:var(--radius);background:transparent;color:var(--text-muted);cursor:pointer;font-size:.8rem;font-weight:600;letter-spacing:.5px;transition:background .15s,color .15s}.tuner-widget .tuning-btn.active{background:var(--accent);color:var(--on-accent)}.tuner-widget .display{border:1px solid var(--border);border-radius:var(--radius);background:var(--surface-soft);padding:24px 20px 16px;margin-bottom:14px;text-align:center}.tuner-widget .note-big{font-size:5rem;font-weight:700;line-height:1;letter-spacing:-2px;color:var(--text-muted);transition:color .15s,opacity .15s}.tuner-widget .note-big sup{font-size:1.8rem;font-weight:600;vertical-align:super;letter-spacing:0}.tuner-widget .note-big.in-tune{color:var(--t-in-tune);opacity:1}.tuner-widget .note-big.sharp{color:var(--t-sharp);opacity:1}.tuner-widget .note-big.flat{color:var(--t-flat);opacity:1}.tuner-widget .freq-label{font-size:.8rem;color:var(--text-muted);margin:4px 0 18px;min-height:18px}.tuner-widget .meter-wrap{position:relative;height:48px;margin-bottom:4px}.tuner-widget .meter-rail{position:absolute;top:50%;left:0;right:0;height:2px;background:var(--border);transform:translateY(-50%)}.tuner-widget .meter-ok{position:absolute;top:50%;left:44%;width:12%;height:4px;background:var(--t-in-tune);transform:translateY(-50%);opacity:.5}.tuner-widget .meter-center-line{position:absolute;top:8px;bottom:8px;left:50%;width:1px;background:var(--border);transform:translate(-50%)}.tuner-widget .needle{position:absolute;top:6px;bottom:6px;left:50%;width:2px;background:var(--accent);transform:translate(-50%);transition:left .08s ease-out,background .15s}.tuner-widget .needle.in-tune{background:var(--t-in-tune)}.tuner-widget .meter-row{display:flex;justify-content:space-between;color:var(--text-muted);font-size:.68rem;margin-bottom:6px;padding:0 2px}.tuner-widget .cents-label{font-size:.78rem;color:var(--text-muted);min-height:18px}.tuner-widget .strings{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:16px}.tuner-widget .string-card{border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);padding:12px 4px 10px;text-align:center;transition:border-color .15s,background .15s}.tuner-widget .string-card.nearest{border-color:var(--accent);border-style:solid;background:color-mix(in srgb,var(--accent) 8%,transparent)}.tuner-widget .string-card.in-tune{border-color:var(--t-in-tune);border-style:solid;background:color-mix(in srgb,var(--t-in-tune) 8%,transparent)}.tuner-widget .s-note{font-size:1.6rem;font-weight:700;color:var(--foreground);line-height:1.1}.tuner-widget .s-note sup{font-size:.8rem;font-weight:500;vertical-align:super}.tuner-widget .s-freq{font-size:.65rem;color:var(--text-muted);margin-top:3px}.tuner-widget .mic-btn{width:100%;padding:12px;border:1px solid var(--accent);border-radius:var(--radius);background:var(--accent);color:var(--on-accent);font-size:.9rem;font-weight:700;letter-spacing:2px;text-transform:uppercase;cursor:pointer;transition:background .15s,color .15s}.tuner-widget .mic-btn:hover{background:var(--accent-hover)}.tuner-widget .mic-btn.on{background:var(--accent);color:var(--on-accent);border-style:solid}.tuner-widget .mic-btn.on:hover{opacity:.85}.tuner-widget .status-line{text-align:center;font-size:.72rem;color:var(--text-muted);margin-top:8px;min-height:18px}.tuner-widget .status-line.err{color:var(--accent);opacity:1}
