/* ══════════════════════════════════════════════════════════════════════════
   STARKOS — motion tokens
   ══════════════════════════════════════════════════════════════════════════

   Linked by every page. This is the ONLY place a transition duration or an
   easing curve is authored. REPORT-001 counted 18 distinct transition
   durations doing the work of about 3; Timo picked the three.

   WHY A SHARED FILE AND NOT js/theme.js
   theme.js injects no :root and no tokens — it forces dark mode and fixes
   number inputs. Injecting a stylesheet from JS would also mean every
   transition on the page is undefined until that script runs, which is a
   flash of un-eased motion on the slowest devices we support. A <link> is
   render-blocking in the right direction: the tokens exist before first paint.
   bodyfat.html does not load theme.js at all, which settles it.

   USING THEM
     transition: transform var(--t-fast) var(--ease);

   There is no fallback value in the var() calls on purpose. If this file
   fails to load, every transition silently disappears — so it is asserted
   directly: tests/e2e-fonts.mjs checks that --t-fast resolves to a real
   computed value on every page. A guessed fallback would hide that failure
   in the one place it matters.

   WHAT DOES NOT COME FROM HERE
   Keyframe choreography, staged/stepped reveals and the logo intro keep their
   authored durations — they have their own timing story and flattening them
   to 200ms would destroy it. REPORT-006 lists every one by name.
   ══════════════════════════════════════════════════════════════════════════ */

:root {
  /* Press feedback, tints, anything that happens under the finger. Fast enough
     that the change is already done when the finger lifts. */
  --t-fast: 120ms;

  /* The default. Colour, opacity, border — anything the eye follows. */
  --t-base: 200ms;

  /* Anything that moves layout, or moves far. Long enough to be read as a
     movement rather than a jump. */
  --t-slow: 350ms;

  /* The only easing in the product. Fast out of the gate, settles gently —
     the standard material curve, and the one three declarations here had
     already converged on independently. */
  --ease: cubic-bezier(0.4, 0, 0.2, 1);
}

/* Every tokenised transition collapses to instant. Most pages already carry
   their own `transition: none` blocks for this — those still win and are
   untouched. This catches the pages that never had one (signup, login, 404,
   admin) without adding a rule to each, and it cannot break a flow: a 0.01ms
   transition still fires transitionend, where `transition: none` does not.

   Keyframe animations are NOT covered here; they are switched off per page in
   the blocks that already exist. */
@media (prefers-reduced-motion: reduce) {
  :root {
    --t-fast: 0.01ms;
    --t-base: 0.01ms;
    --t-slow: 0.01ms;
  }
}