/* ══════════════════════════════════════════════════════════════════════
   BRAHMASTRA — TARGET LOCK CURSOR
   A reticle that trails the pointer and locks on to interactive elements.
   The native mouse pointer stays visible underneath — nothing is hidden.
   Load AFTER css/style.css
   ══════════════════════════════════════════════════════════════════════ */

.fx-reticle {
  position: fixed; top: 0; left: 0; z-index: 9998;
  width: 34px; height: 34px; margin: -17px 0 0 -17px;
  pointer-events: none; opacity: 0;
  transform: translate3d(var(--rx, 50vw), var(--ry, 50vh), 0);
  transition: opacity .35s ease, width .22s ease, height .22s ease, margin .22s ease;
  will-change: transform;
}
body:hover .fx-reticle { opacity: .9; }

/* outer ring */
.fx-reticle::before {
  content: ""; position: absolute; inset: 0; border-radius: 50%;
  border: 1px solid rgba(168, 85, 247, .75);
  box-shadow: 0 0 14px rgba(168, 85, 247, .45);
  transition: border-color .25s ease, box-shadow .25s ease;
}

/* centre dot */
.fx-reticle::after {
  content: ""; position: absolute; inset: 45%;
  background: #ec4899; border-radius: 50%;
  box-shadow: 0 0 10px #ec4899;
  transition: background .25s ease, box-shadow .25s ease;
}

/* four crosshair ticks */
.fx-reticle i {
  position: absolute; background: rgba(236, 72, 153, .85);
  transition: background .25s ease;
}
.fx-reticle i:nth-child(1) { left: 50%; top: -9px;    width: 1px; height: 7px; margin-left: -.5px; }
.fx-reticle i:nth-child(2) { left: 50%; bottom: -9px; width: 1px; height: 7px; margin-left: -.5px; }
.fx-reticle i:nth-child(3) { top: 50%; left: -9px;    height: 1px; width: 7px; margin-top: -.5px; }
.fx-reticle i:nth-child(4) { top: 50%; right: -9px;   height: 1px; width: 7px; margin-top: -.5px; }

/* ─── LOCKED-ON STATE ───────────────────────────────────────────────── */
.fx-reticle.fx-lock {
  width: 62px; height: 62px; margin: -31px 0 0 -31px;
}
.fx-reticle.fx-lock::before {
  border: 1px dashed rgba(239, 68, 68, .9);
  box-shadow: 0 0 22px rgba(239, 68, 68, .55);
  animation: fxLockSpin 2.4s linear infinite;
}
.fx-reticle.fx-lock::after {
  background: #ef4444;
  box-shadow: 0 0 12px #ef4444;
}
.fx-reticle.fx-lock i { background: rgba(239, 68, 68, .95); }
@keyframes fxLockSpin { to { transform: rotate(360deg); } }

/* ─── DISABLE WHERE IT DOESN'T BELONG ───────────────────────────────── */
@media (max-width: 720px) { .fx-reticle { display: none; } }
@media (hover: none)      { .fx-reticle { display: none; } }
@media (prefers-reduced-motion: reduce) { .fx-reticle { display: none; } }