:root {
  color-scheme: light;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: #23332e;
  background: #f8faf7;
  line-height: 1.65;
  font-synthesis: none;
}
* { box-sizing: border-box; }
body { margin: 0; }
a { color: #175d46; text-underline-offset: .23em; }
a:hover { color: #0c3f2d; }
a:focus-visible { outline: 3px solid #277a5a; outline-offset: 5px; border-radius: 2px; }
.skip { position: absolute; left: 1rem; top: -8rem; background: white; padding: .8rem; z-index: 2; }
.skip:focus { top: 1rem; }
.site-header, main, footer { width: min(100% - 3rem, 66rem); margin-inline: auto; }
.site-header { padding-block: 1.6rem; display: flex; align-items: center; justify-content: space-between; gap: 1rem; border-bottom: 1px solid #d9e2da; }
.brand { font-weight: 750; letter-spacing: -.025em; color: #23332e; text-decoration: none; }
nav { display: flex; gap: 1.25rem; flex-wrap: wrap; }
nav a { font-size: .93rem; text-decoration: none; padding-block: .55rem; }
nav a[aria-current] { text-decoration: underline; font-weight: 650; }
.intro { padding-block: 4.2rem 2.5rem; max-width: 52rem; }
.eyebrow { color: #426453; font-size: .8rem; font-weight: 700; letter-spacing: .075em; text-transform: uppercase; }
h1, h2, h3 { line-height: 1.15; color: #183c2d; }
h1 { font-size: clamp(2.25rem, 6vw, 4.6rem); font-weight: 650; letter-spacing: -.055em; margin: 1.2rem 0 1.7rem; overflow-wrap: break-word; }
h2 { font-size: 1.65rem; font-weight: 650; letter-spacing: -.035em; margin-block: 0 1.2rem; }
h3 { font-size: 1.1rem; margin: .8rem 0; }
p { margin-block: 0 1rem; max-width: 76ch; }
.lead { font-size: 1.23rem; line-height: 1.7; color: #3e5549; max-width: 62ch; }
section { padding-block: 2.5rem; }
.flow { list-style: none; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2.2rem; padding: 0; margin-block: 2rem; }
.flow li { border-top: 2px solid #bbcebf; padding-top: 1rem; }
.flow p { font-size: .98rem; }
.step { font-size: .8rem; font-weight: 750; color: #547561; font-variant-numeric: tabular-nums; }
.note { background: #edf3eb; border: 1px solid #d7e3d4; border-radius: .75rem; padding: 2rem; margin-block: 1rem; }
.text-link { display: inline-block; font-weight: 650; margin-top: .5rem; }
code { font-family: ui-monospace, "Cascadia Code", monospace; font-size: .9em; overflow-wrap: anywhere; }
.document { max-width: 52rem; }
.document h1 { font-size: clamp(2rem, 5vw, 3.6rem); }
.document .intro { padding-bottom: 1.5rem; }
.document section { padding-block: 1.5rem; border-top: 1px solid #d9e2da; }
.document h2 { font-size: 1.35rem; }
.document li { margin-bottom: .85rem; }
.document ul { padding-left: 1.3rem; }
footer { padding-block: 2rem; margin-top: 2rem; border-top: 1px solid #d9e2da; color: #55685b; font-size: .85rem; }
footer p { display: flex; gap: 1.2rem; flex-wrap: wrap; }
@media (max-width: 640px) {
  .site-header, main, footer { width: min(100% - 2rem, 66rem); }
  .site-header { align-items: flex-start; flex-direction: column; gap: .35rem; padding-block: 1.2rem; }
  nav { gap: 1.4rem; }
  .intro { padding-top: 2.5rem; }
  .flow { grid-template-columns: 1fr; gap: .7rem; }
  .note { padding: 1.3rem; }
  h2 { font-size: 1.45rem; }
}
@media print {
  :root { background: white; color: black; }
  .skip, nav { display: none; }
  .intro, section { padding-block: 1rem; }
  .note { break-inside: avoid; }
}