/* Shared design-token scale (radius/spacing/elevation/motion). Only the
 * SCALE is shared here - each page keeps its own color palette in its own
 * :root (see the comments there for why: pages intentionally use different
 * palettes). Load this before the page's own stylesheet. */
:root {
  /* Radius */
  --r-sm: 6px;
  --r: 10px;
  --r-lg: 14px;
  --r-pill: 999px;

  /* Spacing scale */
  --s-1: 4px;
  --s-2: 8px;
  --s-3: 12px;
  --s-4: 16px;
  --s-5: 24px;
  --s-6: 32px;

  /* Elevation */
  --shadow-1: 0 1px 2px rgba(0, 0, 0, .3);
  --shadow-2: 0 8px 28px rgba(0, 0, 0, .45);

  /* Motion */
  --t-fast: 120ms ease;
  --t: 180ms ease;
}