:root {
  color-scheme: light;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans", sans-serif;
  color: #252525;
  background: #fff;
  line-height: 1.8;
}

* { box-sizing: border-box; }
body { margin: 0; }
.site-header, main { width: min(100% - 3rem, 52rem); margin-inline: auto; }
.site-header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding-block: 1.25rem;
  border-bottom: 2px solid #252525;
}
.brand { font-size: 1.25rem; font-weight: 750; letter-spacing: -.025em; }
nav { display: flex; gap: 1.25rem; }
nav a { padding-block: .5rem; text-underline-offset: .25em; }
nav a[aria-current="page"] { color: #252525; font-weight: 700; text-decoration-thickness: 2px; }
main { padding-block: 2rem 4rem; overflow-wrap: anywhere; }
h1 { font-size: clamp(1.6rem, 4.5vw, 2rem); line-height: 1.5; margin: 0 0 1rem; }
h2 { font-size: 1.25rem; line-height: 1.6; margin: 2.5rem 0 .75rem; }
p { margin: 0 0 1.1rem; }
ul { padding-left: 1.5rem; }
li { padding-left: .2rem; margin-block: .35rem; }
a { color: #17539a; text-underline-offset: .15em; }
a:hover { text-decoration-thickness: 2px; }
a:focus-visible { outline: 3px solid #17539a; outline-offset: 4px; }
.table-wrap { margin-block: 1rem 1.5rem; }
table { width: 100%; border-collapse: collapse; table-layout: fixed; }
th, td { padding: .75rem; border: 1px solid #d5d5d5; text-align: left; vertical-align: top; }
th { background: #f3f4f5; }
th:first-child { width: 35%; }
code { font-size: .95em; overflow-wrap: anywhere; }
.skip-link { position: absolute; top: -6rem; left: 1rem; background: #fff; padding: .5rem 1rem; }
.skip-link:focus { top: .5rem; }
@media (max-width: 480px) {
  .site-header, main { width: calc(100% - 2rem); }
  main { padding-top: 1.5rem; }
  th, td { padding: .6rem; }
}
