:root{--ink:#14263D;--ink-2:#2E4A6B;--text:#1B2838;--muted:#5E6B7C;--line:#D9E0E8;--ground:#F5F7FA;--surface:#FFFFFF;--accent-ink:#0F6B4F;--focus:#2E4A6B}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){--ink:#E8EEF5;--ink-2:#C7D3E0;--text:#E6ECF3;--muted:#9FAEBF;--line:#26364A;--ground:#0F1A28;--surface:#162435;--accent-ink:#8FE6C6;--focus:#8FB3DA}}
:root[data-theme="dark"]{--ink:#E8EEF5;--ink-2:#C7D3E0;--text:#E6ECF3;--muted:#9FAEBF;--line:#26364A;--ground:#0F1A28;--surface:#162435;--accent-ink:#8FE6C6;--focus:#8FB3DA}
*{box-sizing:border-box}
body{margin:0;background:var(--ground);color:var(--text);font-family:"IBM Plex Sans","Segoe UI",system-ui,sans-serif;font-size:16px;line-height:1.65;padding-inline:20px;padding-block:0}
main{max-width:760px;margin-inline:auto;padding-block:40px 72px}
h1,h2{font-family:"Bricolage Grotesque","Segoe UI",system-ui,sans-serif;color:var(--ink);margin:0;text-wrap:balance;line-height:1.15}
h1{font-size:clamp(1.9rem,4vw,2.6rem);font-weight:800;letter-spacing:-.02em;margin-bottom:8px}
h2{font-size:1.15rem;font-weight:700;margin-top:32px;margin-bottom:8px}
p,li{margin:0 0 12px;color:var(--text)}
ul,ol{padding-left:22px;margin:0 0 12px}
.meta{color:var(--muted);font-size:.9rem;margin-bottom:28px}
.back{display:inline-block;font-size:.9rem;color:var(--ink-2);text-decoration:none;margin-bottom:28px}
.back:hover{text-decoration:underline}
a{color:var(--ink-2)}
a:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.todo{background:#FBF0DA;color:#6B4A0F;border:1px dashed #B7791F;border-radius:6px;padding:2px 6px;font-size:.9em}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .todo{background:#3B2E14;color:#E0A94A;border-color:#E0A94A}}
:root[data-theme="dark"] .todo{background:#3B2E14;color:#E0A94A;border-color:#E0A94A}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink);margin-bottom:24px}
.brand svg{width:30px;height:30px}
.brand b{font-family:"Bricolage Grotesque",sans-serif;font-weight:800;letter-spacing:.02em;line-height:.95;font-size:.85rem;text-transform:uppercase}
footer{max-width:760px;margin-inline:auto;border-top:1px solid var(--line);padding-block:20px 40px;color:var(--muted);font-size:.85rem}
footer a{color:var(--muted);text-decoration:none;margin-right:16px}