/* The app's own tokens, the same values index.html uses, so a policy page and
   the product are visibly one thing. Single-theme dark, like everything else. */
:root {
  --ground: #0f0c1a; --surface: #1b1730; --line: #2e2848;
  --ink: #ece8f7; --muted: #9d95b8; --brand: #9d7bff;
}
* { box-sizing: border-box; }
body {
  margin: 0; background: var(--ground); color: var(--ink);
  font-family: Figtree, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 16.5px; line-height: 1.65;
  -webkit-font-smoothing: antialiased;
}
.wrap { max-width: 720px; margin: 0 auto; padding: 32px 20px 72px; }
header { display: flex; align-items: center; gap: 12px; padding: 20px 0 8px; }
header img { width: 32px; height: 32px; border-radius: 8px; }
header a { color: var(--ink); text-decoration: none; font-weight: 700; letter-spacing: .02em; }
h1 { font-size: 30px; line-height: 1.2; margin: 24px 0 6px; font-weight: 800; }
h2 { font-size: 19px; margin: 34px 0 8px; font-weight: 700; }
p, li { color: var(--ink); }
.lede, .updated { color: var(--muted); }
.updated { font-size: 14px; margin: 0 0 8px; }
ul { padding-left: 22px; }
li { margin: 6px 0; }
a { color: var(--brand); }
.box {
  border: 1px solid var(--line); border-radius: 14px;
  background: var(--surface); padding: 16px 18px; margin: 20px 0;
}
footer {
  margin-top: 48px; padding-top: 20px; border-top: 1px solid var(--line);
  color: var(--muted); font-size: 14px;
}
footer a { margin-right: 14px; }
