:root {
  color-scheme: light;
  --ink: #132632;
  --muted: #435763;
  --link: #006b93;
  --line: #d7e3e7;
  --pale: #eef7f7;
}
* { box-sizing: border-box; }
body { margin: 0; color: var(--ink); background: #fff; font: 1rem/1.68 system-ui, sans-serif; }
a { color: var(--link); text-underline-offset: .18em; }
a:focus-visible, [tabindex]:focus-visible { outline: 2px solid var(--link); outline-offset: 4px; }
.wrap { width: min(100% - 2rem, 69rem); margin-inline: auto; }
.site-header { border-bottom: 1px solid var(--line); }
.site-header .wrap, .site-footer .wrap { display: flex; align-items: center; justify-content: space-between; gap: .75rem 1.5rem; flex-wrap: wrap; padding-block: .9rem; }
.site-header img { display: block; width: 10.25rem; height: auto; }
.site-header nav { display: flex; flex-wrap: wrap; gap: .35rem 1.15rem; }
.site-header nav a { color: var(--ink); font-weight: 650; text-decoration: none; }
.site-header nav a:hover { text-decoration: underline; }
.reading { max-width: 49rem; padding-block: 1.35rem 3rem; overflow-wrap: anywhere; }
.breadcrumbs, .byline { color: var(--muted); font-size: .89rem; }
.breadcrumbs { display: flex; flex-wrap: wrap; gap: .2rem .55rem; margin-bottom: 1.65rem; }
.page-intro { border-bottom: 1px solid var(--line); padding-bottom: 1rem; margin-bottom: 1.35rem; }
h1, h2 { line-height: 1.17; letter-spacing: 0; }
h1 { margin: 0 0 .65rem; font-size: 2.65rem; }
h2 { margin: 1.65rem 0 .5rem; font-size: 1.36rem; }
.lead { font-size: 1.13rem; color: var(--muted); margin-block: 0 .75rem; }
.byline { margin-block: .3rem; }
.answer { border-left: .25rem solid #16847a; background: var(--pale); padding: .85rem 1rem; }
section p, section ul { margin-block: 0 1rem; }
.question { border-bottom: 1px solid var(--line); scroll-margin-block-start: 1rem; }
.table-wrap { max-width: 100%; overflow-x: auto; margin-block: 1.45rem; }
table { border-collapse: collapse; width: 100%; font-size: .9rem; }
caption { text-align: left; font-weight: 700; padding-bottom: .55rem; }
th, td { text-align: left; padding: .5rem .65rem; border-bottom: 1px solid var(--line); }
thead { background: var(--pale); }
.site-footer { background: #142831; color: #fff; }
.site-footer a { color: #b8eced; }
@media (max-width: 40rem) {
  h1 { font-size: 1.9rem; }
  .site-header .wrap, .site-footer .wrap { justify-content: flex-start; }
  .site-header nav { flex-basis: 100%; font-size: .9rem; }
  th, td { padding: .4rem; }
}