/* Tank City chrome beyond the shared sheet: the touch pad, and a result dialog that
   sits over the letterboxed stage like the other games'. */

/* ---- touch pad, in the spirit of the PoP pad: coarse-pointer devices only ---- */
.pad { display: none; }

@media (pointer: coarse) {
  .pad {
    display: block;
    position: fixed;
    inset: 0;
    z-index: 5;
    pointer-events: none;
  }
  .pad button {
    pointer-events: auto;
    position: fixed;
    touch-action: none;
    -webkit-user-select: none;
    user-select: none;
    background: #241a10cc;
    border: 2px solid #6a5acd55;
    border-radius: 10px;
    color: #e8d9b8;
    font: 700 3.2vmin monospace;
  }
  .dpad button { width: 11vmin; height: 11vmin; }
  .dpad .up    { left: 13vmin; bottom: 16vmin; }
  .dpad .down  { left: 13vmin; bottom: 2vmin; }
  .dpad .left  { left: 2vmin;  bottom: 9vmin; }
  .dpad .right { left: 24vmin; bottom: 9vmin; }
  .fire {
    width: 16vmin; height: 16vmin; border-radius: 50%;
    right: 4vmin; bottom: 5vmin;
    border-color: #c24a2a88;
  }
  .fire:active, .dpad button:active { background: #6a5acd55; }
}

/* ---- result dialog ---- */
#result-modal { z-index: 8; }

/* ---- the enemies-left chip in the header ---- */
.chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 2px 8px;
  background: #241a10;
  border: 1px solid #6a5acd55;
  border-radius: 8px;
  color: #e8d9b8;
}