:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#0f1115;--panel:#171a21;--panel-2:#1f232c;--fg:#ebe6dc;--muted:#8d929c;--accent:#e8c27a;--accent-ink:#1a1408;--staff:#cfc9bc;--board-edge:#1e1813;--board-mid:#2b231d;--nut:#e6dbc4;--string:#c9c2b2;--tape:#78b4dc8c;--dot:#ebe6dc80;--board-line:#4a3f35;--ok:#7cc68d;--ok-ink:#0b1a0f;--bad:#e06c5f;--bad-ink:#1f0906;--mid:#d9a441;--mid-ink:#1a1203;--radius:12px;--swatch-light:#f5f1e8;--swatch-light-ink:#2a2620;--swatch-dark:#0f1115;--swatch-dark-ink:#ebe6dc;--swatch-bedtime:#000;--swatch-bedtime-ink:#e0574a;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif}:root[data-theme=bedtime]{--bg:#000;--panel:#0e0302;--panel-2:#170605;--fg:#e0574a;--muted:#8a2f27;--accent:#ff4a36;--accent-ink:#000;--staff:#c4473b;--board-edge:#080100;--board-mid:#1d0805;--nut:#a8382d;--string:#b0443a;--tape:#ff4a3659;--dot:#e0574a8c;--board-line:#3a0f0a;--ok:#ff7a5c;--ok-ink:#000;--bad:#5c1209;--bad-ink:#ff6a52;--mid:#a8321f;--mid-ink:#000}:root[data-theme=light]{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--bg:#f5f1e8;--panel:#fffdf8;--panel-2:#e4ddcf;--fg:#221f1a;--muted:#6f695f;--accent:#9c6a12;--accent-ink:#fff;--staff:#2a2620;--board-edge:#d8c7a4;--board-mid:#eadfc6;--nut:#3b3128;--string:#6e5f4b;--tape:#2878b473;--dot:#32261980;--board-line:#b8a684;--ok:#2f8a47;--ok-ink:#fff;--bad:#c2412f;--bad-ink:#fff;--mid:#b67a16;--mid-ink:#fff}*,:before,:after{box-sizing:border-box}html,body{background:var(--bg);width:100%;height:100%;color:var(--fg);overscroll-behavior:none;margin:0;overflow:hidden}body{touch-action:manipulation;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;-webkit-text-size-adjust:100%}#app{height:100dvh}.shell{flex-direction:column;height:100%;display:flex}.shell__main{flex:1;grid-template:minmax(0,1fr)/minmax(0,1fr);min-height:0;display:grid}button{font:inherit;color:inherit;cursor:pointer}:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.layout{height:100%;padding:calc(env(safe-area-inset-top) + 10px) calc(env(safe-area-inset-right) + 12px) calc(env(safe-area-inset-bottom) + 6px) calc(env(safe-area-inset-left) + 12px);gap:8px;width:100%;max-width:100vw;min-height:0;display:grid}.layout>*{min-width:0;min-height:0}.area-header{grid-area:header}.area-controls{grid-area:controls}.area-staff{grid-area:staff;display:flex}.area-info{grid-area:info}.area-board{grid-area:board;display:flex}.area-top{grid-area:top}.area-feedback{grid-area:feedback}.area-answer{grid-area:answer;display:flex}.area-content{-webkit-overflow-scrolling:touch;grid-area:content;overflow-y:auto}.area-footer{grid-area:footer}.area-chart{-webkit-overflow-scrolling:touch;grid-area:chart;overflow-y:auto}.layout--explore{grid-template:"header""controls""staff"minmax(96px,24%)"info""board"minmax(0,1fr)/minmax(0,1fr)}.layout--chart{grid-template:"header""controls""chart"minmax(0,1fr)/minmax(0,1fr)}.layout--page{grid-template:"header""content"minmax(0,1fr)"footer"/minmax(0,1fr)}.layout--drill{grid-template:"top""staff"minmax(100px,24%)"feedback""answer"minmax(0,1fr)/minmax(0,1fr)}@media (orientation:landscape){.layout--drill{grid-template:"top answer""staff answer"minmax(0,1fr)"feedback answer"/minmax(0,1fr) minmax(0,1fr)}.layout--page .area-content>*,.layout--page .area-footer{width:100%;max-width:760px;margin-inline:auto}.layout--explore{grid-template:"header board""controls board""staff board"minmax(0,1fr)"info board"/minmax(0,1fr) minmax(0,1fr)}}@media (orientation:landscape) and (width>=1024px) and (height>=600px){.layout{gap:16px;padding:20px}.layout--explore{grid-template:"header staff board""controls staff board"minmax(0,1fr)"controls info board"/240px minmax(0,1fr) minmax(340px,36%)}.layout--drill{grid-template-columns:minmax(0,1fr) minmax(360px,38%)}.layout--chart{grid-template:"header chart""controls chart"minmax(0,1fr)/240px minmax(0,1fr)}}.header{justify-content:space-between;align-items:center;gap:8px;display:flex}.header__title{letter-spacing:.04em;color:var(--accent);margin:0;font-size:1.05rem}.icon-button{border:1px solid var(--panel-2);background:var(--panel);width:36px;height:36px;color:var(--muted);border-radius:999px;flex:none;padding:0;font-size:1.05rem;line-height:1}a.icon-button{place-items:center;display:inline-grid}.icon-button.is-on{color:var(--accent);border-color:var(--accent)}.header__spacer{flex:1}.header__sub a{min-height:36px;color:var(--muted);white-space:nowrap;border-radius:999px;align-items:center;padding:6px 12px;font-size:.85rem;text-decoration:none;display:inline-flex}.header__sub a.is-on{background:var(--accent);color:var(--accent-ink);font-weight:600}.controls{flex-wrap:wrap;align-items:center;gap:6px;display:flex}.chip,.segmented button{border:1px solid var(--panel-2);background:var(--panel);min-height:36px;color:var(--muted);border-radius:999px;padding:6px 12px;font-size:.85rem}.chip.is-on{color:var(--fg);border-color:var(--muted)}.segmented{background:var(--panel);border:1px solid var(--panel-2);border-radius:999px;padding:2px;display:inline-flex}.segmented button{background:0 0;border:none;min-width:44px}.segmented button.is-on{background:var(--accent);color:var(--accent-ink);font-weight:600}.segmented--small button{min-height:32px;padding:4px 10px;font-size:.8rem}.staff{background:var(--panel);border-radius:var(--radius);width:100%;height:100%}.staff__lines line,.staff__ledger{stroke:var(--staff);stroke-width:1.1px}.staff__ink{fill:var(--staff)}.staff__note path{fill:var(--accent)}.staff__note{transform-box:fill-box;animation:.16s ease-out pop}@keyframes pop{0%{opacity:.2}to{opacity:1}}.info{background:var(--panel);border-radius:var(--radius);min-height:64px;padding:10px 14px}.info--empty{color:var(--muted);align-items:center;font-size:.9rem;display:flex}.info__name{color:var(--accent);font-size:1.8rem;font-weight:700;line-height:1.1}.info__where{font-size:1rem}.info__also{color:var(--muted);margin-top:2px;font-size:.85rem}.overlap{flex-wrap:wrap;align-items:center;gap:6px;margin-top:6px;display:flex}.overlap__label{color:var(--muted);font-size:.8rem}.fingerboard{flex:1;min-height:0;position:relative;overflow:hidden}.fingerboard svg{display:block;position:absolute;inset:0}.board-edge{stop-color:var(--board-edge)}.board-mid{stop-color:var(--board-mid)}.fingerboard__board{stroke:var(--board-line);stroke-width:1px}.fingerboard__nut{fill:var(--nut)}.fingerboard__tape{fill:var(--tape)}.fingerboard__string{stroke:var(--string);stroke-linecap:round}.fingerboard__string-name{fill:var(--fg);font-size:15px;font-weight:700}.fingerboard__finger{fill:var(--muted);font-size:12px;font-weight:600}.fingerboard__finger.is-dim{opacity:.35}.spot{cursor:pointer;outline:none}.spot__hit{fill:#0000}.spot__dot{fill:var(--board-mid);stroke:var(--dot);stroke-width:1.5px}.spot:not(.is-in-key) .spot__dot{stroke-dasharray:3 3}.spot__label{fill:var(--fg);pointer-events:none;font-weight:600}.spot.is-alt .spot__dot{stroke:var(--accent);stroke-dasharray:4 3;stroke-width:2px}.spot.is-selected .spot__dot{fill:var(--accent);stroke:var(--accent)}.spot.is-selected .spot__label{fill:var(--accent-ink)}.spot:focus-visible .spot__dot{stroke:var(--accent);stroke-width:3px}@media (hover:hover){.spot:hover .spot__hit{fill:#ffffff08}}.chart{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px;margin:0;padding:0 0 16px;list-style:none;display:grid}.chart__card{background:var(--panel);border:1px solid var(--panel-2);border-radius:var(--radius);flex-direction:column;align-items:center;gap:2px;width:100%;padding:8px 8px 10px;display:flex}.chart__card .staff{background:0 0;height:90px}.chart__name{color:var(--accent);font-size:1.15rem;font-weight:700}.chart__where{font-size:.85rem}.chart__where.is-alt{color:var(--muted);text-decoration:line-through}@media (orientation:landscape) and (width>=1024px) and (height>=600px){:is(.layout--explore,.layout--chart) .header{flex-wrap:wrap;row-gap:12px}:is(.layout--explore,.layout--chart) .header__sub{order:3;width:100%}:is(.layout--explore,.layout--chart) .header__sub a{flex:1;justify-content:center}.controls{flex-direction:column;align-items:stretch;margin-top:8px}.controls .segmented button{flex:1}.chip{text-align:left;border-radius:10px}}.chart .staff__note{animation:none}@media (width<=430px) and (orientation:portrait),(orientation:landscape) and (width<=1023px){.header--sub .header__title{display:none}}.primary,.secondary{border:none;border-radius:14px;width:100%;min-height:52px;font-size:1.05rem;font-weight:700}.primary{background:var(--accent);color:var(--accent-ink)}.secondary{background:var(--panel-2);color:var(--fg)}.primary--small{width:auto;min-height:44px;margin-top:8px;padding:0 22px}.area-footer--split{grid-template-columns:1fr 1.4fr;gap:10px;display:grid}.setup{grid-template-columns:minmax(0,1fr);gap:18px;padding-bottom:8px;display:grid}.setup__title{text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin:0 0 8px;font-size:.8rem}.choice-list{gap:8px;display:grid}.choice{text-align:left;border-radius:var(--radius);border:1px solid var(--panel-2);background:var(--panel);flex-direction:column;align-items:flex-start;gap:2px;min-height:56px;padding:12px 14px;display:flex}.choice.is-on{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}.choice__name{font-weight:650}.choice__hint{color:var(--muted);font-size:.82rem}.choice__name,.choice__hint{overflow-wrap:anywhere;max-width:100%}@media (orientation:landscape) and (width>=900px){.choice-list{grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}}.drill-top{align-items:center;gap:10px;display:flex}.progress{background:var(--panel-2);border-radius:999px;flex:1;height:8px;overflow:hidden}.progress__fill{background:var(--accent);height:100%;transition:width .25s ease-out}.drill-top__count{font-variant-numeric:tabular-nums;color:var(--muted);font-size:.9rem}.streak{font-variant-numeric:tabular-nums;min-width:3ch;color:var(--muted)}.streak.is-hot{color:var(--accent);font-weight:700}.feedback{background:var(--panel);border-radius:var(--radius);border:1px solid #0000;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:4px 12px;min-height:64px;padding:10px 14px;display:flex}.feedback p{margin:0}.feedback__prompt{color:var(--muted)}.feedback__key{color:var(--fg);font-weight:600}.feedback__message{flex:200px;font-size:1rem}.feedback__icon{border-radius:999px;place-items:center;width:1.6em;height:1.6em;margin-right:8px;font-weight:800;display:inline-grid}.feedback.is-correct{border-color:var(--ok)}.feedback.is-correct .feedback__icon{background:var(--ok);color:var(--ok-ink)}.feedback.is-wrong{border-color:var(--bad)}.feedback.is-wrong .feedback__icon{background:var(--bad);color:var(--bad-ink)}.spot.is-correct .spot__dot{fill:var(--ok);stroke:var(--ok)}.spot.is-correct .spot__label{fill:var(--ok-ink)}.spot.is-answer .spot__dot{fill:var(--accent);stroke:var(--accent)}.spot.is-answer .spot__label{fill:var(--accent-ink)}.spot.is-wrong .spot__dot{fill:var(--bad);stroke:var(--bad);stroke-dasharray:none}.spot.is-wrong .spot__label{fill:var(--bad-ink)}.spot[aria-disabled=true]{cursor:default}.pad{flex-direction:column;flex:1;justify-content:center;gap:10px;width:100%;max-width:560px;margin:0 auto;display:flex}.pad__row{grid-template-columns:repeat(14,minmax(0,1fr));gap:6px;display:grid}.pad__key{border:1px solid var(--panel-2);background:var(--panel-2);border-radius:12px;min-height:clamp(52px,11vh,84px);padding:0;font-size:1.35rem;font-weight:700}.pad__key--sharp{background:var(--panel);color:var(--muted);font-size:1.15rem}.pad__key.is-correct{background:var(--ok);color:var(--ok-ink);border-color:var(--ok)}.pad__key.is-answer{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}.pad__key.is-wrong{background:var(--bad);color:var(--bad-ink);border-color:var(--bad)}.summary{gap:16px;padding-bottom:8px;display:grid}.summary__verdict{color:var(--accent);margin:4px 0 0;font-size:1.4rem}.tiles{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;display:grid}.tile{background:var(--panel);border-radius:var(--radius);flex-direction:column;gap:2px;padding:12px 10px;display:flex}.tile__value{font-variant-numeric:tabular-nums;font-size:1.5rem;font-weight:800}.tile__label{color:var(--muted);font-size:.78rem}.error-list,.missed-list{gap:6px;margin:0;padding:0;list-style:none;display:grid}.error-list li{background:var(--panel);border-radius:10px;justify-content:space-between;padding:10px 14px;display:flex}.error-list__n{color:var(--bad);font-weight:700}.missed-list{grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}.missed{background:var(--panel);border-radius:var(--radius);grid-template-columns:120px 1fr;align-items:center;gap:10px;padding:6px 12px 6px 6px;display:grid}.missed .staff{background:0 0;height:80px}.missed .staff__note{animation:none}.missed__text{flex-direction:column;gap:2px;font-size:.9rem;display:flex}.missed__text strong{color:var(--accent);font-size:1.15rem}.missed__count{color:var(--muted);font-size:.8rem}.setup-footer{grid-template-columns:auto 1fr;align-items:center;gap:12px;display:grid}.setup-footer__length{flex-direction:column;gap:2px;display:flex}.setup-footer__length .setup__title{margin:0}@media (orientation:portrait){.pad{justify-content:flex-end;padding-bottom:4px}}.kbd-hint{display:none}@media (hover:hover) and (pointer:fine){.kbd-hint{color:var(--muted);opacity:.8;margin-top:4px;font-size:.78rem;display:block}}.muted{color:var(--muted);margin:0;font-size:.9rem}.streak-banner{border-radius:var(--radius);background:var(--panel);color:var(--muted);margin:0;padding:10px 14px}.streak-banner.is-done{color:var(--fg)}.tip{border-radius:var(--radius);border:1px solid var(--accent);background:var(--panel);align-items:flex-start;gap:10px;padding:10px 10px 10px 14px;display:flex}.tip p{flex:1;margin:0;font-size:.9rem}.mastery{align-items:center;gap:8px;width:100%;margin-top:6px;display:flex}.mastery__bar{background:var(--panel-2);border-radius:999px;flex:1;height:5px;overflow:hidden}.mastery__fill{background:var(--ok);height:100%;display:block}.mastery__text{color:var(--muted);font-variant-numeric:tabular-nums;font-size:.75rem}.stats{gap:18px;padding-bottom:8px;display:grid}.stats__summary{align-content:start;gap:16px;display:grid}@media (orientation:landscape) and (width>=700px){.stats{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start}}.stats__controls{flex-wrap:wrap;gap:6px;margin-bottom:8px;display:flex}.stats__board{height:clamp(340px,62vh,600px);display:flex}.legend{color:var(--muted);flex-wrap:wrap;gap:4px 12px;margin:0 0 4px;padding:0;font-size:.8rem;list-style:none;display:flex}.legend__item:before{content:"";vertical-align:-1px;border:1.5px solid var(--dot);background:var(--board-mid);border-radius:999px;width:10px;height:10px;margin-right:5px;display:inline-block}.legend__item.heat-weak:before{background:var(--bad);border-color:var(--bad)}.legend__item.heat-mid:before{background:var(--mid);border-color:var(--mid)}.legend__item.heat-solid:before{background:var(--ok);border-color:var(--ok)}.spot.heat-weak .spot__dot{fill:var(--bad);stroke:var(--bad)}.spot.heat-weak .spot__label{fill:var(--bad-ink)}.spot.heat-mid .spot__dot{fill:var(--mid);stroke:var(--mid)}.spot.heat-mid .spot__label{fill:var(--mid-ink)}.spot.heat-solid .spot__dot{fill:var(--ok);stroke:var(--ok)}.spot.heat-solid .spot__label{fill:var(--ok-ink)}.spot[class*=heat-].is-selected .spot__dot{stroke:var(--fg);stroke-width:3px}.spot-detail{border-radius:var(--radius);background:var(--panel);margin-top:8px;padding:10px 14px}.spot-detail strong{color:var(--accent)}.spot-detail__stats{color:var(--muted);margin-top:2px;font-size:.85rem}.history{gap:4px;margin:0;padding:0;list-style:none;display:grid}.history li{background:var(--panel);border-radius:10px;justify-content:space-between;gap:10px;padding:8px 12px;font-size:.88rem;display:flex}.history__score{font-variant-numeric:tabular-nums;font-weight:700}.backup{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;display:grid}.backup .secondary{min-height:44px;font-size:.95rem}.file-button{cursor:pointer;place-items:center;display:grid;position:relative}.file-button input{opacity:0;width:1px;height:1px;position:absolute}.file-button:focus-within{outline:2px solid var(--accent);outline-offset:2px}.danger{color:var(--bad)}.setup__note{margin-bottom:10px}.mic-error{border-radius:var(--radius);border:1px solid var(--bad);background:var(--panel);grid-column:1/-1;margin:0;padding:10px 14px;font-size:.9rem}.layout--page .mic-error{grid-area:auto}.feedback__coaching{color:var(--bad);flex-basis:100%;font-weight:600}.stand{flex-direction:column;flex:1;gap:8px;min-height:0;display:flex}.stand__mic{flex-wrap:wrap;align-items:center;gap:8px;min-height:64px;display:flex}.stand__board{opacity:.45;flex:1;min-height:0;transition:opacity .6s;display:flex}.stand__board.is-hinted{opacity:1}.stand__skip{min-height:44px;font-size:.95rem}.tuner{border-radius:var(--radius);background:var(--panel);padding:10px 14px 8px}.tuner__scale{background:var(--panel-2);border-radius:999px;height:28px;position:relative;overflow:hidden}.tuner__band{background:color-mix(in srgb, var(--ok) 25%, transparent);position:absolute;top:0;bottom:0}.tuner__center{background:var(--muted);width:2px;margin-left:-1px;position:absolute;top:4px;bottom:4px;left:50%}.tuner__needle{background:var(--muted);opacity:.3;border-radius:3px;width:6px;margin-left:-3px;transition:left 80ms linear;position:absolute;top:2px;bottom:2px}.tuner.is-voiced .tuner__needle{background:var(--mid);opacity:1}.tuner.is-in-tune .tuner__needle{background:var(--ok)}.tuner__labels{color:var(--muted);justify-content:space-between;margin-top:4px;font-size:.85rem;display:flex}.tuner__heard{font-variant-numeric:tabular-nums}.tuner.is-voiced .tuner__heard{color:var(--fg);font-weight:600}.tuner-page{justify-items:center;gap:16px;padding:8px 0 16px;display:grid}.tuner-page>.muted{text-align:center;max-width:420px}.tuner-page__ref{flex-wrap:wrap;justify-content:center;align-items:center;gap:8px;display:flex}.tuner-page__tones{gap:6px;display:flex}@media (orientation:landscape) and (height<=500px){.tuner-page{gap:10px;padding-top:0}.tuner--big{padding:8px 14px}.tuner--big .tuner__scale{height:34px}.tuner__note{margin-bottom:6px;font-size:2.6rem}.tuner__cents{font-size:1.1rem}.tuner__advice{margin-top:6px}}.tuner--big{width:min(100%,520px);padding:16px 18px 14px}.tuner--big .tuner__scale{height:44px}.tuner--big .tuner__needle{width:8px;margin-left:-4px;transition:left 60ms linear}.tuner--big.is-held .tuner__needle{opacity:.45}.tuner__tick{background:var(--muted);opacity:.6;width:1px;height:10px;position:absolute;bottom:0}.tuner__tick.is-zero{display:none}.tuner__note{color:var(--muted);justify-content:center;align-items:baseline;gap:12px;margin-bottom:10px;font-size:4.5rem;font-weight:800;line-height:1;display:flex}.tuner.is-voiced .tuner__note{color:var(--fg)}.tuner.is-in-tune .tuner__note{color:var(--ok)}.tuner__cents{font-variant-numeric:tabular-nums;min-width:4ch;font-size:1.4rem;font-weight:600}.tuner__advice{text-align:center;min-height:1.4em;color:var(--muted);margin:10px 0 0;font-size:1.05rem}.tuner.is-voiced .tuner__advice{color:var(--fg)}.tuner.is-in-tune .tuner__advice{color:var(--ok);font-weight:600}.drill--play.layout--drill{grid-template-rows:auto minmax(120px,30%) auto minmax(0,1fr)}@media (orientation:landscape){.drill--play.layout--drill{grid-template-rows:auto minmax(0,1fr) auto;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr)}}.staff__stem,.staff__barline{stroke:var(--staff);stroke-width:1.2px}.staff__pnote path{fill:var(--staff)}.staff__cursor{fill:var(--accent);opacity:.16}.staff__pnote.is-current path{fill:var(--accent)}.staff__pnote.is-current .staff__stem{stroke:var(--accent)}.staff__pnote.is-correct path{fill:var(--ok)}.staff__pnote.is-correct .staff__stem{stroke:var(--ok)}.staff__pnote.is-wrong path{fill:var(--bad)}.staff__pnote.is-wrong .staff__stem{stroke:var(--bad)}.staff__pnote.is-upcoming{opacity:.85}.setup__row{flex-wrap:wrap;gap:8px;display:flex}.tiles--two{grid-template-columns:repeat(2,minmax(0,1fr))}.key-choices{flex:1;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));align-content:end;gap:8px;display:grid}.key-choice{border:1px solid var(--panel-2);background:var(--panel-2);border-radius:14px;min-height:64px;font-size:1.1rem;font-weight:700}.key-choice.is-correct{background:var(--ok);color:var(--ok-ink)}.key-choice.is-answer{background:var(--accent);color:var(--accent-ink)}.key-choice.is-wrong{background:var(--bad);color:var(--bad-ink)}.pattern{flex-direction:column;flex:1;gap:8px;min-height:0;display:flex}.pattern__board{flex:1;min-height:0;display:flex}.pattern__check{min-height:48px}.primary:disabled{opacity:.45}.spot.is-off{opacity:.22;pointer-events:none}.spot.is-picked .spot__dot{fill:var(--accent);stroke:var(--fg);stroke-width:2.5px;stroke-dasharray:none}.metro{justify-items:center;gap:18px;padding:8px 0 16px;display:grid}.metro__dots{align-items:center;gap:14px;min-height:34px;display:flex}.metro__dot{background:var(--panel-2);border:2px solid var(--muted);border-radius:999px;width:22px;height:22px}.metro__dot.is-down{width:30px;height:30px}.metro__dot.is-on{background:var(--accent);border-color:var(--accent);animation:.18s ease-out beat}@keyframes beat{0%{transform:scale(1.35)}to{transform:scale(1)}}.metro__tempo{align-items:center;gap:18px;display:flex}.metro__step{border:1px solid var(--panel-2);background:var(--panel);border-radius:999px;width:56px;height:56px;font-size:1.8rem;line-height:1}.metro__bpm{flex-direction:column;align-items:center;min-width:140px;display:flex}.metro__value{font-variant-numeric:tabular-nums;color:var(--accent);font-size:4rem;font-weight:800;line-height:1}.metro__unit{color:var(--muted);font-size:.9rem}.metro__slider{width:min(100%,460px);accent-color:var(--accent)}.metro__presets{flex-wrap:wrap;justify-content:center;gap:6px;display:flex}.metro .setup__row{justify-content:center}.metro .muted{text-align:center;max-width:420px}.metro-chip{border:1px solid var(--accent);background:var(--panel);min-height:36px;color:var(--accent);font-variant-numeric:tabular-nums;white-space:nowrap;border-radius:999px;padding:0 10px;font-weight:700}a.choice{color:inherit;text-decoration:none}.videos{gap:12px;padding-bottom:16px;display:grid}.videos .segmented{justify-self:start}.video-search{gap:8px;display:flex}.video-search input{border:1px solid var(--panel-2);background:var(--panel);min-width:0;min-height:44px;color:var(--fg);-webkit-user-select:text;user-select:text;border-radius:12px;flex:1;padding:0 14px;font-size:16px}.video-search .primary--small{margin-top:0}.tip a{color:var(--accent)}.video-list{gap:8px;margin:0;padding:0;list-style:none;display:grid}@media (orientation:landscape) and (width>=900px){.video-list{grid-template-columns:repeat(auto-fill,minmax(360px,1fr))}}.video{border-radius:var(--radius);background:var(--panel);align-items:stretch;display:flex;overflow:hidden}.video__open{text-align:left;background:0 0;border:none;flex:1;gap:10px;min-width:0;padding:0;display:flex}.video__thumb{object-fit:cover;background:var(--panel-2);flex-shrink:0;width:128px;height:72px}.video__text{flex-direction:column;gap:2px;min-width:0;padding:8px 0;display:flex}.video__title{-webkit-line-clamp:2;-webkit-box-orient:vertical;font-size:.92rem;font-weight:600;display:-webkit-box;overflow:hidden}.video__channel{color:var(--muted);font-size:.8rem}.video__star{width:52px;color:var(--muted);background:0 0;border:none;font-size:1.5rem}.video__star.is-on{color:var(--muted);width:auto;padding:8px 12px;font-size:.85rem}.video__star.is-on:hover{color:var(--error,#c44)}.player{gap:6px;display:grid}.player__stick{z-index:1;background:var(--bg);gap:8px;padding-bottom:8px;display:grid;position:sticky;top:0}.player__frame{aspect-ratio:16/9;border-radius:var(--radius);background:#000;justify-self:center;width:min(100%,92.4444dvh);overflow:hidden}.player__frame iframe{border:0;width:100%;height:100%;display:block}.player__controls{grid-template-columns:1fr 1.6fr 1fr 1fr;gap:8px;display:grid}.player__controls button{min-height:48px;font-size:1.15rem}.player__controls .primary{font-size:1rem}.player__controls .secondary:disabled{opacity:.4}.player__controls .secondary.is-on{background:var(--accent);color:var(--accent-ink)}.marks{gap:6px;margin:0;padding:0;list-style:none;display:grid}.mark{background:var(--panel);border:1px solid #0000;border-radius:12px;align-items:stretch;display:flex}.mark.is-current{border-color:var(--accent)}.mark.is-looping{background:var(--panel-2)}.mark__jump{text-align:left;background:0 0;border:none;flex:1;align-items:center;gap:12px;min-width:0;min-height:48px;padding:0 12px;display:flex}.mark__time{font-variant-numeric:tabular-nums;color:var(--accent);min-width:3.2em;font-weight:800}.mark__label{text-overflow:ellipsis;white-space:nowrap;flex:1;overflow:hidden}.mark__tool{width:44px;color:var(--muted);background:0 0;border:none;font-size:1rem}.marks__hint{margin:0}.video__marks{color:var(--accent)}.player__bar{justify-content:space-between;align-items:center;display:flex}.player__bar a{color:var(--accent);font-size:.9rem}.player__bar-buttons{gap:6px;display:flex}.player__music{flex-wrap:wrap;gap:6px;display:flex}.player__piece{text-overflow:ellipsis;white-space:nowrap;max-width:100%;overflow:hidden}.mark__bar{min-width:44px;color:var(--accent);font-variant-numeric:tabular-nums;background:0 0;border:none;padding:0 8px;font-weight:700}.player--piece{display:contents}.player--piece .player__frame{width:min(100%,42.6667dvh)}@media (height<=500px){.player--piece .player__stick{position:static}.player--piece .player__frame{width:min(100%,99.5556dvh)}}.mark-chips{scrollbar-width:none;gap:6px;margin:0;padding:0 0 2px;list-style:none;display:flex;overflow-x:auto}.mark-chip{white-space:nowrap;background:var(--panel);min-height:36px;color:var(--fg);border:1px solid #0000;border-radius:999px;padding:0 12px;font-size:.85rem}.mark-chip .mark__time{min-width:0}.mark-chip.is-current{border-color:var(--accent)}.mark-chip.is-looping{background:var(--panel-2)}.mark-chip__bar{color:var(--muted)}.piece-videos__video{text-overflow:ellipsis;white-space:nowrap;max-width:100%;overflow:hidden}.score-page__watch{color:var(--accent);border-color:var(--accent)}.form-error{color:var(--bad);margin:8px 0 0;font-size:.9rem}.library__hint{margin-top:8px}.score-page{grid-template-columns:minmax(0,1fr);gap:10px;padding-bottom:8px;display:grid}.score-page__head{align-items:center;gap:10px;display:flex}.score-page__head>*{min-width:0}.score-page__head h2,.score-page__head p{overflow-wrap:anywhere}.score-page__title{margin:0;font-size:1.2rem}.score-page__back{background:var(--panel-2);width:44px;height:44px;color:var(--fg);border-radius:12px;flex:none;place-items:center;font-size:1.6rem;text-decoration:none;display:grid}.score-page__warn{margin:0}.score-page__footer{gap:8px;padding-top:8px;display:grid}.score-page__info{flex-wrap:wrap;align-items:center;gap:6px 10px;min-height:0;padding:8px 14px;display:flex}.score-page__info p{margin:0}.score-page__actions{gap:8px;display:flex}.score-page__actions .secondary{min-height:44px;font-size:.95rem}.score{background:var(--panel);border-radius:var(--radius);width:100%;padding:10px 6px;overflow:hidden}.score__svg{margin:0 auto;display:block}.score__lines line,.score__ledger,.score__bar{stroke:var(--staff);stroke-width:1.1px}.score__stem{stroke:var(--staff);stroke-width:1.2px}.score__bracket{fill:none;stroke:var(--staff);stroke-width:1.1px}.score__ink{fill:var(--staff)}.score__number,.score__tuplet{fill:var(--muted);font-size:9px;font-style:italic}.score__finger{fill:var(--staff);font-size:10px;font-weight:700}.score__hit{fill:#0000;cursor:pointer}.score__cursor{fill:var(--accent);opacity:.18}.score__event.is-current .score__ink{fill:var(--accent)}.score__event.is-current .score__stem,.score__event.is-current .score__ledger{stroke:var(--accent)}@media (orientation:landscape){.layout--score .area-content>*,.layout--score .area-footer{max-width:1100px}}.stopbar{z-index:20;background:var(--bg);justify-content:center;padding:6px 0;display:flex;position:sticky;top:0}.stopbar__btn{min-height:44px;padding:0 28px}.score-tools--pinned{z-index:20;background:var(--bg);padding:6px 0;position:sticky;top:0}.score-tools{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.score-tools__play{flex:auto;width:auto;max-width:260px;min-height:44px;padding:0 18px;font-size:1rem}.score-tools__play.is-on{background:var(--panel-2);color:var(--fg)}.score-tools__chips{flex-wrap:wrap;gap:6px;width:100%;display:flex}.score-tools__loop{flex-wrap:wrap;align-items:center;gap:8px;width:100%;display:flex}.score-tools__loop select,.chip--select select{border:1px solid var(--panel-2);background:var(--panel-2);min-height:36px;color:var(--fg);font:inherit;border-radius:10px;padding:0 8px}.chip--select{align-items:center;gap:6px;padding-block:0;display:inline-flex}.chip--select select{max-width:9.5em;min-height:30px;font-size:.85rem}.stepper{border:1px solid var(--panel-2);background:var(--panel);border-radius:999px;align-items:center;display:inline-flex}.stepper button{width:44px;height:44px;color:var(--fg);background:0 0;border:none;font-size:1.3rem}.stepper__value{text-align:center;font-variant-numeric:tabular-nums;min-width:3.6em;font-weight:700}.score-page__transposed{align-items:center;margin:0}@media (orientation:landscape) and (height<=500px){.score-tools__chips{width:auto}.score-tools__play{max-width:180px}.score-page{gap:6px}}.layout--score.has-board{grid-template-rows:auto minmax(0,1fr) minmax(150px,30%) auto;grid-template-areas:"header""content""board""footer"}@media (orientation:landscape){.layout--score.has-board{grid-template:"header header""content board"minmax(0,1fr)"footer board"/minmax(0,1fr) minmax(150px,26%)}}.link-button{color:var(--accent);font:inherit;cursor:pointer;background:0 0;border:none;padding:0;text-decoration:underline}.field{color:var(--muted);gap:4px;font-size:.85rem;display:grid}.field input,.field select,.field textarea,.bar-editor__text{border:1px solid var(--panel-2);background:var(--panel);min-height:44px;color:var(--fg);font:inherit;border-radius:10px;width:100%;padding:0 10px;font-size:1rem}.scan,.scan__code{gap:8px;display:grid}.scan__code .primary--small{justify-self:start;margin-top:0}.scan__button.is-busy{opacity:.7}.scan__button.is-busy:after{content:"";vertical-align:middle;border:2px solid;border-right-color:#0000;border-radius:50%;width:16px;height:16px;margin-left:10px;animation:.8s linear infinite spin;display:inline-block}.scan__button{justify-content:center;align-items:center;display:flex}@keyframes spin{to{transform:rotate(360deg)}}.review-details{grid-template-columns:1fr 1fr;gap:8px;display:grid}.review-details .field:not(.field--small){grid-column:1/-1}@media (width>=700px){.review-details{grid-template-columns:2fr 2fr 1fr 1fr}.review-details .field:not(.field--small){grid-column:auto}}.review-pages{gap:8px;padding-bottom:2px;display:flex;overflow-x:auto}.review-page{border:1px solid var(--panel-2);background:var(--panel);width:72px;height:96px;color:var(--fg);border-radius:8px;flex:none;place-items:center;padding:0;font-size:.85rem;text-decoration:none;display:grid;overflow:hidden}.review-page img{object-fit:cover;width:100%;height:100%}.review-flags{flex-wrap:wrap;gap:6px;margin:0;padding:0;list-style:none;display:flex}.review-flags .chip{text-align:left;border-color:var(--mid);color:var(--fg)}.score__flag{fill:var(--mid);opacity:.16}.review-footer{gap:8px;padding-top:8px;display:grid}.review-actions{flex-wrap:wrap;align-items:center;gap:6px;display:flex}.review-save{margin:0 0 0 auto}.note-editor{background:var(--panel);border-radius:var(--radius);gap:6px;padding:8px 10px;display:grid}.note-editor__head{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.note-editor__head .chip:last-child{margin-left:auto}.note-editor__row{flex-wrap:wrap;gap:6px;display:flex}.note-editor__row .chip{min-width:44px;min-height:40px;color:var(--fg);font-size:1rem}.note-editor .chip:disabled{opacity:.35}.chip--dur{font-size:1.2rem;line-height:1}.bar-editor__text{resize:vertical;padding:8px 10px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.bar-editor .primary--small{margin-top:0}.area-pages{display:none}@media (orientation:landscape) and (width>=1024px) and (height>=600px){.layout--review.has-pages{grid-template:"header header""pages content"minmax(0,1fr)"pages footer"/minmax(0,1fr) minmax(0,1.1fr)}.layout--review.has-pages .area-pages{border-radius:var(--radius);grid-area:pages;align-content:start;gap:8px;display:grid;overflow-y:auto}.area-pages img{border-radius:var(--radius);width:100%;display:block}.layout--review.has-pages .review-pages{display:none}}.sync{flex-wrap:wrap;align-items:center;gap:8px;font-size:.9rem;display:flex}.sync__text{min-width:10em;color:var(--muted);flex:1}.sync__dot{background:var(--muted);border-radius:50%;flex:none;width:9px;height:9px}.sync__dot.is-idle{background:var(--ok)}.sync__dot.is-syncing{background:var(--accent);animation:.8s ease-in-out infinite alternate pop}.sync__dot.is-error,.sync__dot.is-off{background:var(--bad)}.area-content>.sync,.area-content>.scan:first-child{margin-bottom:14px}.page-viewer{z-index:20;background:var(--bg);padding:calc(env(safe-area-inset-top) + 8px) 8px calc(env(safe-area-inset-bottom) + 8px);touch-action:pinch-zoom pan-x pan-y;position:fixed;inset:0;overflow:auto}.page-viewer img{max-width:100%;margin:0 auto;display:block}.page-viewer__close{top:calc(env(safe-area-inset-top) + 10px);position:fixed;right:12px}@media (width<=430px){.header{gap:4px}.header__sub a{padding:6px 9px}.metro-chip{padding:0 8px}}.score__event.is-correct .score__ink{fill:var(--ok)}.score__event.is-correct .score__stem{stroke:var(--ok)}.score__event.is-wrong .score__ink{fill:var(--bad)}.score__event.is-wrong .score__stem{stroke:var(--bad)}.spot.is-tune .spot__dot{fill:var(--mid);stroke:var(--mid);stroke-dasharray:none}.spot.is-tune .spot__label{fill:var(--mid-ink)}.scale-picker{gap:8px;display:grid}.scale-picker__presets{scrollbar-width:none;align-items:center;gap:6px;padding-bottom:2px;display:flex;overflow-x:auto}.scale-picker__presets::-webkit-scrollbar{display:none}.scale-picker__presets .chip{white-space:nowrap;flex:none}.scale-picker__label{text-transform:uppercase;letter-spacing:.06em;color:var(--muted);flex:none;padding-left:4px;font-size:.7rem}.scale-picker__label:not(:first-child){padding-left:10px}@media (width>=900px){.scale-picker__presets{flex-wrap:wrap;overflow:visible}}.scale-picker__row{flex-wrap:wrap;align-items:center;gap:6px;display:flex}.scale-picker .chip:disabled,.scale-picker button:disabled{opacity:.4}.scale-picker .segmented{flex-wrap:wrap}.scale-picker__presets .chip.is-on{color:var(--fg);border-color:var(--accent)}a.chip{align-items:center;text-decoration:none;display:inline-flex}.scale-about{gap:4px;font-size:.9rem;display:grid}.scale-about p{margin:0}.scale-patterns{flex-wrap:wrap;gap:4px 14px;margin:0;padding:0;list-style:none;display:flex}.scale-patterns__fingers{font-variant-numeric:tabular-nums;letter-spacing:.04em}.scale-run{gap:8px;display:grid}.scale-run__lead{margin:0;font-size:.85rem}.scale-run__buttons{margin:0}.scale-run__head{justify-content:space-between;align-items:center;gap:8px;display:flex}.scale-run__count{font-variant-numeric:tabular-nums}.scale-run__message{min-height:1.4em;margin:0}.scale-run__off{color:var(--muted);margin:0;padding-left:18px;font-size:.9rem}@media (orientation:landscape) and (height<=500px){.scale-run__lead{display:none}}.drone-page{justify-items:center;gap:14px;padding:8px 0 16px;display:grid}.drone-now{border-radius:var(--radius);border:1px solid var(--panel-2);background:var(--panel);justify-items:center;gap:2px;width:min(100%,420px);padding:12px 14px;display:grid}.drone-now.is-on{border-color:var(--accent)}.drone-now__note{font-size:3rem;font-weight:700;line-height:1.1}.drone-now.is-on .drone-now__note{color:var(--accent)}.drone-now__detail{color:var(--muted);font-size:.9rem}.drone-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;width:min(100%,420px);display:grid}.drone-grid__note{border:1px solid var(--panel-2);background:var(--panel);min-height:46px;color:var(--fg);border-radius:10px;font-size:1.1rem;font-weight:600}.drone-grid__note.is-rare{color:var(--muted)}.drone-grid__note.is-on{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}.drone-volume{align-items:center;gap:10px;width:min(100%,420px);display:flex}.drone-volume input{accent-color:var(--accent);flex:1}.drone-tip{gap:6px;max-width:520px;font-size:.9rem;display:grid}.drone-tip p{margin:0}@media (orientation:landscape) and (height<=500px){.drone-page{gap:8px;padding-top:0}.drone-now{padding:6px 12px}.drone-now__note{font-size:2rem}.drone-grid{grid-template-columns:repeat(6,minmax(0,1fr))}.drone-grid__note{min-height:40px}}.settings{align-content:start;gap:18px;display:grid}.settings section{gap:10px;display:grid}.choice--theme{color:inherit;font:inherit}.choice--theme .choice__name{align-items:center;gap:10px;display:inline-flex}.theme-swatch{border:1px solid var(--muted);border-radius:999px;flex:none;width:22px;height:22px}.theme-swatch--light{background:linear-gradient(135deg, var(--swatch-light) 50%, var(--swatch-light-ink) 50%)}.theme-swatch--dark{background:linear-gradient(135deg, var(--swatch-dark) 50%, var(--swatch-dark-ink) 50%)}.theme-swatch--bedtime{background:linear-gradient(135deg, var(--swatch-bedtime) 50%, var(--swatch-bedtime-ink) 50%)}.theme-swatch--auto{background:linear-gradient(90deg, var(--swatch-light) 50%, var(--swatch-dark) 50%)}:root[data-theme=bedtime] .theme-swatch{opacity:.35}.tabbar{background:var(--panel);border-top:1px solid var(--panel-2);padding:6px calc(env(safe-area-inset-right) + 6px) calc(env(safe-area-inset-bottom) + 4px) calc(env(safe-area-inset-left) + 6px);flex:none;display:flex}.tabbar a{min-width:0;min-height:52px;color:var(--muted);letter-spacing:.01em;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:3px;font-size:.7rem;font-weight:600;text-decoration:none;display:flex}.tabbar__icon{border-radius:999px;place-items:center;width:54px;height:30px;transition:background .15s;display:grid}.tabbar a.is-on{color:var(--fg)}.tabbar a.is-on .tabbar__icon{background:var(--panel-2);color:var(--accent)}.tabbar a:active .tabbar__icon{background:var(--panel-2)}.has-nav .layout{padding-bottom:6px}@media (orientation:landscape){.shell{flex-direction:row}.shell__main{order:2}.tabbar{width:calc(78px + env(safe-area-inset-left));border-top:none;border-right:1px solid var(--panel-2);padding:calc(env(safe-area-inset-top) + 6px) 4px calc(env(safe-area-inset-bottom) + 6px) calc(env(safe-area-inset-left) + 4px);flex-direction:column;order:1;justify-content:center;gap:4px}.tabbar a{flex:none;min-height:56px}.has-nav .layout{padding-left:12px;padding-bottom:calc(env(safe-area-inset-bottom) + 6px)}}@media (orientation:landscape) and (width>=1024px) and (height>=600px){.tabbar{justify-content:flex-start;gap:8px;width:92px;padding-top:20px}.tabbar a{min-height:64px;font-size:.74rem}.has-nav .layout{padding-bottom:20px;padding-left:20px}}.recorder{justify-items:start;gap:8px;display:grid}.record-button{border:1px solid var(--panel-2);background:var(--panel);min-height:52px;color:var(--fg);border-radius:999px;align-items:center;gap:10px;padding:0 18px;font-size:1rem;font-weight:600;display:flex}.record-button__dot{background:var(--bad);border-radius:50%;flex:none;width:14px;height:14px}.record-button.is-recording{border-color:var(--bad)}.record-button.is-recording .record-button__dot{animation:.8s ease-in-out infinite alternate pop}.record-take{gap:10px;display:grid}.record-take audio{width:100%}.record-take__actions{gap:8px;display:flex}.recording-list{gap:8px;margin:0;padding:0;list-style:none;display:grid}.recording-row{border-radius:var(--radius);background:var(--panel);gap:6px;padding:10px 12px;display:grid}.recording-row__head{color:var(--muted);justify-content:space-between;gap:10px;font-size:.85rem;display:flex}.recording-row__duration{font-variant-numeric:tabular-nums}.recording-row audio{width:100%}.recording-row__note{resize:vertical;font-size:.9rem}.piece-recordings{gap:8px;display:grid}.linked-video{align-items:stretch;min-width:0;max-width:100%;display:inline-flex}.linked-video>.piece-videos__video{border-radius:18px 0 0 18px;min-width:0}.linked-video>.linked-video__remove{border-left:0;border-radius:0 18px 18px 0;flex:0 0 44px;min-height:44px;padding:0;font-size:1.2rem}.linked-video__remove:hover{color:var(--error,#c44)}
