/* ── Cursor Blink ─────────────────────────────────────────────── */
@keyframes cursorBlink {
  0%, 100% { opacity: 1; }
  50% { opacity: 0; }
}

/* ── Fade In ──────────────────────────────────────────────────── */
@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

/* ── Slide Up ─────────────────────────────────────────────────── */
@keyframes slideUp {
  from { opacity: 0; transform: translateY(12px); }
  to { opacity: 1; transform: translateY(0); }
}

/* ── Button Flash ─────────────────────────────────────────────── */
@keyframes btnFlash {
  0% { opacity: 1; }
  50% { opacity: 0.5; }
  100% { opacity: 1; }
}

/* ── Flicker ──────────────────────────────────────────────────── */
@keyframes screenFlicker {
  0%  { opacity: 0; }
  10% { opacity: 0.04; }
  11% { opacity: 0; }
  20% { opacity: 0.03; }
  21% { opacity: 0; }
  100% { opacity: 0; }
}

/* ── Glow Pulse ───────────────────────────────────────────────── */
@keyframes glowPulse {
  0%, 100% { text-shadow: 0 0 6px #00FF41; }
  50% { text-shadow: 0 0 14px #00FF41, 0 0 28px rgba(0,255,65,0.4); }
}

/* ── XP Pop ───────────────────────────────────────────────────── */
@keyframes xpPop {
  0%   { transform: scale(0.8) translateY(0); opacity: 0; }
  30%  { transform: scale(1.3) translateY(-8px); opacity: 1; }
  60%  { transform: scale(1.1) translateY(-4px); opacity: 1; }
  100% { transform: scale(1) translateY(-20px); opacity: 0; }
}

/* ── Boot Line Reveal ─────────────────────────────────────────── */
@keyframes bootLineReveal {
  from { opacity: 0; transform: translateX(-4px); }
  to   { opacity: 1; transform: translateX(0); }
}

/* ── Terminal Typing ──────────────────────────────────────────── */
@keyframes typeIn {
  from { max-width: 0; }
  to   { max-width: 100%; }
}

/* ── Page Entry ───────────────────────────────────────────────── */
@keyframes pageEntry {
  from { opacity: 0; }
  to   { opacity: 1; }
}

/* ── Card Hover Glow ──────────────────────────────────────────── */
@keyframes cardGlow {
  from { box-shadow: none; }
  to   { box-shadow: 0 0 6px rgba(0,255,65,0.4); }
}

/* ── Shake (wrong answer) ─────────────────────────────────────── */
@keyframes shake {
  0%, 100% { transform: translateX(0); }
  20% { transform: translateX(-6px); }
  40% { transform: translateX(6px); }
  60% { transform: translateX(-4px); }
  80% { transform: translateX(4px); }
}

/* ── Applied Classes ──────────────────────────────────────────── */
.anim-page-entry {
  animation: pageEntry 0.3s ease forwards;
}

.anim-slide-up {
  animation: slideUp 0.3s ease forwards;
}

.anim-glow-pulse {
  animation: glowPulse 2.5s ease-in-out infinite;
}

.anim-shake {
  animation: shake 0.3s ease;
}

/* ── Screen Flicker Applied ───────────────────────────────────── */
#flicker-overlay.active {
  animation: screenFlicker 0.4s linear;
}

/* ── Hero Staggered Reveal ────────────────────────────────────── */
.hero-eyebrow  { animation: slideUp 0.4s ease 0.1s both; }
.hero-title    { animation: slideUp 0.4s ease 0.25s both; }
.hero-subtitle { animation: slideUp 0.4s ease 0.4s both; }
.hero-cta      { animation: slideUp 0.4s ease 0.55s both; }

/* ── XP Float ─────────────────────────────────────────────────── */
.xp-float {
  position: fixed;
  font-family: var(--font-display);
  font-size: 24px;
  color: var(--amber);
  text-shadow: var(--glow-amber);
  pointer-events: none;
  z-index: 999;
  animation: xpPop 1.2s ease forwards;
}

/* ── Module Label Animation ───────────────────────────────────── */
.module-header {
  animation: slideUp 0.3s ease forwards;
}