@font-face{font-family:Bravura;font-style:normal;font-display:block;font-weight:400;src:local(Bravura),url(./bravura-CBWYXOFh.woff2)format("woff2")}:root{--bg:#14161b;--surface:#1f222a;--surface-2:#2a2e38;--line:#363b48;--ink:#f3f1ea;--muted:#9aa1ae;--accent:#4cb4f5;--accent-ink:#06141f;--band:#2daabe57;--ok:#3fd07a;--bad:#ff5f6b;--hint:#ffc247;--star:#ffd23f;--key-white:#f4f1ea;--key-ink:#3b3e46;--key-black:#0d0f13;--pattern:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='104' height='104'%3E%3Cg fill='%23ffffff' fill-opacity='0.04'%3E%3Cellipse cx='22' cy='34' rx='5.2' ry='3.7' transform='rotate(-20 22 34)'/%3E%3Crect x='25.8' y='13' width='1.6' height='21'/%3E%3Cellipse cx='74' cy='86' rx='5.2' ry='3.7' transform='rotate(-20 74 86)'/%3E%3Crect x='77.8' y='65' width='1.6' height='21'/%3E%3C/g%3E%3C/svg%3E");--smart:#ff8f3f;--manual:#6c93ff;--daily:#2fc98a;--fixed:#4cb4f5;--moving:#22c7c7;--memory:#b68bff;--note-0:#ff6b6b;--note-1:#ff9f43;--note-2:#ffd43b;--note-3:#5fd068;--note-4:#27c9c9;--note-5:#5c9dff;--note-6:#b68bff;--ease-out:cubic-bezier(.16, 1, .3, 1);--spring:cubic-bezier(.3, 1.5, .5, 1);--spring-soft:cubic-bezier(.25, 1.2, .4, 1);--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}:root[data-theme=light]{--bg:#f3f0e8;--surface:#fff;--surface-2:#ebe7dc;--line:#d9d3c5;--ink:#22242a;--muted:#6b6f78;--accent:#1c8fdc;--accent-ink:#fff;--band:#28a0b942;--ok:#22a85a;--bad:#dc4350;--hint:#d9950b;--star:#f2b705;--key-white:#fff;--key-ink:#3b3e46;--key-black:#22242a;--pattern:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='104' height='104'%3E%3Cg fill='%23000000' fill-opacity='0.045'%3E%3Cellipse cx='22' cy='34' rx='5.2' ry='3.7' transform='rotate(-20 22 34)'/%3E%3Crect x='25.8' y='13' width='1.6' height='21'/%3E%3Cellipse cx='74' cy='86' rx='5.2' ry='3.7' transform='rotate(-20 74 86)'/%3E%3Crect x='77.8' y='65' width='1.6' height='21'/%3E%3C/g%3E%3C/svg%3E");--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}*{box-sizing:border-box}html,body,#app{height:100%}body{background:var(--bg) var(--pattern);color:var(--ink);-webkit-tap-highlight-color:transparent;overscroll-behavior:none;margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;font-size:16px;line-height:1.4}button{font:inherit;color:inherit;cursor:pointer}button:disabled{cursor:default}h1{margin:0;font-size:1.35rem}.icon{fill:none;stroke:currentColor;stroke-width:2px;stroke-linecap:round;stroke-linejoin:round;width:22px;height:22px}.page{max-width:640px;min-height:100%;padding:env(safe-area-inset-top) max(16px, env(safe-area-inset-right)) calc(24px + env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left));margin:0 auto}.page-wide{max-width:980px}.page-header,.home-header{align-items:center;gap:12px;padding:16px 0;display:flex}.home-header{justify-content:space-between}.brand{letter-spacing:.02em;font-size:1.6rem}.brand span{color:var(--accent)}.page-body{flex-direction:column;gap:16px;display:flex}.icon-button{border:1px solid var(--line);background:var(--surface);border-radius:50%;flex:none;place-items:center;width:44px;height:44px;display:grid}.tone-smart{--tone:var(--smart)}.tone-manual{--tone:var(--manual)}.tone-daily{--tone:var(--daily)}.tone-fixed{--tone:var(--fixed)}.tone-moving{--tone:var(--moving)}.tone-memory{--tone:var(--memory)}.cards{grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px;display:grid}.card{border:1px solid color-mix(in srgb, var(--tone) 45%, var(--line));background:linear-gradient(160deg, color-mix(in srgb, var(--tone) 16%, var(--surface)), var(--surface) 70%);text-align:left;border-radius:20px;grid-template:"icon title""icon text"1fr"action action"/auto 1fr;align-items:center;gap:2px 14px;padding:16px 16px 0;display:grid;overflow:hidden}.card-icon{background:var(--tone);color:#10131a;border-radius:50%;grid-area:icon;place-items:center;width:56px;height:56px;display:grid}.card-icon .icon{width:28px;height:28px}.card-title{grid-area:title;align-self:end;font-size:1.15rem;font-weight:700}.card-text{grid-area:text;align-self:start}.card-action{background:var(--tone);color:#10131a;letter-spacing:.06em;text-align:center;text-transform:uppercase;grid-area:action;margin:14px -16px 0;padding:11px 16px;font-weight:700}.card-text,.hint{color:var(--muted);font-size:.9rem}.hint{margin:6px 0 0}.hint-warn{color:var(--bad)}.field{flex-direction:column;gap:8px;display:flex}.field-label{letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin:0;font-size:.8rem;font-weight:650}.segmented{flex-wrap:wrap;gap:6px;display:flex}.segment{border:1px solid var(--line);background:var(--surface);border-radius:12px;flex:auto;min-height:44px;padding:8px 12px}.segment-on{border-color:var(--accent);background:var(--accent);color:var(--accent-ink);font-weight:650}.segment:disabled{opacity:.4}.toggle{border:1px solid var(--line);background:var(--surface);border-radius:12px;justify-content:space-between;align-items:center;gap:16px;padding:12px 14px;display:flex}.toggle-text{flex-direction:column;display:flex}.toggle .hint{margin:0}.toggle input{width:24px;height:24px;accent-color:var(--accent);flex:none}.presets,.note-chips{flex-wrap:wrap;gap:6px;display:flex}.chip{border:1px solid var(--line);background:var(--surface);border-radius:999px;min-height:38px;padding:6px 12px;font-size:.9rem}.note-chip{border-color:color-mix(in srgb, var(--chip) 55%, var(--line));min-width:58px}.note-chip.chip-on{border-color:var(--chip);background:var(--chip);color:#10131a;font-weight:650}.primary,.secondary,.danger{border:1px solid var(--line);background:var(--surface);border-radius:16px;min-height:52px;padding:12px 16px;font-weight:650}.primary{border-color:var(--accent);background:var(--accent);color:var(--accent-ink);letter-spacing:.02em;font-size:1.05rem}.primary:disabled{opacity:.45}.danger{border-color:var(--bad);color:var(--bad)}.confirm{flex-direction:column;gap:8px;display:flex}.panel{border:1px solid color-mix(in srgb, var(--tone) 40%, var(--line));background:var(--surface);border-radius:18px;flex-direction:column;gap:8px;padding:14px;display:flex}.panel-head{justify-content:space-between;align-items:center;display:flex}.ribbon{background:var(--tone);color:#10131a;letter-spacing:.06em;text-transform:uppercase;border-radius:999px;padding:4px 12px;font-size:.8rem;font-weight:700}.panel-note{color:var(--muted);font-size:.9rem}.staff.staff-mini{width:100%;height:120px}.stages{flex-direction:column;gap:10px;display:flex}.stage{border:1px solid color-mix(in srgb, var(--tone) 45%, var(--line));background:linear-gradient(100deg, color-mix(in srgb, var(--tone) 14%, var(--surface)), var(--surface) 65%);text-align:left;border-radius:16px;align-items:center;gap:12px;padding:12px 14px;display:flex}.stage-number{background:var(--tone);color:#10131a;border-radius:50%;flex:none;place-items:center;width:36px;height:36px;font-weight:800;display:grid}.stage-body{flex-direction:column;flex:1;min-width:0;display:flex}.stage-title{font-weight:650}.stage-hint{color:var(--muted);font-size:.82rem}.star{color:var(--line)}.star-on{color:var(--star)}.choices{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;display:grid}.choice{border:2px solid var(--line);background:var(--surface);border-radius:18px;flex-direction:column;justify-content:center;align-items:center;gap:4px;min-height:150px;padding:12px;display:flex}.choice-on{border-color:var(--accent);background:color-mix(in srgb, var(--accent) 16%, var(--surface))}.choice-name{font-weight:650}.results{text-align:center;padding-top:32px}.results-context{color:var(--muted);margin:0}.results-title{color:var(--accent);font-size:1.9rem}.results-stars .stars{font-size:3rem;line-height:1}.stats{grid-template-columns:repeat(4,1fr);gap:8px;margin:0;display:grid}.stats>div{border:1px solid var(--line);background:var(--surface);border-radius:14px;padding:10px 6px}.stats dt{color:var(--muted);font-size:.75rem}.stats dd{margin:0;font-size:1.3rem;font-weight:700}.stat-ok{color:var(--ok)}.stat-bad{color:var(--bad)}.chart{border:1px solid var(--line);background:var(--surface);border-radius:14px;grid-template-columns:repeat(7,1fr);gap:8px;padding:12px;display:grid}.chart-col{flex-direction:column;align-items:center;gap:4px;font-size:.8rem;display:flex}.chart-value{color:var(--muted);font-variant-numeric:tabular-nums}.chart-track{background:var(--surface-2);border-radius:8px;align-items:flex-end;width:100%;max-width:34px;height:64px;display:flex;overflow:hidden}.chart-bar{transform-origin:bottom;border-radius:8px;width:100%}.chart-empty .chart-bar{display:none}.chart-empty .chart-name{color:var(--muted)}.chart-name{font-weight:650}.review{margin:0}.results-actions{grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:8px;display:grid}.play{max-width:1000px;height:100dvh;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);-webkit-user-select:none;user-select:none;touch-action:manipulation;flex-direction:column;margin:0 auto;display:flex}.hud{z-index:1;grid-template-columns:auto 1fr auto;grid-template-areas:"close title stats""progress progress progress";align-items:center;gap:8px 12px;padding:10px 12px 6px;display:grid;position:relative}.hud>.icon-button{grid-area:close}.hud-title{min-width:0;color:var(--muted);text-overflow:ellipsis;white-space:nowrap;grid-area:title;font-weight:600;overflow:hidden}.hud-stats{font-variant-numeric:tabular-nums;grid-area:stats;align-items:center;gap:12px;display:flex}.lives{color:var(--bad);letter-spacing:2px}.lives-lost{color:var(--line)}.misses{color:var(--bad);font-weight:650}.clock{font-weight:650}.clock-low{color:var(--bad)}.progress{border:2px solid var(--ink);background:var(--surface-2);border-radius:999px;grid-area:progress;justify-self:center;width:min(70%,320px);height:22px;position:relative;overflow:hidden}.progress-fill{background:linear-gradient(90deg, var(--accent), color-mix(in srgb, var(--accent) 60%, var(--moving)));transform-origin:0;transition:transform .6s var(--spring-soft);position:absolute;inset:0}.progress-text{font-variant-numeric:tabular-nums;place-items:center;font-size:.78rem;font-weight:700;display:grid;position:absolute;inset:0}.staff-area{flex:1;justify-content:center;align-items:center;min-height:0;padding:0 4px;display:flex;position:relative}.staff{width:100%;height:100%;overflow:visible}.staff-line{stroke:var(--ink);stroke-width:1px}.ledger{stroke:currentColor;stroke-width:1.2px}.glyph{fill:currentColor;font-family:Bravura,serif;font-size:40px}.clef{color:var(--ink)}.stem{stroke:currentColor;stroke-width:1.3px}.note{color:var(--ink);transition:color .18s ease-out}.note-wrong{color:var(--bad)}.note-given{color:var(--muted)}.band{fill:var(--band);transition:transform .38s var(--spring-soft)}.notes-page{transition:opacity .15s ease-in,transform .15s ease-in}.notes-leaving{opacity:0;transform:translate(-8px)}.note-label{animation:.2s ease-out both fade-in}.bubble{transform-box:fill-box;transform-origin:50%;animation:bubble-in .5s var(--spring) both}.bubble-text{fill:#10131a;font-family:system-ui,sans-serif;font-size:8px;font-weight:700}.badge{stroke:var(--bg);stroke-width:.8px}.badge-ok{fill:var(--ok)}.badge-bad{fill:var(--bad)}.badge-mark{fill:none;stroke:#fff;stroke-width:1.1px;stroke-linecap:round;stroke-linejoin:round}.note-label,.reference-label{fill:currentColor;font-family:system-ui,sans-serif;font-size:10px;font-weight:600}.reference{color:var(--muted)}.reference-label{font-size:8px}.countdown{transform-box:fill-box;transform-origin:50%;animation:bubble-in .5s var(--spring) both}.countdown circle{fill:var(--memory)}.countdown text{fill:#10131a;font-family:system-ui,sans-serif;font-size:12px;font-weight:800}.feedback{text-align:center;color:var(--muted);pointer-events:none;font-weight:600;position:absolute;bottom:2px;left:0;right:0}.feedback span{animation:.15s ease-out both fade-in;display:inline-block}.keyboard{z-index:1;background:var(--bg);box-shadow:0 0 0 12px var(--bg);flex:none;gap:4px;height:clamp(140px,32dvh,260px);margin:6px 8px 10px;transition:opacity .2s ease-out;display:flex;position:relative}.keyboard-locked{pointer-events:none}.keyboard-locked .key-white{background:color-mix(in srgb, var(--key-white) 42%, var(--bg));color:color-mix(in srgb, var(--key-ink) 55%, var(--bg))}.keyboard-locked .interval-key{color:var(--muted)}.keyboard-locked .key-dot{opacity:.5}.key,.interval-key{transition:background-color .35s ease-out,border-color .35s ease-out,color .35s ease-out,transform 70ms ease-out}.key-ok,.key-bad,.key-hint{transition-duration:0s,0s,0s,70ms}.key-white:active,.interval-key:active{transform:translateY(3px)}.key-black:active{transform:translateY(2px)}.key{border:1px solid var(--line);touch-action:none;padding:0}.key-white{background:var(--key-white);color:var(--key-ink);border-radius:4px 4px 12px 12px;flex:1;justify-content:center;align-items:flex-end;padding-bottom:12px;display:flex;box-shadow:inset 0 -6px #0000001a}.key-black{border-color:var(--key-black);background:var(--key-black);border-radius:0 0 8px 8px;height:58%;position:absolute;top:0;box-shadow:inset 0 -5px #ffffff1f}.key-inert{height:30%}.key-label{pointer-events:none;flex-direction:column;align-items:center;gap:6px;font-size:.95rem;font-weight:700;display:flex}.key-dot{border-radius:50%;width:10px;height:10px}.key.key-ok,.interval-key.key-ok{border-color:var(--ok);background:var(--ok);color:#fff}.key.key-bad,.interval-key.key-bad{border-color:var(--bad);background:var(--bad);color:#fff}.key.key-hint,.interval-key.key-hint{border-color:var(--hint);background:var(--hint);color:#10131a}.interval-keys{z-index:1;background:var(--bg);box-shadow:0 0 0 14px var(--bg);flex:none;grid-template-columns:repeat(auto-fit,minmax(72px,1fr));gap:8px;margin:6px 10px 14px;transition:opacity .2s ease-out;display:grid;position:relative}.interval-key{border:1px solid color-mix(in srgb, var(--accent) 40%, var(--line));background:var(--surface);touch-action:none;border-radius:14px;min-height:72px;font-size:1.4rem;font-weight:700}.page,.play{animation:.24s ease-out both screen-in}.card:active,.segment:active,.chip:active,.stage:active,.choice:active,.primary:active,.secondary:active,.danger:active,.icon-button:active{transform:scale(.97)}.results-stars .star-on{animation:star-pop .75s var(--spring) both;animation-delay:calc(.2s + var(--i,0) * .16s);display:inline-block}.stats>div{animation:.3s ease-out both screen-in}.stats>div:nth-child(2){animation-delay:50ms}.stats>div:nth-child(3){animation-delay:.1s}.stats>div:nth-child(4){animation-delay:.15s}.chart-bar{animation:bar-grow .8s var(--spring-soft) both;animation-delay:calc(.3s + var(--i,0) * 50ms)}.key.key-ok,.key.key-bad,.interval-key.key-ok,.interval-key.key-bad{animation:key-press .5s var(--spring)}@keyframes key-press{0%{transform:translateY(5px)scaleY(.97)}}@keyframes screen-in{0%{opacity:0;transform:translateY(10px)}}@keyframes fade-in{0%{opacity:0}}@keyframes bubble-in{0%{opacity:0;transform:scale(.4)}}@keyframes bar-grow{0%{transform:scaleY(0)}}@keyframes star-pop{0%{opacity:0;transform:scale(.2)rotate(-25deg)}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-delay:0s!important}}@media (orientation:landscape) and (height<=520px){.hud{grid-template-columns:auto 1fr min(40vw,320px) 1fr;grid-template-areas:"close title progress stats";padding:6px 12px 0}.hud-stats{justify-self:end}.progress{width:100%}.keyboard{height:27dvh;margin-bottom:6px}.key-label{flex-direction:row}.feedback{font-size:.9rem;top:0;bottom:auto}.interval-key{min-height:52px}}@supports (animation-timing-function:linear(0, 1)){:root{--spring:linear(0, .095, .319, .586, .835, 1.027, 1.148, 1.2, 1.199, 1.163, 1.11, 1.056, 1.011, .979, .962, .958, .963, .972, .984, .994, 1.002, 1.007, 1.009, 1.008, 1.007, 1.004, 1);--spring-soft:linear(0, .042, .145, .28, .425, .565, .691, .798, .883, .949, .995, 1.026, 1.044, 1.053, 1.054, 1.051, 1.044, 1.037, 1.029, 1.022, 1.015, 1.01, 1.005, 1.002, 1, .998, 1)}}.note{animation:note-in .32s var(--ease-out) both;animation-delay:calc(var(--i,0) * 45ms)}.notes-stream .note,.staff-mini .note{animation:none}.staff-mini .note-given{color:var(--smart)}.note-shape{transform-box:fill-box;transform-origin:50%}.note-correct .note-shape{animation:note-pop .55s var(--spring)}.note-wrong .note-shape{animation:.4s ease-out note-shake}.ripple{fill:none;stroke-width:1.4px;transform-box:fill-box;transform-origin:50%;pointer-events:none;animation:ripple .65s var(--ease-out) both}.band-waiting{animation:1.1s ease-in-out infinite band-pulse}.progress-text{animation:count-pop .35s var(--spring)}.streak{background:color-mix(in srgb, var(--smart) 22%, transparent);color:var(--smart);animation:count-pop .35s var(--spring);border-radius:999px;padding:2px 10px;font-size:.85rem;font-weight:700}.streak-big{background:var(--smart);color:#10131a;animation:streak-big .7s var(--spring)}.key{transform-origin:top}.key.key-hint,.interval-key.key-hint{animation:.5s ease-out hint-pulse}.results-stars .star-on{text-shadow:0 0 18px color-mix(in srgb, var(--star) 55%, transparent)}.card,.segment,.chip,.stage,.choice,.primary,.secondary,.danger,.icon-button{transition:background-color .15s ease-out, border-color .15s ease-out, color .15s ease-out, transform .4s var(--spring)}.card:active,.segment:active,.chip:active,.stage:active,.choice:active,.primary:active,.secondary:active,.danger:active,.icon-button:active{transition-duration:.15s,.15s,.15s,70ms;transform:scale(.96)}.cards .card,.stages .stage{animation:screen-in .45s var(--ease-out) both}.cards .card:nth-child(2),.stages .stage:nth-child(2){animation-delay:70ms}.cards .card:nth-child(3),.stages .stage:nth-child(3){animation-delay:.14s}.confetti{z-index:5;pointer-events:none;position:fixed;inset:0;overflow:hidden}.confetti span{border-radius:2px;width:9px;height:14px;animation:linear both confetti-fall;position:absolute;top:-20px}@keyframes note-in{0%{opacity:0;transform:translateY(-7px)}}@keyframes note-pop{0%{transform:scale(1.4)}}@keyframes note-shake{20%{transform:translate(-2.5px)}45%{transform:translate(2px)}70%{transform:translate(-1.2px)}}@keyframes ripple{0%{opacity:.9;transform:scale(.6)}to{opacity:0;transform:scale(3.2)}}@keyframes band-pulse{50%{opacity:.45}}@keyframes count-pop{0%{transform:scale(1.3)}}@keyframes streak-big{0%{transform:scale(1.9)rotate(-8deg)}}@keyframes hint-pulse{0%{filter:brightness(1.6)}}@keyframes confetti-fall{to{transform:translate(var(--drift), 112vh) rotate(var(--spin))}}@media (prefers-reduced-motion:reduce){.confetti{display:none}.band-waiting{animation:none}}:root{--session:#ff78b0;--songs:#b68bff;--progress:#27c9c9;--pulse:#ffb43f}.tone-session{--tone:var(--session)}.tone-songs{--tone:var(--songs)}.tone-progress{--tone:var(--progress)}.tone-pulse{--tone:var(--pulse)}.band-beat{fill:color-mix(in srgb, var(--pulse) 30%, transparent);transition:none;animation:.3s ease-out beat-flash}.system-line{stroke-width:1.6px}.staff-tools{z-index:1;gap:8px;display:flex;position:absolute;top:8px;right:12px}.tool-replay{color:var(--memory);border-color:color-mix(in srgb, var(--memory) 60%, var(--line))}.tool-on{border-color:var(--bad);background:var(--bad);color:#fff;animation:1.4s ease-in-out infinite mic-live}.stage:disabled{opacity:.45}.stage-number .icon{width:20px;height:20px}.note-button{cursor:pointer}.note-hit{fill:#0000}.legend{color:var(--muted);flex-wrap:wrap;align-items:center;gap:6px 10px;font-size:.82rem;display:flex}.legend-swatch{border-radius:50%;width:12px;height:12px;margin-left:6px}.note-detail{min-height:2.8em;margin:0}.chart-weeks{grid-template-columns:repeat(var(--columns), 1fr)}.chart-weeks .chart-value{white-space:nowrap;font-size:.72rem}@keyframes beat-flash{0%{fill:color-mix(in srgb, var(--pulse) 75%, transparent)}}@keyframes mic-live{50%{box-shadow:0 0 0 6px color-mix(in srgb, var(--bad) 30%, transparent)}}.song-row{align-items:center;gap:8px;display:flex}.song-row .stage{flex:1;min-width:0}.song-form{border:1px solid var(--line);background:var(--surface);border-radius:14px;flex-direction:column;gap:10px;padding:12px 14px;display:flex}.song-form summary{cursor:pointer;font-weight:650}.song-form[open] summary{margin-bottom:10px}.text-field{color:var(--muted);flex-direction:column;gap:4px;margin-bottom:10px;font-size:.85rem;display:flex}.text-field input,.text-field textarea{border:1px solid var(--line);background:var(--bg);width:100%;color:var(--ink);font:inherit;border-radius:10px;padding:10px 12px}.text-field textarea{resize:vertical;font-family:ui-monospace,Cascadia Mono,Consolas,monospace}.text-field input:focus,.text-field textarea:focus{border-color:var(--accent);outline:none}.file-button{cursor:pointer;place-items:center;display:grid}.file-button input{display:none}