body.redesign{--lime:#32c85b;--ink:#f5f5f7;--muted:#777b78;--line:#282b29;background:#101110;color:var(--ink);margin:0;overflow:hidden;font-family:Manrope,Arial,sans-serif}body.redesign>[hidden]{display:none!important}body.redesign button{touch-action:manipulation}body.redesign button:focus-visible{outline:2px solid #32c85b;outline-offset:3px}
#newShell{height:var(--new-height,100dvh);max-width:600px;margin:auto;padding:12px 18px max(10px,env(safe-area-inset-bottom));box-sizing:border-box;display:grid;grid-template-rows:44px 38px minmax(0,1fr) 48px;gap:8px;background:#101110}.new-header{display:flex;align-items:center;justify-content:space-between;gap:12px}.new-brand{display:flex;align-items:center;gap:10px;font-weight:750;font-size:12px;letter-spacing:3px;text-decoration:none;color:#fff}.new-brand img{width:28px;height:35px}.new-header button{display:flex;align-items:center;gap:8px;padding:0;background:none;border:0}.new-header button span{font-size:10px;letter-spacing:2px;color:#858985}.new-header i{width:44px;height:26px;border-radius:20px;background:#333;position:relative}.new-header i:after{content:'';position:absolute;top:3px;left:3px;width:20px;height:20px;background:#fff;border-radius:50%}.new-header [aria-checked=true] i{background:#32c85b}.new-header [aria-checked=true] i:after{left:21px}.new-titlebar{display:flex;gap:5px;align-items:center}.new-titlebar button{min-height:34px;padding:5px 9px;background:#1c1e1c;border:0;border-radius:9px;font-size:12px}.new-titlebar #chooseLesson{margin-right:auto}.preview-tag{font:8px monospace;letter-spacing:1px;color:#656a65}.new-titlebar #openStats,.new-titlebar #openSettings{font-size:20px;width:36px}
#newStage{min-height:0;overflow:hidden}body.redesign #newStage .console{position:static!important;display:grid!important;width:100%;max-width:none;height:100%!important;min-height:0;grid-template-columns:1fr;grid-template-rows:40px auto 18px minmax(70px,1fr) minmax(50px,1fr) 66px 22px 44px;gap:5px;margin:0;padding:0;border:0;background:none;overflow:hidden;box-shadow:none;border-radius:0}
body.redesign #newStage .console>*{display:none!important}body.redesign #newStage .console>#beats{display:flex!important;grid-area:1/1;margin:0;gap:5px;min-height:0}body.redesign #newStage #beats i{display:grid;place-items:center;flex:1;max-width:none;height:40px;min-height:0;padding:0;border:0;border-radius:13px;background:#1d201d;color:#737973;font-size:20px;box-shadow:none}body.redesign #newStage #beats i.active{background:#32c85b;color:#09290f}
body.redesign #newStage .console>#nextCue{display:block!important;grid-area:2/1;min-height:16px;font-size:11px;line-height:1.3;margin:0;color:#969d96;text-align:center}
body.redesign #newStage .console>#switchBoard:not([hidden]){display:block!important;grid-area:2/1;position:static;margin:0;padding:5px 9px;border:1px solid #303a30;border-radius:10px;background:#151915;box-shadow:none}body.redesign #newStage .switch-board-label,body.redesign #newStage .switch-board-pattern{display:none}body.redesign #newStage .switch-board>strong{font-size:20px;margin:0;line-height:1.1}body.redesign #newStage .switch-board-bottom{margin:2px 0 0;padding:0;min-height:24px;border:0}body.redesign #newStage .switch-board-bottom span{font-size:11px}body.redesign #newStage .switch-board-bottom b{font-size:24px}body.redesign #newStage .switch-round-result{font-size:10px;margin:2px 0}body.redesign #newStage .switch-board.change{background:#32c85b;color:#071a0b}body.redesign #newStage .console:has(#switchBoard:not([hidden]))>#nextCue{visibility:hidden}
body.redesign #newStage .console>#blockStatus{display:block!important;grid-area:3/1;font-size:9px;line-height:18px;letter-spacing:1px;color:#828982;margin:0;overflow:hidden;white-space:nowrap}
body.redesign #newStage .console>#hitStrip{display:grid!important;grid-area:4/1;min-height:0;gap:4px;margin:0;grid-auto-rows:minmax(0,1fr)}body.redesign #newStage #hitStrip span{min-height:0;min-width:0;box-sizing:border-box;padding:2px 0;font:11px/1.1 Manrope,Arial,sans-serif;border:1px solid transparent;border-radius:12px;background:#1d201d;color:#737973;overflow:hidden;overflow-wrap:anywhere}body.redesign #newStage #hitStrip .hit-good{background:#143d22;color:#4bd87b}body.redesign #newStage #hitStrip .hit-early{background:#481a1a;color:#ff7373}body.redesign #newStage #hitStrip .hit-late{background:#453217;color:#e8bd69}body.redesign #newStage #hitStrip .hit-miss{background:#29191b;color:#bd7171}body.redesign #newStage #hitStrip .hit-uncertain{background:#38333e;color:#d0c3d9;outline:1px dashed #93859e}
body.redesign #newStage .console>#character{display:flex!important;grid-area:5/1;flex-direction:column;align-items:center;justify-content:end;min-height:0;overflow:hidden}#characterImg{display:block;max-height:calc(100% - 18px);width:auto;max-width:90%;object-fit:contain;image-rendering:pixelated}#characterLine{font-size:10px;color:#878e87;height:16px;text-align:center;flex-shrink:0}
body.redesign #newStage .console>.tempo{display:flex!important;grid-area:6/1;margin:0;min-height:0;align-items:center;justify-content:space-between;gap:10px}body.redesign #newStage .tempo>div{display:flex;flex-direction:column;align-items:center}body.redesign #newStage .tempo input#bpm{font:700 48px/1 Manrope,Arial,sans-serif;width:110px;height:49px;pointer-events:auto}body.redesign #newStage .tempo span{font-size:10px;letter-spacing:2px;color:#848884}body.redesign #newStage .tempo button{display:grid;width:72px;height:44px;min-height:44px;border:1px solid #272a27;border-radius:14px;background:transparent;font-size:22px;color:#aaa}
body.redesign #newStage .console>#tempoRange{display:block!important;grid-area:7/1;width:100%;height:18px;margin:0;accent-color:#32c85b}body.redesign #newStage .console>.transport{display:flex!important;grid-area:8/1;position:static;padding:0;margin:0;gap:9px;background:none}body.redesign #newStage .transport button{flex:1;min-height:44px;margin:0;padding:8px;font-size:12px;border:0;border-radius:13px;background:#eeeef3;color:#111}
#idleActions{display:flex;gap:8px;min-height:0}#idleActions button{border-radius:13px;font-size:12px;padding:8px 12px;min-height:44px;margin:0}#idleActions #mainStart{flex:1;background:#32c85b;color:#05210d;border:0}#idleActions #openCalibration{background:#191d19;color:#999;border:1px solid #282d28}#newShell.is-playing{grid-template-rows:44px 38px minmax(0,1fr)}#newShell.is-playing #idleActions{display:none}#newShell.dense #newStage .console{grid-template-rows:36px auto 16px minmax(100px,2fr) minmax(35px,.6fr) 60px 20px 44px}#newShell.dense #hitStrip span{font-size:9px;border-radius:7px}
.new-dialog{color:#eee;background:#151815;border:1px solid #343a34;border-radius:22px 22px 0 0;padding:0;width:min(600px,100%);max-width:100%;max-height:92dvh;margin:auto auto 0;box-sizing:border-box}.new-dialog::backdrop{background:#000a;backdrop-filter:blur(4px)}.new-dialog>header{display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;background:#151815;padding:14px 18px;z-index:10;border-bottom:1px solid #2a302a}.new-dialog h2{font:700 18px Manrope,Arial,sans-serif;margin:0}.new-dialog header button{width:42px;min-height:42px;padding:4px;border-radius:50%;background:#252b25;border:0;color:#fff}.dialog-content{padding:14px;overflow:auto}.new-dialog .panel{padding:10px;border:0;background:none;margin:0}.new-dialog .topline{font-size:10px}.new-dialog .lesson-choices{flex-wrap:wrap}.new-dialog button{min-height:44px}.new-dialog .mode-card{width:100%;text-align:left;margin-top:16px;padding:16px;background:#202720}.new-dialog .calibration-panel h2{font-size:23px;line-height:1.1}.new-dialog details{margin:12px 0}.new-dialog details[open]>summary{margin-bottom:12px}.new-dialog iframe{display:block;border:0;width:100%;height:calc(88dvh - 78px);background:#151716}#statsDialog,#metroDialog{height:94dvh}#statsDialog .dialog-content,#metroDialog .dialog-content{padding:0}.new-dialog .session-extra{display:block!important}
@media(max-height:620px){#newShell{padding-top:5px;gap:4px;grid-template-rows:36px 32px minmax(0,1fr) 44px}#newShell.is-playing{grid-template-rows:36px 32px minmax(0,1fr)}body.redesign #newStage .console{grid-template-rows:30px auto 15px minmax(48px,1fr) minmax(25px,.7fr) 54px 18px 44px;gap:3px}body.redesign #newStage #beats i{height:30px}body.redesign #newStage .tempo input#bpm{font-size:38px;height:39px}#characterLine{display:none}#newShell.dense #newStage .console{grid-template-rows:30px auto 14px minmax(72px,2fr) 25px 48px 16px 44px}}
@media(prefers-reduced-motion:reduce){body.redesign *{animation:none!important;transition:none!important;scroll-behavior:auto!important}}