/* ==========================================================================
   GARNET RADAR (MESIN 2 : OBSIDIAN GREEN) : PROCEDURAL TEXTURES & LIGHTBLADES
   Nivansware Studios & Garnet Gate DNA Architecture
   High-Contrast Obsidian + Tactical Phosphor Green (#10B981 / #22C55E)
   Zero Raster Bloat : Pure CSS & Math Gradients
   Zero Em-Dash & Zero Keyboard Emoji Mandate
   ========================================================================== */

/* 1. Tactical Cartesian Grid Canvas (24px x 24px Precision Mesh) */
.radar-grid-texture {
  background-image: 
    linear-gradient(to right, rgba(16, 185, 129, 0.05) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(16, 185, 129, 0.05) 1px, transparent 1px);
  background-size: 24px 24px;
}

.radar-grid-dense {
  background-image: 
    linear-gradient(to right, rgba(16, 185, 129, 0.08) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(16, 185, 129, 0.08) 1px, transparent 1px);
  background-size: 16px 16px;
}

/* 2. CRT Phosphor Micro-Scanline Simulation */
.radar-scanlines {
  position: relative;
}

.radar-scanlines::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    rgba(18, 16, 16, 0) 50%, 
    rgba(0, 0, 0, 0.35) 50%
  );
  background-size: 100% 4px;
  pointer-events: none;
  z-index: 2;
  opacity: 0.65;
}

/* 3. Hexagonal Geopolitical Ingestion Mesh */
.radar-hex-mesh {
  background-color: var(--radar-bg-core, #05070B);
  background-image: 
    radial-gradient(circle at 50% 50%, rgba(16, 185, 129, 0.08) 0%, transparent 60%),
    linear-gradient(to right, rgba(16, 185, 129, 0.04) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(16, 185, 129, 0.04) 1px, transparent 1px);
  background-size: 100% 100%, 32px 32px, 32px 32px;
}

/* 4. Tactical Cockpit Vignette */
.radar-vignette {
  box-shadow: inset 0 0 100px rgba(3, 5, 8, 0.85);
}

/* 5. Lightblade Edge Glows */
.radar-lightblade-green {
  position: relative;
}

.radar-lightblade-green::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 1px;
  background: linear-gradient(
    90deg, 
    transparent 0%, 
    var(--radar-neon-green, #10B981) 50%, 
    transparent 100%
  );
  box-shadow: 0 0 10px var(--radar-neon-green, #10B981);
}

.radar-lightblade-crimson::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 1px;
  background: linear-gradient(
    90deg, 
    transparent 0%, 
    var(--radar-neon-crimson, #EF4444) 50%, 
    transparent 100%
  );
  box-shadow: 0 0 10px var(--radar-neon-crimson, #EF4444);
}

.radar-lightblade-amber::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 1px;
  background: linear-gradient(
    90deg, 
    transparent 0%, 
    var(--radar-neon-amber, #F59E0B) 50%, 
    transparent 100%
  );
  box-shadow: 0 0 10px var(--radar-neon-amber, #F59E0B);
}

/* 6. Specular Sheen Tracker Overlay */
.radar-sheen {
  position: relative;
  overflow: hidden;
}

.radar-sheen::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: radial-gradient(
    600px circle at var(--mouse-x, 50%) var(--mouse-y, 50%),
    rgba(16, 185, 129, 0.12),
    transparent 40%
  );
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.25s ease;
  z-index: 1;
}

.radar-sheen:hover::after {
  opacity: 1;
}