@font-face{font-family:Anton;font-style:normal;font-display:swap;font-weight:400;src:url(./anton-latin-400-normal-Byf51wtH.woff2)format("woff2"),url(./anton-latin-400-normal-AUNGEG_V.woff)format("woff")}@font-face{font-family:Instrument Sans;font-style:normal;font-display:swap;font-weight:400;src:url(./instrument-sans-latin-400-normal-DRC__1Mx.woff2)format("woff2"),url(./instrument-sans-latin-400-normal-D1W7dsQl.woff)format("woff")}@font-face{font-family:Instrument Sans;font-style:normal;font-display:swap;font-weight:500;src:url(./instrument-sans-latin-500-normal-Dk9ku72i.woff2)format("woff2"),url(./instrument-sans-latin-500-normal-Z6ESRlEs.woff)format("woff")}@font-face{font-family:Instrument Sans;font-style:normal;font-display:swap;font-weight:600;src:url(./instrument-sans-latin-600-normal-B7fBEWYG.woff2)format("woff2"),url(./instrument-sans-latin-600-normal-B9e8oLYv.woff)format("woff")}:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#0b0b10;--panel:#15151e;--panel2:#1e1e29;--line:#2e2e3c;--ink:#f4f1ea;--muted:#9591a4;--dim:#605c74;--warm:#ffb627;--cool:#3ad7c4;--hot:#ff5470}*{box-sizing:border-box}html,body,#root{height:100%}body{background:var(--bg);color:var(--ink);-webkit-font-smoothing:antialiased;margin:0;font-family:Instrument Sans,Helvetica Neue,Helvetica,Arial,sans-serif;font-size:16px;line-height:1.5}button,input,select{font:inherit;color:inherit}button{cursor:pointer}:focus-visible{outline:2px solid var(--warm);outline-offset:3px}h1,h2,p{margin:0}.app{grid-template-rows:auto minmax(0,1fr);max-width:1000px;height:100%;margin:0 auto;padding:0 18px;display:grid}.top{align-items:center;gap:12px;min-height:54px;padding-block:12px 8px;display:flex}.logo{letter-spacing:.07em;text-transform:uppercase;white-space:nowrap;font-family:Anton,Impact,sans-serif;font-size:17px}.logo em{color:var(--warm);font-style:normal}.song{min-width:0;color:var(--muted);white-space:nowrap;text-overflow:ellipsis;flex:1;font-size:14px;overflow:hidden}.txtbtn{border:1px solid var(--line);color:var(--muted);white-space:nowrap;background:0 0;border-radius:999px;padding:7px 15px;font-size:14px}.txtbtn:hover{border-color:var(--dim);color:var(--ink)}.view{text-align:center;align-content:center;justify-items:center;gap:clamp(14px,3vh,28px);min-height:0;padding-block:10px 24px;display:grid;overflow:auto}.view[hidden]{display:none!important}.lede h1{letter-spacing:.01em;text-wrap:balance;font-family:Anton,Impact,sans-serif;font-size:clamp(28px,6.5vw,46px);font-weight:400;line-height:1.02}.lede p{color:var(--muted);text-wrap:balance;margin-top:10px;font-size:17px}.choices{gap:12px;width:100%;max-width:520px;display:grid}.choice{text-align:left;background:var(--panel);border:1px solid var(--line);border-radius:10px;gap:5px;padding:18px 20px;display:grid}.choice:hover{border-color:var(--warm)}.choice b{letter-spacing:.03em;font-family:Anton,Impact,sans-serif;font-size:19px;font-weight:400}.choice span{color:var(--muted);font-size:14.5px;line-height:1.45}.choice.main{border-color:var(--warm);padding:22px}.choice.main b{color:var(--warm);font-size:24px}.others{flex-wrap:wrap;justify-content:center;gap:10px;display:flex}.mic{aspect-ratio:1;width:min(46vw,170px);color:var(--warm);background:var(--panel2);border:2px solid var(--line);border-radius:50%;place-items:center;display:grid;position:relative}.mic:after{content:"";border:2px solid var(--warm);opacity:0;border-radius:50%;animation:1.8s ease-out infinite mic-ring;position:absolute;inset:-2px}.mic.hearing{border-color:var(--warm)}.mic.hearing:after{animation-duration:.9s}.mic.blocked{color:var(--dim)}.mic.blocked:after{display:none}@keyframes mic-ring{0%{opacity:.7;transform:scale(1)}to{opacity:0;transform:scale(1.35)}}@media (prefers-reduced-motion:reduce){.mic:after{animation:none}}.livenote{color:var(--muted);align-items:center;gap:7px;font-size:13.5px;display:flex}.livenote i{background:var(--cool);border-radius:50%;width:8px;height:8px;display:block}.livenote.lost i{background:var(--warm)}.say{text-wrap:balance;max-width:30ch;font-size:19px}.say b{color:var(--warm);font-weight:600}.sub{color:var(--muted);text-wrap:balance;max-width:34ch;font-size:14.5px}.pad{aspect-ratio:1;background:var(--panel2);border:2px solid var(--line);letter-spacing:.1em;text-transform:uppercase;width:min(62vw,230px);color:var(--ink);border-radius:50%;place-items:center;font-family:Anton,Impact,sans-serif;font-size:28px;display:grid}.pad:active{background:var(--warm);border-color:var(--warm);color:#0b0b10}.tapdots{gap:9px;display:flex}.tapdots i{background:var(--line);border-radius:50%;width:11px;height:11px;display:block}.tapdots i.on{background:var(--warm)}.num{color:var(--warm);font-variant-numeric:tabular-nums;-webkit-user-select:none;user-select:none;font-family:Anton,Impact,sans-serif;font-size:min(30vh,44vw);line-height:.8;transition:font-size .15s}.num.small{font-size:min(9vh,14vw)}.num.second{color:var(--cool)}.num.resting{color:var(--dim)}.beat{animation:.15s ease-out beat}@keyframes beat{0%{transform:scale(1.06)}to{transform:scale(1)}}@media (prefers-reduced-motion:reduce){.beat{animation:none}}.boxes{grid-auto-columns:1fr;grid-auto-flow:column;gap:clamp(4px,1.2vw,9px);width:100%;max-width:560px;display:grid}.box{border:1px solid var(--line);background:var(--panel);min-height:clamp(40px,7.5vh,58px);color:var(--dim);border-radius:6px;place-items:center;font-family:Anton,Impact,sans-serif;font-size:clamp(16px,4vw,26px);transition:background 80ms linear,color 80ms linear,border-color 80ms linear;display:grid}.box.first{color:var(--muted)}.box.lit{background:var(--warm);border-color:var(--warm);color:#0b0b10}.box.lit.second{background:var(--cool);border-color:var(--cool)}.box.quiet{opacity:.35}.progress{background:var(--line);border-radius:2px;width:100%;max-width:560px;height:3px;overflow:hidden}.progress i{background:var(--warm);transform-origin:0;width:100%;height:100%;display:block;transform:scaleX(0)}.hint{color:var(--muted);text-wrap:balance;max-width:40ch;font-size:15px}.hint b{color:var(--ink);font-weight:600}.actions{flex-wrap:wrap;justify-content:center;gap:9px;display:flex}.primary{letter-spacing:.08em;text-transform:uppercase;background:var(--ink);color:#0b0b10;border:none;border-radius:7px;padding:14px 30px;font-family:Anton,Impact,sans-serif;font-size:17px}.primary.stop{background:var(--hot);color:#fff}.extra{gap:7px;width:100%;max-width:560px;display:grid}.fallrow{align-items:stretch;gap:8px;width:100%;display:flex}.lanelabels{flex:none;grid-template-rows:repeat(3,1fr);width:clamp(42px,12vw,58px);padding-top:19px;display:grid}.lanelabels span{letter-spacing:.08em;place-items:center end;font-size:clamp(9px,2.4vw,11px);font-weight:600;display:grid}.lanelabels .l1{color:var(--warm)}.lanelabels .l2{color:var(--cool)}.lanelabels .l3{color:var(--muted)}canvas.drums{border-radius:7px;flex:1;min-width:0;height:clamp(152px,33vh,270px);display:block}.extra-wide{max-width:100%}canvas.whole{background:var(--panel);border:1px solid var(--line);cursor:pointer;border-radius:6px;width:100%;height:56px;display:block}.fallnote{color:var(--dim);text-wrap:balance;font-size:13px}.fallnote b{color:var(--muted);font-weight:500}.sheet{z-index:20;padding:0 18px;padding-top:calc(16px + env(safe-area-inset-top,0px));padding-bottom:calc(28px + env(safe-area-inset-bottom,0px));background:#0b0b10f7;position:fixed;inset:0;overflow:auto}.sheetin{gap:12px;max-width:560px;margin:0 auto;display:grid}.sheethead{align-items:center;gap:12px;padding-block:6px 4px;display:flex}.sheethead h2{letter-spacing:.05em;text-transform:uppercase;flex:1;font-family:Anton,Impact,sans-serif;font-size:20px;font-weight:400}.opt{background:var(--panel);border:1px solid var(--line);text-align:left;border-radius:9px;align-items:center;gap:14px;padding:13px 15px;display:flex}.opt .lbl{flex:1;gap:2px;min-width:0;display:grid}.opt .lbl span{font-size:15px}.opt .lbl em{color:var(--dim);font-size:12.5px;font-style:normal}.opt input[type=text]{background:var(--panel2);border:1px solid var(--line);border-radius:6px;flex:none;width:min(45vw,180px);padding:9px 11px;font-size:14px}.opt input[type=checkbox]{appearance:none;background:var(--panel2);border:1px solid var(--line);cursor:pointer;border-radius:999px;flex:none;width:44px;height:26px;margin:0;transition:background .12s linear;position:relative}.opt input[type=checkbox]:after{content:"";background:var(--dim);border-radius:50%;width:18px;height:18px;transition:transform .12s,background .12s linear;position:absolute;top:3px;left:3px}.opt input[type=checkbox]:checked{background:var(--warm);border-color:var(--warm)}.opt input[type=checkbox]:checked:after{background:#0b0b10;transform:translate(18px)}.stepper{flex:none;align-items:center;gap:6px;display:flex}.stepper button{border:1px solid var(--line);background:var(--panel2);width:34px;height:34px;color:var(--muted);border-radius:6px;place-items:center;padding:0;font-size:17px;line-height:1;display:grid}.stepper button:hover{color:var(--ink)}.stepper .read{text-align:center;font-variant-numeric:tabular-nums;min-width:66px;color:var(--ink);font-size:15px}.slider{width:130px;accent-color:var(--warm);flex:none}.seg{flex-wrap:wrap;gap:6px;display:flex}.seg button{background:var(--panel2);border:1px solid var(--line);color:var(--muted);border-radius:999px;padding:7px 14px;font-size:13.5px}.seg button.on{background:var(--warm);border-color:var(--warm);color:#0b0b10;font-weight:600}.grouplab{letter-spacing:.17em;text-transform:uppercase;color:var(--dim);padding-top:10px;font-size:11px}.plain{color:var(--muted);font-size:14px;line-height:1.55}.plain b{color:var(--ink);font-weight:600}.savedrow{background:var(--panel);border:1px solid var(--line);border-radius:8px;align-items:center;gap:10px;padding:10px 13px;font-size:14.5px;display:flex}.savedrow .nm{text-overflow:ellipsis;white-space:nowrap;text-align:left;background:0 0;border:none;flex:1;min-width:0;padding:4px 0;font-size:14.5px;overflow:hidden}.savedrow .nm:hover{color:var(--warm)}.savedrow .meta{color:var(--dim);white-space:nowrap;font-size:13px}.savedrow .x{color:var(--dim);background:0 0;border:none;padding:0 4px;font-size:17px}.savedrow .x:hover{color:var(--hot)}.status{color:var(--warm);text-wrap:balance;max-width:46ch;min-height:1.4em;font-size:14px}.self-start{justify-self:start}.library{text-align:left;gap:7px;width:100%;max-width:520px;display:grid}.library .grouplab{padding-top:0}.fallnote{margin:2px auto 0}.pill{background:var(--panel2);color:var(--muted);border-radius:999px;padding:5px 12px;font-size:12.5px}.box{position:relative}.claptag{letter-spacing:.06em;color:var(--warm);font-family:Instrument Sans,system-ui,sans-serif;font-size:10.5px;position:absolute;bottom:calc(-1*clamp(16px,2.4vh,20px));left:0;right:0}.lesson .boxes{margin-bottom:clamp(16px,2.4vh,20px)}.feedback{min-height:1.5em;color:var(--muted);font-size:17px}.feedback b{color:var(--ink);font-weight:600}.feedback.good{color:var(--cool)}