:root{--fg:#1f2430;--muted:#5b6475;--bg:#fff;--line:#e3e6ec;--accent:#1a5fd0;--soft:#f5f7fb}
@media (prefers-color-scheme:dark){:root{--fg:#e8eaf0;--muted:#a3abbb;--bg:#14171d;--line:#2a2f3a;--accent:#7aa7ff;--soft:#1b1f27}}
*{box-sizing:border-box}
body{margin:0;font:16px/1.65 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:var(--fg);background:var(--bg)}
header,main,footer{max-width:760px;margin:0 auto;padding:0 20px}
header{display:flex;gap:20px;align-items:center;padding-top:20px;padding-bottom:12px;border-bottom:1px solid var(--line)}
header a.brand{font-weight:700;color:var(--fg);text-decoration:none;margin-right:auto}
a{color:var(--accent)}
h1{font-size:2rem;line-height:1.25;margin:1.6rem 0 .6rem}
h2{font-size:1.3rem;margin:2rem 0 .5rem}
img{max-width:100%;height:auto;border:1px solid var(--line);border-radius:8px}
figure{margin:1.2rem 0}figcaption{color:var(--muted);font-size:.9rem}
.btn{display:inline-block;background:var(--accent);color:#fff;padding:.6rem 1.1rem;border-radius:8px;text-decoration:none;font-weight:600}
.note{background:var(--soft);border:1px solid var(--line);border-radius:8px;padding:.8rem 1rem}
footer{color:var(--muted);font-size:.9rem;padding-top:2rem;padding-bottom:3rem}

header{flex-wrap:wrap}header a.brand{flex-basis:100%}.breadcrumbs{font-size:.875rem;color:var(--muted);margin-top:1.5rem}code{overflow-wrap:anywhere}a:focus-visible{outline:2px solid var(--accent);outline-offset:4px}@media(min-width:640px){header a.brand{flex-basis:auto}}