/* ─────────────────────────────────────────────────────────────────────────────
   Jelly — legal document pages (terms.html, privacy.html, accessibility.html).
   Loads AFTER tokens.css + jelly-ui.css. Deliberately plain: these pages are
   read, not browsed. Ivory field, Fraunces headings, Instrument Sans body,
   Jelly Pink links, one 720px column.
   The DRAFT banner is tangerine — the sparing accent — because an unreviewed
   legal page must never look finished.
   ───────────────────────────────────────────────────────────────────────────── */

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  background:var(--color-surface-page);
  color:var(--color-text-primary);
  font-family:var(--font-ui);
  font-size:16.5px;
  line-height:1.62;
  -webkit-font-smoothing:antialiased;
}

/* ── draft banner ───────────────────────────────────────────────────────── */
.draft{
  background:var(--raw-tangerine);
  color:#fff;
  padding:14px 20px;
  font-size:14.5px;
  line-height:1.45;
  font-weight:600;
  letter-spacing:.005em;
  position:sticky;top:0;z-index:10;
}
.draft .in{max-width:720px;margin:0 auto}
.draft strong{font-weight:800;letter-spacing:.06em;text-transform:uppercase;font-size:12.5px;
  display:block;margin-bottom:2px;opacity:.92}

/* ── chrome ─────────────────────────────────────────────────────────────── */
.doc-nav{max-width:720px;margin:0 auto;padding:28px 20px 0}
.doc-nav img{height:26px;width:auto;display:block}
.doc{max-width:720px;margin:0 auto;padding:28px 20px 96px}

.doc-foot{
  max-width:720px;margin:0 auto;padding:0 20px 72px;
  border-top:1px solid var(--color-border-soft);
  padding-top:22px;font-size:14px;color:var(--color-text-secondary);
}
.doc-foot a{font-weight:600}

/* ── type ───────────────────────────────────────────────────────────────── */
.doc h1{
  font-family:var(--font-display);font-variation-settings:var(--font-display-settings);
  font-weight:900;font-size:clamp(32px,5.4vw,46px);line-height:1.04;
  letter-spacing:-.02em;margin:8px 0 6px;
}
.doc h2{
  font-family:var(--font-display);font-variation-settings:var(--font-display-settings);
  font-weight:800;font-size:clamp(21px,3vw,26px);line-height:1.18;
  letter-spacing:-.012em;margin:44px 0 10px;
}
.doc h3{font-size:17px;font-weight:700;margin:26px 0 6px;letter-spacing:-.005em}
.doc h2+h3{margin-top:16px}
.doc p{margin:0 0 14px}
.doc ul,.doc ol{margin:0 0 16px;padding-left:22px}
.doc li{margin:0 0 7px}
.doc a{color:var(--color-action-primary);font-weight:600;text-decoration:underline;
  text-underline-offset:2px;text-decoration-thickness:1px}
.doc strong{font-weight:700}
.doc hr{border:0;border-top:1px solid var(--color-border-soft);margin:40px 0}
.doc .meta{color:var(--color-text-secondary);font-size:14.5px;margin-bottom:26px}

/* Bracketed placeholders stay loud on purpose — they are honest, and they are
   the reason this page is not publishable yet. */
.doc .ph{
  display:block;margin:0 0 16px;padding:11px 14px;
  border-left:3px solid var(--raw-tangerine);
  background:var(--color-surface-tint);
  font-size:14.5px;line-height:1.5;color:var(--color-text-primary);
}
.doc .ph code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13px;
  font-weight:700;color:var(--raw-tangerine);letter-spacing:.01em}

.doc blockquote{
  margin:0 0 18px;padding:12px 16px;border-left:3px solid var(--color-border-soft);
  background:var(--color-surface-tint);font-size:15px;color:var(--color-text-secondary)
}

/* ── tables ─────────────────────────────────────────────────────────────── */
.tw{overflow-x:auto;margin:0 0 20px;-webkit-overflow-scrolling:touch}
.doc table{border-collapse:collapse;width:100%;min-width:420px;font-size:14.5px}
.doc th,.doc td{text-align:left;padding:9px 12px;border-bottom:1px solid var(--color-border-soft);
  vertical-align:top}
.doc th{font-weight:700;font-size:12.5px;letter-spacing:.06em;text-transform:uppercase;
  color:var(--color-text-secondary)}
.doc td code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12.5px}

/* ── internal appendix ──────────────────────────────────────────────────── */
.appendix{
  margin-top:56px;padding:22px 20px 4px;
  border:1px dashed var(--raw-tangerine);border-radius:16px;
  background:var(--color-surface-tint);
}
.appendix .flag{
  font-size:12.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;
  color:var(--raw-tangerine);margin:0 0 8px
}
.appendix h2{margin-top:22px;font-size:20px}
.appendix h2:first-of-type{margin-top:6px}