:root {
  /* Colors — brand & accent */
  --color-primary: #000000;
  --color-on-primary: #ffffff;
  --color-ink: #000000;
  --color-canvas: #ffffff;
  --color-inverse-canvas: #000000;
  --color-inverse-ink: #ffffff;
  --color-on-inverse-soft: #ffffff;
  --color-accent-magenta: #ff3d8b;

  /* Colors — surface & hairlines */
  --color-hairline: #e6e6e6;
  --color-hairline-soft: #f1f1f1;
  --color-surface-soft: #f7f7f5;

  /* Colors — pastel blocks */
  --color-block-lime: #dceeb1;
  --color-block-lilac: #c5b0f4;
  --color-block-cream: #f4ecd6;
  --color-block-pink: #efd4d4;
  --color-block-mint: #c8e6cd;
  --color-block-coral: #f3c9b6;
  --color-block-navy: #1f1d3d;

  /* Colors — semantic */
  --color-success: #1ea64a;
  --color-overlay-scrim: #000000;

  /* Semantic aliases */
  --color-bg: var(--color-canvas);
  --color-text: var(--color-ink);
  --color-link: var(--color-ink);

  /* Font families */
  --font-sans: "figmaSans", "figmaSans Fallback", "SF Pro Display", system-ui, helvetica, sans-serif;
  --font-mono: "figmaMono", "figmaMono Fallback", "SF Mono", menlo, monospace;

  /* Font sizes */
  --font-size-display-xl: 86px;
  --font-size-display-lg: 64px;
  --font-size-headline: 26px;
  --font-size-subhead: 26px;
  --font-size-card-title: 24px;
  --font-size-body-lg: 20px;
  --font-size-body: 18px;
  --font-size-body-sm: 16px;
  --font-size-link: 20px;
  --font-size-button: 20px;
  --font-size-eyebrow: 18px;
  --font-size-caption: 12px;

  /* Font weights */
  --font-weight-body: 320;
  --font-weight-body-sm: 330;
  --font-weight-display: 340;
  --font-weight-link: 480;
  --font-weight-button: 480;
  --font-weight-headline: 540;
  --font-weight-mono: 400;
  --font-weight-bold: 700;

  /* Line heights */
  --line-height-display-xl: 1.00;
  --line-height-display-lg: 1.10;
  --line-height-headline: 1.35;
  --line-height-subhead: 1.35;
  --line-height-card-title: 1.45;
  --line-height-body-lg: 1.40;
  --line-height-body: 1.45;
  --line-height-body-sm: 1.45;
  --line-height-link: 1.40;
  --line-height-button: 1.40;
  --line-height-eyebrow: 1.30;
  --line-height-caption: 1.00;

  /* Letter spacing */
  --letter-spacing-display-xl: -1.72px;
  --letter-spacing-display-lg: -0.96px;
  --letter-spacing-headline: -0.26px;
  --letter-spacing-subhead: -0.26px;
  --letter-spacing-card-title: 0;
  --letter-spacing-body-lg: -0.14px;
  --letter-spacing-body: -0.26px;
  --letter-spacing-body-sm: -0.14px;
  --letter-spacing-link: -0.10px;
  --letter-spacing-button: -0.10px;
  --letter-spacing-eyebrow: 0.54px;
  --letter-spacing-caption: 0.60px;

  /* Radii */
  --radius-xs: 2px;
  --radius-sm: 6px;
  --radius-md: 8px;
  --radius-lg: 24px;
  --radius-xl: 32px;
  --radius-pill: 50px;
  --radius-full: 9999px;

  /* Spacing */
  --space-hair: 1px;
  --space-xxs: 4px;
  --space-xs: 8px;
  --space-sm: 12px;
  --space-md: 16px;
  --space-lg: 24px;
  --space-xl: 32px;
  --space-xxl: 48px;
  --space-section: 96px;

  /* Shadows / elevation */
  --shadow-none: none;
  --shadow-soft: 0 4px 16px rgba(0, 0, 0, 0.06);
  --shadow-modal: 0 12px 48px rgba(0, 0, 0, 0.24);
}