:root { color-scheme: dark; font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; background: #020617; color: #e2e8f0; }
* { box-sizing: border-box; }
body { margin: 0; line-height: 1.75; }
a { color: #fcd34d; text-underline-offset: 3px; }
a:hover { color: #fde68a; }
.layout { width: min(100% - 40px, 790px); margin: auto; padding: 32px 0 64px; }
.site-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; padding-bottom: 20px; border-bottom: 1px solid #334155; }
.brand { color: #fcd34d; font-weight: 900; font-size: 1.2rem; letter-spacing: .1em; text-decoration: none; }
.site-nav { display: flex; flex-wrap: wrap; gap: 18px; font-size: .875rem; }
.site-nav [aria-current="page"] { color: #fff; text-decoration: none; }
.site-main { padding: 14px 0; }
h1, h2, h3 { color: #f8fafc; line-height: 1.3; }
h1 { font-size: clamp(1.8rem, 5vw, 2.5rem); margin: 20px 0 12px; }
h2 { font-size: 1.35rem; margin: 38px 0 12px; }
h3 { font-size: 1.1rem; margin: 25px 0 10px; }
p, li { color: #cbd5e1; }
ul { padding-left: 26px; }
li { padding: 3px 0; }
strong { color: #f8fafc; }
code { background: #1e293b; color: #fcd34d; border-radius: 4px; padding: 2px 5px; font-size: .9em; }
.site-footer { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-top: 36px; border-top: 1px solid #334155; padding-top: 20px; color: #94a3b8; font-size: .875rem; }
@media (max-width: 480px) { .layout { width: min(100% - 32px, 790px); padding-top: 20px; } }