/* Cyberpunk Aesthetic & UI Enhancements */
:root {
  --neon-cyan: #00f0ff;
  --neon-pink: #ff007f;
  --neon-purple: #9d00ff;
  --bg-dark: #06080e;
}

body {
  touch-action: none;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  user-select: none;
  background-color: var(--bg-dark);
}

/* Sonar Grid Overlay */
.sonar-grid {
  background-image: 
    linear-gradient(to right, rgba(0, 240, 255, 0.08) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(0, 240, 255, 0.08) 1px, transparent 1px);
  background-size: 32px 32px;
}

.sonar-scanline {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to bottom,
    transparent 0%,
    rgba(0, 240, 255, 0.25) 50%,
    transparent 100%
  );
  animation: sonar-sweep 3s linear infinite;
  pointer-events: none;
}

@keyframes sonar-sweep {
  0% { transform: translateY(-100%); }
  100% { transform: translateY(100%); }
}

/* Alarm Red Pulse */
.alarm-pulse {
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at center, transparent 30%, rgba(239, 68, 68, 0.4) 100%);
  animation: alarm-flashing 1s ease-in-out infinite alternate;
}

@keyframes alarm-flashing {
  0% { opacity: 0.3; }
  100% { opacity: 0.9; }
}

/* Scrollbar polish */
::-webkit-scrollbar {
  width: 4px;
}
::-webkit-scrollbar-track {
  background: #0b0f19;
}
::-webkit-scrollbar-thumb {
  background: #1e293b;
  border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
  background: #00f0ff;
}