/* ============================================================================
   Tokens - Motion
   system/tokens/motion.css

   Durations and easings for transitions. All animations respect
   prefers-reduced-motion via the global rule below.

   Component-level transitions use these tokens; complex keyframe animations
   (LED pulse, particle drift, scramble) live in their respective component
   CSS files.

   See sibling motion.md for usage guidance.
   ============================================================================ */

:root {
  /* Durations */
  --gm-duration-instant: 80ms;    /* press feedback (transform) */
  --gm-duration-fast:    150ms;   /* hover, focus, color change */
  --gm-duration-base:    250ms;   /* default - modal fade, panel slide */
  --gm-duration-slow:    400ms;   /* slower reveals, layout shifts */

  /* Easings */
  --gm-ease-out:    cubic-bezier(0.16, 1, 0.3, 1);    /* default - natural deceleration */
  --gm-ease-in:     cubic-bezier(0.7, 0, 0.84, 0);    /* exiting elements */
  --gm-ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);   /* symmetric transitions */
  --gm-ease-linear: linear;                            /* progress bars, spinners */
}

/* ----------------------------------------------------------------------
   Reduced motion - global override
   Components do NOT need to gate their own transitions. This rule kills
   all animation/transition durations across the .gm scope.
   ---------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  .gm *,
  .gm *::before,
  .gm *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}