:root {
  color-scheme: light dark;
  --bg: light-dark(#f2f2ef, #1b1c1a);
  --surface: light-dark(#fafaf7, #222320);
  --ink: light-dark(#20211f, #f1f1eb);
  --muted: light-dark(#73756e, #a8aaa1);
  --line: light-dark(#d3d4cd, #3d3e39);

  --letter-spacing: -0.05em;

  --border: 1px solid var(--line);
  --border-radius: 18px;

  --body-max: 50rem;
}

body {
    background-color: var(--bg);
    color: var(--ink);
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    max-width: var(--body-max);
    margin: 0 auto;
}

h1, p, a {
    letter-spacing: var(--letter-spacing);
}

h1 {
    font-size: clamp(32px, 4vw, 48px);
}

a {
    color: var(--muted);
}

ul {
    border: var(--border);
    border-radius: var(--border-radius);
    background-color: var(--surface);
    padding: 2rem 3rem 1.75rem;
}

li {
    margin-bottom: 0.5rem;
}