:root { --bg:#FBF3EC; --bg-2:#F7E6D8; --ink:#4A3324; --muted:#7A6455; --line:#EBD8C8; --accent:#8E5C32; --acc-mark:#C08A5E; --gold:#E8BF9A; }
* { box-sizing:border-box; margin:0; padding:0; }
body { background:var(--bg); color:var(--ink); font:400 16px/1.7 "Manrope",system-ui,sans-serif; -webkit-font-smoothing:antialiased; }
a { color:var(--accent); }
:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
.wrap { max-width:780px; margin:0 auto; padding:0 24px; }
header { border-bottom:1px solid var(--line); }
header .wrap { max-width:1180px; display:flex; justify-content:space-between; align-items:center; height:76px; }
.logo { display:flex; align-items:center; gap:12px; font:500 21px/1 "Cormorant Garamond",serif; letter-spacing:.32em; color:var(--ink); text-decoration:none; }
.logo img { height:40px; width:auto; }
.back { font-size:14px; color:var(--muted); text-decoration:none; }
.back:hover { color:var(--ink); }
main { padding:72px 0 96px; }
.eyebrow { font:500 12px/1 "Manrope",sans-serif; letter-spacing:.22em; text-transform:uppercase; color:var(--accent); }
h1 { font:500 clamp(40px,6vw,56px)/1.1 "Cormorant Garamond",serif; margin:18px 0 10px; }
.updated { color:var(--muted); font-size:14px; margin-bottom:48px; }
h2 { font:500 28px/1.2 "Cormorant Garamond",serif; margin:48px 0 14px; scroll-margin-top:24px; }
p, li { color:#5C4637; }
p + p { margin-top:12px; }
ul { margin:12px 0 0 20px; }
li + li { margin-top:6px; }
table { width:100%; border-collapse:collapse; margin-top:14px; font-size:14px; }
th, td { text-align:left; padding:10px 12px; border-bottom:1px solid var(--line); vertical-align:top; }
th { font-weight:600; color:var(--ink); background:var(--bg-2); }
.card { background:var(--bg-2); padding:20px 24px; margin-top:14px; }
mark.todo { background:#FFE3A3; color:#5A3A00; padding:0 4px; border-radius:3px; }
footer { border-top:1px solid var(--line); padding:28px 0; font-size:13px; color:var(--muted); }
footer .wrap { max-width:1180px; display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; }
@media (max-width:560px) { .wrap { padding:0 16px; } main { padding:48px 0 72px; } th, td { padding:8px; } }