/* Web-only layout fixes. Keep the objective readable in UltraGames' narrow
   mobile iframe instead of squeezing three HUD panels into one row. */
.btn[href] {
  display: block;
  text-align: center;
  text-decoration: none;
}

@media (max-width: 520px) {
  .hud {
    height: auto;
    display: none;
    grid-template-columns: minmax(0, 1fr) 48px;
    grid-template-areas:
      "vitals pause"
      "objective objective";
    gap: 5px;
    align-items: start;
  }

  .hud.active { display: grid; }

  .hud > .hudPanel:first-child {
    grid-area: vitals;
    min-width: 0;
    padding: 6px;
  }

  .objective {
    grid-area: objective;
    min-width: 0;
    max-height: none;
    overflow: visible;
    font-size: 11px;
  }

  .pauseTop {
    grid-area: pause;
    width: 48px;
    height: 48px;
    min-width: 48px;
    padding: 0;
    border-radius: 14px;
    font-size: 19px;
  }

  .warning { top: calc(150px + env(safe-area-inset-top)); }
}