:root { --ground:#5e0f09; --ink:#f6c4b4; --ink-soft:#e49c89; --chip:#3c0805; --gold:#f2c14e; --white:#fff; --shadow:rgba(0,0,0,.45);
  --display:"Figtree","Avenir Next",-apple-system,"Segoe UI",sans-serif; --body:"Figtree","Avenir Next",-apple-system,"Segoe UI",sans-serif; color-scheme:dark }
* { box-sizing:border-box }
body { margin:0; background:var(--ground); color:var(--ink); font:17px/1.65 var(--body);
  padding:40px max(16px, env(safe-area-inset-right)) 60px max(16px, env(safe-area-inset-left)) }
main { max-width:68ch; margin:0 auto; background:var(--chip); border-radius:20px; box-shadow:0 18px 40px var(--shadow); padding:28px clamp(18px, 4vw, 40px) }
h1 { font:800 clamp(34px,5vw,48px)/1.05 var(--display); letter-spacing:-0.03em; margin:0 0 4px; text-wrap:balance }
h2 { font:800 21px/1.25 var(--display); letter-spacing:-0.01em; color:var(--white); margin:28px 0 6px }
p, li { margin:0 0 10px }
.meta { color:var(--ink-soft); font-size:14px; margin-bottom:20px }
a { color:var(--ink) }
a:focus-visible { outline:3px solid var(--gold); outline-offset:2px }
nav { max-width:68ch; margin:0 auto 14px; font:700 15px var(--display) }
nav a { color:var(--ink); text-decoration:none }
.meta { color:var(--ink-soft) }
