/* Game UI only; the rendering resolution, materials and shadows remain full quality. */
[hidden] { display: none !important; }
.preloader { position: fixed; inset: 0; z-index: 30; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 20px; background: #121720; font-family: Arial, sans-serif; color: #efdbb4; }
.preloader b { font-size: 26px; }
.preloader span { font-size: 12px; color: #9fa9b9; }
.preloader progress { width: min(280px, 70vw); height: 5px; accent-color: #e8c27b; }
.preloader__ring { width: 58px; height: 58px; border: 2px solid #e8c27b22; border-top-color: #e8c27b; border-radius: 50%; animation: preload-spin 1s linear infinite; }
@keyframes preload-spin { to { transform: rotate(360deg); } }
body.embedded #menu, body.embedded .hud__hint { display: none; }
body .hud { font-family: Arial, sans-serif; }
body .hud__top { align-items: flex-start; padding: 16px 20px; }
body .hud__score, body .hud__ammo { padding: 12px 16px; background: linear-gradient(120deg, #171d28e8, #15181fd9); border: 1px solid #e9c9875c; border-radius: 8px; box-shadow: 0 6px 22px #0003; }
body .hud__score span, body .hud__ammo > span { display: block; font-size: 9px; letter-spacing: .15em; color: #c4b18d; margin-bottom: 5px; }
body .hud__score b { color: #f5dfae; font-size: 31px; }
body .hud__ammo b { display: block; font-size: 22px; color: #f5dfae; }
body .hud__wave { background: #151923c9; padding: 9px 14px; border-radius: 5px; font-size: 10px; }
.ammoRounds { display: grid; grid-template-columns: repeat(10, 10px); gap: 3px; margin-top: 8px; }
.ammoRounds i { width: 10px; height: 27px; background: url('./assets/ui/cartridge.webp') center / contain no-repeat; transition: opacity .12s; }
.ammoRounds i.spent { opacity: .12; }
body .hud__markers { margin-top: 0; gap: 4px; opacity: .7; }
body .hud__markers i { width: 7px; height: 7px; border-radius: 50%; }
body .hud__zones { bottom: 16px; left: 16px; right: 16px; text-align: center; font-size: 10px; color: #e7dfc6; letter-spacing: 0; }
body .hud__aim { font-family: Arial, sans-serif; font-size: 16px; letter-spacing: .02em; text-align: center; width: 85%; }
@media (max-width: 600px) {
  body .hud__top { padding: 10px; gap: 6px; }
  body .hud__score, body .hud__ammo { padding: 9px 11px; }
  body .hud__wave { font-size: 9px; }
  .ammoRounds { grid-template-columns: repeat(10, 8px); gap: 1px; }
  .ammoRounds i { width: 8px; height: 22px; }
}