@import url("./game-ux.css?v=1");
html,body{max-width:100%;overflow-x:hidden;overflow-x:clip}.game-site-header,.game-site-footer,body>main{min-width:0;max-width:100%}
.game-site-header{position:relative;z-index:20;display:flex;align-items:center;justify-content:space-between;width:100%;height:76px;padding:0 5vw;background:#071f2f;color:#fff;border-bottom:1px solid #27403a}.game-site-brand{display:inline-flex;align-items:center;gap:10px;color:#fff!important;text-decoration:none;font-size:18px;font-weight:800;line-height:1}.game-site-brand img{display:block;width:31px;height:31px;border-radius:9px;box-shadow:0 3px 12px #0003}.game-site-back{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0 14px;border:1px solid #46605a;border-radius:99px;color:#d5e3de!important;text-decoration:none;font-size:12px;font-weight:800}.game-site-back>span{color:#d5ff5f;font-size:16px}.game-site-back:hover,.game-site-back:focus-visible{border-color:#69d2e7;background:#12352f;color:#fff!important}.game-site-footer{display:grid!important;grid-template-columns:auto auto 1fr auto;align-items:center;gap:25px;width:100%;min-height:100px;margin-top:auto;padding:28px 5vw!important;background:#041722!important;color:#8da29b!important;font-size:11px!important}.game-site-footer .game-site-brand{font-size:16px}.game-site-footer .game-site-brand img{width:28px;height:28px}.game-site-footer small{white-space:nowrap;color:#8da29b}.game-site-footer p{margin:0!important;text-align:center;color:#8da29b}.game-site-footer nav{display:flex;gap:16px;justify-content:flex-end}.game-site-footer a:not(.game-site-brand){color:#a9bdb6!important;text-decoration:none}.game-site-footer a:hover,.game-site-footer a:focus-visible{color:#d5ff5f!important}@media(max-width:760px){.game-site-header{height:64px;padding:0 18px}.game-site-brand{font-size:16px}.game-site-brand img{width:29px;height:29px}.game-site-back{min-height:40px;padding:0 12px;font-size:10px}.game-site-footer{grid-template-columns:1fr!important;justify-items:center;gap:12px!important;min-height:0;padding:30px 18px 90px!important;text-align:center}.game-site-footer p{max-width:430px}.game-site-footer nav{justify-content:center;flex-wrap:wrap}}
body{min-height:100svh;display:flex;flex-direction:column}body>main{flex:1}
@media(max-width:760px) and (display-mode:standalone){.game-site-header{height:calc(64px + env(safe-area-inset-top));padding-top:env(safe-area-inset-top);padding-left:max(18px,env(safe-area-inset-left));padding-right:max(18px,env(safe-area-inset-right));position:sticky;top:0}.game-site-back{min-width:98px;min-height:44px;justify-content:center}.game-site-footer{padding-bottom:calc(30px + env(safe-area-inset-bottom))!important}}

/* Installed-app dialog and touch behaviour. */
.native-app body.native-dialog-open{overflow:hidden;overscroll-behavior:none}
.native-app .game-modal section{position:relative;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.native-app .game-overlay,
.native-app .boat-overlay,
.native-app .beach-overlay,
.native-app .flap-overlay,
.native-app .puff-overlay,
.native-app .pause-overlay,
.native-app .scale-overlay,
.native-app .tank-overlay{overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.native-app .game-dialog-close{position:absolute;z-index:100;top:max(12px,env(safe-area-inset-top));right:max(12px,env(safe-area-inset-right));display:grid!important;place-items:center;width:46px!important;height:46px!important;min-width:46px!important;min-height:46px!important;margin:0!important;padding:0!important;border:1px solid #698087!important;border-radius:50%!important;background:#071f2fee!important;color:#fff!important;box-shadow:0 8px 22px #00182655!important;font:700 28px/1 system-ui,-apple-system,"Segoe UI",sans-serif!important;touch-action:manipulation}
.native-app .game-dialog-close:focus-visible{outline:3px solid #d5ff5f;outline-offset:3px}
.native-app button,.native-app a,.native-app input,.native-app select{touch-action:manipulation}
.native-app canvas,.native-app .fishing-water,.native-app .puff-board,.native-app .scale-game,.native-app .tank-stage{overscroll-behavior:none}

@media(max-width:720px){
  /* Keep the installed app focused on play instead of oversized web-page intros. */
  .native-app .hub-hero,
  .native-app .beach-hero,
  .native-app .boat-hero,
  .native-app .cast-hero,
  .native-app .flap-hero,
  .native-app .game-hero,
  .native-app .puff-hero,
  .native-app .scale-hero,
  .native-app .tank-hero{min-height:0!important;padding-top:26px!important;padding-bottom:38px!important}
  .native-app .hub-hero h1,
  .native-app .beach-hero h1,
  .native-app .boat-hero h1,
  .native-app .cast-hero h1,
  .native-app .flap-hero h1,
  .native-app .game-hero h1,
  .native-app .puff-hero h1,
  .native-app .scale-hero h1,
  .native-app .tank-hero h1{font-size:clamp(38px,12vw,54px)!important;line-height:.98!important;letter-spacing:-2.4px!important}
  .native-app .hub-hero>p:last-child,
  .native-app .beach-hero>div>p:last-child,
  .native-app .boat-hero>div>p:last-child,
  .native-app .cast-hero>div>p:last-child,
  .native-app .flap-hero>div>p:last-child,
  .native-app .game-hero>div>p:last-child,
  .native-app .puff-hero>div>p:last-child,
  .native-app .scale-hero>div>span,
  .native-app .tank-hero>div>p:last-child{max-width:34rem;margin-top:8px!important;line-height:1.4!important}
  .native-app .room-strip{padding:15px 16px!important;gap:12px!important;border-radius:18px 18px 0 0!important}
  .native-app .room-strip h2{margin-top:2px!important}
  .native-app .room-actions{gap:8px!important}
  .native-app .join-room{gap:7px!important}
  .native-app .game-modal{padding:8px max(8px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left))}
  .native-app .game-modal section{width:100%;max-height:calc(100dvh - 16px);padding:20px 16px 18px;border-radius:20px}
  .native-app .game-modal section>.cast-kicker{padding-right:52px}
  .native-app .game-modal h2{padding-right:46px;font-size:clamp(25px,7.8vw,32px);line-height:1.05}
  .native-app .podium{gap:5px;margin-top:12px}
  .native-app .podium>div{min-height:44px;padding:8px 10px}
  .native-app .game-modal button:not(.game-dialog-close){min-height:48px;margin-top:12px}
  .native-app .game-modal a{min-height:44px;margin-top:8px}
  .native-app .arcade-result-card{grid-template-columns:repeat(2,minmax(0,1fr));width:100%;max-height:none;margin-top:10px;padding:6px}
  .native-app .arcade-result-card>div,.native-app .arcade-result-card>a{min-height:48px;padding:8px}
  .native-app .arcade-result-card>a{grid-column:1/-1}
  .native-app .arcade-result-card>a small{display:block;color:#78d9e8!important}
  .native-app .arcade-result-card>a b{display:block;color:#fff!important}
  .native-app .game-site-header>*{min-width:0}
  .native-app .game-site-brand{flex:0 1 auto;overflow:hidden}
  .native-app .game-site-brand img{max-width:100%;height:auto}
  .native-app .game-site-back{flex:0 0 auto;white-space:nowrap}
  .native-app .game-overlay,
  .native-app .boat-overlay,
  .native-app .beach-overlay,
  .native-app .flap-overlay,
  .native-app .puff-overlay,
  .native-app .pause-overlay,
  .native-app .scale-overlay,
  .native-app .tank-overlay{max-width:100%;overflow-x:hidden;overflow-y:auto}
  .native-app .overlay-actions{display:flex;flex-wrap:wrap;width:100%;max-width:100%}
  .native-app .overlay-actions>*{flex:1 1 130px;min-width:0;max-width:100%}
  .native-app .beach-result-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%;max-width:100%}
  .native-app .beach-result-stats span{min-width:0}
}

@media(max-width:620px){.spot-stage{min-height:0!important}}
