/* Preserve the original console layout; enlarge only mobile navigation. */
.game-page .console-color-modal{padding:max(12px,env(safe-area-inset-top)) 12px max(12px,env(safe-area-inset-bottom));height:100vh;height:100dvh}
.game-page .console-color-modal-inner{margin:0;padding:12px;gap:12px;max-height:100%;overscroll-behavior:contain}
.game-page .console-color-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.game-page .console-color-tab{min-height:44px;font-size:14px}
.game-page .special-skins-note{font-size:14px;line-height:1.4;margin:0}
/* Shaded previews retain their texture; a small metal lock sits above the target. */
.game-page .earned-case.is-locked{box-shadow:inset 0 0 0 1px #ded5b35c,inset 0 2px 0 #fff4,0 4px 10px #0006}
.game-page .earned-case.is-locked:before{background:linear-gradient(160deg,#12192377,#050a12db);backdrop-filter:saturate(.45)}
.game-page .earned-case{display:grid;grid-template-rows:1fr auto auto;align-items:center;justify-items:center;padding:10px 4px 7px;gap:4px;aspect-ratio:4/3}
.game-page .earned-case .console-case-label{position:static;order:3;padding:0;background:none;border-radius:0;font-size:12px;line-height:1.1}
.game-page .case-padlock{position:relative;left:auto;top:auto;transform:none;align-self:end;width:18px;height:15px;border-color:#f0dfac;background:linear-gradient(140deg,#968562,#4e483c);box-shadow:0 2px 5px #0008;margin-top:9px}
.game-page .case-padlock:before{width:8px;height:9px;left:3px;top:-10px;border-color:#f0dfac}
.game-page .case-padlock:after{content:'';position:absolute;width:3px;height:5px;border-radius:2px;background:#211f1a;left:6px;top:4px}
.game-page .case-points{position:static;font:600 12px system-ui;line-height:1.2;color:#f3dfaa;letter-spacing:.02em}

@media(max-width:740px){
 .game-page .bottom-nav{gap:14px}
 .game-page .nav-tab{min-height:88px;padding:16px 12px;font-size:18px;gap:8px}
 .game-page .nav-tab svg{width:30px;height:30px}
}
@media(orientation:landscape) and (max-height:550px){.game-page .console-color-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.game-page .console-color-modal-inner{max-width:760px}}
/* Reserve room for controls before assigning the remaining height to the screen. */
.game-page .page-shell{gap:clamp(6px,1.2dvh,12px)}
.game-page .hero-banner{max-width:min(600px,48dvh)}
.game-page .console-unit{justify-content:flex-start;gap:8px;padding-bottom:clamp(18px,3dvh,28px)}
.game-page #canvas-container{flex:1 1 auto;min-height:0;display:flex;align-items:center;justify-content:center}
.game-page #game{max-height:100%;width:100%;object-fit:contain}
.game-page .console-panel{flex:0 0 auto}
.game-page .console-logo{width:min(160px,15dvh);margin-bottom:6px}
.game-page .console-round-icon{max-height:clamp(48px,9dvh,86px);background-size:contain}
.game-page .console-extra-row{margin-top:8px;gap:clamp(5px,2vw,14px)}
.game-page .console-color-trigger{width:clamp(40px,8vw,52px);height:clamp(40px,8vw,52px);flex-basis:clamp(40px,8vw,52px)}
.game-page .spotify-option{margin:0 auto;padding:6px 10px}
.game-page .bottom-nav{gap:10px}
.game-page .nav-tab{min-height:48px;padding:8px 12px;font-size:14px;gap:5px;flex-direction:row}
.game-page .nav-tab svg{width:22px;height:22px}
@media(max-height:700px){.game-page .console-logo{display:none}.game-page .spotify-copy small{display:none}.game-page .console-screen{gap:6px}.game-page .coin-slot{width:clamp(26px,7vw,40px);height:clamp(26px,7vw,40px)}}
/* Original screen ratio: 600 × 340. Fit both dimensions without stretching. */
.game-page #canvas-container{container-type:size}
.game-page #game{width:min(100%,calc(100cqh * 600 / 340));height:auto;max-height:none;aspect-ratio:600 / 340;flex:none}

/* Match the banner to the shell and keep the screen close to its top edge. */
.game-page .hero-banner{width:100%;max-width:600px}
.game-page .console-unit{padding-top:clamp(12px,2vw,18px);padding-bottom:14px}
.game-page #canvas-container{align-items:flex-start}
/* Keep the controls next to the screen instead of filling spare viewport height. */
.game-page #game-wrap,.game-page .game-frame,.game-page .console-unit{flex:0 0 auto}
.game-page .game-frame{justify-content:flex-start}
.game-page #canvas-container{flex:0 0 auto;container-type:normal;aspect-ratio:600 / 340}
.game-page #game{width:100%;height:auto;aspect-ratio:600 / 340}
.game-page .console-unit{gap:12px}
/* Album panel follows the olive and cream console navigation. */
.game-page .spotify-option{margin:18px auto 0;width:min(100%,600px);padding:12px 16px;border:2px solid #c8c39f;border-radius:16px;background:linear-gradient(145deg,#59663b,#29331f);box-shadow:inset 0 0 0 3px #17201088,inset 0 2px 0 #f5edc833,0 4px 0 #10170dcc;color:#f1ead2;gap:12px}
.game-page .spotify-copy strong{font-family:'Anton',sans-serif;letter-spacing:.03em;font-weight:400;color:#f1ead2}
.game-page .spotify-option a{padding:8px 12px;border:1px solid #d4c890;border-radius:8px;background:linear-gradient(145deg,#7a853e,#485422);color:#fff0ba;box-shadow:inset 0 1px 0 #ffffd333;text-align:center}
.game-page .spotify-option a:hover{background:linear-gradient(145deg,#8b9649,#58642b)}
.game-page .spotify-option a:focus-visible{outline:3px solid #f3d86c;outline-offset:3px}
@media(max-width:400px){.game-page .spotify-option{padding:10px 12px;gap:8px}.game-page .spotify-option a{padding:7px 9px}}
