body {
  background: radial-gradient(circle at top, #0b1a2a, #020812);
  color: #fff;
  font-family: sans-serif;
  text-align: center;
}
header { padding: 1em; border-bottom: 1px solid #444; }
.map-area { position: relative; height: 60vh; overflow: hidden; }
.map-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  opacity: 0;
  transition: opacity 0.5s ease-in-out;
  filter: drop-shadow(0 0 4px #111) contrast(1.4);
}
.map-img.active { opacity: 1; }
button {
  margin: 0.5em;
  padding: 0.6em 1.2em;
  border-radius: 8px;
  border: none;
  background: #2563eb;
  color: #fff;
  font-weight: bold;
  cursor: pointer;
}
button:hover { background: #1d4ed8; }
.casualty-banner {
  margin-top: 1em;
  padding: 1em;
  background: rgba(127,29,29,0.9);
  color: #fee2e2;
  font-size: 1.2em;
  border-radius: 8px;
}
.missile-path {
  stroke: #f97316;
  stroke-width: 2;
  fill: none;
  stroke-dasharray: 260;
  stroke-dashoffset: 260;
  animation: drawArc 1.6s forwards ease-out;
}
@keyframes drawArc { to { stroke-dashoffset: 0; } }
.impact {
  fill: #f97316;
  opacity: 0;
  animation: blink 0.5s 1.6s forwards;
}
@keyframes blink {
  0% { opacity: 0; r: 0; }
  40% { opacity: 1; r: 4; }
  100% { opacity: 0; r: 7; }
}