/* Penalty Kicks — edge-device and accessibility polish. Matchday identity stays in style.css. */
.game-bar{
  padding-left:max(12px,env(safe-area-inset-left));
  padding-right:max(12px,env(safe-area-inset-right));
  padding-top:max(6px,env(safe-area-inset-top));
}
.screen{
  padding-left:max(18px,env(safe-area-inset-left));
  padding-right:max(18px,env(safe-area-inset-right));
  padding-bottom:max(18px,env(safe-area-inset-bottom));
}
.icon-btn,.hud-btn,.menu-actions button{min-width:44px;min-height:44px}
.back-link:focus-visible,.icon-btn:focus-visible,.hud-btn:focus-visible{outline:3px solid #ffd84f;outline-offset:3px}
#screen-how .panel,#screen-leaderboard .panel,#screen-pause .panel,#screen-gameover .panel{
  max-height:calc(100dvh - 72px - env(safe-area-inset-top) - env(safe-area-inset-bottom));
  overflow:auto;
  overscroll-behavior:contain;
}

@media(max-width:430px){
  .game-bar{gap:.4rem}
  .game-bar-title{font-size:.72rem;letter-spacing:.06em}
  .hud{padding-left:max(8px,env(safe-area-inset-left));padding-right:max(8px,env(safe-area-inset-right))}
  .hud-hint{max-width:calc(100vw - 2 * max(8px,env(safe-area-inset-left)));white-space:normal}
}

@media(max-height:560px) and (orientation:landscape){
  #screen-menu .panel{bottom:max(6px,env(safe-area-inset-bottom));max-height:88%;padding:12px 16px}
  #screen-menu h1{font-size:clamp(2.2rem,8vw,4rem)!important}
  #screen-menu .menu-actions button{min-height:46px}
  #screen-menu::after{top:calc(3% + env(safe-area-inset-top))}
  #screen-how .panel,#screen-leaderboard .panel,#screen-pause .panel,#screen-gameover .panel{max-height:calc(100dvh - 18px - env(safe-area-inset-top) - env(safe-area-inset-bottom))}
}

@media(prefers-reduced-motion:reduce){
  .screen *, .hud *{scroll-behavior:auto!important}
  .hud-banner,.countdown,.toast{animation:none!important;transition:none!important}
}