:root {
  --space-1: 4px;
  --space-2: 6px;
  --space-3: 8px;
  --space-4: 10px;
  --space-5: 12px;
  --space-6: 16px;
  --space-7: 20px;
  --space-8: 24px;
  --space-9: 28px;
  --space-10: 32px;
  --space-11: 48px;
  --space-12: 56px;

  --radius-xs: 4px;   /* tags, id chips */
  --radius-sm: 6px;   /* tiles */
  --radius-md: 8px;   /* panels, tables */
  --radius-lg: 12px;  /* cards */
  --radius-icon: 22.5%; /* app icon squircle approximation */

  --border-width: 1px;
  /* Website only: fluid spacing on the same two ends */
  --web-space-section: clamp(2.5rem, 1.7857rem + 3.5714vw, 5rem); /* 40 → 80px: padding of a page band */
  --web-space-block: clamp(1.5rem, 1.2143rem + 1.4286vw, 2.5rem); /* 24 → 40px: between groups inside a band */
}
