/* Shared styling for the legal pages (privacy, terms). Mirrors site.html's
   palette and type pairing (Poppins headings / Inter body) so these don't read
   as a bolt-on, but stays deliberately plain — a legal document should be
   scannable and printable, not designed. */
:root {
  --brand: #1a8043;
  --brand-d: #136332;
  --ink: #10201a;
  --body: #41504a;
  --muted: #6d7a73;
  --line: #e4ebe6;
  --tint: #f4f8f5;
  --page: #ffffff;
  --surface: #ffffff;
  color-scheme: light;
}

/* Dark mode, three tiers: the OS preference applies on its own, and an explicit
   choice made in the Learning Center (data-theme, set from localStorage by the
   inline script in each page's head) beats it either way. */
:root[data-theme="dark"] {
  /* Mirrors learn/learn.css so the legal pages, the Learning Center and the
     marketing page agree on what dark looks like. */
  --brand: #4ade80;
  --brand-d: #5fd68a;
  --ink: #f3f4f6;
  --body: #9ca3af;
  --muted: #7d8590;
  --line: #2e303a;
  --page: #16171d;
  --surface: #1f2028;
  --tint: #1a1b22;
  color-scheme: dark;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
  /* Mirrors learn/learn.css so the legal pages, the Learning Center and the
       marketing page agree on what dark looks like. */
    --brand: #4ade80;
    --brand-d: #5fd68a;
    --ink: #f3f4f6;
    --body: #9ca3af;
    --muted: #7d8590;
    --line: #2e303a;
    --page: #16171d;
    --surface: #1f2028;
    --tint: #1a1b22;
    color-scheme: dark;
  }
}
* { box-sizing: border-box; }
body {
  margin: 0;
  font: 16px/1.65 "Inter", system-ui, sans-serif;
  color: var(--body);
  background: var(--page);
  -webkit-font-smoothing: antialiased;
}
.wrap { max-width: 760px; margin: 0 auto; padding: 32px 22px 96px; }

header.doc {
  border-bottom: 1px solid var(--line);
  padding-bottom: 20px;
  margin-bottom: 34px;
}
.brand {
  font-family: "Poppins", system-ui, sans-serif;
  font-weight: 800;
  font-size: 1.05rem;
  color: var(--brand-d);
  letter-spacing: -0.01em;
  text-decoration: none;
  display: inline-block;
}
.brand span { color: var(--ink); }

h1 {
  font-family: "Poppins", system-ui, sans-serif;
  font-weight: 700;
  font-size: 2rem;
  line-height: 1.2;
  color: var(--ink);
  margin: 18px 0 6px;
  text-wrap: balance;
}
h2 {
  font-family: "Poppins", system-ui, sans-serif;
  font-weight: 600;
  font-size: 1.18rem;
  color: var(--ink);
  margin: 38px 0 10px;
  scroll-margin-top: 20px;
}
h3 {
  font-family: "Poppins", system-ui, sans-serif;
  font-weight: 600;
  font-size: 1rem;
  color: var(--ink);
  margin: 24px 0 6px;
}
.updated { color: var(--muted); font-size: 0.9rem; margin: 0; }

p, li { margin: 0 0 12px; }
ul, ol { padding-left: 22px; margin: 0 0 16px; }
li { margin-bottom: 7px; }
a { color: var(--brand-d); }
strong { color: var(--ink); }

/* Anything the reader must not skim past. */
.callout {
  background: var(--tint);
  border: 1px solid var(--line);
  border-left: 3px solid var(--brand);
  border-radius: 8px;
  padding: 14px 16px;
  margin: 20px 0;
}
.callout p:last-child { margin-bottom: 0; }

/* Placeholders still to be filled before publishing — deliberately loud so a
   draft can never go live with them still in it. */
.todo {
  background: #fff4e5;
  border: 1px dashed #d97706;
  color: #8a4b00;
  border-radius: 6px;
  padding: 2px 7px;
  font-weight: 600;
  font-size: 0.92em;
  white-space: nowrap;
}

table { border-collapse: collapse; width: 100%; margin: 8px 0 20px; font-size: 0.94rem; }
th, td { border: 1px solid var(--line); padding: 9px 11px; text-align: left; vertical-align: top; }
th { background: var(--tint); font-weight: 600; color: var(--ink); }
/* Kept white in both themes: a printed page is white paper either way. */
@media print { :root { --page: #ffffff; --surface: #ffffff; --ink: #10201a; --body: #41504a; } }

.toc { background: var(--tint); border: 1px solid var(--line); border-radius: 10px; padding: 16px 18px; margin: 26px 0 34px; }
.toc p { font-weight: 600; color: var(--ink); margin: 0 0 8px; }
.toc ol { margin: 0; padding-left: 20px; }
.toc li { margin-bottom: 4px; }

footer.doc { border-top: 1px solid var(--line); margin-top: 52px; padding-top: 18px; color: var(--muted); font-size: 0.88rem; }

@media print {
  .toc, footer.doc { break-inside: avoid; }
  body { font-size: 11pt; }
}
