#mobile-controls { display:none; }

@media (hover:none), (pointer:coarse) {
  canvas { touch-action:none; }

  #mobile-controls {
    display:flex;
    position:fixed;
    left:0;
    right:0;
    bottom:12px;
    justify-content:space-between;
    align-items:flex-end;
    padding:0 18px;
    z-index:9999;
    pointer-events:none;
  }

  #mobile-controls button {
    pointer-events:auto;
    width:58px;
    height:58px;
    border-radius:14px;
    border:2px solid #7dd3fc;
    background:rgba(15,23,42,.85);
    color:white;
    font-size:22px;
    font-weight:bold;
  }

  .move-pad {
    display:flex;
    flex-direction:column;
    gap:6px;
    align-items:center;
  }

  .move-pad div {
    display:flex;
    gap:6px;
  }

  #fire-btn {
    width:86px !important;
    height:86px !important;
    border-radius:50% !important;
    border-color:#f87171 !important;
  }
}