:root{--bg:#0f1115;--panel:#181b22;--panel-2:#20242d;--text:#e8eaf0;--muted:#8b92a3;--accent:#f5b942;--good:#3ecf6e;--bad:#ef5350;font-size:18px}*{box-sizing:border-box}body{background:var(--bg);color:var(--text);margin:0;font-family:system-ui,-apple-system,Segoe UI,sans-serif}a{color:inherit;text-decoration:none}button,input{font:inherit;color:inherit;background:var(--panel-2);border:1px solid #343a47;border-radius:8px;padding:.5rem .9rem}button{cursor:pointer}button:hover{border-color:var(--accent)}button.primary{background:var(--accent);color:#1a1405;border-color:var(--accent);font-weight:600}.shell{flex-direction:column;min-height:100vh;display:flex}.nav{background:var(--panel);flex-wrap:wrap;align-items:center;gap:.25rem;padding:.5rem 1rem;display:flex}.nav a{color:var(--muted);border-radius:8px;padding:.4rem .8rem}.nav a:hover,.nav a.active{color:var(--text);background:var(--panel-2)}.nav .spacer{flex:1}.view{flex:1;padding:1.5rem 2rem}h1{margin-top:0}.cards{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:1rem;display:grid}.card{background:var(--panel);border-radius:12px;padding:1.2rem;display:block}.card:hover{outline:2px solid var(--accent)}.card h3{margin:0 0 .4rem}.card p{color:var(--muted);margin:0;font-size:.85rem}.login{flex-direction:column;gap:.8rem;max-width:320px;margin:20vh auto;display:flex}.login .error{color:var(--bad);min-height:1.2em}.muted{color:var(--muted)}.micerr{color:var(--bad);margin-right:.5rem;font-size:.8rem}button.on{border-color:var(--good);color:var(--good)}.meter{background:var(--panel-2);vertical-align:middle;border-radius:5px;width:120px;height:10px;margin-right:.6rem;display:inline-block;position:relative;overflow:hidden}.meter-fill{background:var(--muted);width:0;height:100%}.meter-fill.over{background:var(--good)}.meter-gate{background:var(--accent);width:2px;position:absolute;top:0;bottom:0}.tuner{text-align:center;max-width:560px;margin:0 auto}.tuner-note{font-size:7rem;font-weight:700;line-height:1.1}.tuner.intune .tuner-note{color:var(--good)}.tuner-needle{width:100%;max-width:440px}.tuner-needle .tick{stroke:var(--muted);stroke-width:1.5px}.tuner-needle .needle{stroke:var(--accent);stroke-width:3px;transition:transform 80ms linear}.tuner.intune .needle{stroke:var(--good)}.tuner-cents{min-height:1.6em;font-size:1.4rem}.tuner-strings{justify-content:center;gap:.6rem;margin:1rem 0;display:flex}.tstr{background:var(--panel-2);border-radius:50%;justify-content:center;align-items:center;width:3.2rem;height:3.2rem;font-size:1.4rem;font-weight:600;display:flex;position:relative}.tstr.near{outline:3px solid var(--accent)}.tstr .chk{color:var(--good);font-size:1rem;display:none;position:absolute;top:-6px;right:-4px}.tstr.done{background:#1d3a29}.tstr.done .chk{display:block}h2{margin:0 0 .6rem;font-size:1.1rem}.warn{color:var(--accent);background:#3a2a10;border-radius:8px;margin:.5rem 0;padding:.6rem .9rem}.set-group{background:var(--panel);border-radius:12px;max-width:720px;margin-bottom:1rem;padding:1rem 1.2rem}.set-row{align-items:center;gap:.6rem;padding:.3rem 0;display:flex}.set-row label{flex:1}.set-row input[type=number]{width:8rem}.set-row select{background:var(--panel-2);color:var(--text);border:1px solid #343a47;border-radius:8px;max-width:22rem;padding:.4rem}button.reset{padding:.2rem .5rem}.nf-head{flex-wrap:wrap;align-items:center;gap:1rem;display:flex}.nf-head h1{margin:0}.spacer{flex:1}.nf-filters{flex-wrap:wrap;align-items:center;gap:.8rem;margin:1rem 0;font-size:.85rem;display:flex}.chip{background:var(--panel);border-radius:999px;align-items:center;gap:.3rem;padding:.2rem .6rem;display:inline-flex}.chip input{padding:.1rem .3rem}.nf-card{background:var(--panel);text-align:center;border:3px solid #0000;border-radius:20px;max-width:640px;margin:1rem auto;padding:2rem;transition:border-color .2s}.nf-card.good{border-color:var(--good)}.nf-card.bad{border-color:var(--bad)}.nf-note{font-size:9rem;font-weight:700;line-height:1.1}.nf-where{color:var(--muted);font-size:2rem}.nf-hint{min-height:7rem;color:var(--accent);margin-top:1rem;font-size:1.6rem}.nf-feedback{min-height:2rem;font-size:1.6rem}.nf-card.good .nf-feedback{color:var(--good)}.nf-card.bad .nf-feedback{color:var(--bad)}.fb{width:320px;margin:.4rem auto;display:block}.fb-string{stroke:var(--muted);stroke-width:1px}.fb-fret{stroke:#343a47;stroke-width:1px}.fb-nut{stroke:var(--text);stroke-width:3px}.fb-dot{fill:var(--accent)}.dbg-info{margin-top:1rem;font-size:.9rem}.hw-list{gap:.6rem;margin-bottom:1.5rem;display:grid}.hw-item{background:var(--panel);border-radius:10px;grid-template-columns:2fr 1fr 1fr;align-items:center;gap:1rem;padding:.9rem 1.2rem;display:grid}.hw-item:hover{outline:2px solid var(--accent)}.hw-controls{margin-top:.5rem}.hw-status{min-height:2rem;color:var(--accent);margin-top:.5rem;font-size:1.4rem}.hw-results{background:var(--panel);border-radius:14px;max-width:640px;margin-top:1rem;padding:1rem 1.5rem}.hw-results h2{margin:0 0 .5rem;font-size:2.2rem}.hw-actions{align-items:center;gap:1rem;margin-top:1rem;display:flex}.cal-out{margin-top:.5rem}.chord-grid{grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:.6rem;margin:1rem 0;display:grid}.chord-tile{background:var(--panel);border-radius:12px;flex-direction:column;align-items:center;gap:.2rem;padding:.5rem;display:flex}.chord-tile.sel{outline:2px solid var(--accent)}.chord-diagram{display:block}.badge{background:var(--good);color:#08210f;border-radius:999px;padding:.05rem .5rem;font-size:.7rem}.chord-detail{background:var(--panel);border-radius:16px;flex-wrap:wrap;align-items:flex-start;gap:2rem;padding:1.2rem 1.6rem;display:flex}.chord-live{flex:1;min-width:280px}.score-bar{background:var(--panel-2);border-radius:9px;height:18px;margin:.6rem 0;position:relative}.score-bar #cbar{background:var(--bad);border-radius:9px;width:0;height:100%;transition:width .15s}.score-bar #cbar.ok{background:var(--good)}.score-bar #cthr{background:var(--accent);width:2px;position:absolute;top:-3px;bottom:-3px}.chord-res{min-height:2rem;font-size:1.5rem}.chord-res.good{color:var(--good)}.chord-res.bad{color:var(--bad)}.big{font-size:4rem;font-weight:700;line-height:1.1}.cal-list{flex-wrap:wrap;gap:.4rem;margin:.8rem 0;display:flex}.change-board{flex-wrap:wrap;justify-content:center;align-items:center;gap:2rem;margin:1.5rem 0;display:flex}.change-chord{background:var(--panel);opacity:.55;border:3px solid #0000;border-radius:16px;padding:1rem}.change-chord.expected{border-color:var(--accent);opacity:1}.change-mid{text-align:center;min-width:160px}.hw-next{align-items:center;gap:.8rem;margin:.5rem 0;display:flex}.hw-strum{letter-spacing:.1em;color:var(--muted);margin-top:.4rem;font-size:1.4rem}.hw-strum span{border-radius:6px;padding:.1rem .4rem}.hw-strum span.on{background:var(--accent);color:#1a1405}.good{color:var(--good)}.home-hero{flex-wrap:wrap;align-items:center;gap:2.5rem;margin:1rem 0 1.5rem;display:flex}.start-btn{background:var(--accent);color:#1a1405;border-radius:16px;padding:1.4rem 2.6rem;font-size:1.8rem;font-weight:700}.start-btn:hover{filter:brightness(1.08)}.home-streak{text-align:center}.ring{width:130px;height:130px}.ring-bg{fill:none;stroke:var(--panel-2);stroke-width:12px}.ring-fg{fill:none;stroke:var(--accent);stroke-width:12px;stroke-linecap:round}.ring-fg.done{stroke:var(--good)}.ring-num{fill:var(--text);font-size:30px;font-weight:700}.ring-sub{fill:var(--muted);font-size:12px}.rt-list{gap:.5rem;max-width:720px;margin:1rem 0;padding:0;list-style:none;display:grid}.rt-list li{background:var(--panel);border-radius:10px;grid-template-columns:5rem 11rem 1fr;align-items:center;gap:.8rem;padding:.7rem 1rem;display:grid}.rt-min{color:var(--accent);font-weight:600}.rt-bar{flex-wrap:wrap;align-items:center;gap:1.2rem;display:flex}.rt-progress{background:var(--panel-2);border-radius:3px;height:6px;margin:.6rem 0 1rem;overflow:hidden}.rt-progress>div{background:var(--accent);width:0;height:100%;transition:width .25s linear}.set-group.wide{max-width:980px}.stat-tiles{flex-wrap:wrap;gap:1rem;margin-bottom:1rem;display:flex}.tile{background:var(--panel);text-align:center;border-radius:12px;min-width:140px;padding:.8rem 1.6rem}.tile small{color:var(--muted);font-size:1.3rem;font-weight:400}.cal-heat{max-width:100%;height:auto}.bar-chart,.fret-heat{width:100%;height:auto;display:block}.bar-chart .bar{fill:var(--muted)}.bar-chart .bar.goal{fill:var(--good)}.bar-chart .goal-line{stroke:var(--accent);stroke-dasharray:5 4;stroke-width:1.5px}.axis{fill:var(--muted);font-size:11px}.cell-note{fill:#fff;pointer-events:none;font-size:12px}.stats-two{grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:1.5rem;display:grid}.stats-table{border-collapse:collapse;width:100%}.stats-table th,.stats-table td{text-align:left;border-bottom:1px solid var(--panel-2);padding:.3rem .8rem .3rem 0}.stats-table th{color:var(--muted);font-size:.85rem;font-weight:500}.chroma-bars{align-items:flex-end;gap:6px;height:90px;margin:.5rem 0;display:flex}.cb{max-width:40px;height:100%;color:var(--muted);flex-direction:column;flex:1;justify-content:flex-end;align-items:center;font-size:.7rem;display:flex}.cb-fill{background:var(--accent);border-radius:4px 4px 0 0;width:100%;height:0}
