:root {
  /* palette */
  --color-neutral-700: #414141;
  --color-neutral-900: #121212;
  --color-neutral-50-1: #ffffff;
  --color-neutral-500: #717171;
  --color-neutral-400: #989898;
  --color-neutral-800: #222222;
  --color-neutral-950: #000000;
  --color-neutral-50-2: #f8f8f8;

  /* surfaces */
  --surface-0: #ffffff;
  --surface-1: #989898;
  --surface-2: #717171;
  --surface-3: #414141;
  --surface-4: #222222;

  /* type scale */
  --text-h3: 38px;
  --leading-h3: 1.21;
  --tracking-h3: -1px;
  --text-body: 16px;
  --leading-body: 1.63;
  --tracking-body: nullpx;
  --text-link: 16px;
  --leading-link: 1.63;
  --tracking-link: nullpx;
  --text-h4: 14px;
  --leading-h4: 1;
  --tracking-h4: -0.2px;
  --text-ui-action: 14px;
  --leading-ui-action: 1.29;
  --tracking-ui-action: -0.2px;

  /* font families */
  --font-goudy-old-style: "goudy-old-style", ui-sans-serif, system-ui, sans-serif;
  --font-times-new-roman: "Times New Roman", ui-sans-serif, system-ui, sans-serif;
  --font-akzidenz-grotesk-pro: "akzidenz-grotesk-pro", ui-sans-serif, system-ui, sans-serif;

  /* radii */
  --radius-none: 0;

  /* spacing */
  --spacing-base: 2px;
}