:root{--bg:#f7f7f9;--surface:#fff;--surface-2:#f0f0f3;--text:#1d1d22;--text-muted:#6b6b76;--accent:#c9882e;--accent-strong:#a96e1d;--accent-soft:#f7e8d2;--ok:#2c8a4b;--warn:#c0392b;--info:#3b6fd4;--chart-1:var(--accent);--chart-2:#3b6fd4;--chart-3:#2c8a4b;--chart-4:#8e44ad;--border:#e2e2e8;--shadow:0 1px 3px #00000014;--radius:10px;--tap:44px}@media (prefers-color-scheme:dark){:root{--bg:#14151a;--surface:#1e1f26;--surface-2:#26272f;--text:#e8e8ec;--text-muted:#9b9ba6;--accent:#d99a3d;--accent-strong:#eab055;--accent-soft:#3a2f1d;--ok:#4cc47a;--warn:#e06050;--info:#6b93e8;--border:#34353f;--shadow:0 1px 3px #0006}}*{box-sizing:border-box}html,body{background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;margin:0;padding:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif}button{font:inherit}@media (prefers-reduced-motion:reduce){*{transition-duration:.01ms!important;animation-duration:.01ms!important}}.app{max-width:680px;padding:12px 14px calc(24px + env(safe-area-inset-bottom));margin:0 auto}.app-header{align-items:baseline;gap:10px;margin:4px 0 8px;display:flex}.app-header h1{color:var(--accent-strong);margin:0;font-size:20px}.version{font-size:11px}.app-footer{text-align:center;margin-top:28px;font-size:12px}.muted{color:var(--text-muted)}.small{font-size:12px}.warn-text{color:var(--warn)}.banner{background:var(--accent-soft);border:1px solid var(--accent);border-radius:var(--radius);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;margin:8px 0;padding:8px 12px;font-size:14px;display:flex}.banner-actions{gap:8px;display:flex}.whats-new{border-radius:var(--radius);box-shadow:var(--shadow);background:var(--surface);color:var(--text);border:none;max-width:420px;margin:20px auto;padding:20px}.whats-new h2{margin-top:0}.tabs{background:var(--surface-2);border-radius:var(--radius);z-index:5;gap:4px;margin:10px 0;padding:4px;display:flex;position:sticky;top:6px}.tab{min-height:var(--tap);color:var(--text-muted);cursor:pointer;background:0 0;border:none;border-radius:8px;flex:1;font-weight:600}.tab-active{background:var(--surface);color:var(--accent-strong);box-shadow:var(--shadow)}.btn{min-height:var(--tap);border:1px solid var(--border);background:var(--surface);color:var(--text);cursor:pointer;border-radius:8px;padding:8px 16px;font-weight:600}.btn:active{transform:translateY(1px)}.btn-primary{background:var(--accent);border-color:var(--accent);color:#fff}.btn-small{min-height:34px;padding:4px 10px;font-size:13px}.btn-ghost{background:0 0}.btn-active{border-color:var(--accent);color:var(--accent-strong)}.btn:disabled{opacity:.5;cursor:default}.button-row{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.segmented{background:var(--surface-2);border-radius:8px;flex-wrap:wrap;gap:4px;margin:6px 0;padding:4px;display:flex}.segmented button{min-height:38px;color:var(--text-muted);cursor:pointer;background:0 0;border:none;border-radius:6px;padding:4px 12px;font-weight:600}.segment-active{background:var(--surface);box-shadow:var(--shadow);color:var(--accent-strong)!important}.segmented-wrap{flex-wrap:wrap}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);margin:12px 0;padding:14px}.card h2{margin:0 0 6px;font-size:17px}.card h3{color:var(--text-muted);margin:14px 0 4px;font-size:14px}.form-row{flex-direction:column;gap:6px;margin:10px 0;display:flex}.form-row label{font-size:14px}.form-row input[type=range]{width:100%;min-height:var(--tap)}.form-row input[type=search],.form-row select{min-height:var(--tap);border:1px solid var(--border);background:var(--surface);color:var(--text);font:inherit;border-radius:8px;padding:6px 10px}.check{align-items:center;gap:8px;display:flex}.check input{width:20px;height:20px;accent-color:var(--accent)}.empty-state{text-align:center;padding:30px 10px}.hidden-file-input{display:none}.drill-status{font-variant-numeric:tabular-nums;color:var(--text-muted);justify-content:space-between;margin-bottom:6px;display:flex}.drill-prompt{text-align:center;margin:6px 0;font-size:18px}.score-big{color:var(--accent-strong);font-size:42px;font-weight:800}.score-line{font-weight:600}.choice-grid{grid-template-columns:repeat(auto-fit,minmax(70px,1fr));gap:8px;margin-top:10px;display:grid}.choice-correct{border-color:var(--ok);color:var(--ok)}.fretboard{touch-action:manipulation;width:100%;overflow-x:auto}.fretboard-cell{cursor:pointer}.fretboard-cell:hover circle,.fretboard-cell:active circle{stroke:var(--accent);stroke-width:2px}.fretboard-dot-main{fill:var(--accent)}.fretboard-dot-extra{fill:var(--info)}.chord-grid{grid-template-columns:repeat(auto-fill,minmax(92px,1fr));gap:8px;display:grid}.chord-strip{gap:6px;padding:4px 0;display:flex;overflow-x:auto}.chord-card{border:1px solid var(--border);background:var(--surface);cursor:pointer;border-radius:8px;flex-direction:column;align-items:center;padding:4px;display:flex}.chord-dot{fill:var(--accent)}.chord-notes{margin:2px 0 4px}.change-drill-now{justify-content:center;align-items:flex-start;gap:14px;display:flex}.change-next{text-align:center;opacity:.75}.change-next p{margin:0}.tuner-readout{text-align:center;padding:10px 0 14px}.tuner-note{font-variant-numeric:tabular-nums;font-size:52px;font-weight:800;line-height:1.1}.tuner-cents{color:var(--text-muted);font-variant-numeric:tabular-nums}.tuner-in-tune .tuner-note{color:var(--ok)}.tuner-meter{background:linear-gradient(to right, var(--warn), var(--warn) 30%, var(--ok) 45%, var(--ok) 55%, var(--warn) 70%, var(--warn));border-radius:5px;height:10px;margin:14px 8% 6px;position:relative}.tuner-meter-center{background:var(--text);border-radius:1px;width:2px;position:absolute;top:-3px;bottom:-3px;left:50%}.tuner-meter-needle{background:var(--text);border-radius:2px;width:4px;height:22px;margin-left:-2px;transition:left 80ms linear;position:absolute;top:-6px}.tuner-strings{justify-content:center;gap:8px;margin:10px 0;display:flex}.tuner-string-active{border-color:var(--accent);color:var(--accent-strong);box-shadow:0 0 0 2px var(--accent-soft)}.tune-list{flex-direction:column;gap:8px;display:flex}.tune-card{text-align:left;background:var(--surface);border:1px solid var(--border);cursor:pointer;color:var(--text);border-radius:8px;flex-direction:column;gap:2px;padding:10px 12px;display:flex}.song-header{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.song-header h2{flex:1;margin:0}.notation-scroll{border:1px solid var(--border);border-radius:8px;margin:10px 0;padding:6px;overflow-x:auto}.notation{flex-wrap:wrap;align-items:flex-start;gap:8px;display:flex}.bar-system{border-radius:6px;flex-direction:column;padding:2px;transition:background .12s;display:flex}.bar-active{background:var(--accent-soft)}.bar-chords{color:var(--info);padding-left:12px;font-size:11px;font-weight:700}.stat-row{gap:12px;margin:8px 0;display:flex}.stat{background:var(--surface-2);border-radius:8px;flex-direction:column;flex:1;align-items:center;padding:10px 4px;display:flex}.stat-value{color:var(--accent-strong);text-overflow:ellipsis;white-space:nowrap;max-width:100%;font-size:24px;font-weight:800;overflow:hidden}.best-list{margin:4px 0;padding-left:20px;font-size:14px}