:root{--bg:#14110f;--surface:#1e1916;--surface-2:#2a231f;--line:#3a312b;--text:#f4ede5;--muted:#a99c8f;--accent:#f0a23b;--accent-ink:#1b1206;--accent-soft:#f0a23b24;--ok:#4fc98b;--bad:#ef6b6b;--radius:14px;--shadow:0 6px 24px #00000047;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}@media (prefers-color-scheme:light){:root:not([data-theme=dark]){--bg:#f8f4ee;--surface:#fff;--surface-2:#f1eae1;--line:#e0d6ca;--text:#2a211b;--muted:#7b6d61;--accent:#c46f12;--accent-ink:#fff;--accent-soft:#c46f121f;--ok:#1f9d62;--bad:#d04545;--shadow:0 6px 24px #462d1417;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}}:root[data-theme=light]{--bg:#f8f4ee;--surface:#fff;--surface-2:#f1eae1;--line:#e0d6ca;--text:#2a211b;--muted:#7b6d61;--accent:#c46f12;--accent-ink:#fff;--accent-soft:#c46f121f;--ok:#1f9d62;--bad:#d04545;--shadow:0 6px 24px #462d1417;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}*{box-sizing:border-box}html,body{height:100%;margin:0}body{background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;font:16px/1.55 system-ui,-apple-system,Segoe UI,Roboto,sans-serif}h1,h2,h3{letter-spacing:-.01em;margin:0;line-height:1.2}h1{font-size:1.9rem}h2{font-size:1.2rem}h3{font-size:1rem}p{margin:0}a{color:var(--accent)}button,select,input{font:inherit;color:inherit}:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.app{grid-template-columns:224px 1fr;min-height:100%;display:grid}.nav{background:var(--surface);border-right:1px solid var(--line);flex-direction:column;gap:2px;height:100vh;padding:20px 12px;display:flex;position:sticky;top:0}.brand{align-items:center;gap:10px;padding:4px 12px 18px;font-size:1.15rem;font-weight:700;display:flex}.brand-mark{background:var(--accent);width:32px;height:32px;color:var(--accent-ink);border-radius:9px;place-items:center;display:grid}.nav a{color:var(--muted);border-radius:10px;align-items:center;gap:12px;padding:10px 12px;font-weight:500;text-decoration:none;display:flex}.nav a:hover{background:var(--surface-2);color:var(--text)}.nav a.active{background:var(--accent-soft);color:var(--accent)}.nav svg{flex:none;width:20px;height:20px}.nav .spacer{flex:1}.main{outline:none;width:100%;max-width:1080px;padding:36px clamp(16px,4vw,48px) 64px}.page-head{margin-bottom:24px}.page-head p{color:var(--muted);max-width:62ch;margin-top:6px}.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:20px}.card+.card{margin-top:16px}.grid>.card,.stage>.card{margin-top:0}.grid{gap:16px;display:grid}.grid.cols-3{grid-template-columns:repeat(auto-fit,minmax(210px,1fr))}.grid.cols-chords{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}.row{align-items:center;gap:12px;display:flex}.row.wrap{flex-wrap:wrap}.row.between{justify-content:space-between}.stack{flex-direction:column;gap:12px;display:flex}.muted{color:var(--muted)}.small{font-size:.875rem}.center{text-align:center}.mt{margin-top:16px}.mt-lg{margin-top:28px}.btn{border:1px solid var(--line);background:var(--surface-2);cursor:pointer;color:var(--text);border-radius:10px;justify-content:center;align-items:center;gap:8px;padding:9px 16px;font-weight:600;text-decoration:none;transition:transform 60ms,background .15s,border-color .15s;display:inline-flex}.btn:hover{border-color:var(--accent)}.btn:active{transform:scale(.97)}.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}.btn.big{border-radius:12px;padding:14px 28px;font-size:1.05rem}.btn.ghost{background:0 0}.btn.ok{background:var(--ok);border-color:var(--ok);color:#06200f}.btn.bad{background:var(--bad);border-color:var(--bad);color:#2a0606}.btn[disabled]{opacity:.5;cursor:default}.chip{cursor:pointer;border:1px solid var(--line);color:var(--muted);background:0 0;border-radius:999px;padding:6px 14px;font-weight:500}.chip.active{background:var(--accent-soft);border-color:var(--accent);color:var(--accent)}select,input[type=search],input[type=number]{border:1px solid var(--line);background:var(--surface-2);border-radius:10px;padding:9px 12px}input[type=range]{accent-color:var(--accent);width:100%}label.field{color:var(--muted);flex-direction:column;gap:6px;font-size:.875rem;display:flex}label.check{cursor:pointer;align-items:center;gap:8px;display:inline-flex}label.check input{accent-color:var(--accent);width:18px;height:18px}.tabs{background:var(--surface);border:1px solid var(--line);border-radius:12px;gap:4px;margin-bottom:20px;padding:4px;display:inline-flex}.tab{color:var(--muted);cursor:pointer;background:0 0;border:0;border-radius:9px;padding:8px 18px;font-weight:600}.tab.active{background:var(--accent);color:var(--accent-ink)}.badge{background:var(--surface-2);color:var(--muted);border-radius:999px;padding:2px 10px;font-size:.75rem;font-weight:600;display:inline-block}.badge.done{background:color-mix(in srgb, var(--ok) 18%, transparent);color:var(--ok)}.notice{background:color-mix(in srgb, var(--bad) 14%, transparent);border:1px solid var(--bad);border-radius:10px;padding:12px 16px}.stat{align-items:center;gap:16px;display:flex}.stat-value{font-variant-numeric:tabular-nums;font-size:1.9rem;font-weight:700;line-height:1}.stat-label{color:var(--muted);margin-top:4px;font-size:.875rem}.stat-icon{background:var(--accent-soft);border-radius:14px;flex:none;place-items:center;width:52px;height:52px;font-size:1.5rem;display:grid}.ring{flex:none;width:64px;height:64px;transform:rotate(-90deg)}.ring circle{fill:none;stroke-width:8px}.ring .ring-bg{stroke:var(--surface-2)}.ring .ring-fg{stroke:var(--accent);stroke-linecap:round;transition:stroke-dashoffset .4s}.week{align-items:flex-end;gap:10px;height:96px;display:flex}.week-day{flex-direction:column;flex:1;align-items:center;gap:6px;height:100%;display:flex}.week-bar{background:var(--surface-2);border-radius:8px;flex:1;align-items:flex-end;width:100%;max-width:44px;display:flex;overflow:hidden}.week-bar i{background:var(--accent);border-radius:8px;width:100%;min-height:0;display:block}.week-day.today span{color:var(--accent);font-weight:700}.week-day span{color:var(--muted);font-size:.75rem}.hero{background:linear-gradient(120deg, var(--accent-soft), transparent 70%), var(--surface);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:20px;display:flex}.hero h2{margin:4px 0;font-size:1.35rem}.tile{color:var(--text);flex-direction:column;gap:6px;text-decoration:none;transition:border-color .15s,transform .1s;display:flex}.tile:hover{border-color:var(--accent);transform:translateY(-2px)}.tile svg{width:26px;height:26px;color:var(--accent)}.tile p{color:var(--muted);font-size:.875rem}.level-title{color:var(--muted);text-transform:uppercase;letter-spacing:.08em;margin:28px 0 12px;font-size:.8rem;font-weight:700}.lesson-item{color:var(--text);align-items:center;gap:16px;padding:14px 18px;text-decoration:none;display:flex}.lesson-item+.lesson-item{margin-top:8px}.lesson-item:hover{border-color:var(--accent)}.lesson-num{background:var(--surface-2);border-radius:50%;flex:none;place-items:center;width:36px;height:36px;font-weight:700;display:grid}.lesson-item.done .lesson-num{background:var(--ok);color:#06200f}.lesson-item .grow{flex:1;min-width:0}.lesson{max-width:720px}.lesson h2{margin:28px 0 10px}.lesson p{margin:12px 0}.lesson ol,.lesson ul{margin:12px 0;padding-left:22px}.lesson li{margin:6px 0}.tip{border-left:3px solid var(--accent);background:var(--accent-soft);border-radius:0 10px 10px 0;margin:16px 0;padding:14px 16px}.tablature{background:var(--surface);border:1px solid var(--line);border-radius:10px;margin:16px 0;padding:14px 16px;font:.9rem/1.35 ui-monospace,SFMono-Regular,Menlo,monospace;overflow-x:auto}.widget{margin:16px 0}.lesson-foot{border-top:1px solid var(--line);flex-wrap:wrap;justify-content:space-between;gap:12px;margin-top:36px;padding-top:20px;display:flex}.chord-card{text-align:center;cursor:pointer;padding:14px 10px;transition:border-color .15s,transform 80ms}.chord-card:hover{border-color:var(--accent)}.chord-card:active{transform:scale(.98)}.chord-card.playing{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}.chord-name{font-size:1.35rem;font-weight:700}.chord-fr{color:var(--muted);font-size:.8rem}.chord-svg{width:100%;max-width:140px;height:auto;margin:4px auto 0;display:block}.cd-line{stroke:var(--muted);stroke-width:1.2px}.cd-nut{stroke:var(--text);stroke-width:4px;stroke-linecap:round}.cd-dot{fill:var(--text)}.cd-num{fill:var(--bg);text-anchor:middle;dominant-baseline:central;font-size:10px;font-weight:700}.cd-mark{fill:none;stroke:var(--muted);stroke-width:1.5px}.cd-base{fill:var(--muted);font-size:10px}.fb-wrap{-webkit-overflow-scrolling:touch;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:10px;overflow-x:auto}.fb-svg{width:100%;min-width:760px;height:auto;display:block}.fb-board{fill:color-mix(in srgb, #7a4a22 38%, var(--surface))}.fb-fret{stroke:var(--muted);stroke-width:2px}.fb-nut{stroke:var(--text);stroke-width:5px}.fb-string{stroke:color-mix(in srgb, var(--text) 75%, transparent)}.fb-inlay{fill:color-mix(in srgb, var(--text) 22%, transparent)}.fb-fretnum{fill:var(--muted);text-anchor:middle;font-size:11px}.fb-marker circle{fill:var(--surface-2);stroke:var(--text);stroke-width:1.5px}.fb-marker text{fill:var(--text);text-anchor:middle;dominant-baseline:central;font-size:10.5px;font-weight:700}.fb-marker.root circle{fill:var(--accent);stroke:var(--accent)}.fb-marker.root text{fill:var(--accent-ink)}.fb-marker.ask circle{fill:var(--accent);stroke:var(--accent)}.fb-marker.ask text{fill:var(--accent-ink);font-size:14px}.fb-marker.ok circle{fill:var(--ok);stroke:var(--ok)}.fb-marker.bad circle{fill:var(--bad);stroke:var(--bad)}.fb-marker.ok text,.fb-marker.bad text{fill:#111}.fb-marker{pointer-events:none}.fb-hit{fill:#0000;cursor:pointer}.fb-hit:hover{fill:color-mix(in srgb, var(--accent) 16%, transparent)}.tuner{text-align:center;padding:32px 20px}.tuner-note{letter-spacing:-.03em;min-height:1em;font-size:5.5rem;font-weight:800;line-height:1}.tuner-sub{color:var(--muted);font-variant-numeric:tabular-nums;min-height:1.5em;margin-top:6px}.tuner-msg{min-height:1.6em;margin-top:10px;font-weight:600}.tuner.in-tune .tuner-note,.tuner.in-tune .tuner-msg{color:var(--ok)}.gauge{max-width:520px;height:56px;margin:26px auto 0;position:relative}.gauge-track{background:var(--surface-2);border-radius:2px;height:4px;position:absolute;top:26px;left:0;right:0}.gauge-zone{background:color-mix(in srgb, var(--ok) 28%, transparent);border-radius:8px;width:10%;height:16px;position:absolute;top:20px;left:45%}.gauge-tick{background:var(--line);width:2px;height:20px;position:absolute;top:18px;transform:translate(-1px)}.gauge-needle{background:var(--accent);opacity:.25;border-radius:3px;width:6px;height:48px;transition:left 90ms linear,background .15s;position:absolute;top:4px;left:50%;transform:translate(-3px)}.gauge-needle.live{opacity:1}.tuner.in-tune .gauge-needle{background:var(--ok)}.gauge-labels{max-width:520px;color:var(--muted);justify-content:space-between;margin:4px auto 0;font-size:.75rem;display:flex}.strings{flex-wrap:wrap;justify-content:center;gap:10px;margin-top:28px;display:flex}.string-btn{border:2px solid var(--line);background:var(--surface-2);cursor:pointer;border-radius:50%;flex-direction:column;justify-content:center;align-items:center;width:62px;height:62px;font-weight:700;line-height:1.1;display:flex}.string-btn small{color:var(--muted);font-size:.68rem;font-weight:500}.string-btn.target{border-color:var(--accent);color:var(--accent)}.string-btn.tuned{border-color:var(--ok);background:color-mix(in srgb, var(--ok) 18%, transparent)}.metro{text-align:center;padding:32px 20px}.metro-bpm{font-variant-numeric:tabular-nums;font-size:5.5rem;font-weight:800;line-height:1}.metro-name{color:var(--muted)}.beats{justify-content:center;gap:12px;margin:26px 0;display:flex}.beat{background:var(--surface-2);border:2px solid var(--line);border-radius:50%;width:22px;height:22px;transition:transform 50ms}.beat.first{border-color:var(--accent)}.beat.on{background:var(--accent);border-color:var(--accent);transform:scale(1.25)}.metro-controls{text-align:left;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;max-width:520px;margin:24px auto 0;display:grid}.stage{grid-template-columns:1.5fr 1fr;align-items:stretch;gap:16px;display:grid}.stage .card{text-align:center;margin:0}.stage-label{color:var(--muted);text-transform:uppercase;letter-spacing:.08em;font-size:.8rem;font-weight:700}.stage-name{font-size:3.2rem;font-weight:800;line-height:1.1}.stage-next .stage-name{font-size:1.9rem}.stage-next .chord-svg{opacity:.75;max-width:100px}.stage-now .chord-svg{max-width:190px}.stage-now.flash{border-color:var(--accent)}.pattern{grid-template-columns:repeat(8,1fr);gap:6px;margin:16px 0;display:grid}.slot{background:var(--surface);border:1px solid var(--line);text-align:center;border-radius:10px;padding:8px 0}.slot b{min-height:1.2em;font-size:1.5rem;line-height:1.2;display:block}.slot small{color:var(--muted)}.slot.on{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}.slot.on small{color:var(--accent-ink)}.prog-chips{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.prog-chip{background:var(--surface-2);border:1px solid var(--line);border-radius:999px;align-items:center;gap:6px;padding:6px 8px 6px 14px;font-weight:700;display:inline-flex}.prog-chip button{cursor:pointer;color:var(--muted);background:0 0;border:0;padding:2px 4px;font-size:1rem;line-height:1}.countdown{font-variant-numeric:tabular-nums;font-size:4.5rem;font-weight:800;line-height:1}.history{margin:0;padding:0;list-style:none}.history li{border-bottom:1px solid var(--line);justify-content:space-between;padding:8px 0;display:flex}.history li:last-child{border:0}.options{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin:20px 0;display:grid}.options.notes{grid-template-columns:repeat(auto-fit,minmax(72px,1fr))}.options .btn{padding:14px 10px}.feedback{min-height:1.6em;font-weight:600}.feedback.ok{color:var(--ok)}.feedback.bad{color:var(--bad)}.score{color:var(--muted);font-variant-numeric:tabular-nums;flex-wrap:wrap;gap:20px;display:flex}.score b{color:var(--text)}.prompt{font-size:1.25rem;font-weight:700}@media (width<=820px){.app{display:block}.nav{z-index:10;height:auto;padding:6px 6px calc(6px + env(safe-area-inset-bottom));border-right:0;border-top:1px solid var(--line);flex-direction:row;gap:0;position:fixed;inset:auto 0 0;overflow-x:auto}.brand,.nav .spacer{display:none}.nav a{flex-direction:column;flex:1 0 auto;gap:2px;min-width:64px;padding:6px 10px;font-size:.68rem}.main{padding:22px 16px 104px}h1{font-size:1.55rem}.stage{grid-template-columns:1fr}.tuner-note,.metro-bpm{font-size:4.2rem}.slot b{font-size:1.2rem}}@media (prefers-reduced-motion:reduce){*{transition:none!important}}#root{min-height:100%}.splash{place-items:center;min-height:100vh;padding:24px 16px;display:grid}.auth{width:100%;max-width:400px}.auth .tabs{margin-bottom:0}input[type=text],input[type=email],input[type=password]{border:1px solid var(--line);background:var(--surface-2);border-radius:10px;padding:10px 12px}.grid.cols-4{grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}.mt-sm{margin-top:8px}.dropzone{text-align:center;border-style:dashed;border-width:2px;padding:36px 20px}.dropzone.over{border-color:var(--accent);background:var(--accent-soft)}.song-link{color:var(--text);text-decoration:none}.title-input{letter-spacing:-.01em;background:0 0;border:1px solid #0000;border-radius:8px;width:100%;margin-top:8px;margin-left:-6px;padding:2px 6px;font-size:1.9rem;font-weight:700;display:block}.title-input:hover,.title-input:focus{border-color:var(--line)}.check.track{border:1px solid var(--line);border-radius:999px;padding:6px 12px}.transpose-value{text-align:center;white-space:nowrap;color:var(--text);flex:1}.field.inline{flex-direction:row;align-items:center;gap:8px}.score-bar{z-index:5;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);flex-wrap:wrap;align-items:center;gap:14px;margin-bottom:12px;padding:10px 14px;display:flex;position:sticky;top:0}.score-paper{color:#000;border-radius:var(--radius);border:1px solid var(--line);background:#fff;min-height:160px;padding:8px;overflow-x:auto}.score-paper.busy{opacity:.6}.at-cursor-bar{background:#f0a23b2e}.at-cursor-beat{background:#d9480f;width:3px}.at-selection div{background:#f0a23b40}.at-highlight *{fill:#d9480f;stroke:#d9480f}@media (width<=820px){.title-input{font-size:1.5rem}.score-bar{gap:10px}}.work{margin-bottom:12px}.work-row{border-top:1px solid var(--line);flex-wrap:wrap;flex-basis:100%;align-items:center;gap:10px;padding-top:10px;display:flex}.work-range{text-align:center;min-width:11ch}.work-status{flex:1;min-width:220px}.barmap{grid-template-columns:repeat(auto-fill,minmax(34px,1fr));gap:4px;margin:16px 0 8px;display:grid}.barmap-cell{cursor:pointer;border:1px solid var(--line);background:var(--surface-2);height:30px;color:var(--muted);font-variant-numeric:tabular-nums;border-radius:6px;padding:0;font-size:.75rem}.barmap-cell.part{background:color-mix(in srgb, var(--accent) 30%, var(--surface));color:var(--text)}.barmap-cell.done{background:var(--ok);border-color:var(--ok);color:#06200f;font-weight:700}.barmap-cell.sel{outline:2px solid var(--accent);outline-offset:1px;color:var(--text);font-weight:700}.legend{vertical-align:-1px;border-radius:3px;width:12px;height:12px;margin:0 4px 0 8px;display:inline-block}.legend.part{background:color-mix(in srgb, var(--accent) 30%, var(--surface));border:1px solid var(--line)}.legend.done{background:var(--ok)}.legend:first-child{margin-left:0}