:root{--bg:#f5f6f7;--fg:#16181d;--muted:#525457;--line:#dcdfe3;--surf2:#eef0f2;--f:"Archivo","Helvetica Neue",Arial,sans-serif;--fd:"Bricolage Grotesque","Archivo","Helvetica Neue",Arial,sans-serif;color-scheme:light}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--bg:#16181d;--fg:#f4f5f6;--muted:#a3a6ab;--line:#2f333b;--surf2:#2a2e36;color-scheme:dark}}
:root[data-theme="dark"]{--bg:#16181d;--fg:#f4f5f6;--muted:#a3a6ab;--line:#2f333b;--surf2:#2a2e36;color-scheme:dark}
*{box-sizing:border-box}
body{background:var(--bg);color:var(--fg);font-family:var(--f);font-size:17px;line-height:1.6;margin:0}
.in{max-width:760px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.top{border-bottom:1px solid var(--line)}
.top .in{padding-block:14px;font-weight:600;font-size:15px}
.top a{color:var(--muted);text-decoration:none}
.top a:hover{color:var(--fg)}
.draft{background:var(--surf2);border-left:4px solid #f26a1b;padding:12px 16px;font-size:14.5px;margin-top:28px}
h1,h2{font-family:var(--fd);font-weight:700;text-wrap:balance}
h1{font-size:clamp(34px,5vw,52px);letter-spacing:-.04em;line-height:1;margin:32px 0 8px}
h2{font-size:22px;letter-spacing:-.02em;margin:36px 0 8px;padding-top:20px;border-top:1px solid var(--line)}
p,ul{margin:8px 0}
ul{padding-left:20px}
li{margin:6px 0}
.upd{color:var(--muted);font-size:14.5px}
.todo{background:var(--surf2);padding:2px 8px;border-radius:6px;font-weight:600;font-size:.92em}
a{color:inherit}
footer{border-top:1px solid var(--line);margin-top:56px}
footer .in{padding-block:22px 48px;font-size:14.5px;color:var(--muted)}