/* Reserve room for the score, messages and touch controls before sizing the scene. */
.game-layout .header{height:64px;min-height:64px;padding-top:0;padding-bottom:0;flex-wrap:nowrap}
.game-layout .game-page{padding-top:16px}
.game-layout .game-intro{margin:0 0 16px;min-height:64px}
.game-layout .game-intro h1{font-size:42px;letter-spacing:-2px;white-space:nowrap}
.game-layout .arcade{height:min(680px,calc(100vh - 184px));height:min(680px,calc(100dvh - 184px));display:grid;grid-template-rows:58px minmax(0,1fr) 46px 76px}
.game-layout .scoreboard{padding:9px 20px;align-items:center}
.game-layout .scoreboard strong{font-size:23px;margin-top:2px}
.game-layout .stage{min-height:0;overflow:hidden;container-type:size}
.game-layout canvas{width:100%;height:100%;object-fit:contain}
.game-layout .game-message{min-height:0;padding:5px 14px}
.game-layout .game-message p{font-size:11px;line-height:1.3}
.game-layout .controls{padding:8px 14px 14px;min-height:0}
.game-layout .controls button{height:50px}
/* The contact link must not sit on top of Jump or Wind. */
.game-layout .whatsapp-contact{position:static;display:flex;width:fit-content;margin:20px auto}
.game-layout{padding-bottom:0}
@media(max-width:650px){
 .game-layout .game-intro h1{font-size:34px}
 .game-layout .game-intro>p{display:none}
 .game-layout .scoreboard{padding:8px 11px}
 .game-layout .scoreboard strong{font-size:18px}
 .game-layout .controls{padding-left:9px;padding-right:9px}
 .game-layout .game-message{padding-left:9px;padding-right:9px}
 .game-layout .game-message p{font-size:10px}
}
@media(max-height:540px){
 .game-layout .header{height:48px;min-height:48px}
 .game-layout .header .logo{width:150px}
 .game-layout .game-page{padding-top:8px}
 .game-layout .game-intro{min-height:32px;margin-bottom:8px}
 .game-layout .game-intro .eyebrow,.game-layout .game-intro>p{display:none}
 .game-layout .game-intro h1{font-size:28px}
 .game-layout .arcade{height:calc(100vh - 108px);height:calc(100dvh - 108px);grid-template-rows:42px minmax(0,1fr) 36px 62px}
 .game-layout .scoreboard{padding:3px 12px}
 .game-layout .scoreboard strong{font-size:17px}
 .game-layout .controls{padding-top:4px;padding-bottom:8px}
 .game-layout .controls button{height:46px}
}
@container(max-height:340px){
 .start-card{padding:12px 20px;max-width:92%}
 .start-card .eyebrow,.start-card #intro-steps{display:none}
 .start-card h2{font-size:30px;line-height:1;margin-bottom:8px;letter-spacing:-1px}
 .start-card h2 br{display:none}
 .start-card p{font-size:11px;margin-bottom:10px;line-height:1.4}
 .start-card .button{padding:10px 18px;font-size:12px}
}
@container(max-height:180px){
 .start-card{padding:8px 14px}
 .start-card h2{font-size:22px;margin-bottom:5px}
 .start-card p{font-size:10px;margin-bottom:6px}
}
