* { box-sizing: border-box; }
html { color-scheme: light; }
body { max-width: 72ch; margin: 0 auto; padding: 24px; background: white; color: #222; font: 16px/1.7 system-ui, sans-serif; overflow-wrap: anywhere; }
header, footer { margin: 1rem 0 2rem; }
nav { display: flex; flex-wrap: wrap; gap: .5rem 1.25rem; }
a { color: #164d8f; text-underline-offset: .2em; }
a:focus-visible { outline: 2px solid currentColor; outline-offset: 4px; }
h1 { font-size: 1.65rem; line-height: 1.35; margin: 2rem 0 1rem; }
h2 { font-size: 1.15rem; margin: 2rem 0 .5rem; }
p, ol, ul { margin: .6rem 0 1rem; }
li { margin: .4rem 0; }
ol, ul { padding-left: 1.4rem; }
footer { margin-top: 3rem; font-size: .9rem; }
@media (max-width: 400px) { body { padding: 16px; } }
@media print { body { max-width: none; } header, footer { display: none; } a { color: inherit; } }