:root {
  /* Radii — generously rounded; nothing in this system has a sharp corner
     except full-bleed sections and hairline rules. */
  --radius-xs: 6px;
  --radius-sm: 10px;
  --radius-md: 14px;
  --radius-lg: 20px;
  --radius-xl: 28px;
  --radius-2xl: 36px;
  --radius-pill: 999px;
  --radius-circle: 50%;

  /* Borders */
  --border-width: 1px;
  --border-width-strong: 1.5px;
  --hairline: 1px solid var(--border);
  --hairline-subtle: 1px solid var(--border-subtle);

  /* Elevation — soft, warm, wide. Shadows are diffuse and low-opacity so
     cards feel like they are resting on paper, not floating in space. */
  --shadow-xs: 0 1px 2px rgb(var(--shadow-color) / 0.05);
  --shadow-sm: 0 1px 2px rgb(var(--shadow-color) / 0.04), 0 2px 8px rgb(var(--shadow-color) / 0.05);
  --shadow-md: 0 2px 4px rgb(var(--shadow-color) / 0.04), 0 8px 24px rgb(var(--shadow-color) / 0.07);
  --shadow-lg: 0 4px 8px rgb(var(--shadow-color) / 0.05), 0 18px 48px rgb(var(--shadow-color) / 0.1);
  --shadow-inset: inset 0 1px 0 rgb(255 255 255 / 0.6);
  --focus-ring: 0 0 0 3px rgb(59 130 246 / 0.32);
}