@font-face{font-family:Geist;font-style:normal;font-weight:100 900;font-display:swap;src:url(../media/fef07dbb0973bf53-s.00az9qtie3ho1.woff2)format("woff2");unicode-range:U+460-52F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}@font-face{font-family:Geist;font-style:normal;font-weight:100 900;font-display:swap;src:url(../media/8a480f0b521d4e75-s.3j-a226dh71aj.woff2)format("woff2");unicode-range:U+301,U+400-45F,U+490-491,U+4B0-4B1,U+2116}@font-face{font-family:Geist;font-style:normal;font-weight:100 900;font-display:swap;src:url(../media/53b9e256198e5412-s.2gwoz23eiro2t.woff2)format("woff2");unicode-range:U+102-103,U+110-111,U+128-129,U+168-169,U+1A0-1A1,U+1AF-1B0,U+300-301,U+303-304,U+308-309,U+323,U+329,U+1EA0-1EF9,U+20AB}@font-face{font-family:Geist;font-style:normal;font-weight:100 900;font-display:swap;src:url(../media/7178b3e590c64307-s.0i3h3th1vs4m7.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}@font-face{font-family:Geist;font-style:normal;font-weight:100 900;font-display:swap;src:url(../media/caa3a2e1cccd8315-s.p.0zr6hhvz-h9nw.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:Geist Fallback;src:local(Arial);ascent-override:95.94%;descent-override:28.16%;line-gap-override:0.0%;size-adjust:104.76%}.geist_a71539c9-module__T19VSG__className{font-family:Geist,Geist Fallback;font-style:normal}.geist_a71539c9-module__T19VSG__variable{--font-geist-sans:"Geist", "Geist Fallback"}
@font-face{font-family:Geist Mono;font-style:normal;font-weight:100 900;font-display:swap;src:url(../media/5ce348bf30bf5439-s.27spqqad3wyeo.woff2)format("woff2");unicode-range:U+460-52F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}@font-face{font-family:Geist Mono;font-style:normal;font-weight:100 900;font-display:swap;src:url(../media/4fa387ec64143e14-s.3f4zuumv8svu0.woff2)format("woff2");unicode-range:U+301,U+400-45F,U+490-491,U+4B0-4B1,U+2116}@font-face{font-family:Geist Mono;font-style:normal;font-weight:100 900;font-display:swap;src:url(../media/6306c77e7c8268e4-s.34r5yzckw0h2s.woff2)format("woff2");unicode-range:U+2000-2001,U+2004-2008,U+200A,U+23B8-23BD,U+2500-259F}@font-face{font-family:Geist Mono;font-style:normal;font-weight:100 900;font-display:swap;src:url(../media/7d817b4c03b0c5f1-s.2jyz_zw3a8jit.woff2)format("woff2");unicode-range:U+102-103,U+110-111,U+128-129,U+168-169,U+1A0-1A1,U+1AF-1B0,U+300-301,U+303-304,U+308-309,U+323,U+329,U+1EA0-1EF9,U+20AB}@font-face{font-family:Geist Mono;font-style:normal;font-weight:100 900;font-display:swap;src:url(../media/bbc41e54d2fcbd21-s.30bdpjkrtcces.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}@font-face{font-family:Geist Mono;font-style:normal;font-weight:100 900;font-display:swap;src:url(../media/797e433ab948586e-s.p.1v5bejj26fx9h.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:Geist Mono Fallback;src:local(Arial);ascent-override:74.67%;descent-override:21.92%;line-gap-override:0.0%;size-adjust:134.59%}.geist_mono_8d43a2aa-module__8Li5zG__className{font-family:Geist Mono,Geist Mono Fallback;font-style:normal}.geist_mono_8d43a2aa-module__8Li5zG__variable{--font-geist-mono:"Geist Mono", "Geist Mono Fallback"}
:root{--background:#fff;--foreground:#171717}@media (prefers-color-scheme:dark){:root{--background:#0a0a0a;--foreground:#ededed}}html{height:100%}html,body{max-width:100vw;overflow-x:hidden}body{min-height:100%;color:var(--foreground);background:var(--background);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;flex-direction:column;font-family:Arial,Helvetica,sans-serif;display:flex}*{box-sizing:border-box;margin:0;padding:0}a{color:inherit;text-decoration:none}@media (prefers-color-scheme:dark){html{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}}:root{--mlu-piano-zone-height:max(190px, 26vh);--mlu-piano-keyboard-height:calc(var(--mlu-piano-zone-height) - 42px)}@media (max-height:760px){:root{--mlu-piano-zone-height:max(160px, 25vh);--mlu-piano-keyboard-height:calc(var(--mlu-piano-zone-height) - 38px)}}
.notation-reader{background:#0b111b;min-height:calc(100vh - 220px);padding:20px 24px 40px}.notation-toolbar{z-index:20;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#080e18f0;border:1px solid #94a3b829;border-radius:14px;justify-content:space-between;align-items:center;gap:18px;margin-bottom:16px;padding:10px 12px;display:flex;position:sticky;top:0}.notation-toolbar>div:first-child{gap:2px;display:grid}.notation-toolbar span{color:#94a3b8;font-size:.78rem}.notation-zoom{align-items:center;gap:8px;display:flex}.notation-zoom button{color:#f8fafc;cursor:pointer;background:#ffffff0d;border:1px solid #94a3b838;border-radius:10px;width:36px;height:36px}.notation-zoom output{text-align:center;color:#dbeafe;font-variant-numeric:tabular-nums;min-width:58px}.notation-status{color:#cbd5e1;text-align:center;padding:18px}.osmd-container{background:#fff;border-radius:18px;width:100%;min-height:500px;padding:24px;overflow-x:auto;box-shadow:0 18px 55px #00000047}.osmd-container svg{max-width:100%;display:block}.score-midi-notice{color:#dbeafe;background:#43a0ff14;border:1px solid #43a0ff4d;border-radius:14px;grid-column:1/-1;gap:5px;padding:16px 18px;display:grid}.score-midi-notice span{color:#9fb0c6;line-height:1.45}@media (max-width:760px){.notation-reader{padding:12px}.osmd-container{border-radius:12px;padding:10px}}.mode-title strong{color:#f8fafc}.mode-title span{color:#cbd5e1}.score-summary{color:#f8fafc}.score-summary small,.score-summary span,.score-summary dt{color:#cbd5e1}.score-summary dd{color:#fff}.notation-toolbar strong{color:#f8fafc}.notation-toolbar span{color:#cbd5e1}.score-reader-shell .import-score-button{color:#fff}.osmd-container{color:#111;background:#fff}.osmd-container svg{color:#000}
.score-compact-topbar{background:#02070ff5;border-bottom:1px solid #94a3b824;grid-template-columns:44px minmax(210px,1fr) auto auto;align-items:center;gap:12px;min-height:58px;padding:7px 14px;display:grid}.score-compact-topbar .icon-button{width:42px;height:42px}.score-compact-title{gap:1px;min-width:0;display:grid}.score-compact-title strong{color:#f8fafc;font-size:1.18rem}.score-compact-title span{color:#b8c4d4;text-overflow:ellipsis;white-space:nowrap;font-size:.9rem;overflow:hidden}.score-inline-meta{white-space:nowrap;align-items:center;gap:6px;display:flex}.score-inline-meta span{color:#cbd5e1;background:#94a3b814;border-radius:8px;padding:4px 7px;font-size:.8rem}.score-change-file{min-height:40px;padding-inline:12px;font-size:.9rem}.practice-controls{scrollbar-width:thin;background:#050b14f2;border-bottom:1px solid #94a3b821;align-items:center;gap:7px;min-height:48px;padding:6px 14px;display:flex;overflow-x:auto}.practice-state{color:#dbeafe;white-space:nowrap;align-items:center;gap:7px;min-width:190px;margin-right:auto;font-size:.9rem;display:flex}.practice-state-dot{background:#f59e0b;border-radius:50%;flex:0 0 8px;width:8px;height:8px;box-shadow:0 0 10px #f59e0b80}.compact-control,.compact-midi,.compact-select,.compact-tempo{color:#d8e0ea;white-space:nowrap;background:#0f172aa3;border:1px solid #94a3b82e;border-radius:10px;min-height:34px;font-size:.84rem}.compact-control,.compact-midi{cursor:pointer;padding:0 9px}.compact-control.active{color:#fff;background:#43a0ff21;border-color:#43a0ff8c}.compact-tempo{align-items:center;gap:5px;padding:0 6px 0 9px;display:flex}.compact-tempo>span{color:#9eacbd}.compact-tempo button{color:#fff;cursor:pointer;background:#ffffff0f;border:0;border-radius:7px;width:25px;height:25px;padding:0}.compact-tempo output{color:#fff;text-align:center;font-variant-numeric:tabular-nums;min-width:39px}.compact-select{align-items:center;gap:5px;padding-left:9px;display:flex}.compact-select>span{color:#9eacbd}.compact-select select{color:#fff;background:#111827;border:0;border-radius:8px;outline:0;height:30px;font-size:.84rem}.compact-midi{align-items:center;gap:6px;display:flex}.compact-midi:disabled{cursor:default;opacity:.9}.notation-reader{background:#0b111b;min-height:0;padding:8px 14px 14px}.notation-toolbar{color:#e5edf7;background:#080e18eb;border:1px solid #94a3b821;border-radius:10px;justify-content:space-between;align-items:center;min-height:38px;margin-bottom:7px;padding:4px 8px;display:flex}.notation-toolbar strong{font-size:.9rem}.notation-zoom{align-items:center;gap:5px;display:flex}.notation-zoom button{color:#fff;cursor:pointer;background:#ffffff0d;border:1px solid #94a3b833;border-radius:7px;width:27px;height:27px}.notation-zoom output{color:#dbeafe;text-align:center;min-width:45px;font-size:.8rem}.osmd-container{color:#111;background:#fff;border-radius:13px;width:100%;min-height:430px;padding:18px;overflow-x:auto;box-shadow:0 14px 45px #0000003d}.osmd-container svg{color:#000;max-width:100%;display:block}.practice-keyboard-wrap{z-index:35;background:#05080d;border-top:1px solid #94a3b82e;width:100%;padding-top:4px;position:sticky;bottom:0;box-shadow:0 -10px 28px #00000042}.practice-keyboard{background:#05070a;align-items:stretch;width:100%;height:170px;display:flex;position:relative;overflow:hidden}.practice-white-key{background:linear-gradient(90deg,#dfe3e8,#fff 48%,#d6dae0);border-bottom:7px solid #b9bfc7;border-right:1px solid #7c838c;border-radius:0 0 3px 3px;flex:1 1 0;min-width:9px;transition:background 90ms,box-shadow 90ms;position:relative}.practice-black-key{z-index:5;background:linear-gradient(90deg,#020304,#161a22 55%,#020304);border-radius:0 0 3px 3px;width:68%;height:61%;transition:background 90ms,box-shadow 90ms;position:absolute;top:0;right:-34%;box-shadow:0 4px 6px #000000a6}.practice-white-key--expected{background:linear-gradient(90deg,#c4f5d2,#eaffef 48%,#b7ecc7);box-shadow:inset 0 0 0 3px #22c55ec2}.practice-black-key--expected{background:linear-gradient(90deg,#0b4a24,#159447 55%,#062b15);box-shadow:0 4px 6px #000000a6,inset 0 0 0 2px #4ade80d1,0 0 12px #22c55e52}.practice-white-key--correct,.practice-black-key--correct{box-shadow:inset 0 0 0 4px #22c55e,0 0 16px #22c55e8c}.practice-white-key--wrong{background:linear-gradient(90deg,#f8c5c5,#fff0f0 48%,#edb1b1);box-shadow:inset 0 0 0 3px #ef4444d6}.practice-black-key--wrong{background:linear-gradient(90deg,#4a0c13,#a61f2d 55%,#26060a);box-shadow:0 4px 6px #000000a6,inset 0 0 0 2px #f87171e6}.practice-finger{z-index:8;color:#052e16;pointer-events:none;background:#86efac;border-radius:50%;place-items:center;width:22px;height:22px;font-size:.72rem;font-weight:900;display:grid;position:absolute;bottom:26px;left:50%;transform:translate(-50%)}.practice-finger--black{width:19px;height:19px;font-size:.64rem;bottom:9px}.practice-note-label{z-index:7;color:#0000009e;white-space:nowrap;pointer-events:none;font-size:clamp(.38rem,.52vw,.58rem);font-weight:700;position:absolute;bottom:3px;left:50%;transform:translate(-50%)}.practice-note-label--black{color:#ffffffe0;text-shadow:0 1px 2px #000;font-size:clamp(.32rem,.42vw,.48rem);bottom:2px}@media (max-width:1050px){.score-inline-meta{display:none}.score-compact-topbar{grid-template-columns:44px minmax(180px,1fr) auto}.practice-keyboard{height:145px}}@media (max-width:720px){.score-compact-topbar{gap:7px;padding-inline:8px}.practice-controls{padding-inline:8px}.notation-reader{padding:6px}.osmd-container{padding:8px}.practice-keyboard{height:125px}}.score-audition-control.active{background:#22c55e24;border-color:#22c55e94;box-shadow:inset 0 0 0 1px #22c55e14}.compact-loop-range{color:#d8e0ea;white-space:nowrap;background:#0f172aa3;border:1px solid #94a3b82e;border-radius:10px;align-items:center;gap:4px;min-height:34px;padding:0 7px;font-size:.84rem;display:flex}.compact-loop-range label{align-items:center;gap:3px;display:flex}.compact-loop-range label>span{color:#9eacbd;font-weight:700}.compact-loop-range input{color:#fff;width:48px;height:26px;font:inherit;text-align:center;font-variant-numeric:tabular-nums;background:#111827;border:0;border-radius:7px;outline:0;padding:0 4px}
.score-practice-layout{flex-direction:column;height:100dvh;min-height:0;display:flex;overflow:hidden}.score-compact-topbar,.practice-controls{flex:none}.score-compact-topbar{grid-template-columns:44px minmax(210px,1fr) auto auto 44px}.score-fullscreen-button{justify-self:end}.score-practice-body,.notation-reader{flex-direction:column;flex:auto;min-height:0;display:flex;overflow:hidden}.notation-toolbar{flex:none}.osmd-scroll-area{overscroll-behavior:contain;scrollbar-gutter:stable;flex:auto;min-height:0;overflow:auto}.osmd-container{min-height:100%;overflow:visible}.score-shared-piano-zone{width:100%;height:var(--mlu-piano-zone-height);min-height:var(--mlu-piano-zone-height);flex:0 0 var(--mlu-piano-zone-height);box-sizing:border-box;background:#171c26;border-top:1px solid #303646;min-width:0;padding:7px 10px 8px;overflow:hidden}.practice-keyboard-wrap{display:none}.compact-midi .midi-indicator{background:#ef4444;border-radius:50%;flex:0 0 8px;width:8px;height:8px;box-shadow:0 0 8px #ef444480}.compact-midi--connected .midi-indicator{background:#22c55e;box-shadow:0 0 9px #22c55eb3}.compact-midi--requesting .midi-indicator{background:#f59e0b;box-shadow:0 0 9px #f59e0ba6}.compact-midi--no-device .midi-indicator,.compact-midi--denied .midi-indicator,.compact-midi--unsupported .midi-indicator{background:#ef4444}.practice-state-dot--done{background:#22c55e;box-shadow:0 0 10px #22c55e99}@media (max-width:1050px){.score-compact-topbar{grid-template-columns:44px minmax(180px,1fr) auto 44px}.score-inline-meta{display:none}}
:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;color:#f8fafc;--blue:#43a0ff;--green:#49d52f;--orange:#ff9f2f;--pink:#ff4f91;--surface:#070d17b8;--surface-strong:#080e18;--border:#94a3b833;--muted:#94a3b8;background:#02060d;font-family:Inter,ui-sans-serif,system-ui,sans-serif}*{box-sizing:border-box}html,body{min-height:100%;margin:0}body{background:radial-gradient(circle at 50% 35%,#081e3738,#0000 34%),linear-gradient(#040913 0%,#01040a 100%);min-width:320px;overflow-x:hidden}button,select,input{font:inherit}button,select{color:inherit}select,select option{color:#f8fafc;background:#111827}select option:checked{color:#fff;background:#2563eb}
.app-shell{background:#00050cdb;grid-template-rows:78px minmax(430px,1fr) minmax(220px,30vh);min-height:100vh;display:grid}.score-reader-shell,.games-shell{background:linear-gradient(#050a13,#01040a);min-height:100vh}
.topbar{border-bottom:1px solid #94a3b824;grid-template-columns:48px minmax(145px,185px) max-content max-content minmax(180px,320px) minmax(165px,max-content) 48px 48px;justify-content:space-between;align-items:center;gap:10px;min-width:0;padding:12px 18px;display:grid}.icon-button,.style-select,.notes-select,.key-label-toggle,.metronome-control,.midi-button,.refresh-button{border:1px solid var(--border);color:#f8fafc;background:var(--surface);border-radius:16px;min-height:48px}.icon-button{cursor:pointer;place-items:center;width:48px;height:48px;padding:0;display:grid}.topbar>.icon-button:last-child{grid-column:8;justify-self:end}.style-select{grid-template-columns:auto minmax(0,1fr);align-items:center;gap:10px;min-width:0;height:52px;padding:0 14px;display:grid}.style-select select,.notes-select select{background:#111827;border:0;outline:0;min-width:0}.style-select select{width:100%;font-size:1rem}.notes-select{color:#cbd5e1;align-items:center;gap:8px;padding:0 11px;display:flex}.key-label-toggle{color:#cbd5e1;white-space:nowrap;cursor:pointer;justify-content:center;align-items:center;padding:0 12px;display:inline-flex}.key-label-toggle.active{color:#fff;border-color:#43a0ffa6;box-shadow:0 0 14px #43a0ff2e}.metronome-control{grid-template-columns:auto minmax(70px,1fr) 38px;align-items:center;gap:7px;min-width:0;padding:6px 8px;display:grid}.metronome-control button{color:#aeb8c7;white-space:nowrap;cursor:pointer;background:#ffffff0a;border:0;border-radius:9px;padding:6px 8px}.metronome-control button.active{color:#fff;background:#43a0ff33;box-shadow:inset 0 0 0 1px #43a0ff73}.metronome-control input[type=range]{width:100%;min-width:70px;accent-color:var(--blue)}.metronome-control output{text-align:right;color:#fff;font-variant-numeric:tabular-nums}.midi-button{white-space:nowrap;cursor:pointer;align-items:center;gap:8px;min-width:0;padding:0 12px;display:flex}.midi-button:disabled{cursor:default;opacity:.88}.midi-indicator{background:#ef4444;border-radius:50%;flex:0 0 10px;width:10px;height:10px;box-shadow:0 0 10px #ef444473}.midi-button--connected .midi-indicator{background:#4ade80;box-shadow:0 0 10px #4ade808c}.midi-button--requesting .midi-indicator{background:#facc15;box-shadow:0 0 10px #facc1580}.refresh-button{cursor:pointer;width:48px;padding:0;font-size:1.45rem}
.impro-area{grid-template-columns:minmax(0,1fr) minmax(250px,.68fr) minmax(0,1fr);align-items:center;gap:12px;min-height:0;padding:6px 14px 4px;display:grid;position:relative}.orbit-panel{aspect-ratio:1;place-self:center;width:min(100%,560px);position:relative;container-type:inline-size}.ring{pointer-events:none;border:1px dotted #60a5fa3d;border-radius:50%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.right .ring{border-color:#f472b638}.ring-1{width:40%;height:40%}.ring-2{width:68%;height:68%}.ring-3{width:96%;height:96%}.orbit-slot{z-index:2;width:clamp(170px,44.5cqw,250px);height:clamp(170px,44.5cqw,250px);color:inherit;cursor:pointer;background:0 0;border:0;padding:0;position:absolute;transform:translate(-50%,-50%)}.orbit-center{top:50%;left:50%}.orbit-top{top:1%;left:50%}.orbit-right{top:50%;left:99%}.orbit-left{top:50%;left:1%}.orbit-bottom{top:99%;left:50%}.suggestion-node,.suggestion-node.selected{box-sizing:border-box;width:100%;min-width:0;height:100%;min-height:0;color:var(--blue);background:#050a13eb;border:2px solid;align-content:center;place-items:center;gap:clamp(4px,1cqw,6px);padding:clamp(12px,2.5cqw,16px);transition:box-shadow .18s,opacity .18s;display:grid;overflow:hidden;transform:none}.suggestion-node{box-shadow:inset 0 0 28px #0f172ab3}.suggestion-node.selected{box-shadow:0 0 30px color-mix(in srgb, currentColor 45%, transparent), inset 0 0 36px #0f172ad1}.suggestion-circle{border-radius:50%}.suggestion-square{border-radius:10px}.proposal-blue{color:var(--blue)}.proposal-green{color:var(--green)}.proposal-orange{color:var(--orange)}.proposal-pink{color:var(--pink)}.hand-sequence{flex-wrap:wrap;justify-content:center;align-items:center;gap:clamp(3px,.8cqw,5px);width:92%;max-width:none;display:flex}.sequence-event{white-space:nowrap;align-items:center;gap:clamp(2px,.6cqw,4px);display:inline-flex}.simultaneous-group{background:color-mix(in srgb, currentColor 10%, transparent);border:1px solid;border-radius:999px;justify-content:center;align-items:center;padding:clamp(3px,.7cqw,5px) clamp(5px,1.1cqw,8px);font-size:clamp(1rem,1vw,2.5rem);font-weight:750;line-height:1.05;display:inline-flex}.single-note-event{font-size:clamp(1rem,1.5vw,2.5rem);font-weight:750;line-height:1.05}.rhythm-symbol{color:currentColor;font-family:Segoe UI Symbol,Noto Music,serif;font-size:2.5rem;line-height:1}.sequence-arrow{color:#e2e8f0ad;margin-inline:1px;font-size:1.02rem}.method-label{color:#e2e8f0d1;text-align:center;overflow-wrap:anywhere;width:90%;max-width:none;margin-top:clamp(4px,1.1cqw,7px);font-size:1rem;font-weight:600;line-height:1.15;display:block}.played-chord{z-index:3;text-align:center;align-self:center}.played-chord>p{color:#e5e7eb;letter-spacing:.04em;margin:0 0 22px;font-size:1.05rem}.played-chord-card{min-height:290px;box-shadow:inset 0 0 38px color-mix(in srgb, currentColor 7%, transparent);background:#070a10db;border:2px solid;border-radius:22px;flex-direction:column;justify-content:center;align-items:center;padding:30px 22px 26px;display:flex}.played-chord-card strong{color:#f8fafc;font-size:clamp(1.8rem,3vw,3rem);line-height:1.05}.played-notes{color:#d3d8e2;margin-top:22px;font-size:clamp(1rem,1.7vw,1.35rem)}
.main-menu-backdrop{z-index:100;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#00040ac7;place-items:center;padding:24px;display:grid;position:fixed;inset:0}.main-menu{background:var(--surface-strong);border:1px solid #94a3b838;border-radius:24px;width:min(920px,100%);padding:24px;box-shadow:0 30px 90px #0000008c}.main-menu>header{justify-content:space-between;align-items:center;gap:16px;margin-bottom:22px;display:flex}.main-menu>header div{gap:3px;display:grid}.main-menu>header strong{font-size:1.25rem}.main-menu-brand{color:inherit;text-decoration:none}.main-menu-brand:hover,.main-menu-brand:focus-visible{text-underline-offset:4px;text-decoration:underline}.main-menu>header span,.main-settings-group>div span,.main-settings-group p,.main-account-intro span{color:var(--muted)}.main-menu>header button{border:1px solid var(--border);color:#fff;cursor:pointer;background:#ffffff0a;border-radius:50%;width:42px;height:42px}.main-menu-tabs{border-bottom:1px solid #94a3b824;flex-wrap:wrap;gap:8px;margin-bottom:20px;padding-bottom:14px;display:flex}.main-menu-tabs button{color:#aab4c3;cursor:pointer;background:#0f172a80;border:1px solid #94a3b82e;border-radius:12px;min-height:40px;padding:0 16px}.main-menu-tabs button.active{color:#fff;background:#1e548e52;border-color:#43a0ffb3}.main-menu-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;display:grid}.main-menu-card{color:#f8fafc;text-align:left;cursor:pointer;background:#0f172a9e;border:1px solid #94a3b82e;border-radius:20px;flex-direction:column;justify-content:flex-end;align-items:flex-start;gap:10px;min-height:230px;padding:22px;display:flex}.main-menu-card:hover,.main-menu-card.active{background:#1e406947;border-color:#43a0ffa6}.main-menu-icon{color:var(--blue);margin-bottom:auto;font-size:3rem}.main-menu-card strong{font-size:1.2rem}.main-menu-card small{color:#aab4c3;line-height:1.4}.main-settings,.main-account{min-height:260px}.main-settings-group{background:#0f172a85;border:1px solid #94a3b829;border-radius:18px;gap:18px;padding:22px;display:grid}.main-settings-group>div{gap:4px;display:grid}.main-settings-group p{margin:0;line-height:1.5}.settings-field{gap:8px;display:grid}.settings-field>span{color:#dbeafe;font-weight:700}.settings-field select{border:1px solid #94a3b840;border-radius:12px;width:100%;min-height:44px;padding:0 12px}.main-account{gap:18px;display:grid}.main-account-intro{gap:5px;display:grid}.main-account-intro strong{font-size:1.05rem}.main-account-intro span{line-height:1.5}.main-account-grid{grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:14px;display:grid}.main-account-link{color:#f8fafc;background:#0f172a9e;border:1px solid #94a3b82e;border-radius:16px;align-content:end;gap:7px;min-height:142px;padding:18px;text-decoration:none;transition:border-color .18s,background .18s,transform .18s;display:grid}.main-account-link:hover{background:#1e406947;border-color:#43a0ffa6;transform:translateY(-1px)}.main-account-link>span{color:var(--blue);margin-bottom:auto;font-size:1.6rem}.main-account-link strong{font-size:1rem}.main-account-link small{color:#aab4c3;line-height:1.4}
.mode-topbar{background:#02070fe6;border-bottom:1px solid #94a3b824;align-items:center;gap:16px;min-height:76px;padding:12px 24px;display:flex}.mode-title{gap:3px;margin-right:auto;display:grid}.mode-title strong{font-size:1.25rem}.mode-title span{color:var(--muted)}.score-language{border:1px solid var(--border);color:#cbd5e1;border-radius:14px;align-items:center;gap:9px;min-height:46px;padding:0 12px;display:flex}.import-score-button{color:#fff;cursor:pointer;background:#2370be40;border:1px solid #43a0ffa6;border-radius:14px;justify-content:center;align-items:center;min-height:46px;padding:0 18px;display:inline-flex;position:relative}.import-score-button input{opacity:0;pointer-events:none;width:1px;height:1px;position:absolute}.import-score-button--large{min-height:54px;padding-inline:26px}.score-empty-state,.games-placeholder{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:16px;min-height:calc(100vh - 76px);padding:32px;display:flex}.score-empty-state h1,.games-placeholder h1{margin:0;font-size:clamp(1.8rem,4vw,3.4rem)}.score-empty-state p,.games-placeholder p{color:#aab4c3;max-width:720px;margin:0 0 12px;line-height:1.6}.score-empty-icon,.games-placeholder>div{color:var(--blue);font-size:4rem}.score-error{background:#5a0f1c40;border:1px solid #ff4f698c;border-radius:18px;width:min(720px,100% - 40px);margin:40px auto;padding:22px}.score-summary{border-bottom:1px solid #94a3b821;grid-template-columns:minmax(240px,1fr) minmax(460px,1.4fr);align-items:center;gap:24px;padding:24px;display:grid}.score-summary>div{gap:5px;display:grid}.score-summary>div span,.score-summary>div small,.score-summary dt{color:var(--muted)}.score-summary>div strong{font-size:1.5rem}.score-summary dl{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:0;display:grid}.score-summary dl div{background:#0f172a85;border:1px solid #94a3b824;border-radius:14px;gap:5px;padding:12px;display:grid}.score-summary dd{margin:0;font-weight:700}.score-viewport{gap:26px;padding:26px;display:grid}.score-part h2{margin:0 0 12px}.measure-grid{grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px;display:grid}.measure-card{background:#0a111dc2;border:1px solid #94a3b829;border-radius:16px;min-height:150px;padding:14px}.measure-card>header{color:#dbe4ef;justify-content:space-between;margin-bottom:14px;display:flex}.measure-card>header span{color:var(--muted)}.measure-events{flex-wrap:wrap;align-items:flex-start;gap:7px;display:flex}.score-event{background:#43a0ff14;border:1px solid #43a0ff57;border-radius:999px;align-items:center;gap:5px;padding:7px 9px;display:inline-flex}.score-event--chord{background:#49d52f14;border-color:#49d52f80;margin-left:-7px}.score-event small{color:#9fc9f5;font-size:1rem}.empty-measure{color:#7f8b9c}.games-shell--with-piano{flex-direction:column;height:100dvh;min-height:0;display:flex;overflow:hidden}.games-placeholder--grow{flex:auto;min-height:0}.games-shared-piano-zone{width:100%;height:var(--mlu-piano-zone-height);min-height:var(--mlu-piano-zone-height);flex:0 0 var(--mlu-piano-zone-height);box-sizing:border-box;background:#171c26;border-top:1px solid #303646;padding:7px 10px 8px;overflow:hidden}.note-rush-stage{flex:auto;grid-template-rows:auto auto minmax(0,1fr);gap:16px;width:min(1120px,100%);min-height:0;margin:0 auto;padding:22px 24px 18px;display:grid;overflow:auto}.note-rush-heading{justify-content:space-between;align-items:flex-start;gap:24px;display:flex}.note-rush-heading h1{letter-spacing:-.045em;margin:3px 0 7px;font-size:clamp(1.8rem,4vw,3rem)}.note-rush-heading p{color:#98a6b8;max-width:690px;margin:0;line-height:1.55}.note-rush-kicker{color:#72e3a0;letter-spacing:.13em;text-transform:uppercase;font-size:.72rem;font-weight:850}.note-rush-save-state{background:#22c55e0d;border:1px solid #72e3a026;border-radius:13px;gap:4px;min-width:220px;padding:13px 15px;display:grid}.note-rush-save-state strong{font-size:.83rem}.note-rush-save-state span,.note-rush-save-state a{color:#8997aa;font-size:.75rem}.note-rush-save-state a{color:#9bc7ff;text-decoration:none}.note-rush-stats{grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;display:grid}.note-rush-stats>div{background:#0f172a80;border:1px solid #94a3b821;border-radius:13px;gap:4px;padding:12px 14px;display:grid}.note-rush-stats span{color:#7f8b9c;letter-spacing:.08em;text-transform:uppercase;font-size:.7rem;font-weight:800}.note-rush-stats strong{font-size:1.25rem}.note-rush-card{text-align:center;background:radial-gradient(circle at 50% 12%,#43a0ff1f,#0000 44%),#070d18c7;border:1px solid #43a0ff30;border-radius:22px;flex-direction:column;justify-content:center;align-items:center;gap:12px;min-height:210px;padding:22px;transition:border-color .16s,background .16s,transform .16s;display:flex}.note-rush-card--correct{background:#14532d29;border-color:#4ade8085}.note-rush-card--wrong{background:#7f1d1d21;border-color:#f871717a}.note-rush-card-label{color:#8da0b8;letter-spacing:.12em;text-transform:uppercase;font-size:.76rem;font-weight:850}.note-rush-target{color:#fff;letter-spacing:-.08em;font-size:clamp(4rem,12vw,7.5rem);line-height:.9}.note-rush-intro-icon{color:#72e3a0;font-size:4.2rem;line-height:1}.note-rush-card p{color:#9aa8b9;margin:0;line-height:1.55}.note-rush-feedback{color:#a8b7c9;min-height:22px;font-weight:750}.note-rush-card--correct .note-rush-feedback{color:#bbf7d0}.note-rush-card--wrong .note-rush-feedback{color:#fecaca}.note-rush-primary{color:#0b0e14;min-height:46px;font:inherit;cursor:pointer;background:#f8fafc;border:0;border-radius:12px;padding:0 20px;font-weight:850}.note-rush-primary:disabled{opacity:.45;cursor:not-allowed}@media (max-width:760px){.note-rush-stage{padding-inline:14px}.note-rush-heading{flex-direction:column}.note-rush-save-state{width:100%}.note-rush-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.note-rush-stats>div:last-child{grid-column:1/-1}}
.games-game-switcher{background:#070c15db;border-bottom:1px solid #94a3b81c;flex:none;justify-content:center;align-items:center;gap:8px;padding:10px 14px;display:flex}.games-game-switcher button{color:#9aa8ba;min-height:38px;font:inherit;cursor:pointer;background:#ffffff06;border:1px solid #94a3b824;border-radius:10px;padding:0 14px;font-size:.82rem;font-weight:800}.games-game-switcher button:hover:not(:disabled){color:#e6edf5;border-color:#72e3a04d}.games-game-switcher button:disabled{opacity:.42;cursor:not-allowed}.games-game-switcher .games-game-switcher__active{color:#d9fbe5;background:#22c55e14;border-color:#72e3a059}.ear-stage{flex:auto;width:min(1180px,100%);min-height:0;margin:0 auto;padding:18px 24px 20px;overflow:auto}.ear-heading{justify-content:space-between;align-items:flex-start;gap:22px;display:flex}.ear-heading h1{letter-spacing:-.045em;margin:3px 0 7px;font-size:clamp(1.7rem,4vw,2.8rem)}.ear-heading p{color:#98a6b8;max-width:720px;margin:0;line-height:1.55}.ear-levels{grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;margin-top:16px;display:grid}.ear-level{color:#dce4ee;text-align:left;cursor:pointer;background:#0f172a73;border:1px solid #94a3b821;border-radius:12px;gap:4px;min-width:0;padding:10px 11px;display:grid}.ear-level>span{color:#72e3a0;letter-spacing:.08em;text-transform:uppercase;font-size:.67rem;font-weight:850}.ear-level strong{min-height:32px;font-size:.77rem;line-height:1.3}.ear-level small{color:#748296;font-size:.68rem}.ear-level--active{background:#22c55e14;border-color:#72e3a06b;box-shadow:inset 0 0 0 1px #72e3a00d}.ear-level:disabled{opacity:.42;cursor:not-allowed}.ear-session-stats{grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin-top:12px;display:grid}.ear-session-stats>div{background:#0f172a6b;border:1px solid #94a3b81f;border-radius:11px;gap:3px;padding:9px 12px;display:grid}.ear-session-stats span{color:#788598;letter-spacing:.07em;text-transform:uppercase;font-size:.66rem;font-weight:800}.ear-session-stats strong{color:#f8fafc;font-size:1.05rem}.ear-card{text-align:center;background:radial-gradient(circle at 50% 10%,#6366f11f,#0000 46%),#070d18c2;border:1px solid #60a5fa2e;border-radius:20px;flex-direction:column;justify-content:center;align-items:center;gap:10px;min-height:205px;margin-top:12px;padding:20px;transition:border-color .16s,background .16s;display:flex}.ear-card--correct{background:#14532d24;border-color:#4ade8080}.ear-card--wrong{background:#7f1d1d1f;border-color:#f871717a}.ear-card-level{color:#9aabc0;letter-spacing:.09em;text-transform:uppercase;font-size:.72rem;font-weight:850}.ear-symbol{color:#72e3a0;font-size:3.8rem;line-height:1}.ear-card p{color:#9aa8b9;max-width:760px;margin:0;line-height:1.55}.ear-pass-rule{font-size:.8rem;color:#77869a!important}.ear-listen-button{color:#dbeafe;min-height:46px;font:inherit;cursor:pointer;background:#2563eb1c;border:1px solid #60a5fa47;border-radius:999px;padding:0 18px;font-weight:850}.ear-prompt{color:#f8fafc;max-width:760px;font-size:clamp(1.1rem,2.8vw,1.5rem);line-height:1.35}.ear-sequence-progress{color:#9ba8b8;border:1px solid #94a3b821;border-radius:999px;padding:5px 10px;font-size:.77rem}.ear-feedback{color:#a8b7c9;min-height:22px;font-weight:800}.ear-card--correct .ear-feedback{color:#bbf7d0}.ear-card--wrong .ear-feedback{color:#fecaca}.ear-result{color:#fff;letter-spacing:-.07em;font-size:clamp(3.8rem,10vw,6.6rem);line-height:.95}.ear-audio-note{color:#6f7c8d;font-size:.72rem}@media (max-width:980px){.ear-levels{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (max-width:760px){.games-game-switcher{justify-content:stretch}.games-game-switcher button{flex:1 1 0;padding-inline:8px}.ear-stage{padding-inline:14px}.ear-heading{flex-direction:column}.ear-heading .note-rush-save-state{width:100%}.ear-levels,.ear-session-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.ear-session-stats>div:last-child{grid-column:1/-1}}
.note-rush-stage--levels{grid-template-rows:auto auto auto auto minmax(0,1fr)}.games-admin-toggle{color:#fde68a;border-color:#fbbf244d}.games-admin-toggle--active{background:#b453093d;border-color:#fbbf24b8;box-shadow:0 0 0 2px #fbbf2414}.games-admin-test-panel{background:#78350f2e;border-bottom:1px solid #fbbf2433;flex:none;justify-content:space-between;align-items:center;gap:18px;padding:9px 18px;display:flex}.games-admin-test-panel>div:first-child{gap:2px;display:grid}.games-admin-test-panel strong{color:#fef3c7;font-size:.8rem}.games-admin-test-panel span{color:#d6c7aa;font-size:.72rem;line-height:1.35}.games-admin-octave{flex:none;align-items:center;gap:6px;display:flex}.games-admin-octave button{color:#fef3c7;min-height:32px;font:inherit;cursor:pointer;background:#451a0380;border:1px solid #fbbf2440;border-radius:8px;padding:0 10px;font-size:.75rem;font-weight:800}.games-admin-octave button:disabled{opacity:.4;cursor:not-allowed}.games-admin-octave span{color:#fde68a;text-align:center;min-width:68px;font-weight:800}.games-shared-piano-zone--interactive{border-top-color:#fbbf246b;box-shadow:inset 0 3px #fbbf240f}.game-levels{grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;display:grid}.game-level{color:#dce4ee;text-align:left;cursor:pointer;background:#0f172a73;border:1px solid #94a3b821;border-radius:12px;gap:4px;min-width:0;padding:10px 11px;display:grid}.game-level>span{color:#72e3a0;letter-spacing:.08em;text-transform:uppercase;font-size:.67rem;font-weight:850}.game-level strong{min-height:32px;font-size:.77rem;line-height:1.3}.game-level small{color:#748296;font-size:.68rem;line-height:1.25}.game-level--active{background:#22c55e14;border-color:#72e3a06b;box-shadow:inset 0 0 0 1px #72e3a00d}.game-level:disabled{opacity:.42;cursor:not-allowed}.game-infinite{background:#0f172a4d;border:1px dashed #94a3b82e;border-radius:14px;justify-content:space-between;align-items:center;gap:18px;padding:12px 14px;display:flex}.game-infinite>div:first-child{gap:3px;display:grid}.game-infinite>div:first-child>span{color:#a78bfa;letter-spacing:.08em;text-transform:uppercase;font-size:.68rem;font-weight:850}.game-infinite>div:first-child strong{color:#e9e7ff;font-size:.9rem}.game-infinite>div:first-child small{color:#77869a;line-height:1.35}.game-infinite--unlocked{background:#6d28d90f;border-style:solid;border-color:#a78bfa47}.game-infinite-controls{flex:none;align-items:center;gap:6px;display:flex}.game-infinite-controls button{color:#ddd6fe;min-width:38px;min-height:38px;font:inherit;cursor:pointer;background:#6d28d914;border:1px solid #a78bfa38;border-radius:10px;font-weight:850}.game-infinite-controls button:disabled{opacity:.35;cursor:not-allowed}.game-infinite-controls .game-infinite-current{min-width:126px;padding-inline:12px}.game-infinite-controls .game-infinite-current--active{color:#f5f3ff;background:#6d28d92e;border-color:#c4b5fd8c}.game-difficulty-badge{color:#c4b5fd;text-align:center;background:#6d28d912;border:1px solid #a78bfa2e;border-radius:999px;justify-content:center;align-items:center;max-width:min(760px,100%);padding:6px 10px;font-size:.72rem;font-weight:750;line-height:1.35;display:inline-flex}.note-rush-target--complex{letter-spacing:-.04em;overflow-wrap:anywhere;max-width:100%;font-size:clamp(1.65rem,5vw,3.3rem);line-height:1.15}.speed-badge{color:#fde68a;background:#78350f1f;border:1px solid #fbbf2438;border-radius:999px;align-items:center;min-height:28px;padding:0 10px;font-size:.75rem;font-weight:800;display:inline-flex}@media (max-width:980px){.game-levels{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (max-width:760px){.games-mode-topbar{flex-wrap:wrap}.games-mode-topbar .mode-title{min-width:calc(100% - 64px)}.games-admin-test-panel{flex-direction:column;align-items:stretch;gap:8px;padding-inline:14px}.games-admin-octave{width:100%}.games-admin-octave button:last-child{margin-left:auto}.game-levels{grid-template-columns:repeat(2,minmax(0,1fr))}.game-infinite{flex-direction:column;align-items:stretch}.game-infinite-controls{width:100%}.game-infinite-controls .game-infinite-current{flex:auto}}
@media (max-width:1450px){.topbar{grid-template-columns:48px minmax(130px,165px) max-content max-content minmax(150px,250px) minmax(145px,max-content) 44px 44px;gap:7px;padding-inline:12px}.icon-button,.refresh-button{width:44px}.midi-button{padding-inline:9px;font-size:.76rem}.key-label-toggle{padding-inline:9px;font-size:.82rem}}@media (max-width:1120px){.app-shell{grid-template-rows:auto auto 210px}.topbar{grid-template-columns:48px minmax(130px,1fr) auto auto 48px}.notes-select,.midi-button,.refresh-button{display:none}.metronome-control{grid-column:3}.topbar>.icon-button:last-child{grid-column:5}.impro-area{grid-template-columns:1fr 1fr;padding-top:20px}.played-chord{grid-area:1/1/auto/-1;justify-self:center;width:min(440px,92vw)}.played-chord-card{min-height:210px;padding:22px}.orbit-panel{grid-row:2}.white-key{min-width:9px}}@media (max-width:760px){.topbar{grid-template-columns:44px minmax(120px,1fr) auto 44px;gap:6px;padding:9px}.key-label-toggle{display:none}.metronome-control{grid-column:3;grid-template-columns:auto 34px}.metronome-control input[type=range]{display:none}.topbar>.icon-button:last-child{grid-column:4}.impro-area{grid-template-columns:1fr}.orbit-panel{aspect-ratio:1.05;grid-row:auto}.played-chord{grid-area:auto}.keyboard{min-height:180px}.suggestion-node{min-width:76px;min-height:76px;padding:8px}.suggestion-node.selected{min-width:102px;min-height:102px}.main-menu-grid,.score-summary,.score-summary dl{grid-template-columns:1fr}.main-menu-card{min-height:150px}.score-language{display:none}}
.playback-controls{z-index:35;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#050b14f5;border-bottom:1px solid #94a3b826;grid-template-columns:auto minmax(320px,1fr) auto auto;align-items:center;gap:12px;padding:10px 18px;display:grid;position:sticky;top:0}.playback-transport,.playback-tempo,.playback-loop{align-items:center;gap:8px;display:flex}.playback-controls button,.playback-loop input[type=number]{color:#f8fafc;background:#ffffff0d;border:1px solid #94a3b838;border-radius:10px;min-height:38px}.playback-controls button{cursor:pointer;padding:0 11px}.playback-controls button:disabled{opacity:.45;cursor:default}.playback-tempo{min-width:0}.playback-tempo>span{color:#e2e8f0;font-weight:700}.playback-tempo input[type=range]{width:100%;min-width:100px;accent-color:var(--blue)}.playback-tempo output{color:#dbeafe;font-variant-numeric:tabular-nums;white-space:nowrap;min-width:115px}.playback-loop{border-left:1px solid #94a3b824;border-right:1px solid #94a3b824;padding:0 8px}.playback-loop label{color:#e2e8f0;align-items:center;gap:5px;display:flex}.playback-loop input[type=number]{width:62px;padding-inline:7px}.score-midi-button{color:#f8fafc;white-space:nowrap;cursor:pointer;background:#070d17cc;border:1px solid #94a3b838;border-radius:11px;align-items:center;gap:8px;min-height:40px;padding:0 12px;display:flex}.score-midi-button--connected{border-color:#22c55e7a}.score-midi-button--connected .midi-indicator{background:#22c55e;box-shadow:0 0 10px #22c55e8c}.osmd-container{scroll-behavior:smooth}@media (max-width:1180px){.playback-controls{grid-template-columns:1fr auto}.playback-tempo{grid-area:2/1/auto/-1}}@media (max-width:760px){.playback-controls{grid-template-columns:1fr;position:static}.playback-tempo,.playback-loop{flex-wrap:wrap}.playback-tempo{grid-area:auto}}.mode-topbar .score-fullscreen-button{flex:0 0 48px;margin-left:0}.score-wait-state{color:#cbd5e1;white-space:nowrap;background:#ffffff09;border:1px solid #94a3b82e;border-radius:10px;align-items:center;gap:8px;min-height:38px;padding:0 11px;display:inline-flex}.score-wait-dot{background:#f59e0b;border-radius:50%;flex:0 0 9px;width:9px;height:9px;box-shadow:0 0 10px #f59e0b80}.score-wait-state--playing{color:#dcfce7;border-color:#22c55e52}.score-wait-state--playing .score-wait-dot{background:#22c55e;box-shadow:0 0 10px #22c55e8c}@media (max-width:760px){.score-wait-state{white-space:normal}}
.score-practice-body{min-height:0;overflow:hidden}.notation-reader{min-height:0}.osmd-scroll-area{scroll-behavior:smooth;overscroll-behavior:contain;min-height:0;overflow:auto}.compact-control.active{background:#22c55e1f;border-color:#22c55e8c}
:root{--mlu-mode-piano-zone-height:var(--mlu-piano-zone-height)}.shared-piano-zone{width:100%;height:var(--mlu-mode-piano-zone-height);min-height:var(--mlu-mode-piano-zone-height);flex:0 0 var(--mlu-mode-piano-zone-height);box-sizing:border-box;background:#171c26;border-top:1px solid #303646;min-width:0;padding:7px 10px 8px;overflow:hidden}.shared-piano-zone:has(>.shared-piano--3d){--mlu-frame-unit:calc(100% / 54);isolation:isolate;padding:var(--mlu-frame-unit) var(--mlu-frame-unit) 0;box-sizing:border-box;box-shadow:none;background:radial-gradient(115% 100% at 50% 8%,#4b3022 0%,#362219 38%,#241711 70%,#160e0b 100%);border:0;border-radius:0;position:relative;overflow:hidden;container-type:inline-size}.shared-piano-zone:has(>.shared-piano--3d):before{content:"";z-index:2;pointer-events:none;width:72px;height:72px;clip-path:path("M 0 0 H 42 C 37 0 33 4 30 10 L 0 72 Z");background:#05070a;position:absolute;top:0}.shared-piano-zone:has(>.shared-piano--3d):after{content:"";z-index:2;pointer-events:none;width:72px;height:72px;clip-path:path("M 0 0 H 42 C 37 0 33 4 30 10 L 0 72 Z");background:#05070a;position:absolute;top:0}.shared-piano-zone:has(>.shared-piano--3d):before{left:0}.shared-piano-zone:has(>.shared-piano--3d):after{right:0;transform:scaleX(-1)}.shared-piano-zone:has(>.shared-piano--3d)>.shared-piano--3d{z-index:1;box-shadow:none;background:0 0;border:0;border-radius:0;position:relative;overflow:visible}.shared-piano-zone:has(>.shared-piano--3d)>.shared-piano--3d:before{--mlu-frame-unit-3d:calc(100cqi / 54);content:"";z-index:0;top:calc(-1 * var(--mlu-frame-unit-3d));right:calc(-1 * var(--mlu-frame-unit-3d));bottom:0;left:calc(-1 * var(--mlu-frame-unit-3d));pointer-events:none;background: linear-gradient(180deg, #85583d 0%, #7b5037 55%, #67412f calc(100% - 4px), #3a241c 100%) top / 100% calc(var(--mlu-frame-unit-3d) + 8px) no-repeat,  linear-gradient(90deg, #80543b 0%, #754b35 62%, #603c2d calc(100% - 3px), #34221b 100%) left / var(--mlu-frame-unit-3d) 100% no-repeat,  linear-gradient(270deg, #80543b 0%, #754b35 62%, #603c2d calc(100% - 3px), #34221b 100%) right / var(--mlu-frame-unit-3d) 100% no-repeat;border-radius:16px 16px 0 0;position:absolute}.shared-piano-zone:has(>.shared-piano--3d)>.shared-piano--3d:after{z-index:3}.shared-piano-zone>.shared-piano{width:100%;height:100%;min-height:0}.app-shell{grid-template-rows:auto minmax(0, 1fr) var(--mlu-mode-piano-zone-height);width:100%;height:100dvh;min-height:0;display:grid;overflow:hidden}.app-shell>.topbar{min-height:0}.app-shell>.impro-area{min-height:0;overflow:hidden}.app-shell>.shared-piano-zone{flex:none;height:100%;min-height:0}.score-practice-layout{width:100%;height:100dvh;min-height:0;overflow:hidden}.score-practice-body{flex-direction:column;flex:auto;min-height:0;display:flex;overflow:hidden}.score-practice-body>.notation-reader{flex:auto;min-height:0;overflow:hidden}.score-practice-body .osmd-scroll-area{overscroll-behavior:contain;flex:auto;min-height:0;overflow:auto}.games-shell--with-piano{flex-direction:column;width:100%;height:100dvh;min-height:0;display:flex;overflow:hidden}.games-shell--with-piano>.games-placeholder--grow{flex:auto;min-height:0;overflow:hidden}.score-shared-piano-zone,.games-shared-piano-zone{display:none}@media (max-height:760px){.app-shell{grid-template-rows:auto minmax(0, 1fr) var(--mlu-mode-piano-zone-height)}}
.practice-loop-compact{color:#b8c4d4;white-space:nowrap;background:#0f172aa3;border:1px solid #94a3b82e;border-radius:10px;flex:none;align-items:center;gap:5px;min-height:34px;padding:2px 6px;font-size:.7rem;display:inline-flex}.practice-loop-compact.active{color:#fff;background:#43a0ff21;border-color:#43a0ff94}.practice-loop-toggle{cursor:pointer;align-items:center;gap:4px;display:inline-flex}.practice-loop-toggle input{accent-color:#43a0ff;width:13px;height:13px;margin:0}.practice-loop-compact>label:not(.practice-loop-toggle){align-items:center;gap:3px;display:inline-flex}.practice-loop-compact input[type=number]{color:#fff;text-align:center;font-variant-numeric:tabular-nums;background:#111827;border:1px solid #94a3b82b;border-radius:7px;width:44px;height:26px;padding:0 3px;font-size:.7rem}.practice-loop-arrow{color:#7f8b9c}
.score-guide-volume{gap:8px;padding-right:8px}.score-guide-volume input[type=range]{accent-color:#22c55e;width:92px;min-width:92px}.score-guide-volume input[type=range]:focus-visible{outline-offset:2px;outline:2px solid #22c55e8c}.practice-controls .compact-select select:disabled{opacity:.58;cursor:not-allowed}