:root {
  /* Palette */
  --accent: #7c78a8;
  --blue: #527f9f;
  --deep: #102536;
  --gold: #efc76b;
  --ink: #172f42;
  --line: #d8dee2;
  --muted: #697b89;
  --paper: #f5f4f1;
  --red: #a7483f;
  --violet: #6b668f;

  /* Fonts */
  --font-sans: manrope, arial, sans-serif;
  --font-mono: 'DM Mono', monospace;

  /* Typography Scale */
  --step-display: clamp(56px, 9vw, 126px);
  --step-6: clamp(36px, 5vw, 65px);
  --step-5: clamp(24px, 3vw, 38px);
  --step-4: clamp(22px, 3vw, 36px);
  --step-48: 48px;
  --step-32: 32px;
  --step-30: 30px;
  --step-25: 25px;
  --step-24: 24px;
  --step-22: 22px;
  --step-20: 20px;
  --step-18: 18px;
  --step-17: 17px;
  --step-16: 16px;
  --step-1: 15px;
  --step-14: 14px;
  --step-13: 13px;
  --step-12: 12px;
  --step-0: 11px;
  --step-00: 10px;
  --step-09: 9px;

  /* On-dark palette. These are the values the source actually uses on the
     --ink and --accent surfaces. They are not near-misses of the palette
     above: --muted is a dark-on-light value and is illegible on --ink, and
     --paper is warm where the text over --accent is violet-tinted. Each one
     is the exact hex the legacy stylesheets ship. */
  --ink-muted: #9eb0bb;
  --ink-line: #b8c8d2;
  --ink-code: #c9d5dc;
  --accent-paper: #eceaf5;
  --accent-paper-active: #f0eef8;
  --accent-surface: #5b7098;

  /* Overlays. The percentages are the exact 8-bit alphas the source ships
     (#ffffff24, #ffffff3a, #ffffff40, #ffffff50), not rounded to whole
     numbers — the names are rounded, the values are not. */
  --white-14: rgb(255 255 255 / 14.1176%);
  --white-23: rgb(255 255 255 / 22.7451%);
  --white-25: rgb(255 255 255 / 25.098%);
  --white-31: rgb(255 255 255 / 31.3725%);

  /* Breakpoints */
  --bp-sm: 560px;
  --bp-md: 800px;
  --bp-lg: 1100px;
  --bp-xl: 1600px;
  --bp-2xl: 2200px;
}