:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#0b0d12;--panel:#151823;--panel-border:#262c3d;--text:#e7e9f0;--text-dim:#9aa1b5;--accent:#7c9bff;--accent-2:#f472b6;--danger:#f97066;--logo:#b48bff}*{box-sizing:border-box}html,body{background:var(--bg);height:100%;color:var(--text);margin:0;padding:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;overflow:hidden}.app{flex-direction:column;height:100dvh;display:flex}.topbar{background:var(--panel);border-bottom:1px solid var(--panel-border);flex-wrap:wrap;flex:none;justify-content:space-between;align-items:center;gap:.75rem;padding:.75rem 1.15rem;display:flex}.brand{align-items:center;gap:.5rem;display:flex}.logo-mark{object-fit:contain;mix-blend-mode:screen;width:auto;height:44px}.brand-text{flex-direction:column;line-height:1.1;display:flex}.brand-name{letter-spacing:-.01em;font-size:1.05rem;font-weight:700}.brand-tagline{letter-spacing:.16em;text-transform:uppercase;color:var(--text-dim);font-size:.62rem}.controls{flex-wrap:wrap;align-items:center;gap:.9rem;display:flex}.controls label{color:var(--text-dim);white-space:nowrap;align-items:center;gap:.4rem;font-size:.82rem;display:flex}.controls select{background:var(--bg);color:var(--text);border:1px solid var(--panel-border);border-radius:.4rem;padding:.25rem .45rem;font-size:.9rem}button{background:var(--accent);color:#0b0d12;cursor:pointer;border:none;border-radius:.5rem;padding:.4rem 1rem;font-size:.9rem;font-weight:600}button:disabled{opacity:.6;cursor:default}button.secondary{color:var(--text);border:1px solid var(--panel-border);background:0 0}.camera-wrap{background:#000;flex:1;min-height:0;position:relative;overflow:hidden}.camera-video,.camera-canvas{object-fit:cover;width:100%;height:100%;position:absolute;inset:0;transform:scaleX(-1)}.wave-canvas{pointer-events:none;width:100%;height:100%;position:absolute;inset:0}.camera-placeholder{color:var(--text-dim);text-align:center;pointer-events:none;flex-direction:column;justify-content:center;align-items:center;gap:.6rem;padding:1rem;font-size:1rem;display:flex;position:absolute;inset:0}.placeholder-tagline{letter-spacing:.22em;text-transform:uppercase;color:var(--logo);text-shadow:0 0 12px #b48bff8c,0 0 34px #b48bff4d;font-size:clamp(1.4rem,4.5vw,2.6rem);font-weight:300}.placeholder-prompt{font-size:.95rem}.placeholder-start{pointer-events:auto;font:inherit;color:var(--accent);text-underline-offset:3px;cursor:pointer;background:0 0;border:none;padding:0;font-weight:700;text-decoration:underline}.placeholder-start:hover,.placeholder-start:focus-visible{color:var(--text)}.error-overlay{border:1px solid var(--danger);color:var(--danger);background:#0b0d12d9;border-radius:.5rem;margin:0;padding:.4rem .8rem;font-size:.85rem;position:absolute;top:.75rem;left:50%;transform:translate(-50%)}.hud-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);border:1px solid var(--panel-border);background:#0b0d12b8;border-radius:.6rem;grid-template-columns:repeat(2,minmax(90px,1fr));gap:.15rem 1rem;max-width:min(90vw,420px);padding:.6rem .8rem;font-size:.78rem;display:grid;position:absolute;bottom:.75rem;left:.75rem}.hud-overlay dt{color:var(--text-dim);text-transform:uppercase;letter-spacing:.04em;margin:0;font-size:.68rem}.hud-overlay dd{margin:0 0 .25rem;font-weight:600}.legend-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);border:1px solid var(--panel-border);background:#0b0d12b8;border-radius:.6rem;max-width:min(90vw,340px);padding:.4rem .7rem;font-size:.8rem;position:absolute;bottom:.75rem;right:.75rem}.legend-overlay summary{cursor:pointer;color:var(--text-dim);padding:.2rem 0;font-size:.78rem}.legend-overlay ul{color:var(--text-dim);margin:.3rem 0;padding-left:1.1rem;line-height:1.5}.song-tutorial{background:var(--panel);border-top:1px solid var(--panel-border);flex:none;grid-template-columns:minmax(0,auto) minmax(0,1fr);grid-template-areas:"now lyric""now timeline""now controls";align-items:center;gap:.35rem 1.1rem;padding:.6rem 1rem;display:grid}.song-now{grid-area:now;align-items:center;gap:.9rem;display:flex}.song-now-chord{flex-direction:column;min-width:8.5rem;display:flex}.song-chord-name{letter-spacing:-.02em;font-size:1.7rem;font-weight:700;line-height:1.05}.song-chord-degree{text-transform:uppercase;letter-spacing:.1em;color:var(--accent);font-size:.72rem}.song-chord-sounds,.song-chord-warn{color:var(--text-dim);font-size:.7rem}.song-chord-warn{color:var(--danger)}.song-hands{gap:.5rem;display:flex}.hand-diagram{text-align:center;width:52px;margin:0}.hand-diagram svg{width:100%;height:auto}.hand-palm,.hand-finger{fill:none;stroke:var(--text-dim);stroke-width:5px}.hand-finger--up{stroke:var(--logo)}.hand-diagram[data-matched] .hand-palm,.hand-diagram[data-matched] .hand-finger{stroke:#56d364}.hand-diagram figcaption{color:var(--text-dim);margin-top:.15rem;font-size:.6rem;line-height:1.2}.song-match{text-transform:uppercase;letter-spacing:.08em;color:var(--text-dim);white-space:nowrap;font-size:.7rem}.song-match[data-matched]{color:#56d364}.song-lyric{color:var(--text);opacity:.85;grid-area:lyric;margin:0;font-size:.85rem}.song-timeline{grid-area:timeline;gap:.35rem;margin:0;padding:0;list-style:none;display:flex;overflow-x:auto}.song-timeline-item button{border:1px solid var(--panel-border);color:var(--text-dim);background:0 0;border-radius:.45rem;flex-direction:column;align-items:center;min-width:3rem;padding:.25rem .5rem;font-weight:600;display:flex}.song-timeline-item[data-current] button{border-color:var(--accent);color:var(--text);background:#7c9bff1f}.song-timeline-item[data-unreachable] button{border-color:var(--danger);color:var(--danger)}.song-timeline-chord{font-size:.85rem}.song-timeline-fingers{opacity:.7;font-variant-numeric:tabular-nums;font-size:.6rem}.song-controls{color:var(--text-dim);flex-wrap:wrap;grid-area:controls;align-items:center;gap:.6rem;font-size:.78rem;display:flex}.song-controls label{white-space:nowrap;align-items:center;gap:.3rem;display:flex}.song-controls button{padding:.25rem .7rem;font-size:.8rem}.song-tempo input{width:90px;accent-color:var(--accent)}.song-progress{font-variant-numeric:tabular-nums;margin-left:auto}.intro-modal{display:none}.intro-modal[data-open]{z-index:30;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#040508d1;justify-content:center;align-items:center;padding:1rem;display:flex;position:fixed;inset:0}html[data-intro=seen] .intro-modal{display:none}.intro-card{background:var(--panel);border:1px solid var(--panel-border);border-radius:.9rem;width:min(560px,100%);max-height:90vh;padding:1.6rem 1.6rem 1.3rem;overflow-y:auto}.intro-card h1{letter-spacing:-.02em;color:var(--logo);text-shadow:0 0 14px #b48bff73;margin:0 0 .7rem;font-size:clamp(1.4rem,4vw,1.9rem)}.intro-lead{color:var(--text-dim);margin:0;font-size:.95rem;line-height:1.6}.intro-subhead{text-transform:uppercase;letter-spacing:.14em;color:var(--text-dim);margin:1.1rem 0 .5rem;font-size:.72rem}.intro-steps{flex-direction:column;gap:.45rem;margin:0;padding:0;list-style:none;display:flex}.intro-steps li{align-items:center;gap:.6rem;font-size:.92rem;line-height:1.4;display:flex}.intro-steps span{text-align:center;flex:none;width:1.6rem;font-size:1.15rem}.intro-dismiss{width:100%;margin-top:1.3rem;padding:.55rem 1rem;font-size:.95rem}.song-modal{z-index:20;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#040508b8;justify-content:center;align-items:center;padding:1rem;display:flex;position:fixed;inset:0}.song-modal-card{background:var(--panel);border:1px solid var(--panel-border);border-radius:.8rem;flex-direction:column;gap:.7rem;width:min(680px,100%);max-height:90vh;padding:1.1rem;display:flex;overflow-y:auto}.song-modal-head{justify-content:space-between;align-items:center;display:flex}.song-modal-head h2{margin:0;font-size:1.1rem}.song-modal-hint{color:var(--text-dim);margin:0;font-size:.85rem;line-height:1.5}.song-textarea{resize:vertical;background:var(--bg);min-height:190px;color:var(--text);border:1px solid var(--panel-border);border-radius:.5rem;padding:.6rem .7rem;font-family:ui-monospace,Cascadia Code,Consolas,monospace;font-size:.82rem;line-height:1.5}.song-error{color:var(--danger);margin:0;font-size:.82rem}.song-modal-actions{flex-wrap:wrap;align-items:center;gap:.5rem;display:flex}.song-modal-spacer{flex:1}@media (max-width:780px){.song-tutorial{grid-template-columns:1fr;grid-template-areas:"now""lyric""timeline""controls"}.song-progress{margin-left:0}}.eq-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);border:1px solid var(--panel-border);background:#0b0d12b8;border-radius:.6rem;width:232px;padding:.4rem .7rem;font-size:.8rem;position:absolute;top:5.1rem;right:.75rem}.eq-overlay summary{cursor:pointer;color:var(--text-dim);padding:.2rem 0;font-size:.78rem}.eq-band{align-items:center;gap:.4rem;margin-top:.3rem;display:flex}.eq-band-label{width:2.9rem;color:var(--text-dim);text-transform:uppercase;letter-spacing:.04em;flex:none;font-size:.72rem}.eq-band input[type=range]{min-width:0;accent-color:var(--accent);flex:1}.eq-band-value{text-align:right;font-variant-numeric:tabular-nums;width:3.4rem;color:var(--text-dim);flex:none;font-size:.72rem}.eq-reset{margin:.45rem 0 .25rem;padding:.2rem .6rem;font-size:.72rem}.param-meters-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);border:1px solid var(--panel-border);background:#0b0d12b8;border-radius:.6rem;flex-direction:column;gap:.5rem;min-width:160px;padding:.6rem .8rem;display:flex;position:absolute;top:.75rem;right:.75rem}.param-meter{align-items:center;gap:.5rem;display:flex}.param-meter-label{width:3.2rem;color:var(--text-dim);text-transform:uppercase;letter-spacing:.04em;flex:none;font-size:.72rem}.param-meter-track{background:var(--panel-border);border-radius:999px;flex:1;height:5px;overflow:hidden}.param-meter-fill{border-radius:999px;height:100%;transition:width 80ms linear}.param-meter-fill--filter{background:var(--accent)}.param-meter-fill--volume{background:var(--accent-2)}.param-meter-value{font-variant-numeric:tabular-nums;color:var(--text-dim);text-align:right;flex:none;min-width:3.6rem;font-size:.72rem}