/* === GUN SIGHT CURSOR === */
body.game-active,
body.game-active * {
  cursor: url(/cursor-normal.svg) 16 16, crosshair !important;
}

/* === TARGETING MODE === */
.shootable {
  transition: transform 0.2s, box-shadow 0.2s;
}

.shootable:hover {
  cursor: url(/cursor-target.svg) 16 16, crosshair !important;
  transform: scale(1.1);
  box-shadow: 0 0 20px 5px rgba(255, 0, 0, 0.6), 0 0 40px 10px rgba(255, 0, 0, 0.3);
  animation: targetPulse 0.8s ease-in-out infinite;
  z-index: 10;
}

@keyframes targetPulse {
  0%, 100% { box-shadow: 0 0 20px 5px rgba(255, 0, 0, 0.6), 0 0 40px 10px rgba(255, 0, 0, 0.3); }
  50% { box-shadow: 0 0 30px 10px rgba(255, 0, 0, 0.8), 0 0 60px 20px rgba(255, 0, 0, 0.4); }
}

/* Hit flash */
.shootable.hit-target { animation: hitGreen 0.4s; }
.shootable.hit-friendly { animation: hitRed 0.4s; }

@keyframes hitGreen {
  0% { filter: brightness(3) saturate(0); }
  100% { filter: none; }
}
@keyframes hitRed {
  0% { filter: brightness(2) hue-rotate(-30deg) saturate(3); }
  50% { transform: translateX(-5px); }
  100% { filter: none; transform: none; }
}

/* === SCORE HUD === */
.game-hud {
  position: fixed;
  top: 20px;
  right: 20px;
  z-index: 99998;
  font-family: 'Courier New', monospace;
  background: rgba(0, 0, 0, 0.85);
  border: 2px solid #00ff00;
  border-radius: 8px;
  padding: 12px 20px;
  color: #00ff00;
  font-weight: bold;
  text-shadow: 0 0 10px #00ff00;
  box-shadow: 0 0 20px rgba(0, 255, 0, 0.2);
  animation: hudSlide 0.5s ease-out;
  user-select: none;
  pointer-events: none;
}
.game-hud__score { font-size: 28px; letter-spacing: 2px; }
.game-hud__hint { font-size: 11px; color: #00cc00; margin-top: 4px; opacity: 0.8; }

@keyframes hudSlide {
  from { transform: translateX(120%); opacity: 0; }
  to { transform: none; opacity: 1; }
}

/* === OVERLAY === */
.game-overlay {
  position: fixed;
  top: 0; left: 0;
  width: 100vw; height: 100vh;
  z-index: 99999;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.3s;
}
.game-overlay--visible { opacity: 1; }

.game-overlay__content {
  text-align: center;
  font-family: 'Impact', 'Arial Black', sans-serif;
  text-transform: uppercase;
  letter-spacing: 4px;
}

/* Celebrate */
.game-overlay--celebrate {
  background: radial-gradient(ellipse, rgba(0, 180, 0, 0.7), rgba(0, 80, 0, 0.85));
}
.game-overlay--celebrate .game-overlay__points {
  font-size: 160px; color: #fff;
  text-shadow: 0 0 40px #0f0, 0 0 80px #0f0, 0 4px 0 #060;
  animation: pointsBounce 0.6s;
}
.game-overlay--celebrate .game-overlay__message {
  font-size: 52px; color: #cfc;
  text-shadow: 0 0 20px #0f0;
  margin-top: 10px; animation: msgSlide 0.5s 0.2s both;
}
.game-overlay--celebrate .game-overlay__sub {
  font-size: 24px; color: #afa;
  margin-top: 16px; font-family: monospace;
  animation: msgSlide 0.5s 0.4s both;
}

/* Penalty */
.game-overlay--penalty {
  background: radial-gradient(ellipse, rgba(200, 0, 0, 0.75), rgba(80, 0, 0, 0.9));
  animation: screenShake 0.5s;
}
.game-overlay--penalty .game-overlay__points {
  font-size: 160px; color: #fff;
  text-shadow: 0 0 40px #f00, 0 0 80px #f00, 0 4px 0 #600;
  animation: pointsBounce 0.6s;
}
.game-overlay--penalty .game-overlay__message {
  font-size: 64px; color: #fcc;
  text-shadow: 0 0 30px #f00;
  margin-top: 10px; animation: warningFlash 0.3s 3;
}
.game-overlay--penalty .game-overlay__sub {
  font-size: 24px; color: #f88;
  margin-top: 16px; font-family: monospace;
  animation: msgSlide 0.5s 0.4s both;
}

@keyframes pointsBounce {
  0% { transform: scale(0.3); opacity: 0; }
  50% { transform: scale(1.2); }
  100% { transform: scale(1); opacity: 1; }
}
@keyframes msgSlide {
  from { transform: translateY(30px); opacity: 0; }
  to { transform: none; opacity: 1; }
}
@keyframes screenShake {
  0%,100% { transform: none; }
  10% { transform: translate(-15px, -10px); }
  20% { transform: translate(15px, 10px); }
  30% { transform: translate(-10px, 5px); }
  40% { transform: translate(10px, -5px); }
  50% { transform: translate(-5px, 10px); }
  60% { transform: translate(5px, -10px); }
  70% { transform: translate(-3px, 3px); }
  80% { transform: translate(3px, -3px); }
}
@keyframes warningFlash {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.3; }
}

/* Game Over (Miriam) */
.game-overlay--gameover {
  background: rgba(0, 0, 0, 0.95);
  animation: screenShake 0.5s;
}
.game-overlay--gameover .game-overlay__points {
  font-size: 100px; color: #ff0000;
  text-shadow: 0 0 60px #ff0000, 0 0 120px #ff0000;
  animation: pointsBounce 0.6s;
}
.game-overlay--gameover .game-overlay__message {
  font-size: 72px; color: #fff;
  text-shadow: 0 0 40px #ff0000, 0 0 80px #ff0000;
  margin-top: 20px;
  animation: gameOverFlash 0.5s ease-in-out infinite;
}
.game-overlay--gameover .game-overlay__sub {
  font-size: 48px; color: #ff4444;
  margin-top: 30px; font-family: monospace;
  letter-spacing: 12px;
  animation: msgSlide 0.5s 0.4s both;
}
@keyframes gameOverFlash {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.7; transform: scale(1.05); }
}

/* Confetti */
.confetti {
  position: fixed;
  z-index: 100000;
  pointer-events: none;
  animation: confettiFall 1.5s forwards;
}
@keyframes confettiFall {
  0% { transform: translateY(0) rotate(0); opacity: 1; }
  100% { transform: translateY(100vh) rotate(720deg); opacity: 0; }
}

/* Muzzle flash */
.muzzle-flash {
  position: fixed;
  width: 40px; height: 40px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255,255,200,1), rgba(255,200,0,0.8) 40%, rgba(255,100,0,0) 70%);
  pointer-events: none;
  z-index: 100001;
  animation: flashOut 0.15s forwards;
}
@keyframes flashOut {
  0% { transform: scale(1); opacity: 1; }
  100% { transform: scale(2); opacity: 0; }
}