/* tokens.css — the custom properties every site reads. No colours: each site brings its own.
   Interface (on :root): --ease, --ease-out, --spring (light spring, 4% overshoot, settles by 60%),
   --dur-s 240ms, --dur-m 600ms, --dur-l 1200ms, --gutter, --z-nav 50, --z-overlay 80, --z-cursor 100,
   --safe-top/right/bottom/left (the phone's safe-area insets, 0 elsewhere). */
:root {
  --ease: cubic-bezier(.22, 1, .36, 1);
  --ease-out: cubic-bezier(.16, 1, .3, 1);
  --spring: linear(0, 0.112 4.2%, 0.340 8.3%, 0.576 12.5%, 0.768 16.7%, 0.903 20.8%, 0.983 25%,
    1.024 29.2%, 1.038 33.3%, 1.036 37.5%, 1.029 41.7%, 1.019 45.8%, 1.011 50%, 1.005 54.2%,
    1.002 58.3%, 0.999 62.5%, 0.999 75%, 1);
  --dur-s: 240ms;
  --dur-m: 600ms;
  --dur-l: 1200ms;
  --gutter: clamp(16px, 4vw, 48px);
  --z-nav: 50;
  --z-overlay: 80;
  --z-cursor: 100;
  --safe-top: env(safe-area-inset-top, 0px);
  --safe-right: env(safe-area-inset-right, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
  --safe-left: env(safe-area-inset-left, 0px);
}
/* Browsers without linear(): fall back to the closest cubic-bezier (slight overshoot). */
@supports not (animation-timing-function: linear(0, 1)) {
  :root { --spring: cubic-bezier(.34, 1.3, .64, 1); }
}