/* ============================================================
   effects.css
   Atmospheric effects — CRT scanlines, vignette, animations.
   These are purely decorative. Disable by not loading this file.
   ============================================================ */

/* ── CRT SCANLINES ───────────────────────────────────────── */
body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  background: repeating-linear-gradient(
    to bottom,
    rgba(0, 0, 0, 0) 0px,
    rgba(0, 0, 0, 0) 2px,
    rgba(0, 0, 0, 0.15) 3px,
    rgba(0, 0, 0, 0) 4px
  );
  z-index: 100;
  mix-blend-mode: multiply;
}

/* ── VIGNETTE ────────────────────────────────────────────── */
body::after {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  background: radial-gradient(
    ellipse at center,
    rgba(0, 0, 0, 0) 40%,
    rgba(0, 0, 0, 0.55) 100%
  );
  z-index: 101;
}

/* ── BLINKING CURSOR / INDICATOR ─────────────────────────── */
.blink {
  color: var(--color-amber);
  animation: blink 1.2s steps(2) infinite;
}

@keyframes blink {
  50% { opacity: 0; }
}

/* ── BOOT-IN ANIMATION ───────────────────────────────────── */
.wrap > * {
  opacity: 0;
  animation: bootIn 0.5s ease forwards;
}

.wrap > *:nth-child(1) { animation-delay: 0.05s; }
.wrap > *:nth-child(2) { animation-delay: 0.20s; }
.wrap > *:nth-child(3) { animation-delay: 0.35s; }
.wrap > *:nth-child(4) { animation-delay: 0.50s; }
.wrap > *:nth-child(5) { animation-delay: 0.65s; }

@keyframes bootIn {
  from {
    opacity: 0;
    transform: translateY(4px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* ── REDUCED MOTION — respect user preference ────────────── */
@media (prefers-reduced-motion: reduce) {
  .wrap > *,
  .blink {
    animation: none;
    opacity: 1;
  }
}