:root{--fir:#17362A;--signal:#E2601B;--ground:#F2F4EF;--surface:#fff;--line:#D5DBD1;--ink:#10231B;--ink-2:#44564C}
@media (prefers-color-scheme:dark){:root{--ground:#0E1914;--surface:#15241D;--line:#2A3D33;--ink:#E6EEE8;--ink-2:#A3B5AA;--fir:#E6EEE8}}
*{box-sizing:border-box}
body{margin:0;background:var(--ground);color:var(--ink);font:400 17px/1.65 "Figtree",system-ui,-apple-system,"Segoe UI",sans-serif;-webkit-font-smoothing:antialiased}
.wrap{max-width:760px;margin-inline:auto;padding-inline:clamp(16px,4vw,32px)}
header.top{border-bottom:1px solid var(--line);background:var(--surface)}
header.top .wrap{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding-block:.8rem;max-width:1180px}
.brand{display:flex;align-items:center;gap:.6rem;text-decoration:none;color:var(--fir)}
.brand svg{width:48px;height:auto}
.brand b{font:900 1.35rem/1 "Archivo","Arial Narrow",sans-serif;font-stretch:75%}
header.top a{color:var(--ink-2);font-weight:600}
main{padding-block:2.5rem 4rem}
h1{font:900 clamp(2.2rem,6vw,3.2rem)/1 "Archivo","Arial Narrow",sans-serif;font-stretch:75%;margin:0 0 .4rem}
h2{font:800 1.3rem/1.2 "Archivo","Arial Narrow",sans-serif;font-stretch:88%;margin:2.2rem 0 .5rem}
p{margin:.5rem 0}
.stand{color:var(--ink-2);font-size:.9rem}
a{color:inherit;text-underline-offset:2px}
mark.todo{background:#FFE58A;color:#10231B;padding:0 .25em;border-radius:3px}
.btn{font:700 .95rem/1 "Figtree",sans-serif;padding:.7rem 1rem;border-radius:999px;border:0;background:var(--signal);color:#fff;cursor:pointer}
footer{border-top:1px solid var(--line);padding-block:1.5rem;font-size:.9rem;color:var(--ink-2)}
footer .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.6rem;max-width:1180px}
:focus-visible{outline:3px solid var(--signal);outline-offset:3px}