@property --h {
  syntax: '<number>';
  inherits: true;
  initial-value: 250;
}
@property --h2 {
  syntax: '<number>';
  inherits: true;
  initial-value: 285;
}
@property --h3 {
  syntax: '<number>';
  inherits: true;
  initial-value: 205;
}
@property --k {
  syntax: '<number>';
  inherits: true;
  initial-value: 1;
}
@property --kw {
  syntax: '<number>';
  inherits: true;
  initial-value: 1;
}
@property --kb {
  syntax: '<number>';
  inherits: true;
  initial-value: 1;
}
:root {
  --bg: #eff6fd;
  --lobe-1: #dadbfb;
  --lobe-2: #bde7ec;
  --lobe-3: #d4e7fb;
  --lobe-1-clear: rgba(218, 219, 251, 0);
  --lobe-2-clear: rgba(189, 231, 236, 0);
  --lobe-3-clear: rgba(212, 231, 251, 0);
  --surface: #fafcfe;
  --surface-2: #e8f1fb;
  --text: #1a222b;
  --text-muted: #495766;
  --text-faint: #657383;
  --accent: #3e668f;
  --accent-ui: #4875a3;
  --accent-strong: #2e5072;
  --accent-soft: #d9eafc;
  --fill: rgba(72, 117, 163, 0.12);
  --fill-2: rgba(72, 117, 163, 0.08);
  --fill-strong: rgba(72, 117, 163, 0.18);
  --grid: rgba(26, 34, 43, 0.08);
  --line: #c7d2de;
  --line-strong: #6e8398;
  --selection: #bddbfb;
  --danger: #963d3a;
}
@media (prefers-color-scheme: dark) {
  :root:where(:not([data-scheme='light'])) {
    --bg: #090e12;
    --lobe-1: #252437;
    --lobe-2: #0f2b2e;
    --lobe-3: #18232e;
    --lobe-1-clear: rgba(37, 36, 55, 0);
    --lobe-2-clear: rgba(15, 43, 46, 0);
    --lobe-3-clear: rgba(24, 35, 46, 0);
    --surface: #13161a;
    --surface-2: #1b2127;
    --text: #e3e8ee;
    --text-muted: #9ba6b1;
    --text-faint: #7b8895;
    --accent: #8bbcef;
    --accent-ui: #73a9e1;
    --accent-strong: #97c2f0;
    --accent-soft: #1e2f41;
    --fill: rgba(115, 169, 225, 0.18);
    --fill-2: rgba(115, 169, 225, 0.12);
    --fill-strong: rgba(115, 169, 225, 0.26);
    --grid: rgba(227, 232, 238, 0.12);
    --line: #2b343d;
    --line-strong: #63778c;
    --selection: #284561;
    --danger: #e6857e;
  }
}
:root:where([data-scheme='dark']) {
  --bg: #090e12;
  --lobe-1: #252437;
  --lobe-2: #0f2b2e;
  --lobe-3: #18232e;
  --lobe-1-clear: rgba(37, 36, 55, 0);
  --lobe-2-clear: rgba(15, 43, 46, 0);
  --lobe-3-clear: rgba(24, 35, 46, 0);
  --surface: #13161a;
  --surface-2: #1b2127;
  --text: #e3e8ee;
  --text-muted: #9ba6b1;
  --text-faint: #7b8895;
  --accent: #8bbcef;
  --accent-ui: #73a9e1;
  --accent-strong: #97c2f0;
  --accent-soft: #1e2f41;
  --fill: rgba(115, 169, 225, 0.18);
  --fill-2: rgba(115, 169, 225, 0.12);
  --fill-strong: rgba(115, 169, 225, 0.26);
  --grid: rgba(227, 232, 238, 0.12);
  --line: #2b343d;
  --line-strong: #63778c;
  --selection: #284561;
  --danger: #e6857e;
}
@supports (color: oklch(0 0 0)) {
  :root,
  .pf-scope {
    --k: 1;
    --bg: oklch(0.97 calc(0.012 * var(--k) * var(--kw)) var(--h));
    --lobe-1: oklch(0.90 calc(0.044 * var(--k) * var(--kw) * var(--kb)) var(--h2));
    --lobe-2: oklch(0.90 calc(0.044 * var(--k) * var(--kw) * var(--kb)) var(--h3));
    --lobe-3: oklch(0.92 calc(0.034 * var(--k) * var(--kw) * var(--kb)) var(--h));
    --lobe-1-clear: oklch(0.90 calc(0.044 * var(--k) * var(--kw) * var(--kb)) var(--h2) / 0);
    --lobe-2-clear: oklch(0.90 calc(0.044 * var(--k) * var(--kw) * var(--kb)) var(--h3) / 0);
    --lobe-3-clear: oklch(0.92 calc(0.034 * var(--k) * var(--kw) * var(--kb)) var(--h) / 0);
    --surface: oklch(0.99 calc(0.004 * var(--k)) var(--h));
    --surface-2: oklch(0.955 calc(0.016 * var(--k)) var(--h));
    --text: oklch(0.25 calc(0.02 * var(--k)) var(--h));
    --text-muted: oklch(0.45 calc(0.03 * var(--k)) var(--h));
    --text-faint: oklch(0.55 calc(0.03 * var(--k)) var(--h));
    --accent: oklch(0.50 calc(0.08 * var(--k)) var(--h));
    --accent-ui: oklch(0.55 calc(0.088 * var(--k)) var(--h));
    --accent-strong: oklch(0.42 calc(0.07 * var(--k)) var(--h));
    --accent-soft: oklch(0.93 calc(0.03 * var(--k)) var(--h));
    --fill: oklch(0.55 calc(0.088 * var(--k)) var(--h) / 0.12);
    --fill-2: oklch(0.55 calc(0.088 * var(--k)) var(--h) / 0.08);
    --fill-strong: oklch(0.55 calc(0.088 * var(--k)) var(--h) / 0.18);
    --grid: oklch(0.25 calc(0.02 * var(--k)) var(--h) / 0.08);
    --line: oklch(0.86 calc(0.02 * var(--k)) var(--h));
    --line-strong: oklch(0.60 calc(0.04 * var(--k)) var(--h));
    --selection: oklch(0.88 calc(0.055 * var(--k)) var(--h));
    --danger: oklch(0.48 0.12 25);
  }
}
@supports (color: oklch(0 0 0)) {
  @media (prefers-color-scheme: dark) {
    :root:where(:not([data-scheme='light'])) {
      --bg: oklch(0.16 calc(0.012 * var(--k) * var(--kw)) var(--h));
      --lobe-1: oklch(0.27 calc(0.034 * var(--k) * var(--kw) * var(--kb)) var(--h2));
      --lobe-2: oklch(0.27 calc(0.034 * var(--k) * var(--kw) * var(--kb)) var(--h3));
      --lobe-3: oklch(0.25 calc(0.026 * var(--k) * var(--kw) * var(--kb)) var(--h));
      --lobe-1-clear: oklch(0.27 calc(0.034 * var(--k) * var(--kw) * var(--kb)) var(--h2) / 0);
      --lobe-2-clear: oklch(0.27 calc(0.034 * var(--k) * var(--kw) * var(--kb)) var(--h3) / 0);
      --lobe-3-clear: oklch(0.25 calc(0.026 * var(--k) * var(--kw) * var(--kb)) var(--h) / 0);
      --surface: oklch(0.20 calc(0.008 * var(--k)) var(--h));
      --surface-2: oklch(0.245 calc(0.014 * var(--k)) var(--h));
      --text: oklch(0.93 calc(0.01 * var(--k)) var(--h));
      --text-muted: oklch(0.72 calc(0.02 * var(--k)) var(--h));
      --text-faint: oklch(0.62 calc(0.025 * var(--k)) var(--h));
      --accent: oklch(0.78 calc(0.09 * var(--k)) var(--h));
      --accent-ui: oklch(0.72 calc(0.10 * var(--k)) var(--h));
      --accent-strong: oklch(0.80 calc(0.08 * var(--k)) var(--h));
      --accent-soft: oklch(0.30 calc(0.04 * var(--k)) var(--h));
      --fill: oklch(0.72 calc(0.10 * var(--k)) var(--h) / 0.18);
      --fill-2: oklch(0.72 calc(0.10 * var(--k)) var(--h) / 0.12);
      --fill-strong: oklch(0.72 calc(0.10 * var(--k)) var(--h) / 0.26);
      --grid: oklch(0.93 calc(0.01 * var(--k)) var(--h) / 0.12);
      --line: oklch(0.32 calc(0.02 * var(--k)) var(--h));
      --line-strong: oklch(0.56 calc(0.04 * var(--k)) var(--h));
      --selection: oklch(0.38 calc(0.06 * var(--k)) var(--h));
      --danger: oklch(0.72 0.12 25);
    }
  }
  :root:where([data-scheme='dark']) {
    --bg: oklch(0.16 calc(0.012 * var(--k) * var(--kw)) var(--h));
    --lobe-1: oklch(0.27 calc(0.034 * var(--k) * var(--kw) * var(--kb)) var(--h2));
    --lobe-2: oklch(0.27 calc(0.034 * var(--k) * var(--kw) * var(--kb)) var(--h3));
    --lobe-3: oklch(0.25 calc(0.026 * var(--k) * var(--kw) * var(--kb)) var(--h));
    --lobe-1-clear: oklch(0.27 calc(0.034 * var(--k) * var(--kw) * var(--kb)) var(--h2) / 0);
    --lobe-2-clear: oklch(0.27 calc(0.034 * var(--k) * var(--kw) * var(--kb)) var(--h3) / 0);
    --lobe-3-clear: oklch(0.25 calc(0.026 * var(--k) * var(--kw) * var(--kb)) var(--h) / 0);
    --surface: oklch(0.20 calc(0.008 * var(--k)) var(--h));
    --surface-2: oklch(0.245 calc(0.014 * var(--k)) var(--h));
    --text: oklch(0.93 calc(0.01 * var(--k)) var(--h));
    --text-muted: oklch(0.72 calc(0.02 * var(--k)) var(--h));
    --text-faint: oklch(0.62 calc(0.025 * var(--k)) var(--h));
    --accent: oklch(0.78 calc(0.09 * var(--k)) var(--h));
    --accent-ui: oklch(0.72 calc(0.10 * var(--k)) var(--h));
    --accent-strong: oklch(0.80 calc(0.08 * var(--k)) var(--h));
    --accent-soft: oklch(0.30 calc(0.04 * var(--k)) var(--h));
    --fill: oklch(0.72 calc(0.10 * var(--k)) var(--h) / 0.18);
    --fill-2: oklch(0.72 calc(0.10 * var(--k)) var(--h) / 0.12);
    --fill-strong: oklch(0.72 calc(0.10 * var(--k)) var(--h) / 0.26);
    --grid: oklch(0.93 calc(0.01 * var(--k)) var(--h) / 0.12);
    --line: oklch(0.32 calc(0.02 * var(--k)) var(--h));
    --line-strong: oklch(0.56 calc(0.04 * var(--k)) var(--h));
    --selection: oklch(0.38 calc(0.06 * var(--k)) var(--h));
    --danger: oklch(0.72 0.12 25);
  }
}
:root {
  --press-paper: #f6efe3;
  --press-ink: #1e1a15;
  --press-ink-2: #48413a;
  --press-rule: rgba(30, 26, 21, 0.3);
  --press-grain: rgba(30, 26, 21, 0.04);
}
@supports (color: oklch(0 0 0)) {
  :root {
    --press-paper: oklch(0.955 0.018 85);
    --press-ink: oklch(0.22 0.012 70);
    --press-ink-2: oklch(0.38 0.015 70);
    --press-rule: oklch(0.22 0.012 70 / 0.3);
    --press-grain: oklch(0.22 0.012 70 / 0.04);
  }
}
.pf-scope {
  --k: 1;
  --kb: 1;
  color-scheme: light;
}
:root {
  --font-sans: 'Geist', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-serif: 'Instrument Serif', ui-serif, Georgia, 'Times New Roman', serif;
  --font-mono: 'Geist Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  --fs-0: 11.5px;
  --fs-1: 12.5px;
  --fs-2: 14px;
  --fs-3: 15.5px;
  --fs-4: 18px;
  --fs-5: 22px;
  --fs-6: 28px;
  --fs-7: clamp(36px, 3.2vw + 24px, 48px);
  --fs-8: clamp(44px, 4.4vw + 28px, 64px);
  --track-tight: -0.02em;
  --track-open: 0.01em;
  --lh-tight: 1.08;
  --lh-snug: 1.3;
  --lh-body: 1.55;
  --measure: 62ch;
  --s1: 4px;
  --s2: 8px;
  --s3: 12px;
  --s4: 16px;
  --s5: 24px;
  --s6: 32px;
  --s7: 48px;
  --s8: 64px;
  --s9: 96px;
  --r-s: 6px;
  --r-m: 10px;
  --r-l: 16px;
  --d-fast: 150ms;
  --d-base: 250ms;
  --d-slow: 400ms;
  --d-screen: 500ms;
  --ease: cubic-bezier(0.2, 0.8, 0.2, 1);
  --hair: 1px;
  --wrap: 1200px;
  --col: 560px;
}
html {
  background: #f2f3f6;
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  html:where(:not([data-scheme='light'])) {
    background: #0c0d0f;
    color-scheme: dark;
  }
}
html:where([data-scheme='dark']) {
  background: #0c0d0f;
  color-scheme: dark;
}
body {
  background: transparent;
}
.ambient {
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  contain: strict;
  background-color: var(--bg);
  background-image:
    radial-gradient(60% 55% at 15% 20%, var(--lobe-1) 0%, var(--lobe-1-clear) 60%),
    radial-gradient(55% 50% at 85% 10%, var(--lobe-2) 0%, var(--lobe-2-clear) 60%),
    radial-gradient(70% 45% at 50% 105%, var(--lobe-3) 0%, var(--lobe-3-clear) 60%);
}
@media (prefers-contrast: more) {
  .ambient {
    background-image: none;
  }
  @supports (color: oklch(0 0 0)) {
    :root,
    .pf-scope {
      --text: oklch(0.15 calc(0.02 * var(--k)) var(--h));
      --text-muted: oklch(0.35 calc(0.03 * var(--k)) var(--h));
      --accent-ui: oklch(0.45 calc(0.09 * var(--k)) var(--h));
      --line: oklch(0.70 calc(0.02 * var(--k)) var(--h));
      --grid: oklch(0.25 calc(0.02 * var(--k)) var(--h) / 0.2);
    }
    @media (prefers-color-scheme: dark) {
      :root:where(:not([data-scheme='light'])) {
        --text: oklch(0.97 calc(0.01 * var(--k)) var(--h));
        --text-muted: oklch(0.82 calc(0.02 * var(--k)) var(--h));
        --accent-ui: oklch(0.80 calc(0.09 * var(--k)) var(--h));
        --line: oklch(0.48 calc(0.02 * var(--k)) var(--h));
        --grid: oklch(0.93 calc(0.01 * var(--k)) var(--h) / 0.3);
      }
    }
    :root:where([data-scheme='dark']) {
      --text: oklch(0.97 calc(0.01 * var(--k)) var(--h));
      --text-muted: oklch(0.82 calc(0.02 * var(--k)) var(--h));
      --accent-ui: oklch(0.80 calc(0.09 * var(--k)) var(--h));
      --line: oklch(0.48 calc(0.02 * var(--k)) var(--h));
      --grid: oklch(0.93 calc(0.01 * var(--k)) var(--h) / 0.3);
    }
  }
}
@media (forced-colors: active) {
  .ambient {
    display: none;
  }
  :root,
  .pf-scope {
    --bg: Canvas;
    --lobe-1: Canvas;
    --lobe-2: Canvas;
    --lobe-3: Canvas;
    --lobe-1-clear: transparent;
    --lobe-2-clear: transparent;
    --lobe-3-clear: transparent;
    --surface: Canvas;
    --surface-2: Canvas;
    --text: CanvasText;
    --text-muted: CanvasText;
    --text-faint: GrayText;
    --accent: LinkText;
    --accent-ui: LinkText;
    --accent-strong: Highlight;
    --accent-soft: Canvas;
    --fill: transparent;
    --fill-2: transparent;
    --fill-strong: transparent;
    --grid: CanvasText;
    --line: CanvasText;
    --line-strong: CanvasText;
    --selection: Highlight;
    --danger: CanvasText;
    --press-paper: Canvas;
    --press-ink: CanvasText;
    --press-ink-2: CanvasText;
    --press-rule: CanvasText;
    --press-grain: transparent;
  }
}
:root[data-atmo='off'] {
  --k: 0;
}
*,
*::before,
*::after {
  box-sizing: border-box;
}
* {
  margin: 0;
}
img,
picture,
video,
canvas {
  display: block;
  max-width: 100%;
}
body {
  font: 400 var(--fs-3) / var(--lh-body) var(--font-sans);
  color: var(--text);
  -webkit-font-smoothing: antialiased;
}
::selection {
  background: var(--selection);
}
a {
  color: var(--accent);
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-color: var(--line-strong);
  transition: text-decoration-color var(--d-fast) var(--ease);
}
a:hover {
  text-decoration-color: currentColor;
}
button {
  font: inherit;
  color: inherit;
  background: none;
  border: 0;
  cursor: pointer;
}
:focus-visible {
  outline: 2px solid var(--accent-ui);
  outline-offset: 2px;
}
.serif {
  font-family: var(--font-serif);
  font-weight: 400;
  letter-spacing: var(--track-tight);
  line-height: var(--lh-tight);
}
.kicker {
  font-size: var(--fs-1);
  color: var(--text-muted);
  letter-spacing: var(--track-open);
}
.numeral {
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
}
.btn {
  display: inline-flex;
  align-items: center;
  gap: var(--s2);
  padding: 8px 14px;
  border: 1px solid var(--line);
  border-radius: var(--r-m);
  color: var(--text);
  transition:
    color var(--d-fast) var(--ease),
    border-color var(--d-fast) var(--ease),
    background-color var(--d-fast) var(--ease);
}
.btn:hover {
  border-color: var(--line-strong);
}
.btn[disabled],
.btn[aria-disabled='true'] {
  color: var(--text-faint);
  cursor: default;
}
.btn-primary {
  background: var(--accent-strong);
  color: var(--surface);
  border-color: transparent;
}
.btn-primary:hover {
  background: var(--accent);
  border-color: transparent;
}
.btn-quiet,
.btn-quiet:hover {
  border-color: transparent;
}
.btn-quiet {
  color: var(--text-muted);
}
.btn-quiet:hover {
  color: var(--text);
}
.btn-sm {
  padding: 4px 10px;
  font-size: var(--fs-1);
}
.field {
  width: 100%;
  padding: 10px 0;
  background: transparent;
  border: 0;
  border-bottom: 1px solid var(--line-strong);
  color: var(--text);
  font: inherit;
  transition: border-color var(--d-fast) var(--ease);
}
.field::placeholder {
  color: var(--text-faint);
}
.field:focus {
  outline: none;
  border-bottom-color: var(--accent-ui);
}
textarea.field {
  resize: none;
}
.chip {
  display: inline-flex;
  align-items: center;
  padding: 2px 10px;
  border-radius: 999px;
  background: var(--surface-2);
  font-size: var(--fs-1);
  color: var(--text-muted);
}
.panel {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--r-l);
}
.hairline {
  border-top: 1px solid var(--line);
}
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.scroll {
  scrollbar-width: thin;
  scrollbar-color: var(--line) transparent;
}
.wrap {
  max-width: var(--wrap);
  margin-inline: auto;
  padding-inline: var(--s5);
}
.app-view {
  position: relative;
  z-index: 1;
  min-height: 100vh;
  min-height: 100dvh;
}
.atmo {
  position: relative;
}
.atmo-btn {
  font-size: var(--fs-1);
  color: var(--text);
}
.atmo-state {
  color: var(--text-muted);
  transition: color var(--d-fast) var(--ease);
}
.atmo-btn:hover .atmo-state {
  color: var(--text);
}
.atmo-menu {
  position: absolute;
  right: 0;
  top: calc(100% + 6px);
  width: max-content;
  min-width: 200px;
  max-width: min(320px, calc(100vw - 2 * var(--s4)));
  padding: var(--s2);
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--r-m);
  z-index: 50;
}
.atmo-item {
  display: grid;
  gap: 2px;
  width: 100%;
  padding: 8px 10px;
  border-radius: var(--r-s);
  font-size: var(--fs-2);
  color: var(--text-muted);
  text-align: left;
  transition:
    color var(--d-fast) var(--ease),
    background-color var(--d-fast) var(--ease);
}
.atmo-item[aria-checked='true'] {
  color: var(--text);
}
.atmo-item:hover {
  background: var(--surface-2);
}
.atmo-hint {
  font-size: var(--fs-0);
  line-height: var(--lh-snug);
  color: var(--text-muted);
}
.atmo-group {
  display: grid;
  gap: 2px;
}
.atmo-sep {
  height: 1px;
  margin: var(--s2) 0;
  background: var(--line);
}
.atmo-group-label {
  padding: 2px 10px 4px;
}
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
  }
}
.site {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  min-height: 100dvh;
}
.skip {
  position: absolute;
  top: var(--s3);
  left: var(--s4);
  z-index: 10;
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 0 var(--s4);
  background: var(--surface);
  border: 1px solid var(--line-strong);
  border-radius: var(--r-m);
  color: var(--text);
  transform: translateY(-300%);
}
.skip:focus {
  transform: translateY(0);
}
.site-header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--s1) var(--s5);
  width: 100%;
  max-width: var(--wrap);
  margin-inline: auto;
  padding: var(--s3) var(--s5);
}
.site-brand {
  display: inline-flex;
  align-items: center;
  gap: var(--s2);
  min-height: 44px;
  color: var(--text);
  text-decoration: none;
}
.site-brand-word {
  font-size: var(--fs-5);
}
.mark-ring {
  fill: none;
  stroke: var(--accent-ui);
  stroke-width: 1.25;
}
.mark-dot {
  fill: var(--text);
}
.site-nav ul,
.site-footer ul,
.crumbs ol,
.related-grid {
  padding: 0;
  list-style: none;
}
.site-nav ul {
  display: flex;
  flex-wrap: wrap;
  gap: 0 var(--s1);
}
.site-nav a,
.site-footer a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  font-size: var(--fs-2);
  text-decoration: none;
}
.site-nav a {
  padding: 0 var(--s3);
  border-radius: var(--r-m);
  color: var(--text-muted);
}
.site-nav a:hover,
.site-nav a[aria-current='page'] {
  background: var(--surface-2);
  color: var(--text);
}
.site-main {
  flex: 1 0 auto;
  width: 100%;
  max-width: var(--wrap);
  margin-inline: auto;
  padding-inline: var(--s5);
}
.site-main:focus {
  outline: none;
}
.column {
  max-width: 68ch;
  margin-inline: auto;
  padding-bottom: var(--s8);
  font-size: var(--fs-4);
  line-height: var(--lh-body);
}
.crumbs {
  padding-top: var(--s3);
  font-size: var(--fs-2);
  color: var(--text-muted);
}
.crumbs ol {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}
.crumbs li + li::before {
  content: '/';
  padding-inline: var(--s2);
  color: var(--line-strong);
}
.crumbs a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
}
.doc-head {
  padding-top: var(--s5);
}
.doc-head h1 {
  font-size: var(--fs-7);
  text-wrap: balance;
}
.lede {
  margin-top: var(--s4);
  font-size: var(--fs-5);
  line-height: var(--lh-snug);
  color: var(--text-muted);
  text-wrap: pretty;
}
.doc-cta {
  margin-top: var(--s5);
}
.site .btn {
  min-height: 44px;
  text-decoration: none;
}
.prose p,
.prose ul,
.prose ol {
  margin-top: var(--s4);
}
.prose ul,
.prose ol {
  padding-left: 1.4em;
}
.prose li + li {
  margin-top: var(--s2);
}
.prose h2,
.related h2 {
  margin-top: var(--s8);
  font-size: var(--fs-6);
  font-weight: 500;
  line-height: var(--lh-snug);
  letter-spacing: var(--track-tight);
}
.prose h2 + p,
.prose h2 + ul,
.prose h2 + ol {
  margin-top: var(--s3);
}
.prose h3 {
  margin-top: var(--s5);
  font-size: var(--fs-4);
  font-weight: 600;
  line-height: var(--lh-snug);
}
.prose h3 + p {
  margin-top: var(--s2);
}
.prose strong {
  font-weight: 600;
}
.callout {
  margin-top: var(--s4);
  padding: var(--s4) var(--s5) var(--s5);
}
.callout ul {
  margin-top: 0;
}
.related-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: var(--s4);
  margin-top: var(--s4);
}
.related-card {
  display: grid;
  gap: var(--s1);
  align-content: start;
  height: 100%;
  padding: var(--s4);
  color: var(--text);
  text-decoration: none;
  transition: border-color var(--d-fast) var(--ease);
}
.related-card:hover {
  border-color: var(--line-strong);
}
.related-card strong {
  font-size: var(--fs-3);
  font-weight: 600;
}
.related-card span {
  font-size: var(--fs-2);
  line-height: var(--lh-snug);
  color: var(--text-muted);
}
.site-footer {
  border-top: 1px solid var(--line);
  background: var(--surface);
}
.site-footer-inner {
  display: grid;
  gap: var(--s4);
  max-width: var(--wrap);
  margin-inline: auto;
  padding: var(--s6) var(--s5) var(--s7);
}
.site-footer p {
  max-width: 62ch;
  font-size: var(--fs-2);
  color: var(--text-muted);
}
.site-footer ul {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: 0 var(--s4);
}
@media (max-width: 480px) {
  .site-header,
  .site-main,
  .site-footer-inner {
    padding-inline: var(--s4);
  }
  .column {
    font-size: var(--fs-3);
  }
  .lede {
    font-size: var(--fs-4);
  }
}