/* The player is a phone-sized instrument first; the arena grows on wider screens. */
body{overscroll-behavior-y:contain}
.arcade-layout .setup{padding:20px;box-shadow:0 18px 60px #0002}
.setup-title h1{font-size:27px;margin-bottom:22px}
.setup-title .eyebrow{font-size:10px;line-height:1.5}
.field-label{font-size:12px;letter-spacing:.04em;color:#c4c6cb}
.song-card{margin:12px 0 20px}
.song-card strong{overflow-wrap:anywhere}
.round-choice{margin-top:20px}
.round-choice select{font-size:14px;min-height:48px}
.round-summary{gap:6px;margin-top:10px}
.round-summary span{font-size:11px}
.settings summary{min-height:48px;display:flex;align-items:center;justify-content:space-between}
.settings summary::after{content:'+';font-size:20px;color:#ecd9ad}
.settings[open] summary::after{content:'−'}
.quick-start{display:block;width:100%;margin-top:12px;min-height:54px;font-size:14px;box-shadow:none}
.quick-start:disabled{opacity:.55}
.mode-card{min-height:74px}
.game-heading h2{font-size:28px}
.game-heading .eyebrow{font-size:10px}
.visit-best span{font-size:9px}
.visit-best strong{font-size:22px}
.arena{border-radius:18px;background:#0a0d17}
.arena-top{font-size:10px;letter-spacing:.03em;opacity:.8}
.touch-controls button{min-height:76px;position:relative;overflow:hidden;border-bottom-width:3px;background:linear-gradient(180deg,#2b2439,#1b1828);box-shadow:inset 0 1px #ffffff12;touch-action:none}
.touch-controls button[aria-pressed=true]{background:#3a504e;box-shadow:inset 0 0 0 2px #9ee8d5}
.touch-controls button.is-lit,.touch-controls button:active{background:var(--lane);box-shadow:0 0 25px color-mix(in srgb,var(--lane) 20%,transparent)}
.touch-controls button:disabled{opacity:.5}
body[data-state=ready] .touch-controls,body[data-state=loading] .touch-controls{display:none}
.touch-controls .pad-key-hint{font-size:11px}
.touch-controls[data-mode=run] button{font-size:30px}
.touch-controls[data-mode=flight] button,.touch-controls[data-mode=orbit] button{font-size:18px;letter-spacing:.07em;background:linear-gradient(135deg,#38312a,#29212e)}
.touch-controls[data-mode=flight] button.is-lit,.touch-controls[data-mode=orbit] button.is-lit{background:#ecd9ad;color:#251d24}
.touch-controls small{pointer-events:none}
.below-arena .secondary-button{min-width:72px;min-height:48px}
.below-arena p{font-size:12px;line-height:1.5;max-width:340px;margin:auto}
.game-results{background:#13161cf7}
.result-actions .start-button{min-height:48px}
body[data-focus=true] .play-column{background:#101113;gap:8px}
body[data-focus=true] .game-heading .heading-actions button{min-height:44px}
body[data-focus=true] .scoreboard{background:#191d24;border-color:#ffffff19}
body[data-focus=true] .arena-top{top:11px}
body[data-focus=true] .touch-controls button{min-height:76px}
body[data-focus=true] .below-arena p{line-height:1.3}
body[data-focus=true] .game-heading h2{font-size:22px}
body[data-focus=true] .arena{min-height:0}

@media(max-width:760px){
 .arcade-header{min-height:58px;padding:6px 16px}
 .arcade-header .brand{font-size:25px}
 .arcade-header .brand span{font-size:10px}
 .arcade-header nav{gap:12px;font-size:12px}
 .arcade-header nav a:last-child{display:none}
 .arcade-layout{padding:12px 12px 24px}
 .arcade-layout .setup{padding:16px;border-radius:18px}
 .setup-title{display:block}
 .setup-title h1{font-size:24px;margin:0 0 16px}
 .setup-title .eyebrow{font-size:9px;margin-bottom:5px;letter-spacing:.14em}
 .setup>select{font-size:15px;min-height:50px;padding-left:12px}
 .song-card{display:flex;margin:10px 0 14px;gap:9px}
 .song-card img{width:40px;height:40px;border-radius:9px}
 .song-card strong{font-size:12px}
 .song-card span{font-size:10px;margin-top:3px}
 .song-card .small-button{font-size:12px;min-height:44px}
 .mode-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:10px}
 .mode-card{display:flex;align-items:center;text-align:left;gap:9px;min-height:61px;padding:9px 10px;border-radius:12px}
 .mode-card .mode-icon{width:28px;min-width:28px;font-size:27px;margin:0}
 .mode-card .flight-icon{height:30px;background-size:200% auto}
 .mode-card strong{font-size:12px;line-height:1.3}
 .mode-card small{display:block;font-size:9px;line-height:1.3;margin-top:3px}
 .mode-card[aria-pressed=true]{box-shadow:inset 0 0 0 1px #ecd9ad66;background:#38342a}
 .round-choice{margin-top:14px}
 .round-choice label{margin-bottom:5px;font-size:11px}
 .round-choice select{font-size:13px;min-height:46px}
 .round-summary span{font-size:10px;padding:4px 6px}
 .settings{margin-top:4px}
 .settings summary{font-size:12px;padding-block:6px}
 .settings-content{padding-top:6px}
 .quick-start,body[data-state=ready]:not([data-focus=true]) .quick-start{display:block;position:static;width:100%;margin-top:6px;min-height:52px;font-size:14px;box-shadow:none}
 body[data-state=ready]:not([data-focus=true]){padding-bottom:0}
 .session-note{display:block;font-size:10px;line-height:1.5;margin:10px 0 0;text-align:center}
 .game-heading{margin:20px 2px 12px}
 .game-heading h2{font-size:24px}
 .heading-actions .secondary-button{font-size:12px;min-height:44px}
 .scoreboard{padding:10px;grid-template-columns:1fr .7fr .8fr 1.2fr;gap:6px;border-radius:12px}
 .scoreboard span{font-size:9px}
 .scoreboard strong{font-size:20px}
 .scoreboard .progress-stat span{font-size:10px;letter-spacing:0}
 .arena{height:350px;margin-top:8px}
 .game-overlay{padding:18px;background:#10101cd9}
 .game-overlay h3{font-size:31px}
 .game-overlay p{font-size:14px;line-height:1.5}
 .touch-controls{gap:6px}
 .touch-controls button{min-height:76px;font-size:27px}
 .touch-controls .pad-key-hint{display:none}
 .touch-controls button small{font-size:9px;margin-top:5px;letter-spacing:.1em}
 .below-arena p{font-size:11px}
 .below-arena .secondary-button{font-size:12px;padding:8px 10px;min-width:70px}
 .challenge-strip{margin-top:8px}
 .challenge-strip p{font-size:12px;line-height:1.5}
 body[data-focus=true] .play-column{padding:calc(8px + env(safe-area-inset-top)) max(10px,env(safe-area-inset-right)) calc(8px + env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-left));gap:7px;grid-template-rows:44px 57px minmax(0,1fr) 80px 48px auto}
 body[data-focus=true] .game-heading{margin:0;gap:8px;min-width:0}
 body[data-focus=true] .game-heading>div:not(.heading-actions){min-width:0}
 body[data-focus=true] .game-heading h2{font-size:19px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 body[data-focus=true] .active-song-art{width:32px;height:32px}
 body[data-focus=true] .heading-actions{gap:0}
 body[data-focus=true] .heading-actions .secondary-button{font-size:11px;padding:8px 10px}
 body[data-focus=true] .scoreboard{padding:9px 10px}
 body[data-focus=true] .arena{height:100%;margin:0;border-radius:14px}
 body[data-focus=true] .touch-controls{margin:0}
 body[data-focus=true] .touch-controls button{min-height:76px}
 body[data-focus=true] .status{font-size:11px;line-height:1.3}
 body[data-focus=true] .game-overlay .overlay-hint{font-size:11px;margin-top:10px}
}
@media(max-width:370px){
 .mode-card{padding:9px 8px;gap:6px}
 .mode-card strong{font-size:11px}
 .mode-card small{font-size:8px}
 .arcade-header nav a:nth-child(2){display:none}
 body[data-focus=true] .scoreboard strong{font-size:18px}
 body[data-focus=true] .scoreboard span{font-size:8px}
 body[data-focus=true] .scoreboard .progress-stat span{font-size:9px}
 body[data-focus=true] .game-overlay{padding:10px}
 body[data-focus=true] .game-overlay h3{font-size:25px;margin:8px 0}
 body[data-focus=true] .game-overlay p{font-size:12px;margin-bottom:12px}
 body[data-focus=true] .overlay-kicker{display:none}
 body[data-focus=true] .game-overlay .overlay-hint{display:none}
 body[data-focus=true] .start-button{min-height:44px;font-size:14px;padding:10px 18px}
}
@media(max-height:520px) and (orientation:landscape){
 body[data-focus=true] .play-column{grid-template-columns:minmax(0,1fr) 160px;grid-template-rows:40px minmax(0,1fr) 58px;gap:6px;padding:6px max(10px,env(safe-area-inset-right)) max(6px,env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-left))}
 body[data-focus=true] .game-heading{grid-column:1;grid-row:1;min-height:0}
 body[data-focus=true] .game-heading .heading-actions button{min-height:36px}
 body[data-focus=true] .scoreboard{grid-column:2;grid-row:2;grid-template-columns:1fr 1fr;gap:15px 8px;padding:12px 9px}
 body[data-focus=true] .arena{grid-column:1;grid-row:2;min-height:0;margin:0}
 body[data-focus=true] .touch-controls{grid-column:1;grid-row:3}
 body[data-focus=true] .touch-controls button{min-height:54px;font-size:20px}
 body[data-focus=true] .touch-controls button small{display:none}
 body[data-focus=true] .below-arena{grid-column:2;grid-row:3;gap:5px}
 body[data-focus=true] .below-arena .secondary-button{min-width:0;min-height:48px;padding:6px;font-size:11px}
 body[data-focus=true] .status{grid-column:2;grid-row:1}
 body[data-focus=true] .game-overlay{padding:10px}
 body[data-focus=true] .game-overlay h3{font-size:23px;margin:6px 0}
 body[data-focus=true] .game-overlay p{font-size:12px;margin-bottom:10px}
 body[data-focus=true] .game-overlay .overlay-hint{display:none}
}
@media(max-width:760px) and (orientation:portrait){body[data-focus=true][data-state=ready] .play-column,body[data-focus=true][data-state=loading] .play-column{grid-template-rows:44px 57px minmax(0,1fr) 48px auto}}