* { box-sizing: border-box; }
html { min-height: 100%; background: var(--bg); }
body { margin: 0; min-height: 100vh; background: var(--bg); color: var(--text); font-size: 14px; line-height: 1.5; }
h1,h2,h3,h4,p { margin-top: 0; } h1 { margin-bottom: .35rem; font-size: clamp(1.65rem, 3vw, 2.15rem); line-height: 1.15; letter-spacing: -.025em; } h2 { font-size: 1.1rem; letter-spacing: -.01em; } h3 { font-size: .92rem; }
a { color: var(--brand); text-underline-offset: 2px; } a:hover { color: var(--brand-hover); }
button,input,select,textarea { font: inherit; } button,a { -webkit-tap-highlight-color: transparent; }
:focus-visible { outline: 3px solid color-mix(in srgb, var(--focus) 65%, transparent); outline-offset: 2px; }
.skip-link { position: fixed; z-index: 20; top: -5rem; left: 1rem; padding: .65rem 1rem; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-md); }
.skip-link:focus { top: 1rem; }
.muted, small { color: var(--muted); } code { overflow-wrap: anywhere; font-size: .86em; } time { color: var(--muted); font-size: .82rem; white-space: nowrap; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
