/* The app's light palette, so the site and the product read as one thing.
   Values are the measured ones from Palette.swift, not eyeballed. */
:root{
  --canvas:#f7f3ec; --surface:#fbf7ef; --raised:#e8e1d7;
  --border:#d8d0c4; --line:#e4ddd2;
  --ink:#151412; --ink-2:#5f5a52; --ink-3:#726b62;
  --accent:#5d37a1; --accent-deep:#46287d;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--canvas);color:var(--ink);
  font:17px/1.6 -apple-system,BlinkMacSystemFont,"SF Pro Text","Inter",system-ui,sans-serif;
  -webkit-font-smoothing:antialiased}
.wrap{max-width:44rem;margin:0 auto;padding:0 1.25rem}
header{border-bottom:1px solid var(--line);padding:1.5rem 0}
header .wrap{display:flex;align-items:baseline;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.brand{font-weight:700;letter-spacing:-.01em;font-size:1.05rem}
nav a{color:var(--ink-2);text-decoration:none;font-size:.95rem;margin-left:1.25rem}
nav a:hover{color:var(--ink)}
h1{font-size:clamp(2rem,5vw,2.9rem);line-height:1.1;letter-spacing:-.03em;margin:2.5rem 0 1rem}
h2{font-size:1.35rem;letter-spacing:-.015em;margin:2.75rem 0 .75rem}
h3{font-size:1.05rem;margin:1.75rem 0 .5rem}
.lede{font-size:1.2rem;color:var(--ink-2);margin:0 0 2rem}
p{margin:0 0 1rem}
a{color:var(--accent-deep)}
ul{padding-left:1.15rem;margin:0 0 1rem}
li{margin:.4rem 0}
.card{background:var(--surface);border:1px solid var(--line);border-radius:16px;
  padding:1.25rem 1.4rem;margin:1.25rem 0}
.kicker{font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;
  color:var(--ink-3);font-weight:700;margin:0 0 .4rem}
dl{margin:0}
dt{font-weight:650;margin-top:.9rem}
dd{margin:.15rem 0 0;color:var(--ink-2)}
.todo{background:#fff6d8;border:1px solid #e3cf8a;border-radius:10px;
  padding:.7rem .9rem;font-size:.9rem;color:#5c4708;margin:.75rem 0}
footer{border-top:1px solid var(--line);margin-top:4rem;padding:2rem 0 3rem;
  color:var(--ink-3);font-size:.9rem}
footer p{margin:.25rem 0}
table{border-collapse:collapse;width:100%;font-size:.95rem;margin:1rem 0;display:block;overflow-x:auto}
th,td{text-align:left;padding:.55rem .7rem;border-bottom:1px solid var(--line);vertical-align:top}
th{font-size:.75rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3)}
