@font-face{font-family:Noto Music;font-style:normal;font-display:swap;font-weight:400;src:url(./noto-music-music-400-normal-CksxHXl6.woff2)format("woff2"),url(./noto-music-music-400-normal-BOLtuVsm.woff)format("woff")}@font-face{font-family:Inter Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(./inter-cyrillic-ext-wght-normal-BOeWTOD4.woff2)format("woff2-variations");unicode-range:U+460-52F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}@font-face{font-family:Inter Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(./inter-cyrillic-wght-normal-DqGufNeO.woff2)format("woff2-variations");unicode-range:U+301,U+400-45F,U+490-491,U+4B0-4B1,U+2116}@font-face{font-family:Inter Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(./inter-greek-ext-wght-normal-DlzME5K_.woff2)format("woff2-variations");unicode-range:U+1F??}@font-face{font-family:Inter Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(./inter-greek-wght-normal-CkhJZR-_.woff2)format("woff2-variations");unicode-range:U+370-377,U+37A-37F,U+384-38A,U+38C,U+38E-3A1,U+3A3-3FF}@font-face{font-family:Inter Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(./inter-vietnamese-wght-normal-CBcvBZtf.woff2)format("woff2-variations");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:Inter Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(./inter-latin-ext-wght-normal-DO1Apj_S.woff2)format("woff2-variations");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:Inter Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(./inter-latin-wght-normal-Dx4kXJAl.woff2)format("woff2-variations");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}[hidden],body:not(.creator) .creator-only{display:none!important}:root{--bg:#070a18;--panel:#10142b;--panel-2:#181d3a;--line:#262c5c;--text:#e9ebff;--muted:#8d92b8;--accent:#ff7ab6;--right:#3ee6c4;--left:#ffb547;--bar-h:52px;--safe-l:env(safe-area-inset-left,0px);--safe-r:env(safe-area-inset-right,0px);--safe-b:env(safe-area-inset-bottom,0px);--safe-t:env(safe-area-inset-top,0px);color:var(--text);background:var(--bg);-webkit-tap-highlight-color:transparent;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif}*{box-sizing:border-box}html,body{overscroll-behavior:none;height:100%;margin:0;overflow:hidden}body{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;touch-action:manipulation;position:fixed;inset:0}button{font:inherit;color:inherit}.icon-btn svg,.play-btn svg{fill:none;stroke:currentColor;stroke-width:2px;stroke-linecap:round;stroke-linejoin:round;width:22px;height:22px}#app{flex-direction:column;height:100%;display:flex}.bar{height:var(--bar-h);padding:0 calc(12px + var(--safe-r)) 0 calc(12px + var(--safe-l));background:var(--panel);flex:none;align-items:center;gap:8px;display:flex}.bar.top{border-bottom:1px solid var(--line);padding-top:var(--safe-t);height:calc(var(--bar-h) + var(--safe-t))}.spacer{flex:1}.icon-btn{width:40px;height:40px;color:var(--text);cursor:pointer;background:0 0;border:0;border-radius:10px;flex:none;place-items:center;display:grid}.icon-btn:hover{background:var(--panel-2)}.icon-btn.on{color:var(--right)}.song-btn{border:1px solid var(--line);background:var(--panel-2);cursor:pointer;text-align:left;border-radius:10px;flex-direction:column;align-items:flex-start;min-width:0;max-width:46vw;padding:4px 10px;display:flex}.song-btn span{white-space:nowrap;text-overflow:ellipsis;max-width:100%;font-size:14px;font-weight:700;overflow:hidden}.song-btn small{color:var(--muted);white-space:nowrap;text-overflow:ellipsis;max-width:100%;font-size:11px;overflow:hidden}.song-btn:after{content:""}.drawer-about{color:var(--text);border-top:1px dashed var(--line);flex-shrink:0;align-items:center;gap:12px;margin-top:auto;padding-top:14px;text-decoration:none;display:flex}.drawer-about .logo{flex:none;width:44px;height:44px;transform:rotate(-4deg)}.drawer-about b{font-family:Caveat Doodle,Caveat,cursive;font-size:28px;line-height:1;display:block}.drawer-about i{color:var(--accent);font-style:normal}.drawer-about small{color:var(--muted);font-size:12px;display:block}.play-btn{background:var(--accent);color:#1a0b18;cursor:pointer;border:0;border-radius:50%;flex:none;place-items:center;width:44px;height:44px;display:grid}.play-btn svg{fill:currentColor;stroke:none;width:22px;height:22px}.play-btn .i-pause,.play-btn.playing .i-play{display:none}.play-btn.playing .i-pause{display:block}.time{color:var(--muted);font-variant-numeric:tabular-nums;text-align:center;flex:none;min-width:34px;font-size:12px}.transport,.bar-chips{flex:none;align-items:center;gap:8px;display:flex}.bar-chips{gap:6px}.time{min-width:0;padding:0 4px;font-size:13px}.time #time-label{color:var(--text);font-weight:700}.time-sep{opacity:.6}.chip{border:1px solid var(--line);background:var(--panel-2);cursor:pointer;white-space:nowrap;border-radius:999px;flex:none;height:34px;padding:0 12px;font-size:13px}.chip:hover{border-color:var(--accent)}.chip.active{border-color:var(--accent);color:var(--accent)}.toggle-chip.on{border-color:var(--right);color:var(--right);background:#3ee6c424}.btn{background:var(--panel-2);color:var(--text);border:1px solid var(--line);cursor:pointer;border-radius:10px;justify-content:center;align-items:center;gap:6px;padding:9px 14px;font-size:14px;display:inline-flex}.btn:hover{border-color:var(--accent)}.btn.primary{background:var(--accent);border-color:var(--accent);color:#1a0b18;font-weight:700}.btn.wide{width:100%}.btn.rec{color:#ff6b6b}.btn.on{border-color:var(--right);color:var(--right)}.seg{border:1px solid var(--line);border-radius:10px;display:flex;overflow:hidden}.seg button{color:var(--muted);cursor:pointer;white-space:nowrap;background:0 0;border:0;flex:1;padding:9px 10px;font-size:13px}.seg button+button{border-left:1px solid var(--line)}.seg button.on{background:var(--panel-2);color:var(--text);box-shadow:inset 0 -2px 0 var(--accent)}.row-toggle{cursor:pointer;align-items:center;gap:10px;padding:8px 0;font-size:14px;display:flex}.row-toggle.disabled{opacity:.4}.row-toggle input{width:18px;height:18px;accent-color:var(--accent)}input[type=range]{accent-color:var(--accent)}#stage-wrap{background:#000;flex:1;justify-content:center;align-items:center;min-height:0;display:flex}#stage{width:100%;height:100%;position:relative;overflow:hidden}#canvas{touch-action:none;width:100%;height:100%;display:block;position:absolute;inset:0}.hud{top:calc(var(--sheet-h,0px) + 10px);right:calc(14px + var(--safe-r));font-variant-numeric:tabular-nums;pointer-events:none;gap:16px;display:flex;position:absolute}body.view-sheet .hud{background:#10142bd9;border-radius:12px;padding:4px 12px;top:8px}.hud>div{flex-direction:column;align-items:flex-end;display:flex}.hud-label{text-transform:uppercase;letter-spacing:1.5px;color:var(--muted);font-size:9px}.hud span:last-child{font-size:20px;font-weight:700}.wait-hint{left:50%;bottom:calc(var(--kb-h,24%) + 12px);border:1px solid var(--accent);opacity:0;pointer-events:none;white-space:nowrap;background:#10142bd9;border-radius:999px;padding:5px 12px;font-size:12px;transition:opacity .2s;position:absolute;transform:translate(-50%)}.wait-hint.show{opacity:1}.start-hint{left:50%;top:calc(var(--sheet-h,0px) + (100% - var(--sheet-h,0px) - var(--kb-h,24%)) / 2);gap:10px;transition:opacity .3s;display:flex;position:absolute;transform:translate(-50%,-50%)}.start-hint.paper{color:#1f1c33;z-index:5;background:#f7f1e3 radial-gradient(#1f1c330d 1px,#0000 1px) 0 0/14px 14px;border-radius:6px;flex-direction:column;align-items:center;gap:4px;max-width:min(460px,86vw);padding:18px 30px 14px;transform:translate(-50%,-50%)rotate(-1deg);box-shadow:0 16px 36px #00000073}.start-title{text-align:center;color:#1f1c33;padding:0 22px;font-family:Caveat Doodle,Caveat,cursive;font-size:36px;line-height:1.05}.start-meta{color:#5a5670;text-align:center;margin-bottom:8px;font-size:12px}.start-buttons{flex-wrap:wrap;justify-content:center;gap:10px;display:flex}.start-hint.paper .btn:not(.primary){color:#1f1c33;background:0 0;border:2px solid #1f1c33}.start-ready{color:#e0447f;white-space:nowrap;font-family:Caveat Doodle,Caveat,cursive;font-size:22px;position:absolute;top:46%;left:-64px;transform:rotate(-8deg)}.start-ready svg{fill:none;stroke:#e0447f;stroke-width:2.5px;stroke-linecap:round;stroke-linejoin:round;width:46px;height:24px;margin:-2px 0 0 18px;display:block}.start-hint.paper .doodle{fill:none;stroke-width:3px;stroke-linecap:round;stroke-linejoin:round;position:absolute}.start-hint.paper .doodle-note{stroke:#20b89a;width:20px;top:10px;right:12px;transform:rotate(10deg)}.start-hint.paper .tape{background:#3ee6c473;width:90px;height:22px;position:absolute;top:-11px;left:50%;transform:translate(-50%)rotate(-2deg);box-shadow:0 1px 2px #0000001f}@media (height<=560px){.start-hint.paper{padding:10px 20px}.start-title{font-size:22px}.start-meta{margin-bottom:4px;font-size:10.5px}.start-hint.paper{top:calc(var(--sheet-h,0px) + (100% - var(--sheet-h,0px) - var(--kb-h,24%)) / 2 - 8px)}.tip-card{max-width:34%;font-size:16px}.start-hint .btn{padding:8px 16px;font-size:14px}.start-ready{display:none}}@media (width<=700px){.start-ready{display:none}}.start-hint .btn{white-space:nowrap;border-radius:999px;padding:11px 20px;font-size:15px;font-weight:700}.start-hint .btn.primary{box-shadow:0 8px 30px #ff7ab659}.start-hint .btn.on{display:none}body.view-sheet .start-hint{top:50%}.start-hint.hide{opacity:0;pointer-events:none}.rec-brand{--u:calc(var(--ui,1) * 1px);top:calc(var(--sheet-h,0px) + 16 * var(--u));left:calc(20 * var(--u) + var(--safe-l));pointer-events:none;text-shadow:0 2px 12px #070a18cc;font-family:Inter Variable,Inter,system-ui,sans-serif;display:none;position:absolute}.rec-mark{--u:calc(var(--ui,1) * 1px);top:calc(var(--sheet-h,0px) + 16 * var(--u));right:calc(20 * var(--u) + var(--safe-r));pointer-events:none;text-shadow:0 2px 12px #070a18cc;font-family:Inter Variable,Inter,system-ui,sans-serif;display:none;position:absolute}body.rec .hud{top:calc(var(--sheet-h,0px) + 64 * var(--ui,1) * 1px)}.rec-logo{align-items:center;gap:calc(10 * var(--u));font-size:calc(22 * var(--u));letter-spacing:-.5px;color:#f7f7fb;font-weight:800;display:flex}.rec-logo .logo{width:calc(30 * var(--u));height:calc(30 * var(--u))}.rec-logo b,.card-brand b{color:var(--right);font-weight:800}.rec-song{gap:calc(2 * var(--u));flex-direction:column;margin-top:0;display:flex}.rec-song span{font-size:calc(21 * var(--u));letter-spacing:-.3px;color:#f7f7fb;font-weight:800}.rec-song small{font-size:calc(14 * var(--u));color:var(--left);font-weight:600}.rec-exit{width:36px;height:36px;color:var(--text);cursor:pointer;opacity:0;background:#10142bcc;border:0;border-radius:50%;transition:opacity .3s;display:none;position:absolute;top:8px;right:8px}body.rec .rec-exit{display:block}body.rec .rec-exit.show{opacity:1}.card-screen{--u:calc(var(--ui,1) * 1px);text-align:center;padding:calc(30 * var(--u));background-color:#efe6d2;background-image:radial-gradient(#1f1c3312 1.2px,#0000 1.2px);background-size:calc(18 * var(--u)) calc(18 * var(--u));color:#1f1c33;opacity:0;pointer-events:none;z-index:5;flex-direction:column;justify-content:center;align-items:center;font-family:Inter Variable,Inter,system-ui,sans-serif;transition:opacity .6s;display:flex;position:absolute;inset:0;overflow:hidden}.card-screen.show{opacity:1}.card-doodles{position:absolute;inset:0}.card-doodles span{position:absolute;transform:translate(-50%,-50%)}.card-doodles svg{width:calc(var(--s) * var(--u));height:calc(var(--s) * var(--u));opacity:.85;display:block}.card-brand{align-items:center;gap:calc(12 * var(--u));font-size:calc(26 * var(--u));margin-bottom:calc(26 * var(--u));font-weight:800;display:flex;position:relative}.card-brand b{color:#e0447f}.card-brand .logo{width:calc(46 * var(--u));height:calc(46 * var(--u))}.card-paper{background:#fbf7ec radial-gradient(#1f1c330d 1px,#0000 1px);background-size:calc(14 * var(--u)) calc(14 * var(--u));padding:calc(40 * var(--u)) calc(64 * var(--u)) calc(30 * var(--u));border-radius:calc(6 * var(--u));max-width:78%;box-shadow:0 calc(16 * var(--u)) calc(34 * var(--u)) #1f1c3338, 0 calc(2 * var(--u)) 0 #0000000f;position:relative;transform:rotate(-1.5deg)}.card-tape{top:calc(-16 * var(--u));min-width:calc(130 * var(--u));height:calc(34 * var(--u));padding:0 calc(18 * var(--u));color:#1f1c33;font-weight:800;font-size:calc(16 * var(--u));letter-spacing:2px;white-space:nowrap;background:#ffb547bf;justify-content:center;align-items:center;display:flex;position:absolute;left:50%;transform:translate(-50%)rotate(2deg);box-shadow:0 1px 2px #0000001f}.card-tape.pink{background:#ff7ab699}.intro-title{font-family:Caveat Doodle,Caveat,cursive;font-size:calc(92 * var(--u));margin-top:calc(8 * var(--u));color:#1f1c33;line-height:1}.card-underline{width:calc(260 * var(--u));height:calc(18 * var(--u));margin:calc(4 * var(--u)) auto calc(10 * var(--u));fill:none;stroke:#20b89a;stroke-width:3.5px;stroke-linecap:round;display:block}.intro-composer{font-family:Caveat Doodle,Caveat,cursive;font-size:calc(34 * var(--u));color:#e0447f}.outro .logo{width:calc(84 * var(--u));height:calc(84 * var(--u))}.outro-title{font-family:Caveat Doodle,Caveat,cursive;font-size:calc(76 * var(--u));margin-top:calc(10 * var(--u));color:#e0447f;line-height:1}.outro-sub{font-size:calc(24 * var(--u));margin-top:calc(14 * var(--u));color:#3a3650;font-weight:600}.outro-sub b{color:#1f1c33;background:linear-gradient(#0000 58%,#3ee6c48c 58%);padding:0 2px;font-weight:800}.outro-small{font-family:Caveat Doodle,Caveat,cursive;font-size:calc(30 * var(--u));margin-top:calc(16 * var(--u));color:#1f1c33;justify-content:center;align-items:center;gap:calc(8 * var(--u));display:flex}.outro-small svg{width:calc(28 * var(--u));fill:none;stroke:#e0447f;stroke-width:3.5px;stroke-linejoin:round;transform:rotate(8deg)}.summary{background:#05060f99;justify-content:center;align-items:center;display:none;position:absolute;inset:0}.summary.show{display:flex}.summary{z-index:40}@media (height<=560px){.summary-card.paper{padding:14px 28px 10px}.paper .summary-title{font-size:28px}.paper .summary-stars{font-size:24px}.paper .summary-acc{font-size:38px}.paper .summary-detail{margin-bottom:8px;font-size:12px}.paper .summary-sub{margin-top:8px;font-size:18px}.paper .doodle-line{margin-bottom:4px}}.summary-card{background:var(--panel);border:1px solid var(--line);text-align:center;border-radius:18px;min-width:260px;padding:22px 36px}@font-face{font-family:Caveat Doodle;src:url(./caveat700-D8_1Nw6V.woff2)format("woff2");font-weight:700;font-display:swap}.summary-card.paper{color:#1f1c33;background:#f7f1e3 radial-gradient(#1f1c330d 1px,#0000 1px) 0 0/14px 14px;border:none;border-radius:6px;min-width:300px;max-width:min(420px,88vw);padding:26px 40px 20px;position:relative;transform:rotate(-1.2deg);box-shadow:0 18px 40px #00000073,0 2px #00000014}.paper .tape{background:#ffb5478c;width:110px;height:26px;position:absolute;top:-12px;left:50%;transform:translate(-50%)rotate(2deg);box-shadow:0 1px 2px #0000001f}.paper .summary-title{color:#e0447f;margin-bottom:2px;font-family:Caveat Doodle,Caveat,cursive;font-size:40px;line-height:1}.paper .summary-stars{color:#f0a020}.paper .summary-acc{color:#1f1c33;font-family:Caveat Doodle,Caveat,cursive;font-size:54px;line-height:1.05}.paper .doodle-line{fill:none;stroke:#20b89a;stroke-width:3px;stroke-linecap:round;width:140px;height:12px;margin:0 auto 8px;display:block}.paper .summary-detail{color:#5a5670}.paper .summary-actions{flex-wrap:wrap;justify-content:center;gap:10px;display:flex}.paper .btn.ink{color:#1f1c33;background:0 0;border:2px solid #1f1c33;border-radius:999px;align-items:center;text-decoration:none;display:inline-flex}.paper .summary-sub{color:#1f1c33;margin-top:14px;font-family:Caveat Doodle,Caveat,cursive;font-size:22px;text-decoration:none;display:inline-block}.paper .summary-sub b{color:#e0447f}.paper .summary-sub:hover{text-decoration:underline}.paper .doodle{fill:none;stroke-width:3px;stroke-linecap:round;stroke-linejoin:round;position:absolute}.paper .doodle-note{stroke:#20b89a;width:26px;top:14px;right:16px;transform:rotate(10deg)}.paper .doodle-heart{stroke:#e0447f;width:22px;bottom:18px;left:16px;transform:rotate(-12deg)}.summary-stars{letter-spacing:6px;color:#ffd166;font-size:36px}.summary-acc{margin:4px 0;font-size:40px;font-weight:800}.summary-detail{color:var(--muted);margin-bottom:14px;font-size:14px}.engraved{pointer-events:none;background:#f5f0e6;display:none;position:absolute;top:0;left:0;right:0;overflow:hidden;box-shadow:0 2px #00000059}.engraved-track{will-change:transform;position:absolute;top:0;left:0}.engraved-host{position:absolute;top:0;left:0}.engraved-clefs{opacity:0;background:linear-gradient(90deg,#f5f0e6 80%,#f5f0e600);width:72px;transition:opacity .25s;position:absolute;top:0;bottom:0;left:0}.engraved-clefs.show{opacity:1}.engraved-clefs svg{display:block}.engraved-clefs line{stroke:#1f1c33;stroke-width:1px;opacity:.85}.engraved-clefs text{fill:#1f1c33;font-family:Noto Music,serif}.engraved-host svg{display:block}.engraved-labels{width:100%;position:absolute;top:0;left:0}.engraved-fingers{pointer-events:none;width:100%;position:absolute;top:0;left:0}.engraved-finger{text-shadow:0 0 2px #f5f0e6,0 0 2px #f5f0e6,0 0 3px #f5f0e6;font-family:system-ui,sans-serif;font-weight:800;line-height:1;position:absolute;transform:translate(-50%)}.engraved-finger.r{color:#0b7d68}.engraved-finger.l{color:#b36a00}.engraved-label{color:#1f1c33bf;white-space:nowrap;font:700 11px system-ui,sans-serif;position:absolute;transform:translate(-50%)}.engraved-playhead{background:#ff5fa2;width:2px;margin-left:-1px;position:absolute;top:0;bottom:0;box-shadow:0 0 0 10px #ff7ab629}.popover{z-index:30;top:calc(var(--bar-h) + var(--safe-t) + 6px);max-height:calc(100% - var(--bar-h) - var(--safe-t) - 14px);overscroll-behavior:contain;background:var(--panel);border:1px solid var(--line);border-radius:14px;width:min(320px,100vw - 24px);padding:12px 14px 14px;display:none;position:fixed;overflow-y:auto;box-shadow:0 16px 40px #00000080}.popover.open{display:block}.popover .seg{margin:6px 0 4px}.popover input[type=range]{width:100%;margin:8px 0}.pop-title{text-transform:uppercase;letter-spacing:1.2px;color:var(--muted);justify-content:space-between;margin-top:6px;font-size:12px;display:flex}.pop-title span{color:var(--text);font-weight:700}.pop-help{color:var(--muted);margin:6px 0 8px;font-size:13px}.scrim{z-index:40;opacity:0;pointer-events:none;background:#00000080;transition:opacity .2s;position:fixed;inset:0}.scrim.show{opacity:1;pointer-events:auto}.drawer{z-index:50;background:var(--panel);width:min(360px,88vw);padding:calc(10px + var(--safe-t)) 16px calc(16px + var(--safe-b));overscroll-behavior:contain;-webkit-overflow-scrolling:touch;flex-direction:column;gap:12px;transition:transform .25s;display:flex;position:fixed;top:0;bottom:0;overflow-y:auto}.drawer.left{padding-left:calc(16px + var(--safe-l));border-right:1px solid var(--line);left:0;transform:translate(-102%)}.drawer.right{padding-right:calc(16px + var(--safe-r));border-left:1px solid var(--line);right:0;transform:translate(102%)}.drawer.open{transform:none}.drawer-head{justify-content:space-between;align-items:center;font-size:18px;font-weight:800;display:flex}.drawer section{border-top:1px solid var(--line);flex-direction:column;gap:8px;padding-top:6px;display:flex}.drawer h3{color:var(--accent);margin:6px 0 0;font-family:Caveat Doodle,Caveat,cursive;font-size:24px;font-weight:700;line-height:1.1}.drawer h3:after{content:"";opacity:.8;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 8'%3E%3Cpath d='M2 5 Q12 1 22 5 T42 5 T62 4' fill='none' stroke='%233ee6c4' stroke-width='2.2' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat;width:64px;height:8px;margin-top:1px;display:block}.drawer-head>span{font-family:Caveat Doodle,Caveat,cursive;font-size:32px;font-weight:700;line-height:1}.field{color:var(--muted);flex-direction:column;gap:6px;font-size:13px;display:flex}.field input[type=range]{width:100%}.mic-field{flex-direction:row;align-items:center;gap:12px}.mic-sens{display:none}.mic-on .mic-sens{display:flex}.drawer-note{color:var(--muted);margin:0;font-size:12px;line-height:1.4}#midi-status.ok{color:var(--right)}.meter{background:var(--panel-2);border-radius:4px;flex:1;height:8px;overflow:hidden}.meter>div{background:linear-gradient(90deg, var(--right), var(--left), var(--accent));width:0;height:100%;transition:width 60ms linear}.song-list{flex-direction:column;gap:6px;margin:0;padding:0;list-style:none;display:flex}.song-list li{gap:6px;display:flex}.song-list .song-del{width:40px;color:var(--muted);flex:none;justify-content:center;align-items:center}.song-list button{text-align:left;border:1px solid var(--line);background:var(--panel-2);cursor:pointer;border-radius:12px;flex-direction:column;gap:2px;width:100%;padding:10px 12px;display:flex}.song-list button strong{font-size:15px}.song-list button small{color:var(--muted);font-size:12px}.song-list button.on{border-color:var(--accent);box-shadow:inset 3px 0 0 var(--accent)}#drawer-songs{width:min(440px,100vw)}#drawer-songs.dropping{outline:3px dashed var(--accent);outline-offset:-8px}.song-search input{box-sizing:border-box;border:1px solid var(--line);background:var(--panel-2);width:100%;color:var(--text);font:inherit;-webkit-user-select:text;user-select:text;border-radius:12px;padding:11px 14px;font-size:15px}.song-search input:focus-visible{outline:2px solid var(--accent);outline-offset:1px}.chips{flex-wrap:wrap;gap:6px;display:flex}.chips:empty{display:none}.chips button{border:1px solid var(--line);background:var(--panel-2);color:var(--text);font:inherit;cursor:pointer;border-radius:999px;padding:6px 12px;font-size:13px}.chips.small button{color:var(--muted);padding:4px 10px;font-size:12px}.chips button.on{background:var(--accent);border-color:var(--accent);color:#0a0c1e;font-weight:700}.song-list .song-main{min-width:0}.song-list .song-main strong,.song-list .song-main small{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.song-tags{flex-wrap:wrap;gap:4px;margin-top:3px;display:flex}.song-tags span{color:var(--muted);background:#ffffff12;border-radius:999px;padding:1px 7px;font-size:10.5px;font-weight:700}.song-tags .lvl-1{color:#3ee6c4;background:#3ee6c429}.song-tags .lvl-2{color:#ffb547;background:#ffb54729}.song-tags .lvl-3{color:#ff7ab6;background:#ff7ab629}.song-tags .mine{color:#b9c0ff;background:#8c96ff2e}.song-list .song-fav,.song-list .song-del{width:44px;color:var(--muted);flex:none;justify-content:center;align-items:center;padding:0;font-size:18px}.song-list .song-yt{border:1px solid var(--line);background:var(--panel-2);color:#ff5c5c;border-radius:12px;flex:none;justify-content:center;align-items:center;width:40px;font-size:15px;text-decoration:none;display:flex}.song-list .song-fav.on{color:#ffb547;border-color:var(--line);box-shadow:none}.song-facets{flex-direction:column;gap:6px;display:flex}#drawer-songs>*{flex-shrink:0}@media (height<=560px){#drawer-songs{gap:8px}#drawer-songs .drawer-head{font-size:16px}.drawer-head>span{font-size:26px}.song-search{top:calc(-10px - var(--safe-t));z-index:2;background:var(--panel);margin-top:-2px;padding:2px 0 4px;position:sticky}.song-search input{padding:8px 12px;font-size:14px}.song-facets{scrollbar-width:none;flex-direction:row;gap:6px;overflow-x:auto}.song-facets::-webkit-scrollbar{display:none}#song-shelves::-webkit-scrollbar{display:none}.song-facets .chips,#song-shelves{flex-wrap:nowrap;flex:none}#song-shelves{scrollbar-width:none;overflow-x:auto}.chips button{flex:none;padding:4px 10px;font-size:12px}.song-list button{padding:7px 10px}.song-list button strong{font-size:14px}}.request-song{color:#1f1c33;background:#f7f1e3;border-radius:6px;flex-direction:column;gap:2px;padding:12px 14px;font-size:13px;text-decoration:none;display:flex;transform:rotate(-.6deg);box-shadow:0 6px 16px #00000059}.request-song .request-title{color:#e0447f;font-family:Caveat Doodle,Caveat,cursive;font-size:24px;line-height:1}.request-song b{color:#1f1c33}.request-song:hover{transform:rotate(0)}.song-empty{text-align:center;color:var(--muted);padding:18px 8px;font-family:Caveat Doodle,Caveat,cursive;font-size:21px;line-height:1.2}.song-empty:before{content:"";background:url(data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%2048%2048%27%3E%3Cpath%20d%3D%27M24%206%20L29%2018%20L42%2019%20L32%2028%20L35%2041%20L24%2034%20L13%2041%20L16%2028%20L6%2019%20L19%2018%20Z%27%20fill%3D%27none%27%20stroke%3D%27%23ff7ab6%27%20stroke-width%3D%272.6%27%20stroke-linejoin%3D%27round%27/%3E%3Cpath%20d%3D%27M38%206%20Q39%2011%2044%2012%20Q39%2013%2038%2018%20Q37%2013%2032%2012%20Q37%2011%2038%206Z%27%20fill%3D%27none%27%20stroke%3D%27%23ffb547%27%20stroke-width%3D%272%27/%3E%3C/svg%3E) 50%/contain no-repeat;width:56px;height:56px;margin:0 auto 6px;display:block;transform:rotate(-8deg)}.touch-only{display:none!important}@media (pointer:coarse){.desktop-only{display:none!important}.touch-only{display:inline-flex!important}.touch-only.on{display:none!important}}.rotate{z-index:100;background:var(--bg);text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:10px;padding:24px;display:none;position:fixed;inset:0}.rotate-icon{font-size:54px}.rotate-title{font-size:22px;font-weight:800}.rotate p{color:var(--muted);margin:0 0 10px}@media (orientation:portrait) and (pointer:coarse){.rotate{display:flex}}@media (height<=500px){:root{--bar-h:44px}.icon-btn{width:36px;height:36px}.play-btn{width:38px;height:38px}.chip{height:30px;padding:0 10px;font-size:12px}.hud span:last-child{font-size:16px}.hud{gap:12px}.bar{gap:6px}}@media (width<=1100px){.song-btn{max-width:26vw}}@media (width<=860px){.transport,.bar-chips{gap:4px}.bar-chips .chip{padding:0 9px}}body.phone .bar-chips{display:none}body.phone .transport{gap:6px}body.phone .song-btn{max-width:24vw}body.phone #chip-practice{text-overflow:ellipsis;max-width:30vw;overflow:hidden}.popover.practice{gap:18px;width:min(600px,100vw - 24px);display:none}.popover.practice.open{grid-template-columns:1fr 1fr;display:grid}.pop-col{min-width:0}.popover.practice #chip-wait{border-radius:10px;width:100%;height:38px;margin:6px 0 4px}.lyrics{--u:calc(var(--ui,1) * 1px);left:50%;top:calc(var(--sheet-h,0px) + 14 * var(--u));max-width:52%;padding:calc(6 * var(--u)) calc(20 * var(--u));border-radius:calc(16 * var(--u));text-align:center;pointer-events:none;background:#070a18c7;font-family:Inter Variable,Inter,system-ui,sans-serif;display:none;position:absolute;transform:translate(-50%)}.lyrics.has-lyrics{display:block}.lyrics-line{font-size:calc(24 * var(--u));color:#f7f7fb80;white-space:nowrap;text-overflow:ellipsis;font-weight:800;line-height:1.25;overflow:hidden}.lyrics-line span{transition:color .12s}.lyrics-line .sung{color:#f7f7fb}.lyrics-line .now{color:var(--right);text-shadow:0 0 calc(12 * var(--u)) #3ee6c499}.lyrics-line.next{font-size:calc(15 * var(--u));color:#f7f7fb66;margin-top:calc(2 * var(--u));font-weight:600}.lyrics-line.next:empty{display:none}body.view-sheet .lyrics{top:auto;bottom:calc(var(--kb-h,24%) + 10px)}.tip-card{--u:calc(var(--ui,1) * 1px);left:calc(18 * var(--u) + var(--safe-l));top:calc(var(--sheet-h,0px) + 14 * var(--u));max-width:min(30%, calc(380 * var(--u)));gap:calc(10 * var(--u));padding:calc(10 * var(--u)) calc(14 * var(--u));border-radius:calc(14 * var(--u));box-shadow:0 calc(8 * var(--u)) calc(24 * var(--u)) #0006;font-family:Inter Variable,Inter,system-ui,sans-serif;font-size:calc(15 * var(--u));color:#f7f7fb;pointer-events:none;opacity:0;transform:translateX(calc(-12 * var(--u)));background:#10142be6;border:1px solid #ffb54799;align-items:flex-start;font-weight:600;line-height:1.35;transition:opacity .35s,transform .35s;display:flex;position:absolute}.tip-card.show{opacity:1;transform:none}.tip-card b{font-size:calc(18 * var(--u));line-height:1.1}.tip-card{color:#1f1c33;border-radius:calc(4 * var(--u));font-family:Caveat Doodle,Caveat,cursive;font-weight:700;font-size:calc(21 * var(--u));padding:calc(12 * var(--u)) calc(16 * var(--u)) calc(10 * var(--u));transform:translateX(calc(-12 * var(--u))) rotate(-1.5deg);background:#f7f1e3;border:none;align-items:center;line-height:1.15}.tip-card.show{transform:rotate(-1.5deg)}.tip-card:before{content:"";top:calc(-9 * var(--u));left:calc(22 * var(--u));width:calc(64 * var(--u));height:calc(18 * var(--u));background:#ffb54799;position:absolute;transform:rotate(-4deg);box-shadow:0 1px 2px #0000001f}.tip-card b svg{width:calc(22 * var(--u));height:calc(28 * var(--u));fill:#ffb54759;stroke:#e08a00;stroke-width:2.4px;stroke-linecap:round;stroke-linejoin:round;display:block}body.rec .tip-card{top:calc(var(--sheet-h,0px) + 16 * var(--ui,1) * 1px);left:calc(20 * var(--ui,1) * 1px + var(--safe-l))}body.rec .lyrics-line.next{display:none}body.view-sheet .tip-card{top:auto;bottom:calc(var(--kb-h,24%) + 10px)}.tips-text{resize:vertical;background:var(--panel-2);width:100%;color:var(--text);border:1px solid var(--line);-webkit-user-select:text;user-select:text;border-radius:10px;padding:8px 10px;font:13px/1.4 system-ui,sans-serif}body.listening .hud{display:none}.toast{z-index:120;background:var(--panel);border:1px solid var(--line);opacity:0;pointer-events:none;border-radius:12px;max-width:min(560px,90vw);padding:10px 16px;font-size:14px;transition:opacity .25s;position:fixed;bottom:24px;left:50%;transform:translate(-50%);box-shadow:0 10px 30px #00000080}.toast.show{opacity:1}body.exporting #stage{width:var(--export-w)!important;height:var(--export-h)!important}body.exporting .rec-exit,body.exporting .summary,body.exporting .start-hint,body.hide-score .hud,body.hide-hint .wait-hint,body.hide-title .intro,body.hide-title .rec-brand,body.hide-title .rec-mark,body.hide-endCard .outro,body.hide-lyrics .lyrics,body.hide-tips .tip-card,body.rec .bar,body.rec .popover{display:none!important}body.rec #stage{cursor:none;width:min(100vw,177.778vh);height:min(100vh,56.25vw)}body.rec .summary{display:none!important}body:not(.rec) .card-screen{display:none}
