:root {
  color-scheme: light dark;
  --paper: #fafafa;
  --panel: #ffffff;
  --ink: #202020;
  --muted: #626262;
  --line: #dedede;
  --notice: #eeeeee;
  --accent: #0072b2;
  --accent-ink: #ffffff;
  --pass: var(--ink);
  --fail: var(--ink);
  --space-1: .25rem;
  --space-2: .5rem;
  --space-3: .75rem;
  --space-4: 1rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-12: 3rem;
  --text-small: .875rem;
  --text-body: 1rem;
  --text-lead: 1.2rem;
  --text-title: clamp(1.8rem, 4vw, 3rem);
  --radius: .6rem;
  --focus-ring: 3px solid var(--accent);
}
@media (prefers-color-scheme: dark) {
  :root {
    --paper: #171717;
    --panel: #222222;
    --ink: #eeeeee;
    --muted: #b0b0b0;
    --line: #414141;
    --notice: #2c2c2c;
  }
}