:root{--paper:#F1F4EA;--ink:#16231A;--stone:#5E675A;--sawah:#2C5A3D;--kunyit:#B97A0C;--line:#CBD4BE}
@media (prefers-color-scheme:dark){:root{--paper:#0F1611;--ink:#E7ECDD;--stone:#A3AD99;--sawah:#8CC39F;--kunyit:#E8AA3C;--line:#2C3A2F;color-scheme:dark}}
*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);font:400 17px/1.65 "Figtree","Helvetica Neue",Arial,system-ui,sans-serif}
.wrap{max-width:760px;margin:0 auto;padding:40px max(16px,env(safe-area-inset-right,0px)) 80px max(16px,env(safe-area-inset-left,0px))}
a{color:var(--sawah)}
.back{display:inline-flex;align-items:center;gap:10px;text-decoration:none;font:800 1.4rem/1 "Bricolage Grotesque",system-ui,sans-serif;color:var(--ink);margin-bottom:40px}
h1{font:800 clamp(2rem,6vw,3rem)/1.05 "Bricolage Grotesque",system-ui,sans-serif;margin:0 0 8px;letter-spacing:-.01em}
h2{font:700 1.25rem/1.3 "Bricolage Grotesque",system-ui,sans-serif;margin:36px 0 8px}
p,li{color:var(--ink)}
.muted{color:var(--stone);font-size:.92rem}
.todo{background:#F3E2B8;color:#3A2E14;padding:0 4px;border-radius:3px}
ul{padding-left:20px}