:root {
  --font: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
  --mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
  --lh: 1.55;
  --measure: 65ch;
  --text: #14161a;
  --dim: color-mix(in oklab, var(--text) 60%, transparent);
  --rule: #d9d5cd;
  --link: #464ea4;
  --link-v: #8a429e; /* color-mix(in oklab, var(--link) 50%, transparent) */
  --link-h: #a42c11;
  --link-a: #cd4b22;
}

html {
  font-size: clamp(15px, .94rem + .15vw, 17px);
  -webkit-text-size-adjust: 100%;
}

body {
  font-family: var(--font);
  line-height: var(--lh);
  color: var(--text);
  text-wrap: pretty;
  overflow-wrap: break-word;
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6 {
  margin-block: 1.7em .5em;
  line-height: 1.14;
  font-weight: 600;
  text-wrap: balance;
}

h1 { font-size: clamp(2.2rem, 1.4rem + 3vw, 4rem); font-weight: 500; letter-spacing: -.035em; }
h2 { font-size: clamp(1.5rem, 1.1rem + 1.4vw, 2.25rem); font-weight: 500; letter-spacing: -.025em; }
h3 { font-size: 1.2rem; letter-spacing: -.015em; }
h4, h5 { font-size: 1rem; }
h5 { font-weight: normal; }
h6 { font-size: .8125rem; font-weight: 500; letter-spacing: .14em; text-transform: uppercase; color: var(--dim); }

@supports (text-box: trim-both cap alphabetic) {
  h1, h2, h3, h4, h5, h6 { text-box: trim-both cap alphabetic; margin-block: 1.9em .7em; }
  figcaption, .label { text-box: trim-both cap alphabetic; }
}

p, ul, ol, dl, blockquote, pre, table, figure { margin-block: 0 1em; }
figure, blockquote, dl { margin-inline: 0; }
p, li, dd, blockquote { max-width: var(--measure); }

:is(h1, h2, h3, h4, h5, h6) + * { margin-block-start: 0; }
:first-child { margin-block-start: 0; }
:last-child { margin-block-end: 0; }

ul, ol { padding-inline-start: 1.3em; }
li, dd { margin-block: .2em; }
li > ul, li > ol { margin-block: .2em 0; }
dt { font-weight: 600; }
dd { margin-inline-start: 0; color: var(--dim); }

a {
  color: var(--link);
  text-decoration-skip-ink: none;
  text-decoration-color: currentColor;
  transition: color 120ms;
}
a:visited { color: var(--link-v); }
a:hover {
  color: var(--link-h);
  transition: color 0s;
}
a:active { color: var(--link-a); }

:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }

strong, b { font-weight: 600; }
address { font-style: normal; }

small, figcaption { font-size: .875rem; line-height: 1.45; color: var(--dim); }
figcaption { margin-block-start: .6em; }

blockquote {
  padding-inline-start: 1em;
  border-inline-start: 2px solid var(--rule);
  color: var(--dim);
}

code, kbd, samp, pre { display: inline-block; font-family: var(--mono); font-size: .8em; font-variation-settings: 'wght' 450; }
pre { overflow-x: auto; }
kbd { padding: .1em .4em; border: 1px solid var(--rule); border-radius: 3px; font-size: .8em; }

hr { margin-block: 2.5em; border: 0; border-top: 1px solid var(--rule); }

table { border-collapse: collapse; font-variant-numeric: tabular-nums; }
th, td { padding: .45em 1.5em .45em 0; border-bottom: 1px solid var(--rule); text-align: start; vertical-align: top; }
th { font-weight: 600; }