@layer tokens{:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;--font:"Sora", system-ui, sans-serif;--bg:var(--lightningcss-light,#e7eaef)var(--lightningcss-dark,#0b0d12);--bg-glow-1:var(--lightningcss-light,#c9d3e4)var(--lightningcss-dark,#1d2945);--bg-glow-2:var(--lightningcss-light,#ddd7cf)var(--lightningcss-dark,#1a2b2e);--text:var(--lightningcss-light,#14171f)var(--lightningcss-dark,#eef0f5);--muted:var(--lightningcss-light,#4a5163)var(--lightningcss-dark,#a9afbe);--link:var(--lightningcss-light,#2b4fb0)var(--lightningcss-dark,#b7c8f5);--border:var(--lightningcss-light,#14171f1a)var(--lightningcss-dark,#ffffff1f);--well:var(--lightningcss-light,#14171f0d)var(--lightningcss-dark,#ffffff12);--track:var(--lightningcss-light,#14171f24)var(--lightningcss-dark,#ffffff29);--surface:var(--lightningcss-light,#f7f8fa)var(--lightningcss-dark,#171a22);--field:var(--lightningcss-light,#ffffffbf)var(--lightningcss-dark,#00000040);--accent:var(--lightningcss-light,#2f55be)var(--lightningcss-dark,#a8bdf2);--accent-text:var(--lightningcss-light,#fff)var(--lightningcss-dark,#0b0d12);--accent-soft:var(--lightningcss-light,#2f55be1f)var(--lightningcss-dark,#a8bdf229);--accent-glow:var(--lightningcss-light,#2f55be40)var(--lightningcss-dark,#a8bdf240);--right:var(--lightningcss-light,#1e6e44)var(--lightningcss-dark,#8fddb0);--right-strong:var(--lightningcss-light,#2e9e62)var(--lightningcss-dark,#6fcf97);--right-soft:var(--lightningcss-light,#2e9e621f)var(--lightningcss-dark,#6fcf9724);--wrong:var(--lightningcss-light,#a12a1e)var(--lightningcss-dark,#f2a39a);--wrong-soft:var(--lightningcss-light,#b423181a)var(--lightningcss-dark,#f2a39a24);--near:var(--lightningcss-light,#8a3b1c)var(--lightningcss-dark,#f2b8a0);--near-soft:var(--lightningcss-light,#d66e3c21)var(--lightningcss-dark,#f2a08024);--warn-bg:var(--lightningcss-light,#fbefd2)var(--lightningcss-dark,#3a3120);--warn-border:var(--lightningcss-light,#e8c46a)var(--lightningcss-dark,#7a6430);--glass:var(--lightningcss-light,#ffffff8c)var(--lightningcss-dark,#ffffff0f);--glass-strong:var(--lightningcss-light,#ffffffd9)var(--lightningcss-dark,#ffffff1f);--glass-soft:var(--lightningcss-light,#fff6)var(--lightningcss-dark,#ffffff0a);--glass-edge:var(--lightningcss-light,#ffffffd9)var(--lightningcss-dark,#ffffff1f);--glass-highlight:var(--lightningcss-light,#fff)var(--lightningcss-dark,#ffffff2e);--glass-blur:blur(30px) saturate(160%);--shadow-color:var(--lightningcss-light,#141c2d17)var(--lightningcss-dark,#0006);--shadow:0 20px 50px var(--shadow-color);--shadow-high:0 34px 80px var(--shadow-color);--paper:var(--lightningcss-light,#fffffff0)var(--lightningcss-dark,#f1f2f5);--paper-shadow:0 20px 50px var(--lightningcss-light,#141c2d1a)var(--lightningcss-dark,#00000073);--note-due:#2f55be;--note-hit:#1f9d55;--note-near:#d08a00;--note-miss:#d64545;--note-muted:#a8a8a8;--note-landmark:#8a45c2;--key-white:var(--lightningcss-light,#fff)var(--lightningcss-dark,#e9eaee);--key-landmark:var(--lightningcss-light,#ead9f7)var(--lightningcss-dark,#d6c3e8);--hand:#dfe3ee;--hand-edge:#8a91a8;--key-black:var(--lightningcss-light,#262b38)var(--lightningcss-dark,#161922);--hint:var(--lightningcss-light,#f2b84b)var(--lightningcss-dark,#d9a23b);--hint-left:var(--lightningcss-light,#4fb3bf)var(--lightningcss-dark,#3a9aa5);--radius-s:14px;--radius:22px;--radius-l:30px;--radius-xl:38px;--pill:999px;--ease:cubic-bezier(.2, .8, .2, 1);--ease-out:cubic-bezier(.16, 1, .3, 1);--dur-fast:.15s;--dur:.22s;--dur-slow:.32s}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial}}[data-theme=light]{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}[data-theme=dark]{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}@media (prefers-reduced-motion:reduce){:root{--dur-fast:1ms;--dur:1ms;--dur-slow:1ms}}}@layer base{@font-face{font-family:Sora;font-style:normal;font-weight:100 800;font-display:swap;src:url(/fonts/sora-latin.woff2)format("woff2");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Sora;font-style:normal;font-weight:100 800;font-display:swap;src:url(/fonts/sora-latin-ext.woff2)format("woff2");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}*{box-sizing:border-box}[hidden]{display:none!important}:root{font-family:var(--font);background:var(--bg);color:var(--text);accent-color:var(--accent);font-size:15px;line-height:1.45}body{min-height:100dvh;color:var(--text);-webkit-font-smoothing:antialiased;margin:0}body:before{content:"";z-index:-1;pointer-events:none;background:radial-gradient(42rem 42rem at 100% -10%, var(--bg-glow-1), transparent 70%), radial-gradient(40rem 40rem at -5% 110%, var(--bg-glow-2), transparent 70%);position:fixed;inset:0}h1,h2,h3,h4{letter-spacing:-.03em;font-weight:700;line-height:1.15}h1{font-size:2.25rem}h2{font-size:1.6rem}h3{letter-spacing:-.02em;font-size:1.15rem}a{color:var(--link)}strong{font-weight:650}:focus-visible{outline:3px solid color-mix(in srgb, var(--accent) 55%, transparent);outline-offset:2px}input,select,textarea{font:inherit;color:var(--text)}input:is([type=text],[type=email],[type=password],[type=number],[type=search]),select,textarea{border:1px solid var(--border);border-radius:var(--pill);background:var(--field);box-shadow:inset 0 1px 2px var(--shadow-color);transition:border-color var(--dur-fast) var(--ease), box-shadow var(--dur-fast) var(--ease);padding:.7rem 1.1rem}textarea{border-radius:var(--radius)}input:is([type=text],[type=email],[type=password],[type=number],[type=search]):focus,select:focus,textarea:focus{border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-soft);outline:none}input[type=checkbox],input[type=radio]{width:1.1rem;height:1.1rem}table{border-collapse:collapse;font-variant-numeric:tabular-nums;width:100%}th,td{border-bottom:1px solid var(--border);text-align:left;padding:.55rem .7rem}th{color:var(--muted);font-weight:600}progress{accent-color:var(--accent)}}@layer components{.muted{color:var(--muted)}button,a.button{border:1px solid var(--glass-edge);border-radius:var(--pill);background:var(--glass-strong);min-height:2.75rem;box-shadow:inset 0 1px 0 var(--glass-highlight);color:var(--text);font:inherit;cursor:pointer;transition:background-color var(--dur-fast) var(--ease), box-shadow var(--dur-fast) var(--ease), transform var(--dur-fast) var(--ease), opacity var(--dur-fast) var(--ease);justify-content:center;align-items:center;gap:.5rem;padding:.65rem 1.25rem;font-weight:600;line-height:1.2;text-decoration:none;display:inline-flex}button:hover,a.button:hover{background:color-mix(in srgb, var(--glass-strong) 70%, var(--text) 6%)}button:active,a.button:active{transform:scale(.97)}button.primary,a.button.primary{background:var(--accent);box-shadow:inset 0 1px 0 #ffffff59, 0 12px 28px var(--accent-glow);color:var(--accent-text);border-color:#0000}button.primary:hover,a.button.primary:hover{background:color-mix(in srgb, var(--accent) 88%, var(--text))}button.big,a.button.big{min-height:3.25rem;padding:.9rem 1.9rem .9rem 1.6rem;font-size:1.05rem}button.quiet,a.button.quiet{box-shadow:none;color:var(--link);background:0 0;border-color:#0000;padding-inline:.6rem}button.quiet:hover,a.button.quiet:hover{background:var(--well)}button.danger,a.button.danger{border-color:color-mix(in srgb, var(--wrong) 35%, transparent);box-shadow:none;color:var(--wrong);background:0 0}button.icon-button,a.button.icon-button{background:var(--well);width:2.75rem;box-shadow:none;border-color:#0000;padding:0}button:disabled{opacity:.5;cursor:default;transform:none}button.link{min-height:0;box-shadow:none;color:var(--link);background:0 0;border:0;margin-left:.3rem;padding:0;font-weight:600;text-decoration:underline;display:inline}.icon{fill:none;stroke:currentColor;stroke-width:1.9px;stroke-linecap:round;stroke-linejoin:round;flex:none;width:1.3rem;height:1.3rem}.icon.filled{fill:currentColor;stroke:none}:is(button,.button) .icon{width:1.05rem;height:1.05rem}.actions{flex-wrap:wrap;align-items:center;gap:.75rem 1rem;display:flex}.actions.center{justify-content:center}.glass,.panel,.card{border:1px solid var(--glass-edge);border-radius:var(--radius-l);background:var(--glass);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);box-shadow:inset 0 1px 0 var(--glass-highlight), var(--shadow)}.glass.hero{border-radius:var(--radius-xl);box-shadow:inset 0 1px 0 var(--glass-highlight), var(--shadow-high);gap:1.5rem;padding:2.25rem 2.5rem}.panel{gap:1.25rem;padding:1.6rem 1.75rem;display:grid}.panel>:is(h2,h3),.panel p{margin:0}.eyebrow{color:var(--accent);margin:0;font-size:.9rem;font-weight:600}@supports not ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){:root{--glass:var(--surface);--glass-soft:var(--surface)}}@media (prefers-reduced-transparency:reduce){:root{--glass:var(--surface);--glass-soft:var(--surface);--glass-strong:var(--surface)}}.cards{grid-template-columns:repeat(auto-fill,minmax(14rem,1fr));gap:.9rem;margin:0;padding:0;list-style:none;display:grid}.card{border-radius:var(--radius);background:var(--glass-soft);height:100%;box-shadow:inset 0 1px 0 var(--glass-highlight), 0 16px 40px var(--shadow-color);color:var(--text);transition:transform var(--dur-fast) var(--ease), background-color var(--dur-fast) var(--ease);align-content:start;gap:.35rem;padding:1.15rem 1.25rem;text-decoration:none;display:grid}a.card:hover{background:var(--glass-strong);transform:translateY(-2px)}.card span{color:var(--muted)}.card .status{font-size:.9rem}.card .status.done{color:var(--right)}.card.disabled{opacity:.55}.list-group{border:1px solid var(--glass-edge);border-radius:var(--radius-l);background:var(--glass-soft);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);box-shadow:inset 0 1px 0 var(--glass-highlight), 0 20px 50px var(--shadow-color);gap:2px;margin:0;padding:.4rem;list-style:none;display:grid}.list-row{border-radius:var(--radius);min-height:3.25rem;color:var(--text);transition:background-color var(--dur-fast) var(--ease);align-items:center;gap:.9rem;padding:.7rem .9rem;text-decoration:none;display:flex}a.list-row:hover,button.list-row:hover{background:var(--well)}button.list-row{width:100%;box-shadow:none;font-weight:inherit;text-align:left;background:0 0;border:0;justify-content:flex-start}button.list-row:active{transform:none}.list-row.current{background:var(--glass-strong);box-shadow:inset 0 1px 0 var(--glass-highlight), 0 4px 14px var(--shadow-color)}.list-row .row-text{flex:1;min-width:0;display:grid}.list-row .row-title{font-weight:600}.list-row .row-note{color:var(--muted);font-size:.88rem}.list-row .row-value{color:var(--muted);white-space:nowrap;font-size:.92rem}.list-row .chevron{width:1rem;height:1rem;color:var(--muted)}.check{border:1.5px solid var(--track);width:1.85rem;height:1.85rem;color:var(--muted);border-radius:50%;flex:none;place-items:center;font-size:.85rem;font-weight:650;display:inline-grid}.check .icon{stroke-width:3px;width:.95rem;height:.95rem}.done>.check,.check.done{background:var(--text);color:var(--bg);border-color:#0000}.next>.check,.current>.check,.check.current{background:var(--accent);color:var(--accent-text);border-color:#0000}.badge{border-radius:var(--pill);background:var(--accent-soft);color:var(--accent);white-space:nowrap;vertical-align:middle;margin-left:.5rem;padding:.15rem .55rem;font-size:.75rem;font-weight:650}.chips,.segmented{border-radius:var(--pill);background:var(--well);flex-wrap:wrap;gap:3px;padding:4px;display:inline-flex}.chips{border:0;width:fit-content;max-width:100%}.chip,.segmented label{border-radius:var(--pill);min-height:2.4rem;box-shadow:none;color:var(--muted);background:0 0;border:0;padding:.5rem 1rem;font-size:.92rem;font-weight:500}.chip[aria-pressed=true]{background:var(--glass-strong);box-shadow:inset 0 1px 0 var(--glass-highlight), 0 2px 8px var(--shadow-color);color:var(--text);font-weight:600}.segmented label:has(input:checked){background:var(--glass-strong);box-shadow:inset 0 1px 0 var(--glass-highlight), 0 2px 8px var(--shadow-color);color:var(--text);font-weight:600}.segmented{border:0;width:fit-content;max-width:100%;margin:0}.segmented legend{clip-path:inset(50%);width:1px;height:1px;position:absolute;overflow:hidden}.segmented label{cursor:pointer;transition:background-color var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease);align-items:center;display:inline-flex}.segmented input{opacity:0;pointer-events:none;position:absolute}.segmented label:has(input:focus-visible){outline:3px solid color-mix(in srgb, var(--accent) 55%, transparent);outline-offset:2px}.tabs{border-radius:var(--pill);background:var(--well);scrollbar-width:none;gap:3px;width:fit-content;max-width:100%;padding:4px;display:flex;overflow-x:auto}.tab{border-radius:var(--pill);color:var(--muted);white-space:nowrap;transition:background-color var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease);flex:none;padding:.55rem 1rem;font-size:.92rem;font-weight:500;text-decoration:none}.tab:hover{color:var(--text)}.tab[aria-current=page]{background:var(--glass-strong);box-shadow:inset 0 1px 0 var(--glass-highlight), 0 2px 8px var(--shadow-color);color:var(--text);font-weight:600}.status-pill{border-radius:var(--pill);background:var(--well);align-items:center;gap:.5rem;width:fit-content;padding:.55rem 1rem;font-size:.92rem;font-weight:600;display:inline-flex}.status-pill .icon{stroke-width:2.8px;width:1rem;height:1rem}.status-pill.right{background:var(--right-soft);color:var(--right)}.status-pill.wrong{background:var(--wrong-soft);color:var(--wrong)}.status-pill.near{background:var(--near-soft);color:var(--near)}.dot{background:var(--muted);border-radius:50%;flex:none;width:.5rem;height:.5rem;display:inline-block}.dot.on{background:var(--right-strong)}.step-dots{gap:4px;display:inline-flex}.step-dots span{border-radius:var(--pill);background:var(--track);width:1.4rem;height:6px;transition:background-color var(--dur) var(--ease)}.step-dots .done{background:var(--text)}.step-dots .current{background:var(--accent)}.progress-bar{border-radius:var(--pill);background:var(--track);height:6px;display:block;overflow:hidden}.progress-bar span{border-radius:var(--pill);background:var(--accent);height:100%;transition:width var(--dur-slow) var(--ease-out);display:block}.switch{border-radius:var(--pill);background:var(--track);appearance:none;cursor:pointer;width:3.1rem;height:1.85rem;transition:background-color var(--dur) var(--ease);flex:none;margin:0;position:relative}.switch:after{content:"";width:calc(1.85rem - 6px);height:calc(1.85rem - 6px);transition:transform var(--dur) var(--ease);background:#fff;border-radius:50%;position:absolute;top:3px;left:3px;box-shadow:0 2px 6px #0003}.switch:checked{background:var(--accent)}.switch:checked:after{transform:translate(1.25rem)}.field{gap:.45rem;font-size:.92rem;font-weight:500;display:grid}.field .error{color:var(--wrong);align-items:center;gap:.4rem;font-size:.85rem;display:flex}.field:has(.error) input{border-color:var(--wrong);box-shadow:0 0 0 4px var(--wrong-soft)}.setting{align-items:center;gap:.9rem;display:flex}.setting-text{flex:1;display:grid}.setting-text .muted{font-size:.88rem}.setting input[type=range]{flex:1;max-width:16rem}.paper{border-radius:var(--radius);background:var(--paper);box-shadow:var(--paper-shadow);color:#000;justify-content:center;padding:.75rem 1.25rem;display:flex}.staff{width:min(100%,560px)}.staff svg{width:100%;height:auto;max-height:17rem;display:block}.banner{border:1px solid var(--warn-border);border-radius:var(--radius);background:var(--warn-bg);flex-wrap:wrap;align-items:center;gap:.5rem .75rem;padding:.7rem .8rem .7rem 1.2rem;display:flex}.banner .message{flex:1;min-width:16rem}.banner button{min-height:2.4rem;padding:.45rem 1rem}.menu-panel{z-index:40;border:1px solid var(--glass-edge);border-radius:var(--radius);background:color-mix(in srgb, var(--surface) 88%, transparent);width:min(22rem,100vw - 2rem);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);box-shadow:inset 0 1px 0 var(--glass-highlight), var(--shadow-high);color:var(--text);white-space:normal;gap:.7rem;padding:1.1rem 1.2rem;font-size:.95rem;display:grid;position:absolute}.menu-panel p{margin:0}.dialog{border:1px solid var(--glass-edge);border-radius:var(--radius-l);background:var(--surface);max-width:min(30rem,100vw - 2rem);box-shadow:var(--shadow-high);color:var(--text);padding:1.6rem 1.7rem}.dialog::backdrop{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#0a0c1259}.dialog h2{margin-top:0}.dialog label{gap:.25rem;display:grid}.table-scroll{overflow-x:auto}.note-form{gap:1rem;width:min(26rem,100vw - 5.5rem);display:grid}.note-form h2,.note-form p{margin:0}.reactions{flex-wrap:wrap;gap:.5rem;display:flex}.note-form textarea{resize:vertical;min-height:7rem}.note-count{justify-self:end;font-size:.8rem}.dialog label.check-row{align-items:flex-start;gap:.6rem;font-size:.93rem;display:flex}.check-row input{flex:none;margin-top:.15rem}.note-form .error{color:var(--wrong)}}@layer shell{.app{grid-template-columns:auto minmax(0,1fr);gap:24px;min-height:100dvh;padding:24px;display:grid}.content{grid-template-columns:minmax(0,1fr);align-content:start;gap:16px;min-width:0;display:grid}main{width:100%;max-width:980px;margin:0 auto;padding:4px 0 24px}.screen{gap:1.25rem;display:grid}.screen>h2{margin:.25rem 0 0;font-size:2.1rem}.screen.narrow{width:100%;max-width:820px;margin-inline:auto}.screen h3{margin:0 0 .5rem}.side{z-index:30;border:1px solid var(--glass-edge);background:var(--glass);width:88px;height:calc(100dvh - 48px);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);box-shadow:inset 0 1px 0 var(--glass-highlight), var(--shadow);border-radius:34px;flex-direction:column;align-items:center;gap:6px;padding:16px 0;display:flex;position:sticky;top:24px}.brand{color:var(--text);letter-spacing:-.02em;flex:none;align-items:center;gap:.6rem;margin-bottom:14px;font-size:1.05rem;font-weight:650;text-decoration:none;display:flex}.brand-mark{background:var(--text);width:48px;height:48px;color:var(--bg);border-radius:50%;place-items:center;display:grid}.brand-mark .icon{stroke-width:2.2px;width:22px;height:22px}.brand-name{display:none}.sections{flex-direction:column;flex:1;align-items:center;gap:6px;display:flex}.sections .nav-end{margin-top:auto}.nav-item{border-radius:var(--radius);width:68px;color:var(--muted);transition:background-color var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease);flex-direction:column;align-items:center;gap:5px;padding:11px 0;font-size:12px;font-weight:500;text-decoration:none;display:flex;position:relative}.nav-item .icon{width:22px;height:22px}.nav-item:hover{color:var(--text);background:var(--well)}.nav-item[aria-current=page]{background:var(--glass-strong);box-shadow:inset 0 1px 0 var(--glass-highlight), 0 4px 14px var(--shadow-color);color:var(--text);font-weight:600}.tools{flex-direction:column;flex:none;align-items:center;gap:6px;display:flex}.enable-sound{border-radius:var(--radius);background:var(--accent-soft);width:68px;min-height:0;box-shadow:none;color:var(--accent);border:0;flex-direction:column;gap:5px;padding:11px 0;font-size:12px}.enable-sound .icon{width:22px;height:22px}.note-button{min-height:0;box-shadow:none;font:inherit;cursor:pointer;background:0 0;border:0;font-size:12px}@media (width>=720px) and (height<=860px){.side,.tools{gap:2px}.nav-item,.enable-sound{gap:3px;padding:7px 0}}.chip-menu{position:relative}.chip-menu>summary{cursor:pointer;list-style:none}.chip-menu>summary::-webkit-details-marker{display:none}.side .menu-panel{bottom:0;left:calc(100% + 14px)}.device-name{white-space:nowrap;text-overflow:ellipsis;max-width:68px;overflow:hidden}.device .dot{width:8px;height:8px}.device.connected .dot{background:var(--right-strong)}.device-status{margin:0}.account-chip{place-items:center;display:grid}.account-chip .avatar{border:1px solid var(--glass-edge);background:var(--glass-strong);width:48px;height:48px;box-shadow:inset 0 1px 0 var(--glass-highlight);color:var(--text);border-radius:50%;place-items:center;margin-top:4px;font-size:16px;font-weight:650;display:grid}.account-name{display:none}.account-who{display:grid}.sync-status,.midi-help{font-size:.9rem}.midi-help summary{cursor:pointer;color:var(--link)}.midi-help p{margin:.25rem 0 0}.profile{flex-wrap:wrap;align-items:center;gap:.5rem;margin:0;display:flex}.session-bar{z-index:20;border:1px solid var(--glass-edge);border-radius:var(--pill);background:var(--glass);width:min(100%,820px);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);box-shadow:inset 0 1px 0 var(--glass-highlight), 0 16px 40px var(--shadow-color);flex-wrap:wrap;justify-self:center;align-items:center;gap:.5rem 1rem;padding:8px 8px 8px 20px;display:flex;position:sticky;top:24px}.session-bar .current{min-width:0;line-height:1.3;display:grid}.session-bar .step{color:var(--muted);font-size:.85rem}.session-bar .step-dots{margin-inline:.25rem}.session-bar .done{color:var(--right);font-weight:600}.session-bar .actions{flex-wrap:nowrap;gap:6px;margin-left:auto}@media (width<=719px){.app{padding:12px 16px calc(100px + env(safe-area-inset-bottom));display:block}.content{gap:12px}.side{-webkit-backdrop-filter:none;backdrop-filter:none;width:auto;height:auto;box-shadow:none;background:0 0;border:0;flex-direction:row;margin-bottom:12px;padding:0;position:static}.brand{margin:0}.brand-mark{width:40px;height:40px}.brand-name{display:inline}.sections{right:12px;bottom:calc(12px + env(safe-area-inset-bottom));border:1px solid var(--glass-edge);background:var(--glass);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);box-shadow:inset 0 1px 0 var(--glass-highlight), var(--shadow-high);border-radius:32px;grid-template-columns:repeat(5,minmax(0,1fr));gap:2px;padding:6px;display:grid;position:fixed;left:12px}.sections .nav-end{margin-top:0}.sections .nav-item{width:auto;padding:9px 0;font-size:11px}.tools{flex-direction:row;margin-left:auto}.tools .nav-item{width:44px;padding:10px 0}.enable-sound{width:44px}.tools .nav-item .label,.enable-sound .label,.device .device-name{display:none}.account-chip .avatar{width:44px;height:44px;margin:0}}@media (width<=419px){.brand-name{display:none}.side .menu-panel{inset:calc(100% + 10px) 0 auto auto}.session-bar{padding-left:14px;top:8px}.session-bar .step-dots{display:none}main{padding-top:0}}@media (pointer:coarse){select{min-height:44px}}}@layer screens{.today-line{color:var(--muted);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.5rem 1rem;padding:0 .5rem;display:flex}.today-steps{align-items:center;gap:.75rem;display:inline-flex}.glass.hero h1{letter-spacing:-.04em;margin:0;font-size:2.6rem}.lead{font-size:1.08rem;line-height:1.5}.panel>.eyebrow+:is(h1,h2,h3){margin-top:-.85rem}.panel>:is(h1,h2,h3)+.lead,.panel>.result-head+.lead{margin-top:-.6rem}.today-preview{justify-content:flex-start;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,#000 82%,#0000);mask-image:linear-gradient(90deg,#000 82%,#0000)}.today-preview .staff{width:min(100%,560px)}.today-preview .score-view{overflow:hidden}.today-preview .score-view.static svg{max-width:none}.today-card .then{margin-left:auto}.today-plan>summary{width:fit-content;color:var(--link);cursor:pointer;margin:0 .5rem .75rem;font-weight:600}@media (width<=719px){.glass.hero{padding:1.5rem}.glass.hero h1{font-size:2rem}.today-card .actions>.button{flex:1}.today-card .then{text-align:center;width:100%;margin:0}}.figures{flex-wrap:wrap;gap:1rem;margin:0;display:flex}.figures div{border:1px solid var(--glass-edge);border-radius:var(--radius);background:var(--glass-soft);min-width:9rem;padding:.75rem 1rem}.figures dt{color:var(--muted);font-size:.85rem}.figures dd{margin:.25rem 0 0;font-size:1.5rem;font-weight:600}.key{stroke:#555;stroke-width:1px}.key.white{fill:var(--key-white)}.key.black{fill:var(--key-black)}.key.marked{fill:color-mix(in srgb, var(--hint) 45%, var(--key-white))}.key.landmark{fill:var(--key-landmark)}.key.hint{fill:var(--hint)}.key.hint.hint-left{fill:var(--hint-left)}.key.held{fill:var(--accent)}.key-label{text-anchor:middle;fill:#777;pointer-events:none;font-size:9px}.key-cap{fill:#14171f0f;stroke:#14171f29;stroke-width:1px;pointer-events:none}.key-letter{text-anchor:middle;pointer-events:none;font-size:10px;font-weight:650}.key-letter.on-white{fill:#2c3140}.key-letter.on-black{fill:#fff;opacity:.85}.has-letters .key-label{transform:translateY(-22px)}.key.held+.key-label{fill:var(--accent-text)}.keyboard{touch-action:none;-webkit-user-select:none;user-select:none;width:100%;max-height:200px;display:block}.keyboard .key{cursor:pointer}.hand-edge,.hand-fill{stroke-linecap:round;pointer-events:none}.hand-edge rect,.hand-edge line{fill:var(--hand-edge);stroke:var(--hand-edge)}.hand-edge rect{stroke-width:0}.hand-fill rect,.hand-fill line{fill:var(--hand);stroke:var(--hand)}.hand-fill rect{stroke-width:0}.finger-dot{stroke:#fff;stroke-width:1.5px;pointer-events:none}.finger-dot.right{fill:#b7791f}.finger-dot.left{fill:#2b7f88}.finger-number{text-anchor:middle;fill:#fff;pointer-events:none;font-size:10px;font-weight:700}.position-info{text-align:center;color:var(--muted);margin:0}.position-info.changed{color:var(--text);font-weight:600;animation:1.2s ease-out position-flash}@keyframes position-flash{0%{background:var(--warn-bg)}to{background:0 0}}.held{text-align:center;color:var(--muted);margin:0}.loudness{justify-content:center;align-items:center;gap:.6rem;font-size:.85rem;display:flex}.loudness .marking{min-width:7rem;font-style:italic}.loudness .scale{border:1px solid var(--border);border-radius:4px;grid-template-columns:repeat(3,1fr);width:min(18rem,60vw);display:grid;position:relative;overflow:hidden}.loudness .band{text-align:center;color:var(--muted);padding:.1rem 0}.loudness .band.target{background:var(--warn-bg);color:var(--text);font-weight:600}.loudness .needle{background:var(--text);width:3px;margin-left:-1.5px;transition:left 80ms ease-out;position:absolute;top:0;bottom:0}.loudness .needle.ok{background:var(--note-hit)}.loudness .needle.off{background:var(--note-miss)}.hand-legend{text-align:center;color:var(--muted);margin:0;font-size:.85rem}.swatch{vertical-align:-.05em;border-radius:2px;width:.8em;height:.8em;display:inline-block}.swatch.right{background:var(--hint)}.swatch.left{background:var(--hint-left)}.dialog.invite{border-radius:var(--radius-xl);width:min(32rem,100vw - 2rem);max-width:none;padding:2.25rem 2.25rem 1.75rem}.invite form{gap:1.25rem;display:grid;position:relative}.invite h2{letter-spacing:-.035em;margin:0;padding-right:2.5rem;font-size:1.75rem}.invite .lead{margin:-.5rem 0 0}.invite .close{position:absolute;top:-.75rem;right:-.75rem}.invite .brand-mark{width:52px;height:52px}.invite-reasons{border-radius:var(--radius);background:var(--glass-soft);gap:1rem;margin:.25rem 0;padding:1.1rem 1.2rem;list-style:none;display:grid}.invite-reasons li{align-items:flex-start;gap:.9rem;display:flex}.invite-reasons li>span:last-child{gap:.1rem;display:grid}.invite-reasons .muted{font-size:.92rem}.reason-icon{border-radius:var(--radius-s);background:var(--accent-soft);width:2.4rem;height:2.4rem;color:var(--accent);flex:none;place-items:center;display:grid}.reason-icon .icon{width:1.2rem;height:1.2rem}.invite .choices{gap:.6rem;display:grid}.invite-later{text-align:center;justify-items:center;gap:.1rem;margin:-.25rem 0 0;font-size:.88rem;display:grid}.dialog label.dont-show{color:var(--muted);justify-content:center;align-items:center;gap:.5rem;font-size:.88rem;display:flex}@media (width<=480px){.dialog.invite{padding:1.75rem 1.4rem 1.4rem}.invite h2{font-size:1.45rem}}.calibrate{margin:1rem 0}.calibrate .prompt{min-height:1.5em;color:var(--muted)}.drill-play{justify-items:center;gap:1.25rem;width:100%;display:grid}.drill-head{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.75rem 1.5rem;width:100%;display:flex}.drill-head h2{letter-spacing:-.02em;margin:0;font-size:1.15rem}.progress{max-width:22rem;color:var(--muted);font-variant-numeric:tabular-nums;flex:1;justify-content:flex-end;align-items:center;gap:.75rem;font-size:.9rem;display:inline-flex}.progress .progress-bar{flex:1}.drill-play>.paper{border-radius:var(--radius-xl);align-items:center;width:100%;min-height:14rem;padding:1.5rem 2rem}.feedback{letter-spacing:-.02em;text-align:center;width:fit-content;min-height:1.5em;margin:0;font-size:1.3rem;font-weight:600}.feedback.right,.feedback.wrong{border-radius:var(--pill);padding:.55rem 1.1rem;font-size:1rem}.feedback.right{background:var(--right-soft);color:var(--right)}.feedback.wrong{background:var(--wrong-soft);color:var(--wrong)}.drill-play>.keyboard,.drill-play>div>.keyboard,.player>.keyboard{border:1px solid var(--glass-edge);border-radius:var(--radius);background:var(--glass-soft);width:auto;max-width:100%;height:12rem;margin-inline:auto;padding:6px}.drill-play>div:has(>.keyboard){width:100%;display:grid}@media (width<=719px){.drill-play>.keyboard,.drill-play>div>.keyboard,.player>.keyboard{width:100%;height:auto}}.result-head{align-items:center;gap:1rem;display:flex}.glass.hero .result-head h1{font-size:2.1rem}.result-badge{background:var(--right-strong);width:3.25rem;height:3.25rem;box-shadow:inset 0 1px 0 #fff6, 0 10px 24px var(--right-soft);color:#fff;border-radius:50%;flex:none;place-items:center;display:grid}.result-badge .icon{stroke-width:2.6px;width:1.6rem;height:1.6rem}.practise-these{margin:0}.heatmap .keyboard{max-height:140px}.heatmap .keyboard .key{cursor:default}.card .meta{flex-wrap:wrap;gap:.25rem .75rem;font-size:.85rem;display:flex}.level{border-radius:var(--pill);background:var(--right-soft);color:var(--right);padding:.05rem .55rem;font-weight:600}.level-3{background:var(--accent-soft);color:var(--accent)}.level-4,.level-5{background:var(--near-soft);color:var(--near)}.fit-one-hand,.fit-shift{color:var(--muted)}.fit-too-small{color:var(--wrong)}.best{color:var(--right)}.player{gap:1rem}.player-head{border:1px solid var(--glass-edge);border-radius:var(--radius-l);background:var(--glass);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);box-shadow:inset 0 1px 0 var(--glass-highlight), 0 16px 40px var(--shadow-color);flex-wrap:wrap;align-items:center;gap:.75rem;padding:8px;display:flex}.player-title{flex:1;min-width:10rem}.player-title h2{letter-spacing:-.02em;margin:0;font-size:1.1rem}.composer{margin:0;font-size:.88rem}.toolbar{flex-wrap:wrap;align-items:center;gap:.5rem;display:flex}.toolbar select,.player-dock select{background:var(--well);min-height:2.75rem;box-shadow:none;border-color:#0000;font-weight:500}.toolbar .icon-button[aria-expanded=true]{background:var(--glass-strong);box-shadow:inset 0 1px 0 var(--glass-highlight)}.options-panel{border:1px solid var(--glass-edge);border-radius:var(--radius);background:var(--glass-soft);flex-wrap:wrap;align-items:center;gap:.6rem 1rem;padding:.75rem 1.1rem;display:flex}.options-panel label{align-items:center;gap:.4rem;display:inline-flex}.player-dock{border:1px solid var(--glass-edge);border-radius:var(--pill);background:var(--glass);width:fit-content;max-width:100%;-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);box-shadow:inset 0 1px 0 var(--glass-highlight), 0 16px 40px var(--shadow-color);flex-wrap:wrap;justify-content:center;align-items:center;gap:.6rem;margin-inline:auto;padding:8px;display:flex}.options-summary{padding-right:.75rem;font-size:.88rem}.options-summary:empty{display:none}.fit-info{color:var(--muted);margin:0}.fit-info:empty{display:none}.fit-info.warn{color:var(--wrong)}.score-paper{padding:0;overflow:hidden}.score-view{width:100%;position:relative;overflow:hidden}.score-view.static{overflow-x:auto}.score-strip{will-change:transform;width:max-content;position:relative}.score-strip svg,.score-header svg{display:block}.score-view.static .score-strip{width:auto}.score-view.static svg{max-width:100%;height:auto}.score-header{background:linear-gradient(to right, var(--paper) 85%, transparent);pointer-events:none;opacity:0;transition:opacity .15s;position:absolute;top:0;left:0}.score-header.visible{opacity:1}.playhead{background:var(--note-due);opacity:.55;pointer-events:none;width:3px;margin-left:-1px;position:absolute;top:0;bottom:0}.score-strip .muted :is(path,rect,text){fill:var(--note-muted);stroke:var(--note-muted)}.score-strip .due :is(path,rect,text){fill:var(--note-due);stroke:var(--note-due)}.score-strip .hit :is(path,rect,text){fill:var(--note-hit);stroke:var(--note-hit)}.score-strip .near :is(path,rect,text){fill:var(--note-near);stroke:var(--note-near)}.score-strip .miss :is(path,rect,text){fill:var(--note-miss);stroke:var(--note-miss)}.hold-layer{pointer-events:none;position:absolute;inset:0}.hold-bar{background:color-mix(in srgb, var(--note-due) 18%, transparent);border-radius:4px;height:7px;position:absolute;overflow:hidden}.hold-fill{background:var(--note-due);border-radius:4px;height:100%}.hold-bar.held .hold-fill{background:var(--note-hit)}.hold-bar.short{background:color-mix(in srgb, var(--note-near) 22%, transparent)}.hold-bar.short .hold-fill,.hold-bar.long .hold-fill{background:var(--note-near)}.hold-bar.long{background:color-mix(in srgb, var(--note-near) 22%, transparent)}.hold-bar.staccato{outline:1px dashed color-mix(in srgb, var(--note-due) 60%, transparent);outline-offset:1px}.player-status{text-align:center;color:var(--muted);margin:0}.results{border:1px solid var(--glass-edge);border-radius:var(--radius-xl);background:var(--glass-strong);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);box-shadow:inset 0 1px 0 var(--glass-highlight), var(--shadow-high);gap:1.25rem;padding:1.75rem 2rem;display:grid}.results h3{margin:0;font-size:1.3rem}.results .result-head p{margin:0}.result-value{letter-spacing:-.05em;font-size:3rem;font-weight:700;line-height:1}.tip{color:var(--muted);margin:0;line-height:1.5}.result-details{gap:.75rem;display:grid}.result-details>summary{width:fit-content;color:var(--link);cursor:pointer;font-weight:600}.trouble{margin:0}.timing-chart{max-width:28rem;margin:0}.timing-chart .bars{border-bottom:1px solid var(--border);align-items:flex-end;gap:4px;height:90px;padding:0 0 2px;display:flex}.timing-chart .bar{flex:1;align-items:flex-end;height:100%;display:flex}.bar-fill{background:var(--note-near);border-radius:3px 3px 0 0;width:100%;min-height:1px;display:block}.bar.centre .bar-fill{background:var(--right)}.timing-chart .axis{color:var(--muted);justify-content:space-between;font-size:.8rem;display:flex}.timing-chart figcaption{margin-top:.25rem}.setting{align-items:center;gap:.75rem;display:flex}.setting-text{display:grid}.setting input[type=range]{flex:1;max-width:16rem}.page-head{gap:.35rem;padding:0 .5rem;display:grid}.page-head :is(h1,h2),.page-head p{margin:0}.lesson h1{letter-spacing:-.04em;font-size:2.5rem}.learn{border-radius:var(--radius-l);padding:.4rem}.learn>summary{cursor:pointer;list-style:none}.learn>summary::-webkit-details-marker{display:none}.learn[open]>summary .row-value{display:none}.learn>summary .row-value{color:var(--link);font-weight:600}.learn-body{gap:1rem;padding:.25rem 1.1rem 1.1rem;display:grid}.learn-body>p{max-width:68ch;margin:0;line-height:1.6}.practise{border-radius:var(--radius-xl);gap:.5rem;padding:1.1rem .5rem .5rem;display:grid}.practise>h2{letter-spacing:-.01em;margin:0 0 .25rem;padding:0 .9rem;font-size:1.05rem}.exercises{gap:4px;margin:0;padding:0;list-style:none;display:grid}.exercise{border-radius:var(--radius);transition:background-color var(--dur) var(--ease);grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:.9rem;padding:.7rem .9rem;display:grid}.exercise-text{gap:.3rem;display:grid}.exercise-text p{margin:0}.exercise:not(.next) :is(.exercise-what,.exercise-details){display:none}.exercise.done .exercise-title{color:var(--muted);font-weight:550}.exercise.next{background:var(--glass-strong);box-shadow:inset 0 1px 0 var(--glass-highlight), 0 10px 30px var(--shadow-color);grid-template-columns:auto minmax(0,1fr);align-items:start;padding:1.1rem 1.1rem 1.2rem}.exercise.next .exercise-title{letter-spacing:-.02em;font-size:1.15rem}.exercise.next>.button{grid-column:2;justify-self:start}.exercise-details{font-size:.9rem}.lesson-nav{justify-content:space-between;gap:1rem;display:flex}.examples{grid-template-columns:repeat(auto-fill,minmax(15rem,1fr));gap:.75rem;display:grid}.example{gap:.4rem;min-width:0;margin:0;display:grid}.example.wide{grid-column:1/-1}.example .paper{padding:.25rem}.example figcaption{flex-wrap:wrap;align-items:center;gap:.25rem .5rem;display:flex}.example figcaption strong{flex-basis:100%}.lesson-note{border-radius:var(--radius);background:var(--glass-soft);gap:1rem;padding:1.25rem 1.35rem;display:grid}.lesson-note p{margin:0}.course,.stages{gap:1.5rem;display:grid}.section-label{color:var(--muted);letter-spacing:0;margin:0 0 .6rem;padding:0 .6rem;font-size:.95rem;font-weight:600}.unit>summary{cursor:pointer;list-style:none}.unit>summary::-webkit-details-marker{display:none}.unit>summary .chevron{transition:transform var(--dur) var(--ease)}.unit[open]>summary .chevron{transform:rotate(90deg)}.unit[open]>summary.list-row{background:var(--glass-strong)}.unit-body{gap:.6rem;padding:.6rem .4rem .8rem 3.3rem;display:grid}.unit-description{margin:0;padding:0 .9rem}.lesson-list{gap:2px;margin:0;padding:0;list-style:none;display:grid}.lesson-list .list-row{min-height:0;padding-block:.55rem}.lesson-list .list-row.current{background:var(--glass-soft);box-shadow:none}.lesson-list .row-note{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}@media (width<=719px){.unit-body{padding-left:.4rem}}.section-bar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.5rem 1rem;margin-bottom:.75rem;display:flex}.section-bar .section-label{margin:0}.piece-groups{gap:1.5rem;display:grid}.piece-group h4{margin:0 0 .2rem;padding:0 .6rem;font-size:1.05rem}.piece-group>p{margin:0 0 .6rem;padding:0 .6rem}.list-row .meta{flex-wrap:wrap;gap:.25rem .6rem;margin-top:.3rem;font-size:.82rem;display:flex}.celebration{position:relative;overflow:hidden}.week{border-radius:var(--radius);background:var(--glass-soft);justify-content:space-between;gap:.5rem;margin:.5rem 0;padding:1rem;list-style:none;display:flex}.week .day{color:var(--muted);flex:1;justify-items:center;gap:.4rem;font-size:.8rem;display:grid}.week .mark{border:1.5px dashed var(--track);border-radius:50%;place-items:center;width:2.6rem;height:2.6rem;display:grid}.week .mark .icon{stroke-width:2.6px;width:1.1rem;height:1.1rem}.week .practised .mark{background:var(--right-soft);color:var(--right);border:0}.week .is-today.practised .mark{background:var(--accent);box-shadow:0 0 0 5px var(--accent-soft);color:var(--accent-text)}.week .is-today .name{color:var(--text);font-weight:600}.streak-line{font-weight:600}.confetti{pointer-events:none;position:absolute;inset:0}.confetti i{opacity:0;border-radius:2px;width:.5rem;height:.9rem;animation:2.4s ease-in .2s forwards confetti-fall;position:absolute;top:-1rem}.confetti i:nth-child(4n+1){background:var(--accent)}.confetti i:nth-child(4n+2){background:var(--hint)}.confetti i:nth-child(4n+3){background:var(--right)}.confetti i:nth-child(4n){background:var(--hint-left)}.confetti i:first-child{animation-delay:.13s;left:37%}.confetti i:nth-child(2){animation-delay:.26s;left:74%}.confetti i:nth-child(3){animation-delay:.39s;left:11%}.confetti i:nth-child(4){animation-delay:.52s;left:48%}.confetti i:nth-child(5){animation-delay:.65s;left:85%}.confetti i:nth-child(6){animation-delay:.78s;left:22%}.confetti i:nth-child(7){animation-delay:.91s;left:59%}.confetti i:nth-child(8){animation-delay:1.04s;left:96%}.confetti i:nth-child(9){animation-delay:1.17s;left:33%}.confetti i:nth-child(10){animation-delay:.1s;left:70%}.confetti i:nth-child(11){animation-delay:.23s;left:7%}.confetti i:nth-child(12){animation-delay:.36s;left:44%}.confetti i:nth-child(13){animation-delay:.49s;left:81%}.confetti i:nth-child(14){animation-delay:.62s;left:18%}.confetti i:nth-child(15){animation-delay:.75s;left:55%}.confetti i:nth-child(16){animation-delay:.88s;left:92%}.confetti i:nth-child(17){animation-delay:1.01s;left:29%}.confetti i:nth-child(18){animation-delay:1.14s;left:66%}.confetti i:nth-child(19){animation-delay:70ms;left:3%}.confetti i:nth-child(20){animation-delay:.2s;left:40%}.confetti i:nth-child(21){animation-delay:.33s;left:77%}.confetti i:nth-child(22){animation-delay:.46s;left:14%}.confetti i:nth-child(23){animation-delay:.59s;left:51%}.confetti i:nth-child(24){animation-delay:.72s;left:88%}@keyframes confetti-fall{0%{opacity:1;transform:translateY(0)rotate(0)}to{opacity:0;transform:translateY(28rem)rotate(540deg)}}@media (prefers-reduced-motion:reduce){.confetti{display:none}}.key-prompt{place-items:center;min-height:8rem;display:grid}.key-target{color:var(--accent);margin:0;font-size:5rem;font-weight:700;line-height:1}.keys-example .keyboard{width:auto;max-width:100%;height:7rem;display:block}.skip-start{border:1px dashed var(--track);border-radius:var(--radius);padding:1rem 1.2rem}.skip-start p{margin:0 0 .5rem}.skip-start p:last-child{margin:0}.check-question{text-align:center;font-size:1.2rem}.check-picture{place-items:center;display:grid}.test-row .check .icon{stroke-width:2px;width:1rem;height:1rem}.row-value .passed{color:var(--right);align-items:center;gap:.25rem;margin-right:.6rem;font-weight:600;display:inline-flex}.row-value .passed .icon{width:1.1rem;height:1.1rem}.test-result .mistakes h3{margin:0 0 .4rem}.test-result .mistakes ul{margin:0;padding-left:1.2rem}.test-result .mistakes li{margin-bottom:.4rem}.skills{grid-template-columns:repeat(auto-fill,minmax(9.5rem,1fr))}.card.skill{gap:.2rem;min-height:9rem}.skill-icon{border-radius:var(--radius-s);background:var(--glass-strong);width:2.6rem;height:2.6rem;box-shadow:inset 0 1px 0 var(--glass-highlight);color:var(--text);place-items:center;margin-bottom:auto;display:grid}.card.skill strong{margin-top:1.5rem}.card-note{font-size:.85rem}.achievements h4{margin:1.25rem 0 .5rem}.achievement-figures{grid-template-columns:repeat(auto-fit,minmax(9rem,1fr));gap:.75rem;margin:0;padding:0;list-style:none;display:grid}.achievement-figures li{border:1px solid var(--glass-edge);border-radius:var(--radius);background:var(--glass-soft);gap:.15rem;padding:.75rem;display:grid}.achievement-figures strong{color:var(--accent);font-size:1.6rem}.achievement-figures span{color:var(--muted);font-size:.9rem}.unit-badges{grid-template-columns:repeat(auto-fill,minmax(10rem,1fr));gap:.75rem;margin:0;padding:0;list-style:none;display:grid}.unit-badge{box-sizing:border-box;border:1px dashed var(--track);border-radius:var(--radius);height:100%;color:var(--muted);text-align:center;justify-items:center;gap:.2rem;padding:.9rem .6rem;text-decoration:none;display:grid}.unit-badge .medal{background:var(--well);border-radius:50%;place-items:center;width:2.8rem;height:2.8rem;display:grid}.unit-badge .status{font-size:.85rem}.unit-badge.passed{border-style:solid;border-color:var(--glass-edge);background:var(--glass-strong);color:var(--text)}.unit-badge.passed .medal{background:var(--right-soft);color:var(--right)}.unit-badge.passed .status{color:var(--right);font-weight:600}.mastered-areas{grid-template-columns:repeat(auto-fit,minmax(16rem,1fr));gap:.5rem 1.5rem;display:grid}.mastered-area p{margin:.25rem 0}.achievement-chips{flex-wrap:wrap;gap:.4rem;margin:.25rem 0 .5rem;padding:0;list-style:none;display:flex}.achievement-chips li{border-radius:var(--pill);background:var(--well);padding:.25rem .7rem;font-size:.9rem}.achievement-chips a{color:var(--accent)}.list-row.disabled{opacity:.55}.all-stages .unit-body{padding-left:.4rem}@media (height<=860px){.player .composer{display:none}.player>.keyboard{height:22vh}}.settings-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,22rem),1fr));align-items:start;gap:1.25rem;display:grid}.settings-col{gap:1.25rem;display:grid}.panel .rows{gap:2px;margin-inline:-.6rem;display:grid}.fold .unit-body{padding:.5rem .9rem 1rem}.fold .unit-body>p{margin:0}.progress-details .heatmap h3{margin:.5rem 0;font-size:1rem}.account-nudge{border:1px solid var(--glass-edge);border-radius:var(--radius);background:var(--glass-soft);align-items:flex-start;gap:1rem;padding:1.25rem 1.35rem;display:flex}.nudge-text{gap:.3rem;display:grid}.nudge-text .muted{font-size:.92rem}.nudge-text .actions{gap:.25rem .5rem;margin-top:.75rem}.nudge-text .actions button{min-height:2.5rem;padding-block:.45rem}.example .along-keys{width:auto;max-width:100%;height:6.5rem;margin:.25rem auto 0;display:block}.play-status{flex-basis:100%;font-size:.92rem}.examples .paper{align-items:center;min-height:8.5rem}.examples .staff svg{max-height:7.5rem}.examples .wide .staff svg{max-height:9.5rem}.explore-staff{cursor:pointer;touch-action:manipulation}.explore .staff svg{max-height:10rem}.listen-first .paper{position:relative}.listen-cover{border-radius:inherit;background:var(--paper);color:#5b6070;transition:opacity var(--dur) var(--ease);flex-direction:column;justify-content:center;align-items:center;gap:.35rem;font-weight:600;display:flex;position:absolute;inset:0}.listen-cover svg{width:1.8rem;height:1.8rem}.listen-first.revealed .listen-cover{opacity:0;pointer-events:none}.listen-first:not(.revealed) .paper>:not(.listen-cover){visibility:hidden}.listen-first:not(.revealed) .along-keys,.listen-first:not(.revealed) .play-status{display:none}.listen-first.revealed .along-keys{animation:rise-in var(--dur) var(--ease-out) both}.listen-question{flex-basis:100%;gap:.5rem;display:grid}.listen-question p{margin:0}.listen-question .feedback{border-radius:var(--radius);text-align:start;width:auto;font-size:.95rem}.listen-question .feedback:empty{display:none}.pulse-strip{gap:.35rem;padding:.25rem .5rem 0;display:grid}.pulse-beats,.pulse-notes{height:.75rem;position:relative}.pulse-notes{height:.9rem}.pulse-dot{background:var(--border);width:.6rem;height:.6rem;transition:background-color var(--dur-fast) var(--ease), transform var(--dur-fast) var(--ease);border-radius:50%;position:absolute;top:50%;transform:translateY(-50%)}.pulse-dot.on{background:var(--accent);transform:translateY(-50%)scale(1.5)}.pulse-bar{border-radius:var(--pill);background-clip:padding-box;background-color:var(--well);border-right:3px solid #0000;position:absolute;top:0;bottom:0;overflow:hidden}.pulse-fill{background:var(--accent);width:0;height:100%;display:block}.learn-steps{counter-reset:learn-step;margin:0;padding:0;list-style:none;display:grid}.learn-step{border-top:1px solid var(--border);counter-increment:learn-step;gap:1.1rem;padding-block:1.75rem;display:grid}.learn-step:first-child{border-top:0;padding-top:.5rem}.learn-step>p{max-width:62ch;margin:0;padding-left:2.6rem;font-size:1.05rem;line-height:1.7;position:relative}.learn-step>p:before{content:counter(learn-step);background:var(--well);width:1.8rem;height:1.8rem;color:var(--muted);border-radius:50%;place-items:center;font-size:.9rem;font-weight:700;display:grid;position:absolute;top:.05rem;left:0}.key-form{gap:1rem;display:grid}.new-key{border-radius:var(--radius);background:var(--warn-bg);gap:.6rem;padding:1rem 1.15rem;display:grid}.new-key p{margin:0}.key-value{flex-wrap:wrap;align-items:center;gap:.6rem;display:flex}.key-value code{overflow-wrap:anywhere;min-width:0;font-size:.85rem}.list-row.inactive .row-title{color:var(--muted)}.admin .row-text>button{justify-self:start;margin-left:-.6rem}.usage{gap:1.1rem;display:grid}.usage-tiles{grid-template-columns:repeat(auto-fit,minmax(7rem,1fr));gap:.75rem;display:grid}.usage-tile{border-radius:var(--radius);background:var(--well);gap:.2rem;padding:.85rem 1rem;display:grid}.usage-tile strong{font-size:1.6rem;line-height:1.1}.usage-tile span{font-size:.85rem}.usage-chart{width:100%;height:auto;display:block}.usage-bar{fill:var(--accent);opacity:.75}.usage-line{fill:none;stroke:var(--text);stroke-width:2px;stroke-linejoin:round;opacity:.55}.cohorts{border-collapse:collapse;width:100%;font-size:.93rem}.cohorts th,.cohorts td{border-bottom:1px solid var(--border);text-align:start;padding:.45rem .6rem}.cohorts th{color:var(--muted);font-weight:600}.cohorts td{white-space:nowrap}}@layer motion{@keyframes fade-in{0%{opacity:0}}@keyframes fade-out{to{opacity:0}}@keyframes rise-in{0%{opacity:0;transform:translateY(10px)}}@keyframes pop-in{0%{opacity:0;transform:scale(.96)}}main{view-transition-name:page}::view-transition-old(root){animation-duration:var(--dur-fast)}::view-transition-new(root){animation-duration:var(--dur-fast)}::view-transition-old(page){animation:fade-out var(--dur-fast) var(--ease) both}::view-transition-new(page){animation:rise-in var(--dur) var(--ease-out) both}main.entering>*{animation:rise-in var(--dur) var(--ease-out) both}.results:not([hidden]),.lesson-note,.account-nudge,.session-bar:not([hidden]){animation:rise-in var(--dur-slow) var(--ease-out) both}.feedback.right,.feedback.wrong,.status-pill,.chip-menu[open]>.menu-panel,.dialog[open]{animation:pop-in var(--dur) var(--ease-out) both}.dialog[open]::backdrop{animation:fade-in var(--dur) var(--ease) both}.unit[open]>.unit-body,.learn[open]>.learn-body,.options-panel:not([hidden]),.today-plan[open]>.list-group{animation:rise-in var(--dur) var(--ease-out) both}.today-preview:not([hidden]){animation:fade-in var(--dur-slow) var(--ease) both}.exercise.next{animation:fade-in var(--dur) var(--ease) both}}