/* ═══════════════════════════════════════════════════════════════════════════
   @evident-technologies/design-tokens — motion.css
   Institutional Motion Doctrine — additive tokens layer.

   Status: ADDITIVE — does not modify or replace any existing token.
   Adoption: OPT-IN — consumers explicitly import this file to use these tokens.

   Doctrine summary:
     Motion supports orientation, NOT attention extraction.
     Easing is procedural, not playful.
     Durations are calm, not theatrical.
     Reduced-motion is a first-class state, not an afterthought.

   See: docs/MOTION-DOCTRINE.md
   ═══════════════════════════════════════════════════════════════════════════ */

:root {
  /* ── Canonical easing curves ────────────────────────────────────────────
     Two curves cover the institutional surface area.
     Additional curves are drift unless documented and reviewed. */

  /* Standard reveal — content entering, modal opening, panel disclosure.
     Quick approach, soft landing. No overshoot. */
  --ease-standard: cubic-bezier(0.22, 1, 0.36, 1);

  /* Chrome / utility — buttons, inputs, hover affordances, focus rings.
     Material-standard, neutral, predictable. */
  --ease-chrome: cubic-bezier(0.4, 0, 0.2, 1);

  /* Exit / dismissal — modal closing, toast dismissal, item removal.
     Slightly accelerated; user attention is moving on. */
  --ease-exit: cubic-bezier(0.4, 0, 1, 1);

  /* Linear — only for continuous indeterminate motion (spinners, shimmer).
     Never use linear for state transitions. */
  --ease-linear: linear;

  /* ── Canonical durations ────────────────────────────────────────────────
     Four durations cover everything. Anything outside this range is drift. */

  --duration-instant: 80ms; /* Color flicker, focus ring, micro-feedback.         */
  --duration-micro: 120ms; /* Hover state, button press, chip toggle.            */
  --duration-standard: 200ms; /* Default for almost everything.                     */
  --duration-reveal: 320ms; /* Modal open, panel disclosure, drawer.              */
  --duration-deliberate: 480ms; /* Large reveal, page transition. Use sparingly.      */

  /* ── Canonical transition compositions ──────────────────────────────────
     Pre-composed shorthands for the common cases. */

  --transition-chrome: var(--duration-micro) var(--ease-chrome);
  --transition-reveal: var(--duration-standard) var(--ease-standard);
  --transition-modal: var(--duration-reveal) var(--ease-standard);
  --transition-exit: var(--duration-standard) var(--ease-exit);

  /* ── Travel distance tokens ─────────────────────────────────────────────
     Standard offsets for translate-based reveals.
     Restrained — institutional motion does not lurch. */

  --motion-travel-xs: 2px; /* Hover lift, button press. */
  --motion-travel-sm: 4px; /* Tooltip, popover entry.   */
  --motion-travel-md: 8px; /* Panel entry, toast.       */
  --motion-travel-lg: 16px; /* Modal entry.              */

  /* ── Legacy-token convergence bridge ─────────────────────────────────────
     Pre-doctrine ease names silently remapped to doctrine curves on pages
     that opt into this file. Cascades after prior declarations in source
     order. No consumer rewrites required.

     Mapping rationale:
       overshoot/bounce springs → --ease-standard (no overshoot; institutional)
       smooth / decel           → --ease-standard (quick approach, soft land)
       material-standard        → --ease-chrome   (identical curve preserved)
       accelerated / accel      → --ease-exit     (identical semantic preserved) */

  --ease-spring: var(--ease-standard); /* animations.css: overshoot spring        */
  --ease-spring-heavy: var(--ease-standard); /* animations.css: heavy overshoot spring  */
  --ease-spring-bounce: var(--ease-standard); /* animations.css: bounce overshoot spring */
  --ease-smooth: var(--ease-chrome); /* animations.css: smooth / material       */
  --ease-decel: var(--ease-standard); /* animations.css: decelerate              */
  --ease-accel: var(--ease-exit); /* animations.css: accelerate              */
  --ease-out: var(--ease-standard); /* tokens.css: --ease-out keyword alias    */
  --ease-in-out: var(--ease-chrome); /* tokens.css: --ease-in-out alias         */
}

/* ── Reduced-motion override (institutional default) ─────────────────────
   When the user prefers reduced motion, ALL token-driven motion collapses
   to instantaneous transitions. Consumers using these tokens automatically
   inherit accessible behavior — no per-component @media block required. */

@media (prefers-reduced-motion: reduce) {
  :root {
    --duration-instant: 0ms;
    --duration-micro: 0ms;
    --duration-standard: 0ms;
    --duration-reveal: 0ms;
    --duration-deliberate: 0ms;
    --motion-travel-xs: 0px;
    --motion-travel-sm: 0px;
    --motion-travel-md: 0px;
    --motion-travel-lg: 0px;
  }
}
