:root {
  color-scheme: light dark;
  --shell-width: 1180px;
  --content-width: 950px;
  --sidebar-width: 210px;
  --shell-gap: 3rem;
  --shell-pad-x: 1.75rem;
  --bg: #f7f3ea;
  --ink: #191815;
  --muted: #5f574c;
  --line: #cfc4b3;
  --accent: #b7482b;
  --panel: #fffaf0;
  --code-bg: #ebe1d0;
  --pre-bg: #211f1a;
  --pre-ink: #fff8ec;
  font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;

}

html.dark {
  --bg: #15130f;
  --ink: #f5ead7;
  --muted: #c7b9a5;
  --line: #4a3f32;
  --accent: #f08a66;
  --panel: #1f1b15;
  --code-bg: #2c251c;
  --pre-bg: #0c0b09;
  --pre-ink: #fff3dd;
}

html {
  scrollbar-gutter: stable;
}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  background: var(--bg);
  color: var(--ink);
  font-size: 18px;
  line-height: 1.65;
}

a {
  color: var(--accent);
  text-underline-offset: 0.16em;
}

h1,
h2,
h3 {
  line-height: 1.04;
  letter-spacing: -0.045em;
}

h1 {
  max-width: 950px;
  margin: 0 0 2rem;
  font-size: clamp(3.2rem, 8vw, 6.4rem);
}

h2 {
  max-width: 68ch;
  margin: 4rem 0 1rem;
  font-size: clamp(1.7rem, 3vw, 2.55rem);
}

h3 {
  max-width: 68ch;
  margin: 2.6rem 0 0.8rem;
  font-size: clamp(1.25rem, 2vw, 1.7rem);
}

p,
ul,
ol {
  max-width: 68ch;
}

p,
ul,
ol,
blockquote,
pre {
  margin-top: 1.05rem;
  margin-bottom: 1.05rem;
}

li + li {
  margin-top: 0.35rem;
}