:root { color-scheme: dark; font-family: system-ui, sans-serif; background: #101211; color: #f5f5f1; line-height: 1.65; }
body { margin: 0; }
header, main, footer { max-width: 52rem; margin: auto; padding: 1.4rem; }
header, footer { border-bottom: 1px solid #434940; }
footer { border-top: 1px solid #434940; border-bottom: 0; }
a { color: #ffd36b; text-underline-offset: .2em; }
a:focus-visible { outline: 3px solid #ffd36b; outline-offset: 4px; }
nav { display: flex; flex-wrap: wrap; gap: .5rem 1.2rem; }
h1, h2 { line-height: 1.25; }
h1 { font-size: clamp(1.7rem, 5vw, 2.3rem); }
h2 { margin-top: 2rem; font-size: 1.35rem; }
.brand { font-weight: 700; font-size: 1.2rem; }
.notice { border-left: 4px solid #ffc452; background: #28271d; padding: 1rem; }
.meta { color: #c5cabf; font-size: .95rem; }
pre { white-space: pre-wrap; overflow-wrap: anywhere; font: inherit; }
li { margin-bottom: .7rem; }
@media (prefers-reduced-motion: reduce) { * { scroll-behavior: auto; } }