/* ============================================================
   Rust Truck — Effects: radii, borders, shadows, motion, texture
   Vintage = mostly square corners with a touch of softening,
   warm low-contrast shadows (sun on dust, never cold/blue),
   and slow, settled motion. No bounce.
   ============================================================ */

:root {
  /* Radii — kept small; vintage signage is square-ish */
  --radius-xs:  2px;
  --radius-sm:  4px;
  --radius-md:  6px;
  --radius-lg:  10px;
  --radius-pill:999px;
  --radius-round:50%;

  /* Border widths */
  --border-thin:   1px;
  --border-medium: 2px;
  --border-heavy:  3px;   /* framed labels / ticket edges */

  /* Warm shadows — based on brown ink, never pure black */
  --shadow-xs:  0 1px 2px color-mix(in srgb, var(--ink-900) 10%, transparent);
  --shadow-sm:  0 2px 6px color-mix(in srgb, var(--ink-900) 12%, transparent);
  --shadow-md:  0 6px 18px color-mix(in srgb, var(--ink-900) 14%, transparent);
  --shadow-lg:  0 16px 40px color-mix(in srgb, var(--ink-900) 18%, transparent);
  --shadow-inset:inset 0 1px 2px color-mix(in srgb, var(--ink-900) 14%, transparent);

  /* Focus ring */
  --focus-ring: 0 0 0 3px var(--color-focus-ring);

  /* Motion — settled, no overshoot */
  --ease-out:    cubic-bezier(0.22, 0.61, 0.36, 1); /* @kind other */
  --ease-in-out: cubic-bezier(0.45, 0, 0.2, 1);     /* @kind other */
  --dur-fast:   120ms; /* @kind other */
  --dur-base:   220ms; /* @kind other */
  --dur-slow:   420ms; /* @kind other */

  /* Texture: a faint paper grain usable as a background layer.
     A subtle warm speckle — never dominates content. */
  --grain: radial-gradient(color-mix(in srgb, var(--ink-900) 5%, transparent) 0.5px, transparent 0.6px);
  --grain-size: 4px 4px;
}