/* FoxHunt3D v4.5.2 — ajoneuvohypyt, ajoneuvoaseet ja tuhoutuva maasto */

#rallyArenaHud {
  grid-template-columns: minmax(0, 1fr) repeat(5, minmax(70px, auto));
}

.vehicle-action-grid {
  grid-template-columns: repeat(3, minmax(72px, 92px));
}

.vehicle-control-button.jump {
  border-color: rgba(104,226,255,.68);
  background: rgba(16,90,115,.58);
}
.vehicle-control-button.weapon {
  white-space: pre-line;
  border-color: rgba(255,209,102,.72);
  background: rgba(112,76,14,.62);
}
.vehicle-control-button.rocket {
  white-space: pre-line;
  border-color: rgba(255,104,72,.72);
  background: rgba(126,38,26,.64);
}
.vehicle-control-button:disabled {
  opacity: .48;
  filter: grayscale(.35);
}

.arena-combat-profile-card {
  border-color: rgba(255,159,67,.28);
  background: linear-gradient(145deg, rgba(255,159,67,.06), rgba(104,226,255,.025));
}

@media (pointer: coarse), (max-width: 900px) {
  #rallyArenaHud {
    grid-template-columns: minmax(0,1fr) repeat(4,minmax(56px,auto));
  }
  #rallyArenaHud .rally-hud-metric:nth-last-child(2) { display: none; }
  #rallyArenaHud .arena-weapon-metric { display: block !important; }
}

@media (max-width: 620px) {
  #rallyArenaHud {
    grid-template-columns: 1fr repeat(3,62px);
  }
  #rallyArenaHud .rally-hud-metric:nth-of-type(4),
  #rallyArenaHud .rally-hud-metric:nth-of-type(5) { display: none; }
  #rallyArenaHud .arena-weapon-metric { display: block !important; }
  .vehicle-action-grid {
    right: 8px;
    bottom: 10px;
    grid-template-columns: repeat(3,64px);
    gap: 5px;
  }
  .vehicle-control-button {
    min-height: 42px;
    padding: 5px 4px;
    font-size: 7px;
    border-radius: 10px;
  }
}

@media (orientation: landscape) and (max-height: 460px) {
  #rallyArenaHud {
    grid-template-columns: minmax(0,1fr) repeat(5,62px);
  }
  .vehicle-action-grid {
    right: 7px;
    bottom: 7px;
    grid-template-columns: repeat(3,62px);
    gap: 5px;
  }
  .vehicle-control-button {
    min-height: 39px;
    padding: 4px;
    font-size: 7px;
  }
  .vehicle-steer-pad {
    width: 100px;
    height: 100px;
    left: 8px;
    bottom: 9px;
  }
}
