/* ═══════════════════════════════════════════
   ANIMATIONS — Keyframes, transitions, micro-interactions
   Decision 4: Ken Burns on splash
   Decision 14: Entry/exit screen transitions
   Decision 16: Micro-interactions pulse + ripple
   Aesthetic rebuild: Enhanced motion system
   ═══════════════════════════════════════════ */

/* ══════════════════════════════════════
   SCREEN TRANSITIONS (Decision 14)
   ══════════════════════════════════════ */

/* Entering screen (Decision 14) — enhanced with scale */
@keyframes screen-enter {
  from {
    opacity: 0;
    transform: translateY(12px) scale(0.99);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

/* Exiting screen (Decision 14) */
@keyframes screen-exit {
  from {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
  to {
    opacity: 0;
    transform: translateY(-8px) scale(0.99);
  }
}

.screen.exiting {
  animation: screen-exit 0.18s ease-in forwards;
  pointer-events: none;
}

/* Splash → Title: slow crossfade (Decision 14) */
.screen-splash-exit {
  animation: screen-exit 0.6s ease-in-out forwards;
}

/* ══════════════════════════════════════
   KEN BURNS — Splash image (Decision 4)
   ══════════════════════════════════════ */

@keyframes ken-burns {
  from {
    transform: scale(1) translate(0, 0);
  }
  to {
    transform: scale(1.06) translate(-0.5%, -1%);
  }
}

/* Applied to the splash image element */
.splash-image.ken-burns-active {
  animation: ken-burns 20s ease-in-out forwards;
  animation-fill-mode: forwards;
}

/* ══════════════════════════════════════
   MICRO-INTERACTIONS (Decision 16)
   ══════════════════════════════════════ */

/* Processing state pulse on decision panel */
@keyframes pulse-dot {
  0%, 100% { opacity: 0.25; }
  50%       { opacity: 0.9; }
}

/* Generic blink */
@keyframes blink {
  0%, 100% { opacity: 1; }
  50%       { opacity: 0.3; }
}

/* Subtle pop for selection feedback */
@keyframes pop-in {
  0%   { transform: scale(0.94); opacity: 0.6; }
  60%  { transform: scale(1.02); }
  100% { transform: scale(1);    opacity: 1; }
}

.pop-in { animation: pop-in 0.2s ease-out; }

/* ══════════════════════════════════════
   ENHANCED AMBIENT ANIMATIONS
   ══════════════════════════════════════ */

/* Ambient glow shift for atmospheric backgrounds */
@keyframes ambient-glow {
  0%, 100% { opacity: 0.03; }
  50%      { opacity: 0.06; }
}

/* Shimmer for highlighted text/stats */
@keyframes shimmer {
  0%   { background-position: -200% center; }
  100% { background-position: 200% center; }
}

/* Floating effect for decorative elements */
@keyframes float-gentle {
  0%, 100% { transform: translateY(0); }
  50%      { transform: translateY(-4px); }
}

/* Ice glow pulse for active states */
@keyframes ice-pulse {
  0%, 100% { box-shadow: 0 0 0 0 transparent; }
  50%      { box-shadow: 0 0 20px color-mix(in srgb, var(--ice) 12%, transparent); }
}

/* ══════════════════════════════════════
   REDUCE MOTION (Decisions 4, 14, 16)
   Respects prefers-reduced-motion
   ══════════════════════════════════════ */

@media (prefers-reduced-motion: reduce) {
  /* Ken Burns — off */
  .splash-image.ken-burns-active {
    animation: none;
  }

  /* Screen transitions — cut directly */
  .screen.active {
    animation: none;
  }

  .screen.exiting {
    animation: none;
    opacity: 0;
  }

  /* Ripple — off */
  .btn-primary::after {
    display: none;
  }

  /* All transitions minimal */
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}