:root{--bg:#faf9f5;--card:#fff;--line:#e6e3d9;--ink:#16161a;--muted:#5e5e68;--accent:#d4ff3a;--olive:#4f6b00}
html.dark{--bg:#0d0d10;--card:#1b1b22;--line:#2a2a33;--ink:#f5f5f2;--muted:#a3a3ad;--olive:#d4ff3a}
*{box-sizing:border-box;margin:0;padding:0}
body{background:var(--bg);color:var(--ink);font-family:Rubik,system-ui,sans-serif;line-height:1.75;font-size:17px}
a{color:var(--olive);text-underline-offset:3px}
:focus-visible{outline:3px solid var(--olive);outline-offset:3px}
.skip{position:absolute;right:12px;top:-60px;background:var(--accent);color:#16161a;padding:8px 14px;border-radius:10px;font-weight:700;z-index:9}
.skip:focus{top:12px}
header,main,footer{max-width:760px;margin:0 auto;padding:0 20px}
header{padding-top:28px;padding-bottom:28px;display:flex;justify-content:space-between;align-items:center}
.logo{font-weight:900;font-size:1.5rem;color:var(--ink);text-decoration:none}
.logo b{color:var(--olive)}
.back{font-weight:700}
.kicker{color:var(--olive);font-weight:700;font-size:.9rem}
h1{font-size:clamp(2rem,5vw,2.8rem);line-height:1.15;margin:6px 0 24px}
h2{font-size:1.3rem;margin:34px 0 10px}
p,ul{margin-bottom:14px}
ul{padding-right:22px}
li{margin-bottom:6px}
.updated{color:var(--muted);font-size:.9rem;margin-top:40px}
footer{border-top:1px solid var(--line);margin-top:60px;padding-top:24px;padding-bottom:40px;color:var(--muted);font-size:.95rem;display:flex;gap:18px;flex-wrap:wrap}
