/* Neon Commando — edge-device polish layered over the existing CRT identity. */
html, body { min-height: 100%; min-height: 100dvh; }
#game-container { height: 100%; height: 100dvh; }

/* Top controls remain comfortably operable on touch without obscuring the game. */
.top-btn {
  width: 44px;
  height: 44px;
  min-width: 44px;
  min-height: 44px;
}
.top-btn:focus-visible {
  outline: 3px solid #00e5ff;
  outline-offset: 3px;
}

/* Respect display cutouts in both orientations, not portrait only. */
#joystick-zone {
  bottom: max(24px, calc(14px + env(safe-area-inset-bottom)));
  left: max(24px, calc(14px + env(safe-area-inset-left)));
}
#btn-jump {
  bottom: max(40px, calc(18px + env(safe-area-inset-bottom)));
  right: max(24px, calc(14px + env(safe-area-inset-right)));
}
#btn-shoot {
  bottom: max(110px, calc(88px + env(safe-area-inset-bottom)));
  right: max(80px, calc(62px + env(safe-area-inset-right)));
}
#btn-weapon {
  bottom: max(40px, calc(18px + env(safe-area-inset-bottom)));
  right: max(110px, calc(96px + env(safe-area-inset-right)));
}

@media (max-width: 560px) {
  .top-btn { width: 44px; height: 44px; min-width: 44px; min-height: 44px; }
}

@media (max-height: 380px) and (orientation: landscape) {
  #top-controls {
    top: max(5px, env(safe-area-inset-top));
    right: max(6px, env(safe-area-inset-right));
    gap: 5px;
  }
  .top-btn { width: 44px; height: 44px; border-radius: 8px; font-size: 9px; }
  #joystick-zone {
    bottom: max(12px, env(safe-area-inset-bottom));
    left: max(12px, env(safe-area-inset-left));
  }
  #btn-jump {
    bottom: max(20px, calc(8px + env(safe-area-inset-bottom)));
    right: max(14px, calc(6px + env(safe-area-inset-right)));
  }
  #btn-shoot {
    bottom: max(82px, calc(68px + env(safe-area-inset-bottom)));
    right: max(64px, calc(52px + env(safe-area-inset-right)));
  }
  #btn-weapon {
    bottom: max(20px, calc(8px + env(safe-area-inset-bottom)));
    right: max(86px, calc(76px + env(safe-area-inset-right)));
  }
}

@media (prefers-reduced-motion: reduce) {
  .vbtn, .top-btn { transition: none !important; }
  #game-container::after { mix-blend-mode: normal; opacity: .08; }
}
