@font-face{font-family:Manrope Variable;font-style:normal;font-display:swap;font-weight:200 800;src:url(data:font/woff2;base64,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) format("woff2-variations");unicode-range:U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}@font-face{font-family:Manrope Variable;font-style:normal;font-display:swap;font-weight:200 800;src:url(./manrope-cyrillic-wght-normal-Dvxsihut.woff2) format("woff2-variations");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}@font-face{font-family:Manrope Variable;font-style:normal;font-display:swap;font-weight:200 800;src:url(./manrope-greek-wght-normal-DL7QRZyv.woff2) format("woff2-variations");unicode-range:U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF}@font-face{font-family:Manrope Variable;font-style:normal;font-display:swap;font-weight:200 800;src:url(./manrope-vietnamese-wght-normal-usUDDRr7.woff2) format("woff2-variations");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}@font-face{font-family:Manrope Variable;font-style:normal;font-display:swap;font-weight:200 800;src:url(./manrope-latin-ext-wght-normal-Ch3YOpNY.woff2) format("woff2-variations");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,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:Manrope Variable;font-style:normal;font-display:swap;font-weight:200 800;src:url(./manrope-latin-wght-normal-DHIcAJRg.woff2) format("woff2-variations");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:DM Mono;font-style:normal;font-display:swap;font-weight:400;src:url(./dm-mono-latin-400-normal-4GdczIuU.woff2) format("woff2"),url(./dm-mono-latin-400-normal--0xN8mdc.woff) format("woff")}@font-face{font-family:DM Mono;font-style:normal;font-display:swap;font-weight:500;src:url(./dm-mono-latin-500-normal-DRMDZjhP.woff2) format("woff2"),url(./dm-mono-latin-500-normal-CN8Miw6E.woff) format("woff")}:root{font-family:Manrope Variable,Noto Sans SC,Microsoft YaHei,system-ui,sans-serif;color:#20201e;background:#f4f0e6;font-synthesis:none;color-scheme:light;--paper: #f4f0e6;--white: #fffdf6;--ink: #20201e;--red: #c43625;--blue: #234bc4;--yellow: #f3cf38;--muted: #625f55;--border: #20201e;--panel: #f4f0e6;--mint: #234bc4;--mint-dim: #e2e8fa;--purple: #234bc4;--mono: "DM Mono", ui-monospace, monospace}*{box-sizing:border-box}body{margin:0;min-width:360px;background:var(--paper)}button,input,select{font:inherit}button,a,input,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer;border:2px solid var(--ink);border-radius:0;color:var(--ink);background:var(--white);font-weight:700;transition:background-color .12s,color .12s,border-color .12s}button:hover:not(:disabled){background:var(--yellow);color:var(--ink)}button:active:not(:disabled){background:var(--ink);color:var(--white)}button:disabled,input:disabled,select:disabled{cursor:not-allowed;opacity:1;color:#666257;border-color:#8a867a;border-style:dashed;background-color:#e5e1d6}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid var(--blue);outline-offset:3px}button.selected:focus-visible{outline-color:var(--red)}svg{width:20px;height:20px;flex-shrink:0}button svg{vertical-align:middle}a{color:inherit;text-decoration:none}[hidden]{display:none!important}h1,h2,p{text-wrap:pretty}.mono{font-family:var(--mono)}.topbar{min-height:72px;padding:0 36px;border-bottom:3px solid var(--ink);display:flex;align-items:center;justify-content:space-between;gap:16px}.brand{display:flex;align-items:center;gap:13px;padding:8px 0}.brand-mark{width:35px;height:35px;display:grid;grid-template-columns:16px 16px;gap:3px}.brand-mark i{display:block;background:var(--ink)}.brand-mark i:first-child{background:var(--red);border-radius:50%}.brand-mark i:nth-child(2){background:var(--blue)}.brand-mark i:nth-child(3){background:var(--yellow);clip-path:polygon(50% 0,100% 100%,0 100%)}.brand strong{display:flex;align-items:center;gap:20px;font-size:19px;font-weight:850;letter-spacing:1.8px}.brand strong span{border-left:2px solid var(--ink);padding-left:20px;font-size:11px;font-weight:650;letter-spacing:1px}.quiet-button{min-height:36px;display:flex;align-items:center;gap:8px;padding:7px 12px;font-size:11px}main{max-width:1560px;padding:24px 36px 22px;margin:0 auto}.page-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:22px;min-height:56px}h1{margin:0;font-size:38px;line-height:1.2;font-weight:850;letter-spacing:-1.8px}h1>span{color:var(--red)}.eyebrow{display:flex;align-items:center;gap:8px;font:10px var(--mono);letter-spacing:1.5px;color:var(--muted);margin-bottom:8px}.tiny-dot{height:7px;width:7px;background:var(--red);border-radius:50%}.session-count{display:flex;align-items:center;gap:12px;border-left:3px solid var(--ink);padding:0 0 0 16px}.session-count strong{font:500 31px var(--mono)}.session-count span{max-width:40px;font-size:10px;line-height:1.6;color:var(--muted)}.workspace{display:grid;grid-template-columns:300px minmax(340px,1fr) 188px;align-items:stretch;border:3px solid var(--ink);min-height:592px;height:calc(100dvh - 200px);max-height:850px}.panel{min-width:0;background:var(--panel);border-radius:0}.control-panel{display:flex;flex-direction:column;padding:16px;border-right:3px solid var(--ink);overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--ink) #ddd7c9;overscroll-behavior:contain}.control-panel>*{flex-shrink:0}.mode-tabs{display:flex;gap:6px;margin-bottom:14px}.mode-tabs button{width:50%;min-height:36px;padding:7px 4px;font-size:12px}.mode-tabs button.selected{background:var(--ink);color:var(--yellow)}.mode-tabs button.selected:hover:not(:disabled){background:var(--blue);color:var(--white)}.control-section h2,.section-line h2,.stats-top h2{font-size:11px;font-weight:750;margin:0}.control-section h2{margin-bottom:9px}.pattern-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px}.pattern-option{display:flex;align-items:center;gap:8px;min-height:32px;padding:6px 8px;font-size:11px;white-space:nowrap}.pattern-option svg{width:18px;height:18px}.pattern-option.selected{background:var(--red);color:var(--white)}.pattern-option.selected svg{color:inherit}.pattern-option.selected:hover:not(:disabled){background:var(--ink);color:var(--white)}.bpm-section{padding-top:14px}.section-line{display:flex;align-items:center;justify-content:space-between;gap:8px}.section-line .mono{font:10px var(--mono);color:var(--muted);letter-spacing:1px}.bpm-control{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:7px 0 3px}.bpm-control button{width:34px;height:34px;border-radius:50%;padding:0;font-size:22px;line-height:1}.bpm-control input{width:126px;min-width:0;padding:0 3px;border:0;border-bottom:2px solid var(--ink);border-radius:0;background:var(--white);color:var(--ink);text-align:center;font:500 43px/1.15 var(--mono);letter-spacing:-2px;appearance:textfield}.bpm-control input::-webkit-inner-spin-button{appearance:none}.bpm-control input:disabled{border-bottom-style:dashed}input[type=range]{appearance:none;display:block;width:100%;height:8px;min-height:8px;padding:0;margin:14px 0 10px;border:2px solid var(--ink);border-radius:0;background:#d7d1c2;accent-color:var(--blue);cursor:pointer}input[type=range]::-webkit-slider-thumb{appearance:none;width:16px;height:22px;border:2px solid var(--ink);border-radius:0;background:var(--blue)}input[type=range]::-moz-range-thumb{width:12px;height:18px;border:2px solid var(--ink);border-radius:0;background:var(--blue)}input[type=range]:hover:not(:disabled)::-webkit-slider-thumb{background:var(--yellow)}input[type=range]:hover:not(:disabled)::-moz-range-thumb{background:var(--yellow)}input[type=range]:disabled{background:#e5e1d6}input[type=range]:disabled::-webkit-slider-thumb{background:#918d80;border-color:#666257}input[type=range]:disabled::-moz-range-thumb{background:#918d80;border-color:#666257}.range-endpoints{display:flex;justify-content:space-between;font:9px var(--mono);color:var(--muted)}.compact-controls{display:grid;gap:9px;margin-top:13px}.segment{display:flex;gap:4px}.segment button{min-height:30px;padding:5px 8px;font:500 10px var(--mono);white-space:nowrap}.segment button.selected,.lane-picker button.selected{background:var(--blue);color:var(--white)}.segment button.selected:hover:not(:disabled),.lane-picker button.selected:hover:not(:disabled){background:var(--ink);color:var(--white)}.unit{font-size:10px;color:var(--muted);margin-left:-4px}.compact-controls .section-line:has(.unit){justify-content:initial}.compact-controls .section-line:has(.unit) h2{margin-right:auto}.speed-control{margin-top:14px;padding-top:11px;border-top:2px solid var(--ink)}.speed-control label{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:11px;font-weight:750}.speed-control output,#speed-output{color:var(--blue);font:500 15px var(--mono);margin-left:auto}.speed-control input[type=range]{margin-top:12px;margin-bottom:4px}.speed-control:has(>output){display:grid;grid-template-columns:1fr auto;align-items:center;column-gap:8px}.speed-control>output{grid-column:2;grid-row:1}.speed-control>input{grid-column:1 / -1}#scroll-speed{touch-action:pan-y}.switch-row{display:flex;align-items:center;justify-content:space-between;gap:10px;position:relative;font-size:11px;font-weight:650;cursor:pointer;min-height:26px}.switch-row input{position:absolute;right:0;margin:0;width:40px;height:26px;opacity:0;cursor:pointer}.switch{display:block;position:relative;width:36px;height:22px;border:2px solid var(--ink);background:#d7d1c2;pointer-events:none;flex-shrink:0}.switch:after{content:"";position:absolute;width:12px;height:12px;top:3px;left:3px;background:var(--ink)}.switch-row input:checked+.switch{background:var(--blue)}.switch-row input:checked+.switch:after{transform:translate(14px);background:var(--white)}.switch-row input:focus-visible+.switch{outline:3px solid var(--blue);outline-offset:3px}.switch-row input:disabled+.switch{background:#e5e1d6;border-color:#8a867a;border-style:dashed}.switch-row input:disabled+.switch:after{background:#666257}.switch-row:has(input:disabled){color:#666257;cursor:not-allowed}#step-block{padding-top:10px;margin-top:12px;border-top:2px solid var(--ink)}.step-fields{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin-top:9px}.step-fields label{font-size:9px;color:var(--muted)}.step-fields input{width:100%;margin-top:6px}.start-area{position:sticky;bottom:0;z-index:3;margin:auto -16px -16px;padding:12px 16px 16px;border-top:2px solid var(--ink);background:var(--paper);flex-shrink:0}.training-summary{display:flex;justify-content:space-between;gap:8px;font-size:10px;color:var(--muted);margin-bottom:8px}.training-summary span:last-child{font-family:var(--mono);white-space:nowrap}.primary-button{display:flex;align-items:center;justify-content:center;gap:10px;min-height:44px;width:100%;padding:9px 14px;border:2px solid var(--ink);background:var(--yellow);color:var(--ink);font-size:12px;font-weight:800}.primary-button svg{width:17px;height:17px}.primary-button:hover:not(:disabled){background:var(--red);color:var(--white)}.primary-button:active:not(:disabled){background:var(--ink);color:var(--white)}.primary-button .button-end{margin-left:auto;font-size:22px;line-height:1}.start-area .primary-button{justify-content:initial}.primary-button[data-invalid=true]{background:#e5e1d6;border:2px dashed var(--red);color:var(--red)}.play-panel{display:flex;flex-direction:column;position:relative;overflow:hidden;background:var(--white)}.play-heading{display:flex;align-items:center;justify-content:space-between;flex-shrink:0;min-height:55px;gap:12px;padding:9px 18px;border-bottom:2px solid var(--ink)}.play-heading>div{display:flex;align-items:center;gap:9px;min-width:0;flex-wrap:wrap}.play-heading strong{font-size:12px;font-weight:800}.play-heading #play-config{font:10px var(--mono);color:var(--muted)}.play-heading>div:first-child:not(.speed-control){flex:1 1 auto}.play-heading>.speed-control{display:grid;grid-template-columns:1fr auto;align-items:center;flex:0 1 180px;width:180px;min-width:160px;max-width:190px;margin:0 0 0 auto;padding:0;border:0;gap:8px}.play-heading>.speed-control>label{grid-column:1 / -1;font-size:10px;line-height:14px}.play-heading>.speed-control:has(>output)>label{grid-column:1}.play-heading>.speed-control output{font-size:12px;line-height:14px}.play-heading>.speed-control>input[type=range]{grid-column:1 / -1;height:6px;min-height:6px;margin:0}.status-dot{width:9px;height:9px;flex-shrink:0;background:#aca697;border:1px solid var(--ink);border-radius:50%}.status-dot.running{background:var(--red)}.icon-button{display:grid;place-items:center;flex-shrink:0;width:34px;height:34px;padding:0}.icon-button svg{width:17px;height:17px}.canvas-wrap{flex:1;min-height:360px;position:relative}#track{position:absolute;inset:0;display:block;width:100%;height:100%}.stage-overlay{position:absolute;left:0;right:0;top:36%;text-align:center;pointer-events:none}.stage-badge{display:inline-block;padding:11px 17px;border:2px solid var(--ink);background:var(--yellow);color:var(--ink);font:500 12px var(--mono);letter-spacing:2px}.stage-hint{display:table;padding:6px 10px;margin:9px auto 0;background:var(--white);color:var(--ink);font-size:11px}.countdown-number{display:table;min-width:96px;padding:0 14px;margin:0 auto;border:3px solid var(--ink);background:var(--yellow);color:var(--ink);font:500 68px/1.3 var(--mono);animation:beat-in .16s ease-out}.countdown-label{display:table;padding:6px 10px;margin:8px auto 0;background:var(--white);font-size:11px;font-weight:700;letter-spacing:2px}.play-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:47px;flex-shrink:0;padding:10px 16px;border-top:2px solid var(--ink);font:10px var(--mono);color:var(--muted)}#pattern-path{color:var(--ink);font-size:11px;white-space:nowrap}.keyboard-hint{display:flex;align-items:center;gap:6px;font:10px var(--mono);white-space:nowrap}kbd{font-family:var(--mono)}.keyboard-hint kbd,.restart-hint kbd{display:inline-grid;place-items:center;min-width:23px;height:23px;padding:2px 4px;border:1px solid var(--ink);border-bottom-width:3px;background:var(--paper);color:var(--ink);font:10px var(--mono)}.restart-hint{position:relative;display:inline-flex;align-items:center;gap:6px;align-self:stretch;padding:0 3px;overflow:hidden;isolation:isolate;color:var(--muted);white-space:nowrap;font:10px var(--mono)}.restart-hint>kbd,.restart-hint>span,.restart-hint>labelspan{position:relative;z-index:1}.restart-hint>i{position:absolute;inset:auto 0 0;height:4px;width:100%;background:var(--red);transform:scaleX(clamp(0,var(--hold-progress, 0),1));transform-origin:left;pointer-events:none}.restart-hint.holding{color:var(--ink);background:var(--yellow)}.restart-hint.holding kbd{background:var(--ink);color:var(--yellow)}.progress-track{height:5px;flex-shrink:0;background:#d7d1c2}.progress-track i{display:block;height:100%;width:0;background:var(--blue);transition:width .08s linear}.stats-panel{display:flex;flex-direction:column;min-width:0;padding:19px 16px;border-left:3px solid var(--ink)}.stats-top{display:flex;justify-content:space-between;align-items:center;gap:6px;margin-bottom:28px}.stats-top h2{font-size:11px}.live-label{font:8px var(--mono);letter-spacing:.4px;color:var(--muted)}.metric>span,.timing-stat>span{font-size:11px;font-weight:650;color:var(--muted)}.metric>strong{display:block;margin-top:7px;font:500 43px/1.2 var(--mono);letter-spacing:-2px}.metric>strong small{margin-left:6px;color:var(--muted);font-size:9px;letter-spacing:0}.metric-primary>strong{font-size:35px;color:var(--blue);letter-spacing:-2px}.metric-primary>strong small{margin-left:2px;font-size:13px;color:var(--blue)}.accuracy-track{height:5px;background:#d7d1c2;margin:13px 0 24px}.accuracy-track i{display:block;background:var(--blue);height:100%;transition:width .1s}.judgement-list{display:grid;gap:13px;padding-bottom:20px;margin-top:22px;border-bottom:2px solid var(--ink)}.judgement-list>div{display:flex;align-items:center;justify-content:space-between;gap:8px;font:10px var(--mono)}.judgement-list span{display:flex;align-items:center;gap:8px}.judgement-list b{font-weight:500}.judgement-list i{width:8px;height:8px;border:1px solid var(--ink)}.perfect-dot{background:var(--blue)}.great-dot{background:var(--red);border-radius:50%}.good-dot{background:var(--yellow)}.miss-dot{background:var(--ink)}.timing-stat{margin-top:20px}.timing-stat strong{display:block;margin-top:9px;font:500 23px var(--mono)}.timing-stat small{color:var(--muted);font-size:10px}.timing-meter{height:6px;margin-top:17px;position:relative;background:#d7d1c2;border:1px solid #878175}.timing-meter b{position:absolute;left:50%;top:-5px;bottom:-5px;width:2px;background:var(--ink)}.timing-meter i{position:absolute;top:-4px;left:50%;z-index:1;width:7px;height:12px;background:var(--red);border:1px solid var(--ink);transform:translate(-50%);transition:left .15s}.timing-labels{display:flex;justify-content:space-between;margin-top:9px;color:var(--muted);font:8px var(--mono);letter-spacing:1px}.best-record{display:flex;justify-content:space-between;gap:8px;margin-top:auto;padding-top:18px;border-top:2px solid var(--ink);color:var(--muted);font-size:10px}.best-record strong{color:var(--ink);font:500 11px var(--mono)}.page-footer{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:20px 0 0;color:var(--muted);font-size:10px}.page-footer>span:first-child{display:flex;align-items:center;gap:8px}.page-footer i{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--red)}.page-footer>span:last-child{font:9px var(--mono);letter-spacing:1px}.dimmed{color:#666257}.lane-picker{display:flex;gap:6px;margin-top:9px}.lane-picker button{flex:1;min-height:30px;padding:5px;font:500 11px var(--mono)}.song-fields{margin-top:14px;padding-top:12px;border-top:2px solid var(--ink)}.song-source-tabs{display:flex;gap:6px;margin-bottom:9px}.song-source-tabs button{flex:1;min-height:30px;padding:5px 7px;font-size:10px}.song-source-tabs button.selected,.song-source-tabs [aria-selected=true]{background:var(--blue);color:var(--white)}.song-source-tabs button.selected:hover:not(:disabled){background:var(--ink);color:var(--white)}#builtin-song-fields,#local-song-fields{min-width:0}.song-library{display:grid;gap:5px;max-height:204px;overflow-y:auto;padding:2px 4px 3px 2px;scrollbar-width:thin;scrollbar-color:var(--ink) #ddd7c9;overscroll-behavior:contain}.song-option{display:grid;grid-template-columns:25px minmax(0,1fr);column-gap:9px;row-gap:3px;align-items:center;min-height:49px;padding:7px 9px;text-align:left}.song-index{grid-row:1 / 3;align-self:stretch;display:grid;place-items:center;border-right:1px solid currentColor;padding-right:8px;font:500 12px var(--mono)}.song-option>span:last-child{display:grid;gap:3px;min-width:0}.song-title{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px;font-weight:800;line-height:1.3}.song-artist{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--muted);font-size:9px;font-weight:500;line-height:1.3}.song-option.selected,.song-option[aria-pressed=true]{background:var(--blue);color:var(--white)}.song-option.selected .song-artist,.song-option[aria-pressed=true] .song-artist{color:var(--white)}.song-option.selected:hover:not(:disabled){background:var(--ink);color:var(--white)}.song-option:focus-visible{outline:3px solid var(--ink);outline-offset:-5px}.song-option.selected:focus-visible,.song-option[aria-pressed=true]:focus-visible{outline-color:var(--yellow)}.song-option:not(.selected):hover:not(:disabled) .song-artist{color:var(--ink)}.song-option:disabled .song-title,.song-option:disabled .song-artist{color:#666257}.file-button{position:relative;display:flex;align-items:center;justify-content:center;gap:8px;min-height:43px;padding:10px;border:2px solid var(--ink);background:var(--yellow);color:var(--ink);font-size:11px;font-weight:750;cursor:pointer;overflow:hidden}.file-button:hover{background:var(--ink);color:var(--white)}.file-button svg{width:17px;height:17px}.file-button span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.file-button input{position:absolute;width:1px;height:1px;opacity:0}.file-button:focus-within{outline:3px solid var(--blue);outline-offset:3px}.file-button:has(input:disabled){background:#e5e1d6;border-color:#8a867a;border-style:dashed;color:#666257;cursor:not-allowed}.song-direction{margin:8px 0 11px;font-size:9px;color:var(--muted);text-align:center}.song-credit{margin:8px 0 0;font-size:9px;line-height:1.6;color:var(--muted);overflow-wrap:anywhere}.song-credit a{text-decoration:underline;text-underline-offset:3px;color:var(--blue)}.two-fields{display:grid;grid-template-columns:1fr 1fr;gap:10px}.song-fields .two-fields{margin-top:10px}.two-fields label{color:var(--muted);font-size:10px}.two-fields label span{float:right}.two-fields input{width:100%;margin-top:6px}.two-fields input,.step-fields input,.rest-label select{min-width:0;padding:8px;border:2px solid var(--ink);border-radius:0;background:var(--white);color:var(--ink);font:12px var(--mono)}.dialog{width:420px;max-width:calc(100vw - 32px);max-height:calc(100dvh - 40px);padding:28px;overflow:auto;border:3px solid var(--ink);border-radius:0;color:var(--ink);background:var(--paper)}.dialog::backdrop{background:#20201e99}.dialog-heading{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:24px}.dialog-heading h2{margin:0;font-size:19px;font-weight:850}.settings-dialog .switch-row{margin:20px 0;font-size:12px}.range-label{display:block;margin-bottom:25px;color:var(--ink);font-size:12px;font-weight:700}.range-label output{float:right;color:var(--blue);font:500 12px var(--mono)}.settings-dialog .two-fields{padding-top:7px}.field-note{margin:11px 0 21px;color:var(--muted);font-size:10px;line-height:1.9}.rest-label{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px;font-size:12px}.rest-label select{width:110px;font-family:inherit;font-size:11px}.pause-dialog{padding:38px 30px;text-align:center;border-top:12px solid var(--blue)}.dialog-eyebrow{color:var(--blue);font:500 10px var(--mono);letter-spacing:1.4px}.pause-dialog h2{margin:18px 0 10px;font-size:25px;font-weight:850;letter-spacing:-.8px}.pause-dialog p{margin:0 0 28px;color:var(--muted);font-size:12px}.dialog-actions{display:flex;gap:10px;margin-top:10px}.secondary-button{flex:1;min-height:43px;padding:9px 12px;font-size:12px}.result-dialog{width:480px}.result-hero{display:flex;align-items:center;justify-content:space-between;gap:16px}.result-hero h2{margin:0 0 8px;font-size:23px;font-weight:850}.result-hero>div>span{color:var(--muted);font-size:11px}.grade-badge{display:grid;place-items:center;flex-shrink:0;width:67px;height:67px;border:2px solid var(--ink);border-radius:50%;background:var(--yellow);color:var(--ink);font:500 40px var(--mono)}.result-accuracy{margin:22px 0 18px;color:var(--blue);font:500 64px var(--mono);letter-spacing:-4px}.result-accuracy small{margin-left:5px;font-size:23px;letter-spacing:0}.result-numbers{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px;padding:18px 0;border-top:2px solid var(--ink);border-bottom:2px solid var(--ink)}.result-numbers>div{display:grid;gap:10px}.result-numbers span{color:var(--muted);font-size:10px}.result-numbers strong{font:500 17px var(--mono)}.lane-results{display:grid;gap:11px;margin-top:23px}.lane-results>div{display:flex;align-items:center;gap:12px}.lane-results kbd{color:var(--ink);font:500 11px var(--mono)}.lane-results span{width:37px;text-align:right;color:var(--muted);font:10px var(--mono)}.lane-bar{flex:1;height:8px;background:#d7d1c2;overflow:hidden}.lane-bar i{display:block;height:100%;background:var(--red)}.lane-results>div:nth-child(n+3) .lane-bar i{background:var(--blue)}.result-detail{margin-top:18px;color:var(--muted);font-size:10px;line-height:1.8}.result-advice{margin:16px 0 23px;color:var(--ink);font-size:11px;line-height:1.8}.result-buttons{display:flex;gap:10px}.result-buttons .primary-button{width:auto;flex:1.4}.result-buttons .secondary-button{flex:1}.toast{position:fixed;left:50%;bottom:24px;z-index:10;max-width:min(80vw,560px);padding:12px 18px;border:2px solid var(--ink);background:var(--yellow);color:var(--ink);font-size:12px;line-height:1.7;pointer-events:none;opacity:0;transform:translate(-50%,12px);transition:opacity .15s,transform .15s}.toast.show{opacity:1;transform:translate(-50%)}@keyframes beat-in{0%{transform:scale(.94)}to{transform:scale(1)}}button:disabled,button.selected:disabled,button[aria-selected=true]:disabled,button[aria-pressed=true]:disabled,input:disabled,select:disabled{color:#666257;border-color:#8a867a;border-style:dashed;background:#e5e1d6}@media(min-width:1500px){main{padding-inline:48px}.topbar{padding-inline:48px}.workspace{grid-template-columns:320px minmax(460px,1fr) 208px}.control-panel{padding:20px}.start-area{margin-inline:-20px;margin-bottom:-20px;bottom:0;padding-inline:20px;padding-bottom:20px}.pattern-option{min-height:37px}.stats-panel{padding:22px 20px}.metric-primary>strong{font-size:40px}}@media(max-width:1150px)and (min-width:801px){.topbar{padding-inline:24px}main{padding:22px 24px}.workspace{grid-template-columns:280px minmax(0,1fr);height:auto;max-height:none;min-height:0}.control-panel,.play-panel{height:620px}.stats-panel{grid-column:1 / -1;display:grid;grid-template-columns:105px 1fr 1fr 1.25fr 1fr;gap:20px;padding:18px;border-left:0;border-top:3px solid var(--ink)}.stats-top{margin:0;flex-direction:column;justify-content:center;align-items:flex-start;gap:10px}.metric>strong,.metric-primary>strong{font-size:31px}.metric>strong small{display:block;margin:2px 0 0}.metric-primary>strong small{display:inline;margin-left:2px}.accuracy-track{margin:8px 0 0}.judgement-list{margin:0;padding:0;border:0;grid-template-columns:1fr 1fr;gap:9px}.judgement-list>div{gap:6px;font-size:9px}.judgement-list span{gap:5px}.timing-stat{margin:0}.timing-stat strong{margin-top:7px;font-size:20px}.timing-meter{margin-top:10px}.best-record{display:none}.play-footer{gap:9px;padding-inline:12px}}@media(max-width:800px){.topbar{min-height:66px;padding:0 18px}.brand strong{font-size:16px;letter-spacing:1.3px}.brand strong span{display:none}.quiet-button{min-width:36px;padding:6px}.quiet-button span{display:none}main{padding:22px 16px}.page-heading{min-height:42px;margin-bottom:18px;gap:12px}h1{font-size:29px;letter-spacing:-1.5px}.eyebrow{font-size:8px}.session-count{gap:8px;padding-left:10px}.session-count strong{font-size:24px}.session-count span{font-size:9px}.workspace{display:flex;flex-direction:column;height:auto;min-height:0;max-height:none}.control-panel{overflow:visible;padding:16px;border-right:0;border-bottom:3px solid var(--ink)}.mode-tabs{margin-bottom:15px}.mode-tabs button{min-height:40px}.pattern-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.pattern-option{justify-content:center;gap:5px;padding:9px 3px;font-size:10px;min-height:38px}.pattern-option svg{width:16px;height:16px}.bpm-section{padding-top:16px}.bpm-control{max-width:300px;margin:8px auto}.bpm-control button{width:38px;height:38px}.bpm-control input{font-size:45px}.range-endpoints{margin-top:3px}.compact-controls{grid-template-columns:1fr 1fr;gap:14px;margin-top:16px}.compact-controls .section-line{flex-wrap:wrap;justify-content:flex-start;gap:7px}.compact-controls .section-line:has(.unit) h2{margin-right:0}.compact-controls h2{width:100%}.segment{gap:4px}.segment button{min-height:34px;padding:6px 9px}.speed-control{margin-top:17px;padding-top:13px}.speed-control input[type=range]{margin-block:16px 8px}#step-block{padding-top:12px;margin-top:12px}.start-area{position:static;margin:16px -16px -16px;padding-top:13px}.primary-button{min-height:47px}.song-library{max-height:235px}.song-option{min-height:52px}.song-title{font-size:12px}.song-artist{font-size:10px}.play-panel{min-height:550px}.play-heading{padding-inline:12px}.play-heading>div{gap:7px}.play-heading #play-config{font-size:9px}.canvas-wrap{min-height:440px}.play-footer{flex-wrap:wrap;gap:10px;padding:9px 12px;font-size:9px}#pattern-path{margin-right:auto;font-size:10px}.keyboard-hint{font-size:9px}.restart-hint{min-height:27px;font-size:9px}.stats-panel{display:grid;grid-template-columns:1fr 1fr 1.15fr;gap:16px;padding:20px 14px;border-left:0;border-top:3px solid var(--ink)}.stats-top{grid-column:1 / -1;margin:0;padding-bottom:10px;border-bottom:2px solid var(--ink)}.metric>strong{font-size:32px}.metric-primary>strong{font-size:28px}.metric>strong small{display:block;margin:3px 0 0}.metric-primary>strong small{display:inline;margin-left:2px}.accuracy-track{margin-bottom:0}.judgement-list{gap:9px;margin:0;padding:0;border:0}.judgement-list>div{font-size:9px}.judgement-list span{gap:5px}.judgement-list i{width:6px;height:6px}.timing-stat{grid-column:1 / 3;margin:0;padding-top:12px;border-top:2px solid var(--ink)}.timing-stat strong{font-size:20px}.best-record{display:grid;align-content:start;gap:10px;margin:0;padding-top:12px}.page-footer>span:last-child{display:none}.dialog{padding:22px}.result-accuracy{font-size:55px}.result-numbers strong{font-size:15px}}@media(max-width:560px){.play-heading:has(>.speed-control){display:grid;grid-template-columns:minmax(0,1fr) 34px;row-gap:13px;padding-block:10px 13px}.play-heading:has(>.speed-control)>div:first-child:not(.speed-control){grid-column:1;grid-row:1}.play-heading:has(>.speed-control)>.icon-button{grid-column:2;grid-row:1}.play-heading>.speed-control{grid-column:1 / -1;grid-row:2;width:100%;min-width:0;max-width:none;grid-template-columns:92px minmax(0,1fr);column-gap:12px;row-gap:0;margin:0}.play-heading>.speed-control>label{grid-column:1;grid-row:1}.play-heading>.speed-control>input[type=range]{grid-column:2;grid-row:1}.play-heading>.speed-control:has(>output){grid-template-columns:auto auto minmax(0,1fr)}.play-heading>.speed-control:has(>output)>input[type=range]{grid-column:3}}@media(max-width:400px){main{padding-inline:10px}.control-panel{padding:12px}.start-area{margin-inline:-12px;margin-bottom:-12px;padding:12px}.pattern-option{gap:3px;font-size:9px}.play-heading #play-config{width:100%;padding-left:16px}.stats-panel{gap:12px;padding-inline:12px}.metric-primary>strong{font-size:25px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}