@font-face{font-family:Outfit;font-style:normal;font-weight:500;font-display:swap;src:url(../media/b2ea385cb5ae8625-s.0kjod.kaq1k69.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:Outfit;font-style:normal;font-weight:500;font-display:swap;src:url(../media/1b99372b3eaef0c8-s.p.0gx2haw2tmll8.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:Outfit;font-style:normal;font-weight:600;font-display:swap;src:url(../media/b2ea385cb5ae8625-s.0kjod.kaq1k69.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:Outfit;font-style:normal;font-weight:600;font-display:swap;src:url(../media/1b99372b3eaef0c8-s.p.0gx2haw2tmll8.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:Outfit;font-style:normal;font-weight:700;font-display:swap;src:url(../media/b2ea385cb5ae8625-s.0kjod.kaq1k69.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:Outfit;font-style:normal;font-weight:700;font-display:swap;src:url(../media/1b99372b3eaef0c8-s.p.0gx2haw2tmll8.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:Outfit;font-style:normal;font-weight:800;font-display:swap;src:url(../media/b2ea385cb5ae8625-s.0kjod.kaq1k69.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:Outfit;font-style:normal;font-weight:800;font-display:swap;src:url(../media/1b99372b3eaef0c8-s.p.0gx2haw2tmll8.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:Outfit Fallback;src:local(Arial);ascent-override:100.18%;descent-override:26.05%;line-gap-override:0.0%;size-adjust:99.82%}.outfit_f63b7444-module__w1BNrq__className{font-family:Outfit,Outfit Fallback;font-style:normal}.outfit_f63b7444-module__w1BNrq__variable{--font-display:"Outfit", "Outfit Fallback"}
:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#060806;--panel:#0d100d;--panel2:#171c17;--line:#252b25;--text:#f2f2ec;--muted:#909890;--lime:#c3f260;--cyan:#73d9ff;--melody:#b88cff;--lyric:#d4865b}@supports (color:lab(0% 0 0)){:root{--bg:lab(2.0258% -.864595 .655097);--panel:lab(4.51749% -1.66815 1.26716);--panel2:lab(9.67615% -3.35328 2.62187);--line:lab(16.637% -3.35324 2.61389);--text:lab(95.4332% -.941068 2.8622);--muted:lab(61.918% -4.19167 3.25085);--lime:lab(90.0959% -31.2957 63.2893)}}*{box-sizing:border-box}html,body{background:var(--bg);min-height:100%;color:var(--text);font-family:var(--font-sans),sans-serif;margin:0}button,input{font:inherit}button{color:inherit;cursor:pointer}.cf-app{background:radial-gradient(circle at 14% -10%,#161e05,transparent 34rem),var(--bg);min-height:100vh}@supports (color:lab(0% 0 0)){.cf-app{background:radial-gradient(circle at 14% -10%,lab(9.94201% -7.80074 12.4804),transparent 34rem),var(--bg)}}.cf-topbar{border-bottom:1px solid var(--line);background:color-mix(in oklch,var(--bg) 94%,transparent);z-index:20;justify-content:space-between;align-items:center;height:64px;padding:0 24px;display:flex;position:sticky;top:0}.cf-logo{font:700 20px var(--font-display);align-items:center;gap:10px;display:flex}.cf-logo i{background:url(/logo.svg) 50%/contain no-repeat;flex:0 0 34px;width:34px;height:34px}.cf-logo b{color:var(--lime)}.github-link{border:1px solid var(--line);color:#aab2ab;background:#151916;border-radius:10px;place-items:center;width:36px;height:36px;transition:color .18s,border-color .18s,background .18s;display:grid}.github-link:hover{color:var(--lime);background:#1d231b;border-color:#4d5d3c}.github-link:focus-visible{outline:2px solid var(--lime);outline-offset:2px}.github-link svg{width:18px;height:18px}.cf-layout{grid-template-columns:270px minmax(0,1fr);min-height:calc(100vh - 64px);display:grid}.library{border-right:1px solid var(--line);background:#101311;flex-direction:column;padding:22px 16px;display:flex}.library-title>span,.kicker{color:var(--lime);letter-spacing:1.2px;font-size:9px;font-weight:800}.library-title h1{font:700 24px var(--font-display);margin:5px 0 2px}.library-title p{color:#727a73;margin:0;font-size:9px}.mobile-song-picker{display:none}.song-list{flex-direction:column;gap:5px;display:flex}.song-list button{text-align:left;background:0 0;border:1px solid #0000;border-radius:12px;grid-template-columns:42px 1fr 22px;align-items:center;gap:10px;padding:8px;display:grid}.song-list button:hover{background:#181c19}.song-list button.selected{box-shadow:inset 3px 0 var(--lime);background:linear-gradient(90deg,#222a1d,#191d1a);border-color:#3b4633}.song-list button>i{--song-color:#d8ff62;background:linear-gradient(145deg,var(--song-color),color-mix(in srgb,var(--song-color) 28%,#101311));color:#101311;border-radius:9px;place-items:center;width:42px;height:42px;font-style:normal;display:grid}.song-list button span strong,.song-list button span small{display:block}.song-list button span strong{font-size:12px}.song-list button span small{color:#7f8880;margin-top:3px;font-size:9px}.song-list button em{font:600 10px var(--font-display);color:#a3aaa4;font-style:normal}.data-credit{background:#171b18;border:1px solid #30382f;border-radius:12px;margin-top:auto;padding:13px}.data-credit strong{color:var(--lime);font-size:10px}.data-credit p{color:#a3aaa4;margin:4px 0;font-size:9px}.data-credit small{color:#666e67;font-size:8px;line-height:1.5}.studio{min-width:0;padding:14px 24px 22px}.song-head{justify-content:space-between;align-items:flex-end;max-width:1280px;margin:0 auto 10px;display:flex}.song-head h2{font:750 25px var(--font-display);margin:3px 0}.song-head p{color:#858e87;margin:0;font-size:10px}.player-card{border:1px solid var(--line);background:var(--panel);border-radius:18px;max-width:1280px;margin:auto;overflow:hidden;box-shadow:0 25px 70px #00000057}.chord-row{border-bottom:1px solid var(--line);background:#101310;align-items:stretch;height:66px;display:flex;overflow:hidden}.current-chord{background:linear-gradient(135deg,#26301f,#171b17);flex:0 0 120px;width:120px;padding:10px 14px}.current-chord span{color:var(--lime);font-size:7px;display:block}.current-chord strong{font:800 24px var(--font-display)}.chord-row>button{background:0 0;border:0;border-left:1px solid #252b26;flex:1;min-width:82px}.chord-row>button small,.chord-row>button strong{display:block}.chord-row>button small{color:#606861;font-size:7px}.chord-row>button strong{font:650 16px var(--font-display);color:#8f9690}.chord-row>button.active{background:#d8ff620d}.chord-row>button.active strong{color:var(--lime)}.next-chord{color:#667068;flex:0 0 94px;justify-content:center;align-items:center;gap:5px;width:94px;font-size:8px;display:flex}.next-chord b{color:#d9ddd9}.learn-grid{grid-template-columns:245px minmax(0,1fr);display:grid}.lesson-panel{border-right:1px solid var(--line);background:#111411;min-width:0;padding:12px}.panel-tabs{background:#0a0c0b;border:1px solid #282e29;border-radius:8px;grid-template-columns:1fr 1fr;gap:3px;margin-bottom:12px;padding:3px;display:grid}.panel-tabs button{color:#697169;background:0 0;border:0;border-radius:5px;padding:6px;font-size:9px}.panel-tabs button.active{color:#fff;background:#242a25}.howto{grid-template-columns:23px 1fr;align-items:start;gap:8px;margin:10px 2px;display:grid}.howto>span{width:20px;height:20px;color:var(--lime);font:700 9px var(--font-display);background:#222a1e;border-radius:6px;place-items:center;display:grid}.howto p{color:#757d76;margin:0;font-size:8px;line-height:1.5}.howto p strong{color:#c4cac4;font-size:9px;display:block}.lh,.rh{border-radius:50%;width:6px;height:6px;margin:0 3px 0 5px;display:inline-block}.lh{background:var(--lime)}.rh{background:var(--cyan)}.lyrics-box{background:#181d18;border:1px solid #303730;border-radius:9px;margin-top:12px;padding:10px}.lyrics-box>small,.lyrics-box>strong{display:block}.lyrics-box>small{color:#778078;font-size:7px}.lyrics-box>strong{color:#d3d7d2;margin:4px 0;font-size:10px;line-height:1.4}.lyrics-box p{color:#666e67;margin:4px 0;font-size:7px}.lyrics-box label{text-align:center;color:#9ca59b;cursor:pointer;border:1px dashed #465044;border-radius:6px;margin-top:8px;padding:6px;font-size:8px;display:block}.lyrics-box input{display:none}.data-panel dl{margin:0}.data-panel dl div{border-bottom:1px solid #252b26;justify-content:space-between;padding:9px 3px;display:flex}.data-panel dt{color:#747c75;font-size:8px}.data-panel dd{font:650 10px var(--font-display);margin:0}.data-panel p{color:#707971;font-size:8px;line-height:1.6}.course-guide{padding:2px}.guide-label{color:var(--lime);letter-spacing:.8px;font-size:8px}.course-guide h3{font:700 14px/1.35 var(--font-display);color:#e3e7e2;margin:7px 0 14px}.course-guide ol{gap:8px;margin:0;padding:0;list-style:none;display:grid}.course-guide li{color:#9ba39c;grid-template-columns:22px 1fr;align-items:center;gap:8px;font-size:9px;line-height:1.4;display:grid}.course-guide li>b{width:22px;height:22px;color:var(--lime);font:700 9px var(--font-display);background:#222a1e;border-radius:7px;place-items:center;display:grid}.hand-key{color:#79817a;border-top:1px solid #252b26;gap:12px;margin-top:16px;padding-top:11px;font-size:8px;display:flex}.piece-meta{gap:7px;margin-bottom:14px;display:grid}.piece-meta>span{background:#171b18;border:1px solid #2c332d;border-radius:8px;padding:9px}.piece-meta small,.piece-meta b{display:block}.piece-meta small{color:#687069;margin-bottom:3px;font-size:7px}.piece-meta b{color:#d2d7d2;font-size:10px}.performance{background:#0e110f;min-width:0}.roll-and-keys{min-width:880px}.piano-roll{background:linear-gradient(#0d100e,#171c18);border-bottom:1px solid #34402f;height:clamp(300px,42dvh,440px);position:relative;overflow:hidden}.roll-grid{position:absolute;inset:0}.roll-grid i{border-left:1px solid #ffffff06;position:absolute;top:0;bottom:0}.hit-line{border-top:1px solid #d8ff626b;position:absolute;bottom:10px;left:0;right:0;box-shadow:0 -5px 18px #d8ff620f}.hit-line span{color:var(--lime);font-size:7px;position:absolute;top:-14px;left:8px}.midi-note{z-index:2;color:#101310;border-radius:5px;justify-content:center;align-items:flex-end;width:2.2%;min-width:8px;max-width:none;padding-bottom:3px;display:flex;position:absolute;transform:translate(-50%,100%);box-shadow:0 4px 14px #0003}.midi-note.left{background:linear-gradient(#91ae48,var(--lime))}.midi-note.right{background:linear-gradient(#418da7,var(--cyan))}.midi-note b{font:750 8px var(--font-display)}.loading{color:#8c958d;background:#101410;place-items:center;font-size:10px;display:grid;position:absolute;inset:0}.loading.error{color:#ff9d66}.keyboard-legend{color:#858d86;background:#111411;align-items:center;gap:12px;height:25px;padding:0 8px;font-size:7px;display:flex}.keyboard-legend small{color:#5f675f;margin-left:auto}.keyboard-legend .audio-error{color:#ff9d66}.real-piano{background:#080a08;height:112px;display:flex;position:relative}.real-piano>button:not(.black){color:#172017;background:linear-gradient(#f3f4ef,#d3d6cf);border:1px solid #2b2e2b;border-top:3px solid #303430;border-radius:0 0 4px 4px;flex:1;min-width:0;position:relative}.real-piano>button:not(.black).lit{background:linear-gradient(var(--lime),#b5d946)}.real-piano button span{font:700 7px var(--font-display);position:absolute;bottom:6px;left:50%;transform:translate(-50%)}.real-piano .black{z-index:3;background:linear-gradient(90deg,#111411,#323732,#0e100e);border:1px solid #050605;border-top:3px solid #080a08;border-radius:0 0 4px 4px;width:14px;height:70px;position:absolute;top:0;box-shadow:0 5px 6px #00000080}.real-piano .black.lit{background:linear-gradient(var(--cyan),#49a9ca);color:#0b171b}.transport{border-top:1px solid var(--line);background:#171b18;grid-template-columns:82px minmax(120px,1fr) auto 170px;align-items:center;gap:14px;height:62px;padding:0 14px;display:grid}.time b{font:650 11px var(--font-display)}.time span{color:#687069;font-size:8px}.timeline{width:100%;accent-color:var(--lime)}.controls{align-items:center;gap:7px;display:flex}.controls button{color:#777f78;background:0 0;border:0;font-size:8px}.controls .main-play{background:var(--lime);color:#101310;border-radius:50%;width:40px;height:40px;font-size:12px}.speed-control{justify-content:flex-end;align-items:center;gap:4px;display:flex}.speed-control>span{color:#687069;margin-right:3px;font-size:7px}.speed-control button{color:#818a82;background:#1d221e;border:1px solid #303730;border-radius:6px;padding:5px 7px;font-size:7px}.speed-control button.active{color:var(--lime);border-color:#708742}@media (max-width:1100px){.cf-layout{grid-template-columns:1fr;align-content:start}.library{border-right:0;border-bottom:1px solid var(--line);height:auto;padding:12px 12px 10px;display:block;overflow:visible}.library-title{align-items:baseline;gap:10px;padding:0 2px 8px;display:flex}.library-title>span{display:none}.library-title h1{margin:0;font-size:17px}.library-title p{font-size:8px}.library-groups{max-width:360px;margin-bottom:8px}.song-list{scroll-snap-type:x proximity;flex-direction:row;padding:0 0 5px;overflow:auto hidden}.song-list button{scroll-snap-align:start;background:#151916;border-color:#232924;min-width:185px}.song-list button.selected{box-shadow:inset 0 -3px var(--lime)}.data-credit{display:none}.learn-grid{grid-template-columns:210px minmax(0,1fr)}.studio{padding:12px}.performance{overflow-x:auto}.roll-and-keys{min-width:820px}}@media (max-width:700px){.cf-topbar{height:50px;padding:0 12px}.cf-layout{min-height:calc(100vh - 50px)}.library{padding:7px 8px 8px}.library-title{display:none}.library-groups{max-width:none;margin-bottom:6px}.library-groups button{padding:6px 3px}.mobile-song-picker{color:#e1e5e0;text-align:left;background:#171b18;border:1px solid #30372f;border-radius:9px;grid-template-columns:30px minmax(0,1fr) 20px 34px;align-items:center;gap:8px;width:100%;height:43px;padding:5px 7px;display:grid}.mobile-song-picker>i{background:linear-gradient(145deg,var(--song-color),color-mix(in srgb,var(--song-color) 28%,#101311));color:#101311;border-radius:7px;place-items:center;width:30px;height:30px;font-style:normal;display:grid}.mobile-song-picker span{min-width:0}.mobile-song-picker span small,.mobile-song-picker span strong{display:block}.mobile-song-picker span small{color:#737c74;font-size:7px}.mobile-song-picker span strong{white-space:nowrap;text-overflow:ellipsis;font-size:11px;overflow:hidden}.mobile-song-picker em{font:600 9px var(--font-display);color:#aab2ab;font-style:normal}.mobile-song-picker>b{color:var(--lime);text-align:right;font-size:8px}.song-list{z-index:20;background:#111411;border:1px solid #343c34;border-radius:10px;max-height:min(48vh,360px);padding:6px;display:none;position:absolute;top:100%;left:8px;right:8px;overflow:hidden auto;box-shadow:0 18px 45px #000000a6}.library{position:relative}.song-list.mobile-open{flex-direction:column;display:flex}.song-list button{background:#151916;grid-template-columns:32px 1fr 18px;gap:7px;width:100%;min-width:0}.song-list button>i{width:32px;height:32px}.song-list button.selected{box-shadow:inset 3px 0 var(--lime)}.studio{padding:8px}.song-head{align-items:center}.song-head h2{font-size:20px}.chord-row{overflow-x:auto}.learn-grid{flex-direction:column;display:flex}.lesson-panel{border-right:0;border-bottom:1px solid var(--line)}.course-guide h3{margin-bottom:10px;font-size:13px}.course-guide ol{grid-template-columns:repeat(3,1fr);gap:6px}.course-guide li{background:#171b18;border-radius:8px;padding:8px;font-size:8px;display:block}.course-guide li>b{margin-bottom:6px}.piece-meta{grid-template-columns:90px 1fr}.howto{display:none}.lyrics-box{margin-top:8px}.performance{overflow-x:auto}.roll-and-keys{min-width:680px}.piano-roll{height:200px}.transport{grid-template-columns:58px minmax(100px,1fr) auto;gap:7px;height:auto;min-height:82px;padding:8px}.speed-control{grid-column:1/-1;justify-content:center}.speed-control button{padding:5px 10px}.player-card{border-radius:13px}}.midi-note{will-change:top;backface-visibility:hidden;transform:translate(-50%,-100%)}.track-switches{grid-template-columns:1fr 1fr;gap:6px;margin:0 0 12px;display:grid}.track-switches button{text-align:left;background:#171b18;border:1px solid #303730;border-radius:8px;padding:8px}.track-switches button span,.track-switches button b{display:block}.track-switches button span{color:#8a938b;font-size:9px}.track-switches button b{color:#626a63;margin-top:3px;font-size:7px}.track-switches button i{background:#454c46;border-radius:50%;width:6px;height:6px;margin-right:5px;display:inline-block}.track-switches button.on{background:#20271c;border-color:#536340}.track-switches button.on span{color:#edf2e9}.track-switches button.on b{color:var(--lime)}.track-switches button.on i{background:var(--lime);box-shadow:0 0 8px #d8ff628c}.melody-status{border-top:1px solid #252b26;align-items:center;gap:8px;margin-top:12px;padding:10px 2px 0;display:flex}.melody-status>i{background:#b88cff;border-radius:50%;width:8px;height:8px;box-shadow:0 0 10px #b88cffb3}.melody-status span strong,.melody-status span small{display:block}.melody-status strong{font-size:9px}.melody-status small{color:#747c75;margin-top:2px;font-size:7px}.lyrics-box label{color:#b59ccf;border-color:#5c4c70}.midi-note.melody{z-index:4;background:linear-gradient(#8f63bf,#c7a5ff);outline:1px solid #e2cfff7a;box-shadow:0 4px 16px #9f68d759}@media (min-width:1101px){.library{height:calc(100vh - 64px);overflow:hidden}}.library-title{padding-bottom:10px}.library-groups{border:1px solid var(--line);background:#0b0e0c;border-radius:9px;grid-template-columns:repeat(3,1fr);gap:3px;margin-bottom:10px;padding:3px;display:grid}.library-groups button{color:#6f7871;background:0 0;border:0;border-radius:6px;padding:7px 3px;font-size:9px}.library-groups button.active{color:var(--lime);background:#252c24}.song-list{scrollbar-width:thin;scrollbar-color:#384037 transparent;min-height:0;padding-right:3px;overflow-y:auto}.song-list button{padding:6px}.song-list button>i{width:36px;height:36px}.data-credit{flex:none;margin-top:10px}.real-piano>button:not(.black).lit.left,.real-piano .black.lit.left{background:linear-gradient(var(--lime),#a9cb3d);color:#172017;box-shadow:inset 0 0 0 2px #d8ff6280}.real-piano>button:not(.black).lit.right,.real-piano .black.lit.right{background:linear-gradient(var(--cyan),#3fa4c7);color:#0b171b;box-shadow:inset 0 0 0 2px #73d9ff80}.no-chords{border-bottom:1px solid var(--line);color:#727b73;background:#101310;align-items:center;height:52px;padding:0 16px;font-size:9px;display:flex}.chord-row{height:58px}.current-chord{padding-top:7px}.current-chord strong{font-size:21px}.song-head{margin-bottom:8px}.player-card{border-radius:14px}@media (min-width:701px) and (max-width:1100px){.library{padding:9px 12px 10px;position:relative}.library-title{display:none}.library-groups{max-width:none;margin-bottom:7px}.mobile-song-picker{color:#e1e5e0;text-align:left;background:#171b18;border:1px solid #30372f;border-radius:9px;grid-template-columns:30px minmax(0,1fr) 20px 38px;align-items:center;gap:8px;width:100%;height:43px;padding:5px 8px;display:grid}.mobile-song-picker>i{background:linear-gradient(145deg,var(--song-color),color-mix(in srgb,var(--song-color) 28%,#101311));color:#101311;border-radius:7px;place-items:center;width:30px;height:30px;font-style:normal;display:grid}.mobile-song-picker span{min-width:0}.mobile-song-picker span small,.mobile-song-picker span strong{display:block}.mobile-song-picker span small{color:#737c74;font-size:7px}.mobile-song-picker span strong{white-space:nowrap;text-overflow:ellipsis;font-size:11px;overflow:hidden}.mobile-song-picker em{font:600 9px var(--font-display);color:#aab2ab;font-style:normal}.mobile-song-picker>b{color:var(--lime);text-align:right;font-size:8px}.song-list{z-index:20;background:#111411;border:1px solid #343c34;border-radius:10px;max-height:min(48vh,360px);padding:6px;display:none;position:absolute;top:100%;left:12px;right:12px;overflow:hidden auto;box-shadow:0 18px 45px #000000a6}.song-list.mobile-open{flex-direction:column;display:flex}.song-list button{grid-template-columns:36px 1fr 20px;width:100%;min-width:0}.song-list button.selected{box-shadow:inset 3px 0 var(--lime)}}.library-title{padding:2px 7px 14px}.library-title h1{margin:0 0 5px;font-size:22px;line-height:1.2}.library-title p{color:#7f8880;font-size:10px;line-height:1.4}.data-credit strong{color:#d9ded8;font-size:11px;line-height:1.4}.song-head{align-items:flex-start;margin-bottom:12px}.song-head>div{min-width:0}.song-head h2{margin:5px 0 7px;font-size:27px;line-height:1.15}.song-head p{flex-wrap:wrap;gap:5px;margin:0;display:flex}.song-head p span{color:#909991;background:#141815;border:1px solid #293029;border-radius:999px;padding:4px 8px;font-size:9px;line-height:1}.song-head p span:last-child{color:#d6ff62;background:#1b2118;border-color:#3d4933}.mobile-guide-toggle{display:none}@media (max-width:700px){.cf-topbar{height:42px;padding:0 10px}.cf-logo{gap:7px;font-size:15px}.cf-logo i{flex-basis:26px;width:26px;height:26px}.cf-layout{min-height:calc(100vh - 42px)}.library{padding:5px 7px 6px}.library-groups{border-radius:8px;height:29px;margin-bottom:5px;padding:2px}.library-groups button{padding:3px;font-size:9px}.mobile-song-picker{border-radius:8px;grid-template-columns:26px minmax(0,1fr) 18px 32px;height:36px;padding:4px 6px}.mobile-song-picker>i{border-radius:6px;width:26px;height:26px}.mobile-song-picker span small{display:none}.mobile-song-picker span strong{font-size:10px}.mobile-song-picker>b{font-size:8px}.studio{padding:6px}.song-head{align-items:flex-start;height:auto;min-height:48px;margin:0 2px 7px}.song-head .kicker{display:none}.song-head h2{margin:2px 0 6px;font-size:18px}.song-head p{gap:4px}.song-head p span{padding:3px 6px;font-size:8px}.chord-row{height:52px}.current-chord{flex-basis:100px;width:100px;padding:7px 10px}.current-chord strong{font-size:19px}.chord-row>button{min-width:70px}.chord-row>button strong{font-size:14px}.next-chord{display:none}.mobile-guide-toggle{border:0;border-bottom:1px solid var(--line);color:#aab2ab;background:#151916;justify-content:space-between;align-items:center;width:100%;height:34px;padding:0 11px;font-size:9px;display:flex}.mobile-guide-toggle b{color:var(--lime);font-size:8px}.lesson-panel{padding:10px;display:none}.lesson-panel.mobile-open{display:block}.panel-tabs{margin-bottom:9px}.performance{order:2}.roll-and-keys{min-width:620px}.piano-roll{height:clamp(220px,36dvh,320px)}.keyboard-legend{height:23px}.real-piano{height:100px}.real-piano .black{height:64px}.transport{min-height:76px}.course-guide ol{grid-template-columns:1fr;gap:5px}.course-guide li{grid-template-columns:22px 1fr;display:grid}.course-guide li>b{margin:0}}.data-credit{background:#141815;border-color:#30392d;border-radius:10px;padding:11px 12px 12px}.data-credit strong{color:var(--lime);letter-spacing:.2px;font-size:10px;line-height:1.3;display:block}.data-credit p{color:#9ba39c;margin:5px 0 7px;font-size:9px;line-height:1.35}.data-credit small{color:#697169;font-size:8px;line-height:1.55;display:block}.song-list button.selected,.song-list button.selected:hover{box-shadow:none}.piano-roll{contain:layout paint}.midi-note{transition:top 45ms linear}.track-switches button:first-child.on{background:#241d2e;border-color:#684f87}.track-switches button:first-child.on span{color:#f4edff}.track-switches button:first-child.on b{color:#d2b4ff}.track-switches button:first-child.on i{background:var(--melody);box-shadow:0 0 9px #b88cff9e}.track-switches button+button.on{background:#2b1f19;border-color:#805238}.track-switches button+button.on span{color:#fff1e9}.track-switches button+button.on b{color:#ffb58b}.track-switches button+button.on i{background:var(--lyric);box-shadow:0 0 9px #ff9d6694}.track-switches .lyrics-switch.on{background:#251b17;border-color:#694633}.track-switches .lyrics-switch.on span{color:#fff0e8}.track-switches .lyrics-switch.on b{color:#d4865b}.track-switches .lyrics-switch.on i{background:var(--lyric);box-shadow:0 0 9px #d4865b8c}.track-switches .melody-switch.on{background:#241d2e;border-color:#684f87}.track-switches .melody-switch.on span{color:#f4edff}.track-switches .melody-switch.on b{color:#d2b4ff}.track-switches .melody-switch.on i{background:var(--melody);box-shadow:0 0 9px #b88cff9e}.song-list button>i,.mobile-song-picker>i{font:750 12px var(--font-display);font-variant-numeric:tabular-nums}.lyrics-box{background:#251b17;border-color:#694633}.lyrics-box>small{color:#d4865b}.lyrics-box>strong{color:#fff0e8}.lyrics-box p{color:#9f7762}.lyrics-box label{color:#f0a57d;background:#ff9d6609;border-color:#855d48}.melody-status>i{background:var(--melody)}.midi-note{align-items:flex-end;min-height:10px;padding:2px 1px;line-height:1;overflow:hidden}.midi-note b{text-overflow:clip;max-width:100%;line-height:1;overflow:hidden}.hit-line{bottom:4px}.real-piano>button:not(.black).lit.melody,.real-piano .black.lit.melody{background:linear-gradient(#d0b0ff,var(--melody));color:#21152d;box-shadow:inset 0 0 0 2px #d1b1ff94,0 0 14px #b88cff47}.hit-line{top:98%;bottom:auto}@media (max-width:700px){.library-groups{gap:2px;height:31px}.library-groups button{font-size:10px;font-weight:600;line-height:1}.mobile-song-picker{grid-template-columns:28px minmax(0,1fr) 22px 34px;gap:7px;height:38px;padding:4px 7px}.mobile-song-picker>i{width:28px;height:28px}.mobile-song-picker span strong{font-size:11px;line-height:1.25}.mobile-song-picker em,.mobile-song-picker>b{font-size:9px}.song-list{gap:4px;padding:7px}.song-list.mobile-open{gap:4px}.song-list button{border-radius:8px;grid-template-columns:34px minmax(0,1fr) 24px;gap:9px;min-height:48px;padding:7px 8px}.song-list button>i{border-radius:7px;width:34px;height:34px}.song-list button span strong{font-size:11px;line-height:1.3}.song-list button span small{margin-top:2px;font-size:8px;line-height:1.25}.song-list button em{text-align:right;font-size:9px}.song-list button.selected,.song-list button.selected:hover{box-shadow:none}.github-link{border-radius:8px;width:30px;height:30px}.github-link svg{width:16px;height:16px}}