:root {
  /* Color: white canvas, near-black text — color lives in imagery/tags,
     not the UI chrome. */
  --color-bg: #ffffff;
  --color-surface: #ffffff;
  --color-image-bg: #f2f2f2;
  --color-text: #141414;
  --color-text-muted: #6e6e6e;
  --color-text-faint: #bfbfbf;
  --color-backdrop: rgba(110, 110, 110, 0.6);
  --color-tag-bg: #f2f2f2;
  --color-tag-text: #141414;

  /* Type: bold, tight-tracking headlines; plain body text */
  --font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --font-weight-bold: 800;
  --font-size-display: clamp(2rem, 1.4rem + 2.5vw, 3rem);
  --font-size-heading: 1.5rem;
  --font-size-body: 1rem;
  --font-size-small: 0.875rem;
  --line-height-tight: 1.05;
  --line-height-body: 1.55;
  --letter-spacing-tight: -0.02em;

  /* Spacing (4px base scale) */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;

  /* Shape: generous corner radii */
  --radius-sm: 10px;
  --radius-lg: 28px;
  --radius-full: 999px;

  /* Layout */
  --content-max-width: 960px;
}