/* Shared by privacy.html and terms.html. Plain on purpose: readable text on the site's own
   dark surface, real headings and landmarks, and no script. A hand-kept copy of the app's
   app/renderer/legal.css in this site's own colours (site.css's :root) -- a separate
   deployable site, so there's no build step to share the actual file.

   Same template as the app's three legal pages (see the long comment at the top of
   app/renderer/legal.css for the full convention). In short: Terms numbers its sections,
   Privacy doesn't; footer cross-links always read Privacy, Terms (this site has no Refunds
   page, since no purchase happens here), never linking to itself; an unfilled fact is a
   visible <span class="fill">, never silently guessed at. */
:root {
  --bg: #0A0B0F;
  --surface: #111318;
  --text: #F0F2F5;
  --muted: #9AA3B2;
  --accent: #00C8FF;
  --border: #1E2028;
}
* { box-sizing: border-box; }
html { color-scheme: dark; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font: 16px/1.65 'Segoe UI Variable Text', -apple-system, 'Segoe UI', Roboto, Inter, system-ui, sans-serif;
}
header, main, footer { max-width: 720px; margin: 0 auto; padding: 0 20px; }
header { padding-top: 28px; }
.back { display: inline-block; margin-bottom: 20px; }
h1 { margin: 0 0 6px; font-size: 28px; line-height: 1.25; }
h2 { margin: 34px 0 6px; font-size: 19px; line-height: 1.3; }
p, ul { margin: 0 0 12px; }
ul { padding-left: 22px; }
li { margin: 4px 0; }
.meta { color: var(--muted); font-size: 14px; }
a { color: var(--accent); text-underline-offset: 2px; }
a:hover { text-decoration-thickness: 2px; }
a:focus-visible { outline: 3px solid var(--accent); outline-offset: 2px; border-radius: 2px; }
/* A placeholder still to be filled in by the owner. Visible on purpose. */
.fill { background: rgba(0, 200, 255, 0.18); color: var(--accent); padding: 0 4px; border-radius: 3px; }
.box { border: 1px solid var(--border); background: var(--surface); border-radius: 8px; padding: 14px 16px; margin: 0 0 14px; }
footer { margin-top: 40px; padding-bottom: 40px; color: var(--muted); font-size: 14px; }