/* Navigation and touch targets for preview 3. */
.new-titlebar{display:grid;grid-template-columns:minmax(0,1.2fr) 1fr 1fr 40px;gap:5px}.new-titlebar button{min-height:40px;font-size:12px;padding:7px 5px;white-space:nowrap}.new-titlebar #chooseLesson{margin:0}.new-titlebar #openStats{font-size:12px;width:auto}.new-titlebar #openSettings{width:40px}.new-header .new-brand{font-size:11px;letter-spacing:2px}
#newShell{grid-template-rows:44px 40px minmax(0,1fr) 48px}#newShell.is-playing{grid-template-rows:44px 40px minmax(0,1fr)}
body.redesign #newStage .console{grid-template-rows:40px auto 18px minmax(50px,1fr) minmax(36px,.8fr) 66px 48px 44px}#newShell.dense #newStage .console{grid-template-rows:36px auto 16px minmax(80px,2fr) minmax(25px,.5fr) 60px 48px 44px}
body.redesign #newStage .console>#tempoRange{height:48px;min-height:48px;padding:0 5px;box-sizing:border-box;touch-action:pan-y;cursor:pointer;-webkit-appearance:none;appearance:none;background:transparent}#tempoRange::-webkit-slider-runnable-track{height:6px;border-radius:8px;background:#354239}#tempoRange::-webkit-slider-thumb{-webkit-appearance:none;width:30px;height:30px;margin-top:-12px;border-radius:50%;background:#f5f5f7;border:0;box-shadow:0 0 0 7px #ffffff09}#tempoRange::-moz-range-track{height:6px;border-radius:8px;background:#354239}#tempoRange::-moz-range-thumb{width:30px;height:30px;border:0;border-radius:50%;background:#f5f5f7}
#lessonDialog .lesson-picker>.lesson-choices{display:grid;grid-template-columns:1fr;gap:8px}#lessonDialog .lesson-picker>.lesson-choices button{text-align:left;padding:15px;font-size:14px}#lessonDialog .lesson-map{font-size:12px;margin:0 0 16px}#lessonDialog .dialog-content>.primary{width:100%;margin:15px 0 0}#lessonChangeHint{color:#dec082}#finishToChoose{width:100%;margin:8px 0 16px}
#statsDialog,#metroDialog{height:auto;max-height:92dvh}#statsDialog .dialog-content,#metroDialog .dialog-content{padding:0 20px 22px}#statsDialog #progressDashboard{display:block;margin:0}#statsDialog #progressDashboard>h2{display:none}#statsDialog .records{padding:18px 0}#statsDialog .progress-chart{min-height:80px;font-size:13px}#statsDialog .progress-chart svg{width:100%}#statsDialog .practice-totals{margin:8px 0 16px}
.embedded-metro .metro-panel{border:0;padding:0;background:none}.embedded-metro .topline{display:none}.embedded-metro .dial-row{display:flex;align-items:center;justify-content:center;gap:12px}.embedded-metro .tempo-wheel{width:180px;margin:8px 0;flex-shrink:0}.embedded-metro .tempo-nudge{width:48px;height:52px;font-size:26px}.embedded-metro .metro-panel input#metroBpm{font-size:48px;height:62px}.embedded-metro .dial-help{display:none}.embedded-metro .metro-quick{display:flex;margin:5px 0}.embedded-metro #metroTap{width:100%;min-height:44px}.embedded-metro .choice-strip{overflow-x:auto;display:flex}.embedded-metro .meter-choices button{min-width:42px}.embedded-metro .metro-beats{display:grid;grid-template-columns:repeat(var(--beats,4),minmax(0,1fr));gap:5px;margin:10px 0}.embedded-metro .metro-beats button{height:52px;min-width:0;padding:0;font-size:24px;position:relative}.embedded-metro .metro-beats button.muted{opacity:.4;border-style:dashed}.embedded-metro .metro-beats button.accent:after{content:'•';position:absolute;font-size:9px;bottom:2px;left:0;right:0}.embedded-metro .metro-parts{display:flex;justify-content:center;gap:8px}.embedded-metro .metro-parts i{width:8px;height:8px;background:#354239;border-radius:50%}.embedded-metro .metro-parts i.active{background:#32c85b}.embedded-metro #metroStart{width:100%;min-height:48px}.embedded-metro .beat-tip{font-size:10px;text-align:center}.embedded-metro .rhythm-row{display:grid;grid-template-columns:45px 1fr}.embedded-metro .choice-strip small{display:none}
@media(max-height:620px){body.redesign #newStage .console{grid-template-rows:30px auto 15px minmax(45px,1fr) 25px 50px 44px 44px;gap:3px}#newShell.dense #newStage .console{grid-template-rows:30px auto 14px minmax(60px,2fr) 20px 48px 44px 44px}body.redesign #newStage .console>#tempoRange{height:44px;min-height:44px}}
/* Restore the original task, feedback and progression alongside the new artwork. */
body.redesign #newStage .console{grid-template-rows:36px auto 38px 16px minmax(50px,1.5fr) 30px 38px minmax(24px,.65fr) 58px 48px 44px;gap:4px}
#newShell.dense #newStage .console{grid-template-rows:30px auto 34px 14px minmax(72px,2fr) 28px 36px minmax(18px,.3fr) 50px 44px 44px}
body.redesign #newStage .console>#taskBrief{display:flex!important;grid-area:3/1;flex-direction:column;justify-content:center;gap:3px;min-width:0}#handsBrief{font:600 12px/1.2 Manrope,Arial,sans-serif;color:#e9f2eb}#clickBrief{font:400 10px/1.2 Manrope,Arial,sans-serif;color:#8fa694}
body.redesign #newStage .console>#blockStatus{grid-area:4/1}
body.redesign #newStage .console>#hitStrip{grid-area:5/1}
body.redesign #newStage .console>#playHint{display:block!important;grid-area:6/1;margin:0;font:500 11px/1.2 Manrope,Arial,sans-serif;color:#b9c8be;overflow:hidden}
body.redesign #newStage .console>#lessonProgress{display:block!important;grid-area:7/1;margin:0;padding:0;border:0;background:none;min-height:0;overflow:hidden}
body.redesign #newStage #lessonProgress #stageRoad,body.redesign #newStage #lessonProgress #lessonRule{display:none}body.redesign #newStage #lessonProgress .lesson-numbers{font-size:9px;line-height:13px;margin:0;gap:6px}body.redesign #newStage #lessonProgress .lesson-track{margin:4px 0;height:4px;background:#2c392f}body.redesign #newStage #lessonProgress .lesson-track i{background:#32c85b}
body.redesign #newStage .console>#character{grid-area:8/1}body.redesign #newStage .console>.tempo{grid-area:9/1}body.redesign #newStage .console>#tempoRange{grid-area:10/1}body.redesign #newStage .console>.transport{grid-area:11/1}#characterLine{display:none}#characterImg{max-height:100%}
body.redesign #newStage #beats i{height:100%;transition:none;animation:none}
body.redesign #newStage .console.silent>#beats,body.redesign #newStage .console.silent>#hitStrip,body.redesign #newStage .console.silent>#playHint,body.redesign #newStage .console.silent>#lessonProgress{visibility:hidden}
@media(max-height:650px){body.redesign #newStage .console,#newShell.dense #newStage .console{grid-template-rows:28px auto 30px 14px minmax(50px,1fr) 26px 28px 20px 44px 44px 44px;gap:2px}body.redesign #newStage .tempo input#bpm{font-size:36px;height:38px}#handsBrief{font-size:11px}#clickBrief{font-size:9px}}
