:root { --paper:#f5f2eb; --card:#fffdf7; --line:#e3ded2; --ink:#1d1d1b;
  --muted:#5d5b55; --faint:#b7b3a9; --clay:#c96442; --claydeep:#a94f30; }
* { box-sizing:border-box; margin:0; padding:0 }
body { background:var(--paper); color:var(--ink);
  font-family:'DM Sans',ui-sans-serif,system-ui,sans-serif; font-size:16px;
  line-height:1.6; -webkit-font-smoothing:antialiased }
a { color:inherit }
.wrap { max-width:960px; margin:0 auto; padding:0 24px }
header.bar { display:flex; justify-content:space-between; align-items:center;
  padding:20px 0; border-bottom:1px solid var(--line) }
.wordmark { font-family:'DM Serif Display',serif; font-size:28px; letter-spacing:-.02em }
.wordmark small { font-family:'DM Sans',sans-serif; font-size:11px; color:var(--faint);
  letter-spacing:.18em; text-transform:uppercase; margin-left:10px }
nav { display:flex; align-items:center }
nav > * { margin-left:24px; font-size:14px; color:var(--muted); text-decoration:none }
nav > *:hover { color:var(--ink) }
.hero { padding:96px 0 72px }
h1.display { font-family:'DM Serif Display',serif; font-weight:400;
  font-size:clamp(40px,7vw,64px); line-height:1.08; letter-spacing:-.02em; max-width:14ch }
.lede { font-size:19px; color:var(--muted); max-width:52ch; margin:24px 0 40px }
.step-label { font-family:'DM Mono',monospace; font-size:12px; color:var(--clay);
  letter-spacing:.2em; text-transform:uppercase; margin-bottom:12px }
section { padding:64px 0; border-top:1px solid var(--line) }
h2.display { font-family:'DM Serif Display',serif; font-weight:400;
  font-size:clamp(28px,4vw,40px); line-height:1.15; letter-spacing:-.01em; max-width:22ch }
.grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:24px; margin-top:40px }
.card { background:var(--card); border:1px solid var(--line); border-radius:1.25rem; padding:28px }
.card h3 { font-family:'DM Serif Display',serif; font-weight:400; font-size:20px; margin:8px 0 10px }
.card p { color:var(--muted); font-size:15px }
form.card { display:grid; gap:14px }
label { font-family:'DM Mono',monospace; font-size:12px; letter-spacing:.14em;
  text-transform:uppercase; color:var(--faint); display:block; margin-bottom:6px }
input { width:100%; font:inherit; padding:11px 14px; border:1px solid var(--line);
  border-radius:.75rem; background:#fff; color:var(--ink) }
input:focus { outline:2px solid var(--clay); outline-offset:1px; border-color:var(--clay) }
button { font:inherit; font-weight:500; cursor:pointer; border:0; border-radius:999px;
  padding:12px 28px; background:var(--ink); color:var(--paper); transition:background .15s }
button:hover { background:var(--clay) }
button.ghost { background:transparent; color:var(--muted); border:1px solid var(--line) }
button.ghost:hover { color:var(--ink); background:transparent; border-color:var(--faint) }
.note { font-size:13px; color:var(--faint) }
.error { border-left:3px solid var(--clay); padding:10px 14px; background:#faf1ec;
  border-radius:.5rem; color:var(--claydeep); font-size:14px }
.chip { display:inline-block; font-family:'DM Mono',monospace; font-size:11px;
  letter-spacing:.12em; text-transform:uppercase; border:1px solid var(--line);
  border-radius:999px; padding:3px 10px; color:var(--muted) }
.digest { font-size:15px }
.digest h2 { font-family:'DM Serif Display',serif; font-weight:400; font-size:24px; margin:18px 0 8px }
.digest li { margin:4px 0 4px 20px }
.digest strong { font-weight:600 }
.digest p { margin:8px 0 }
summary { cursor:pointer; font-size:14px; color:var(--ink) }
details[open] > summary { border-bottom:1px solid var(--line) }
table { width:100%; border-collapse:collapse; font-size:14px }
th { font-family:'DM Mono',monospace; font-size:11px; letter-spacing:.14em;
  text-transform:uppercase; color:var(--faint); text-align:left; padding:8px 10px;
  border-bottom:1px solid var(--line) }
td { padding:8px 10px; border-bottom:1px solid var(--line); color:var(--muted) }
td:first-child { color:var(--ink) }
pre.log { font-family:'DM Mono',monospace; font-size:12px; color:var(--muted);
  white-space:pre-wrap; background:var(--card); border:1px solid var(--line);
  border-radius:.75rem; padding:16px; margin-top:12px }
footer { padding:48px 0 64px; border-top:1px solid var(--line);
  color:var(--faint); font-size:13px; display:flex; justify-content:space-between }
.mono { font-family:'DM Mono',monospace; font-size:12px }
button.link { background:transparent; color:var(--muted); padding:0; border-radius:0;
  cursor:pointer }