/* ==========================================================================
   Motion tokens — the springs.studio foundation
   ==========================================================================
   Three motions (subtle, standard, emphasized), each with an entrance and a
   derived exit. Exits are faster — 70% of the entrance — and flatter, because
   symmetric motion reads as sluggish on the way out. Call sites reach for a
   PURPOSE (--motion-modal-enter), never a raw duration; the purpose layer is
   aliases, so retargeting a surface is a one-line change here.

   Captured from the springs.studio token generator, verbatim except for the
   --motion-speed multiplier described below:

     https://www.springs.studio/?e=sub*subtle*b.42.0.100.100*140*r70*40&e=std*standard*b.20.0.0.100*200*r70*40&e=emp*emphasized*b.20.0.0.100*280*r70*40&pu=sub.std.std.std.emp.emp.emp

   The binding rules from that source (see planning/01-motion-tokens.md):

     1. Entrances decelerate — fast start, settling into rest.
     2. Exits are faster and flatter than entrances.
     3. Reach for a purpose, not a raw duration.
     4. Duration grows with travel distance, sub-linearly:
        duration * (travel / 160px)^0.5, clamped 0.6x-1.8x. Travel only.
     5. Stagger falls off — per-child offset 40ms as offset * index^0.85.
     6. Always ship the prefers-reduced-motion block (below).

   Rules 4 and 5 are arithmetic, not CSS — they live in js/motion-math.js.
   ========================================================================== */
:root {
  /* Dev tuning multiplier — 1 in production, driven by the ?tune slider
     (Epic 10). >1 is slower (durations stretch), <1 is faster. Every raw
     duration is scaled through it, and the shorthands reference the scaled
     duration vars rather than baking a number in, so one property moves the
     whole system. The reduced-motion block below overrides past it on
     purpose — a literal 1ms must win regardless of the slider position. */
  --motion-speed: 1;

  /* Durations — raw values scaled by the tuning multiplier. */
  --duration-subtle: calc(140ms * var(--motion-speed));
  --duration-subtle-exit: calc(98ms * var(--motion-speed));
  --duration-standard: calc(200ms * var(--motion-speed));
  --duration-standard-exit: calc(140ms * var(--motion-speed));
  --duration-emphasized: calc(280ms * var(--motion-speed));
  --duration-emphasized-exit: calc(196ms * var(--motion-speed));

  /* Easings — verbatim from the export. Entrances decelerate; exits flatten. */
  --ease-subtle-enter: cubic-bezier(0.42, 0, 1, 1);
  --ease-subtle-exit: cubic-bezier(0, 0, 0.58, 1);
  --ease-standard-enter: cubic-bezier(0.2, 0, 0, 1);
  --ease-standard-exit: cubic-bezier(1, 0, 0.8, 1);
  --ease-emphasized-enter: cubic-bezier(0.2, 0, 0, 1);
  --ease-emphasized-exit: cubic-bezier(1, 0, 0.8, 1);

  /* Motion — duration and easing together, ready to drop into a transition
     shorthand. Point at the scaled duration vars so the multiplier carries. */
  --motion-subtle-enter: var(--duration-subtle) var(--ease-subtle-enter);
  --motion-subtle-exit: var(--duration-subtle-exit) var(--ease-subtle-exit);
  --motion-standard-enter: var(--duration-standard) var(--ease-standard-enter);
  --motion-standard-exit: var(--duration-standard-exit) var(--ease-standard-exit);
  --motion-emphasized-enter: var(--duration-emphasized) var(--ease-emphasized-enter);
  --motion-emphasized-exit: var(--duration-emphasized-exit) var(--ease-emphasized-exit);

  /* Purposes — aliases, not copies. Call sites use these. */
  --motion-state-enter: var(--motion-subtle-enter);
  --motion-state-exit: var(--motion-subtle-exit);
  --motion-dropdown-enter: var(--motion-standard-enter);
  --motion-dropdown-exit: var(--motion-standard-exit);
  --motion-tooltip-enter: var(--motion-standard-enter);
  --motion-tooltip-exit: var(--motion-standard-exit);
  --motion-list-enter: var(--motion-standard-enter);
  --motion-list-exit: var(--motion-standard-exit);
  --motion-drawer-enter: var(--motion-emphasized-enter);
  --motion-drawer-exit: var(--motion-emphasized-exit);
  --motion-modal-enter: var(--motion-emphasized-enter);
  --motion-modal-exit: var(--motion-emphasized-exit);
  --motion-toast-enter: var(--motion-emphasized-enter);
  --motion-toast-exit: var(--motion-emphasized-exit);

  /* Stagger — per-child offset when a motion enters as a group. Left literal
     (40ms): JS scales these by speedFactor() so choreography gaps stretch
     with the durations, and applies the index^0.85 falloff. */
  --motion-subtle-stagger: 40ms;
  --motion-standard-stagger: 40ms;
  --motion-emphasized-stagger: 40ms;
  --motion-state-stagger: var(--motion-subtle-stagger);
  --motion-dropdown-stagger: var(--motion-standard-stagger);
  --motion-tooltip-stagger: var(--motion-standard-stagger);
  --motion-list-stagger: var(--motion-standard-stagger);
  --motion-drawer-stagger: var(--motion-emphasized-stagger);
  --motion-modal-stagger: var(--motion-emphasized-stagger);
  --motion-toast-stagger: var(--motion-emphasized-stagger);
}

/*
  Always emitted. Every duration collapses and every curve goes linear, so
  nothing animates for someone who asked it not to. The shorthands are
  overridden directly rather than only the duration variables, because a
  spring's duration is baked into its shorthand.
*/
@media (prefers-reduced-motion: reduce) {
  :root {
    --duration-subtle: 1ms;
    --duration-subtle-exit: 1ms;
    --duration-standard: 1ms;
    --duration-standard-exit: 1ms;
    --duration-emphasized: 1ms;
    --duration-emphasized-exit: 1ms;
    --motion-subtle-enter: 1ms linear;
    --motion-subtle-exit: 1ms linear;
    --motion-standard-enter: 1ms linear;
    --motion-standard-exit: 1ms linear;
    --motion-emphasized-enter: 1ms linear;
    --motion-emphasized-exit: 1ms linear;
    --motion-subtle-stagger: 0ms;
    --motion-standard-stagger: 0ms;
    --motion-emphasized-stagger: 0ms;
  }
}