/* Mobile/PWA stability shared by the interactive game pages. */
html,body{max-width:100%;overflow-x:hidden;overflow-x:clip}
.game-shell,.setup-card,.race-card,.local-results,.race-stage,.race-track,.sudoku-grid{min-width:0}

@media(max-width:760px){
  body{-webkit-text-size-adjust:100%;overscroll-behavior-y:none}
  button,a,input,select{touch-action:manipulation}
  .game-shell{width:calc(100% - 24px)!important;max-width:100%;margin-left:auto!important;margin-right:auto!important}
  .setup-card,.race-card,.local-results{width:100%;max-width:100%;min-width:0;overflow:hidden}
  .card-heading,.card-heading>div,.racer-inputs,.racer-row,.race-presets,.setup-actions{width:100%;max-width:100%;min-width:0}
  .card-heading>div{grid-template-columns:auto minmax(0,1fr)}
  .card-heading>b{flex:0 0 auto}
  .race-presets{grid-template-columns:repeat(3,minmax(0,1fr))}
  .race-presets button,.setup-actions button{min-width:0;max-width:100%;white-space:normal;overflow-wrap:anywhere}
  .racer-row{grid-template-columns:30px minmax(0,1fr) 36px}
  .setup-actions{grid-template-columns:repeat(2,minmax(0,1fr))}
  .race-stage,.race-track,.sudoku-grid{contain:layout paint}
  .race-lane{contain:layout paint;transform:translateZ(0)}
  .racing-fish{backface-visibility:hidden}
  .sudoku-grid{width:100%;max-width:min(100%,560px);margin-inline:auto}
  .cell{min-width:0;min-height:0;touch-action:manipulation}
  .game-info,.game-ad-slot,.game-site-footer{content-visibility:auto;contain-intrinsic-size:auto 260px}
}

@media(max-width:480px){
  .game-site-header{padding-inline:12px}
  .game-site-brand{gap:7px;font-size:15px}
  .game-site-back{min-width:0;padding-inline:10px}
  .race-lane{height:48px}
  .lane-label{max-width:74px;font-size:10px}
  .number-pad{gap:5px}
  .number-pad button{min-width:0}
  .stats{gap:6px}
  .stats span{min-width:60px}
}

@media(max-width:390px){
  .setup-actions{grid-template-columns:1fr}
}

@media(max-width:760px) and (pointer:coarse){
  /* Keep gameplay motion, but remove continuous decoration that costs frames. */
  .finish-angler,.race-card:before,.race-card:after,.race-lane:before,.sudoku-bubbles i{animation:none!important}
  .race-track.photo-finish{animation:none!important}
  .race-track.photo-finish .racing-fish{filter:none!important}
}

@media(max-width:760px) and (display-mode:standalone){
  body{min-height:100dvh}
  .game-site-header{position:relative}
  .game-site-footer{padding-bottom:max(30px,env(safe-area-inset-bottom))!important}
}

@media(prefers-reduced-motion:reduce){
  .racing-fish,.finish-angler,.sudoku-tuna,.sudoku-bubbles i{animation:none!important}
}