:root{--bg:#fff;--fg:#1a1a1a;--muted:#555;--accent:#0b57d0;--line:#e0e0e0}
@media (prefers-color-scheme:dark){:root{--bg:#121212;--fg:#ececec;--muted:#aaa;--accent:#8ab4f8;--line:#333}}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--fg);font-family:system-ui,-apple-system,"Segoe UI",Arial,sans-serif;line-height:1.7;font-size:1.0625rem}
header,main,footer{max-width:46rem;margin:0 auto;padding:1rem 1.25rem}
header{border-bottom:1px solid var(--line)}
header a.brand{font-weight:700;color:var(--fg);text-decoration:none}
nav ul{list-style:none;display:flex;flex-wrap:wrap;gap:1rem;padding:0;margin:.5rem 0 0}
a{color:var(--accent)}
a:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
h1{font-size:1.9rem;line-height:1.3}
h2{font-size:1.25rem;margin-top:2rem}
.muted{color:var(--muted)}
footer{border-top:1px solid var(--line);margin-top:2rem;color:var(--muted);font-size:.95rem}
.ltr{direction:ltr;unicode-bidi:isolate}
.skip{position:absolute;inset-inline-start:-999px}
.skip:focus{inset-inline-start:1rem;top:1rem;background:var(--bg);padding:.5rem}
