/* radar.css — Alarm112 Visual FX */

.radar-container {
  position: relative;
  width: 100px;
  height: 100px;
  background: rgba(56, 189, 248, 0.05);
  border-radius: 50%;
  border: 1px solid rgba(56, 189, 248, 0.2);
  overflow: hidden;
  margin: 0 auto 20px;
}

.radar-sweep {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  height: 100%;
  background: conic-gradient(from 0deg, rgba(56, 189, 248, 0.4) 0%, transparent 40%);
  transform-origin: 0 0;
  animation: sweep 4s linear infinite;
  border-radius: 50%;
}

.radar-ring {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  border: 1px solid rgba(56, 189, 248, 0.1);
  border-radius: 50%;
}

.radar-ring:nth-child(1) { width: 30%; height: 30%; }
.radar-ring:nth-child(2) { width: 60%; height: 60%; }
.radar-ring:nth-child(3) { width: 90%; height: 90%; }

.radar-dot {
  position: absolute;
  width: 4px;
  height: 4px;
  background: #38bdf8;
  border-radius: 50%;
  box-shadow: 0 0 8px #38bdf8;
  animation: blink 2s ease-in-out infinite;
}

@keyframes sweep {
  from { transform: rotate(0deg) translate(0, 0); }
  to   { transform: rotate(360deg) translate(0, 0); }
}

@keyframes blink {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.3; }
}

/* ── HUD Scanline ────────────────────────────────────────── */
.hud-scanline {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 2px;
  background: rgba(56, 189, 248, 0.1);
  z-index: 9999;
  pointer-events: none;
  animation: scan 8s linear infinite;
}

@keyframes scan {
  from { transform: translateY(-100px); }
  to { transform: translateY(100vh); }
}