/* Keep the club identity; give fingers and the dancer room to breathe. */
.control-mode{font-size:12px;letter-spacing:0;min-height:36px;padding:6px 12px;color:#fff8e8}
.control-mode[aria-pressed=true]{border-color:#dfff70;color:#dfff70}
.deck-heading{align-items:center;gap:12px}.deck-legend{margin-left:auto}
.lobby-more{margin-top:14px}.lobby-more summary{padding:12px 0;cursor:pointer;color:#bdcce5;font-size:12px}.lobby-more[open] summary{color:#dfff70}
.keyboard .pad strong{font-size:11px}.keyboard .pad{min-height:43px}
.keyboard[data-quick=true] .row-label{display:none}
.keyboard[data-quick=true] .row-pads{grid-template-columns:repeat(8,minmax(0,1fr));gap:8px}
.keyboard[data-quick=true] .pad{height:60px;padding:10px}.keyboard[data-quick=true] .pad strong{font-size:13px;margin-top:6px}
.result-tip{padding:12px;background:#293952;border-radius:9px;color:#e6f1d7!important}
.home-control,.click-mode{min-height:44px}.text-button{min-height:44px}
button,a,summary{touch-action:manipulation}.pad{touch-action:none!important}
@media(max-width:700px){
 .club-lobby,#setup.club-lobby{padding:0;padding-bottom:env(safe-area-inset-bottom)}
 .lobby-shell{grid-template-columns:1fr;border:0;border-radius:0;min-height:100dvh}
 .lobby-poster{padding:14px 16px;display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center}
 .club-mark{font-size:18px}.club-mark small{font-size:9px;margin-left:22px}.mode-tabs{margin:0;gap:4px}.mode-tabs a{display:grid;place-items:center;min-height:44px;padding:8px;font-size:10px}
 .poster-title{grid-column:1/-1;grid-row:auto}.club-lobby .poster-title h1,#setup .poster-title h1{font-size:32px;margin:0;line-height:1.05}.poster-title h1 br{display:none}.poster-title h1 em:before{content:' '}
 .poster-title .eyebrow,.poster-title p,.poster-star,.poster-location,.lobby-song{display:none!important}
 .lobby-config,.app .home-copy.lobby-config{padding:18px 16px 20px}
 .home.club-lobby .lobby-config{padding-bottom:calc(110px + env(safe-area-inset-bottom))}
 .section-label{font-size:10px;margin-bottom:10px}.section-label a{font-size:12px;min-height:32px;display:flex;align-items:center}
 .solo-casting{grid-template-columns:1fr 1.15fr;gap:12px;padding:8px;margin-bottom:16px}.solo-casting .lobby-preview{height:162px}
 .club-lobby .solo-casting .character-choices{flex-direction:column;gap:5px}.solo-casting button.character-choice{min-height:44px;padding:9px!important;font-size:13px}
 .app .home-copy .casting-note{display:none}.venue-choices{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-bottom:14px}.venue-choice .venue-art{height:58px}.venue-choice>span{min-height:34px}.venue-choice>span b{font-size:12px}
 .lobby-settings{padding-bottom:0}.lobby-settings .song-choice{min-height:48px;display:flex;align-items:center;gap:6px}.song-choice small{font-size:9px;margin-top:0}
 .home.club-lobby .home-actions{position:fixed;bottom:0;left:0;right:0;z-index:2;padding:12px 16px calc(12px + env(safe-area-inset-bottom));background:#192139f7;border-top:1px solid #53617f;backdrop-filter:blur(12px);gap:10px}
 .app .home .home-actions>button{min-height:60px;font-size:13px;padding:10px 12px}.lobby-more{margin-top:8px}.lobby-more summary{min-height:44px}.lobby-bottom{margin-top:4px;gap:12px}.club-lobby .home-control{font-size:12px}.club-lobby .practice-button{min-height:44px;font-size:12px}
 .workshop-entry{flex-wrap:wrap;min-height:48px}.workshop-entry small{font-size:11px}
 body:has(.app){overflow-x:hidden}
 .app{padding:0 max(10px,env(safe-area-inset-left)) 0 max(10px,env(safe-area-inset-right))}
 body[data-screen=playing] .app,body[data-screen=paused] .app{height:100dvh;display:flex;flex-direction:column;overflow:hidden}
 .app header{height:50px;flex:none;gap:8px}.app header nav{gap:3px}.app header nav>a,.app header #musicChoice,.app .edition{display:none}.app header nav button{min-height:44px;min-width:44px;font-size:13px;padding:8px}.app .brand{font-size:18px;gap:4px}.app .brand>span{font-size:26px;margin-right:3px}
 body[data-screen=playing] .app main,body[data-screen=paused] .app main{display:flex;flex-direction:column;flex:1;min-height:0}
 .app .hud{height:55px;flex:none}.app .hud strong{font-size:26px}.app .hud small{font-size:9px}.app .hud #combo{font-size:8px;display:inline-block;margin-left:8px}.app .beat-box{display:none}
 body[data-screen=playing] .app .arena,body[data-screen=paused] .app .arena{flex:1;min-height:150px;height:auto;border-radius:12px}
 .app .arena-top{top:10px;left:10px;right:10px;gap:8px}.app .arena-top>span:first-child,.app .dancer-label{display:none}.app .arena-top #phase{font-size:12px}.app .flow-line{bottom:9px;left:10px;right:10px}.app #intent{font-size:11px;max-width:100%}.app #trail{display:none}
 .app .dance-signal{bottom:34px;max-width:calc(100% - 20px);font-size:12px}.app .dance-signal>span{font-size:12px}
 .app #coach,.app .flow-choices{display:none!important}.app .deck{flex:none;padding-top:7px;padding-bottom:env(safe-area-inset-bottom)}
 .app .deck-heading{margin-bottom:4px;font-size:9px;gap:8px;min-height:36px}.app .control-mode{margin-left:auto;min-height:36px;font-size:12px}.app .deck-legend{display:none}
 .app .move-pages{flex-wrap:nowrap;gap:6px;margin:0 0 7px}.app .move-pages button{min-height:38px;padding:7px 9px;font-size:11px;flex:1;white-space:nowrap}.app .move-pages small{display:none}
 .app .keyboard{max-height:34dvh;overflow-y:auto;overscroll-behavior:contain;gap:12px;padding:3px 3px 6px;scrollbar-width:thin}
 .app .keyboard .key-row{display:block}.app .keyboard .row-label{display:flex;width:auto;padding:3px 0;margin-bottom:6px}.app .row-label strong{font-size:11px}.app .row-label small{font-size:10px}
 .app .keyboard .row-pads,.app .keyboard[data-page="1"] .row-pads{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
 .app .keyboard .pad,.app .keyboard[data-page="1"] .key-row .pad{height:52px;min-height:52px;padding:8px;border-radius:8px;display:flex;align-items:center}
 .app .keyboard .pad strong{font-size:12px;white-space:normal;line-height:1.15;margin:0;font-weight:650;overflow:visible;letter-spacing:0}.app .keyboard .pad kbd{display:none}.app .keyboard[data-quick=true] .row-label{display:none}.app .keyboard[data-quick=true] .row-pads{grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}.app .keyboard[data-quick=true]{overflow:visible;max-height:none}
 .app .keyboard .pad[data-queued=true]:after{font-size:8px;top:-6px;padding:2px 4px}.app .pad .link-badge{right:4px;top:3px;font-size:12px}.app .acro-families{flex-wrap:nowrap;overflow-x:auto;margin-bottom:7px;padding-bottom:3px}.app .acro-families button{min-height:36px;flex:none;font-size:11px}
 .app .deck-footer{padding:3px 3px 8px;justify-content:flex-end}.app .deck-footer #status{display:none}.app .deck-footer button{min-height:44px;width:100%;font-size:12px;border-color:#607294;background:#24334e}.app footer{display:none}
 .app .comic{width:138px;top:38px;right:11px;padding:8px}.app .comic-title{font-size:16px}.app .comic-route,.app .comic-bonuses{display:none}.app .comic-points{font-size:23px;margin:4px 0}.app .comic-rhythm{font-size:9px}
 .app .modal{padding:12px;padding-bottom:calc(12px + env(safe-area-inset-bottom))}.app .modal>div{max-height:calc(100dvh - 24px - env(safe-area-inset-bottom));overflow-y:auto;padding:20px}.app .modal button{min-height:44px;font-size:13px}.app .modal p,.app .modal ol{font-size:13px}.app .modal h2{font-size:30px}.app .solo-result-face{height:110px;width:130px}.app .result-stats{gap:14px}.app .result-stats span{font-size:10px}.app .result-tip{font-size:12px}
}
@media(max-width:370px){.club-mark{font-size:16px}.mode-tabs a{font-size:9px;padding:6px}.club-lobby .poster-title h1{font-size:27px}.app .keyboard .pad strong{font-size:11px}.app .hud #combo{display:none}.app .move-pages button{padding:7px 5px}}
@media(max-height:460px) and (orientation:landscape) and (max-width:1000px){
 body[data-screen=playing] .app,body[data-screen=paused] .app{height:100dvh;display:flex;flex-direction:column;overflow:hidden;padding:0 10px}
 .app header{height:44px;flex:none}.app header nav>a,.app header #musicChoice,.app .edition,.app footer{display:none}.app header nav button{min-height:36px}
 body[data-screen=playing] .app main,body[data-screen=paused] .app main{display:grid;grid-template-columns:minmax(0,1fr) 340px;grid-template-rows:42px minmax(0,1fr);gap:0 12px;flex:1;min-height:0;padding-bottom:8px}
 .app .hud{grid-column:1;grid-row:1;height:42px}.app .hud small{font-size:8px}.app .hud strong{font-size:23px}.app .beat-box,.app #roundProgress,.app #coach,.app .flow-choices{display:none!important}
 body[data-screen=playing] .app .arena,body[data-screen=paused] .app .arena{grid-column:1;grid-row:2;min-height:0;height:auto;flex:none}
 .app .deck{grid-column:2;grid-row:1/3;min-height:0;padding:0;display:flex;flex-direction:column}.app .deck-heading{margin:0;min-height:36px}.app .control-mode{font-size:11px;min-height:32px}.app .deck-legend,.app .move-pages small,.app #status{display:none}.app .move-pages{margin:3px 0 6px;flex-wrap:nowrap;gap:5px}.app .move-pages button{font-size:11px;min-height:34px;padding:5px 7px}
 .app .keyboard{min-height:0;max-height:none;overflow-y:auto;padding:3px;flex:1}.app .keyboard .row-label{display:none}.app .keyboard .key-row{display:block}.app .keyboard .row-pads,.app .keyboard[data-page="1"] .row-pads{grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}.app .keyboard .pad{height:52px;min-height:52px;padding:7px}.app .keyboard .pad kbd{display:none}.app .keyboard .pad strong{font-size:12px;white-space:normal;margin:4px 0}.app .deck-footer{padding:6px 3px 0}.app .deck-footer button{width:100%;min-height:38px}.app .dance-signal{bottom:32px}.app #trail{display:none}.app #intent{max-width:100%}.app .arena-top>span:first-child,.app .dancer-label{display:none}.app .acro-families{flex-wrap:nowrap;overflow-x:auto;flex:none}
}
@media(min-width:701px) and (max-width:1000px) and (min-height:461px){
 .app .keyboard .row-pads{grid-template-columns:repeat(5,minmax(0,1fr));gap:7px}.app .keyboard .pad{height:48px}.app .keyboard[data-quick=true] .row-pads{grid-template-columns:repeat(4,minmax(0,1fr))}.app .keyboard .pad strong{font-size:12px}.app .row-label strong{font-size:11px}.app .row-label small{font-size:10px}.app .row-label{width:92px}.app .control-mode{min-height:44px}
}
@media(max-width:700px) and (orientation:portrait){
 body[data-screen=playing] .app .deck,body[data-screen=paused] .app .deck{display:flex;flex-direction:column;max-height:calc(100dvh - 255px);min-height:0}
 .app .deck-heading,.app .move-pages,.app .acro-families,.app .deck-footer{flex:none}.app .keyboard{min-height:0;flex-shrink:1}
}
@media(max-width:700px){
 #setup .poster-title{grid-column:1/-1;grid-row:2}#setup .poster-title h1 br{display:none}#setup .poster-title h1{font-size:29px}#setup .lobby-poster{padding:14px 16px;gap:12px}#setup .character-choice{min-height:44px}#setup .venue-choice .venue-art{height:58px}
}

/* Stop is a real action, with enough contrast beside the dance pads. */
.app #release:not(:disabled){color:#eef4e8;background:#26384a;border-color:#6b8193}
@media(max-width:700px){.app #release{min-height:44px}}
 .app .keyboard .pad[data-queued=true][data-state-label]:after{content:attr(data-state-label)}
