:root{--g:#0E7A5F;--bg:#F2F3EE;--fg:#14202b;--mut:#5b6670;--card:#fff}
@media(prefers-color-scheme:dark){:root{--bg:#0B1118;--fg:#e8edf2;--mut:#93a0ac;--card:#131c26}}
*{box-sizing:border-box}
body{margin:0;font:16px/1.65 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;background:var(--bg);color:var(--fg)}
header,main,footer{max-width:760px;margin:0 auto;padding:0 16px}
header{display:flex;justify-content:space-between;align-items:center;padding-top:20px;padding-bottom:12px;flex-wrap:wrap;gap:8px}
.brand{font-weight:700;font-size:20px;color:var(--g);text-decoration:none}
nav a{margin-left:16px;color:var(--fg);text-decoration:none}
nav a:hover{color:var(--g)}
.card{background:var(--card);border-radius:14px;padding:24px;margin:16px 0;box-shadow:0 1px 3px rgba(0,0,0,.08)}
h1{font-size:28px;line-height:1.25;margin:.4em 0}
h2{font-size:20px;margin:1.4em 0 .4em}
h3{font-size:16px;margin:1em 0 .2em}
a{color:var(--g)}
.mut{color:var(--mut);font-size:14px}
ul{padding-left:20px}
.btn{display:inline-block;background:var(--g);color:#fff;padding:10px 18px;border-radius:10px;text-decoration:none;font-weight:600}
footer{padding-top:16px;padding-bottom:32px;color:var(--mut);font-size:14px}
hr{border:0;border-top:1px solid rgba(128,128,128,.25);margin:28px 0}