/* Shared by privacy.html, terms.html and delete-account.html.

   Colours are generated — do not hand-edit between the markers below. They
   come from DESIGN.md's frontmatter, which mobile/test/core/design_md_test.dart
   already proves equal to the app's colors.dart.
   Regenerate with: node scripts/generate-web-tokens.mjs */
:root {
  /* @generated from DESIGN.md — run scripts/generate-web-tokens.mjs */
  --paper                  : #FCF5E5;
  --surface                : #FFFBF2;
  --surface-2              : #F4E9D3;
  --surface-3              : #EADBBE;
  --elevated               : #FFFDF8;
  --border                 : #E0D0C8;
  --border-2               : #8E7F72;
  --text                   : #212121;
  --text-2                 : #545454;
  --text-3                 : #6B6157;
  --brand-fill             : #D9822B;
  --brand-fill-pressed     : #C9731F;
  --on-brand-fill          : #212121;
  --brand-ink              : #9A5414;
  --brand-soft             : #F8E3C8;
  --secondary              : #2B2320;
  --on-secondary           : #FCF5E5;
  --accent                 : #006E5B;
  --accent-soft            : #DCEEE7;
  --attention              : #8A5200;
  --attention-soft         : #F6E6CC;
  --error                  : #B3261E;
  --error-soft             : #F8E1DC;
  --info                   : #2F5E9E;
  --info-soft              : #E3EAF4;
  --ink                    : #1F1A17;
  --ink-2                  : #2B2320;
  --on-ink                 : #F3ECDF;
  --on-ink-muted           : rgba(243, 236, 223, 0.74);
  --brand-on-ink           : #F0A35E;
  --mood-calm              : #3D6A99;
  --mood-stressed          : #A33D52;
  --mood-celebrating       : #866200;
  --mood-bored             : #5E6A3E;
  --mood-social            : #6A4C9C;
  --mood-calm-soft         : #E4EBF3;
  --mood-stressed-soft     : #F6E2E5;
  --mood-celebrating-soft  : #F5EAC9;
  --mood-bored-soft        : #E8EBDA;
  --mood-social-soft       : #ECE5F5;
  --mood-calm-on-ink       : #8FB4E3;
  --mood-stressed-on-ink   : #E8899B;
  --mood-celebrating-on-ink: #E0B84A;
  --mood-bored-on-ink      : #AEBB82;
  --mood-social-on-ink     : #B9A2E6;
  --dark-bg                : #171411;
  --dark-surface           : #211C18;
  --dark-surface-2         : #2B2520;
  --dark-surface-3         : #362F29;
  --dark-border            : #3A322B;
  --dark-border-2          : #7F7468;
  --dark-text              : #F3ECDF;
  --dark-text-2            : #C9BFB2;
  --dark-text-3            : #A69B8E;
  --dark-brand-fill        : #E8A15A;
  --dark-on-brand-fill     : #171411;
  --dark-brand-ink         : #F0A35E;
  --dark-brand-soft        : #3A2A1A;
  --dark-accent            : #4FC2A6;
  --dark-attention         : #E3B062;
  --dark-error             : #F2928A;
  /* @end generated */

  /* The page's own roles, named so a change is one line rather than a search.

     Light only, deliberately: index.html paints paper at every width and has
     no dark treatment, so following "Privacy policy" out of a paper-white
     landing page into a dark one would read as a different site. The dark-*
     tokens above are the app's — the app follows the system theme, the site
     does not. Give index.html a dark mode and these six lines are where the
     legal pages join it. */
  color-scheme: light;
  /* The site's canvas palette (see index.html, "SITE TOKENS"); the generated
     block above stays untouched for the token --check. */
  --page-bg: #FCF5E5;
  --page-text: #212121;
  --page-muted: #6B6157;
  --page-rule: #E0D0C8;
  --page-link: #9A5414;
  --page-card: #FFFBF2;
}

body {
  max-width: 44rem;
  margin: 0 auto;
  padding: 2rem 1.25rem 4rem;
  font: 400 16px/1.65 "IBM Plex Sans", -apple-system, system-ui, "Segoe UI", Roboto, sans-serif;
  color: var(--page-text);
  background: var(--page-bg);
  -webkit-font-smoothing: antialiased;
}
nav { margin-bottom: 2rem; font-size: .95rem; }
nav a { margin-right: 1.25rem; }
h1 { font-family: "Fraunces", Georgia, serif; font-size: 2rem; font-weight: 600; line-height: 1.25; letter-spacing: -.01em; margin: 0 0 .25rem; }
h2 { font-size: 1.15rem; font-weight: 600; letter-spacing: -.005em; margin: 2.25rem 0 .5rem; }
.meta { color: var(--page-muted); margin: 0 0 1.5rem; }
a { color: var(--page-link); }
ul, ol { padding-left: 1.25rem; }
li + li { margin-top: .35rem; }
.table-wrap { overflow-x: auto; }
table { border-collapse: collapse; width: 100%; font-size: .95rem; }
th, td {
  text-align: left;
  vertical-align: top;
  padding: .55rem .75rem .55rem 0;
  border-bottom: 1px solid var(--page-rule);
}
.callout {
  border: 1px solid var(--page-rule);
  border-radius: 10px;
  background: var(--page-card);
  padding: .75rem 1.25rem;
}
footer {
  margin-top: 3rem;
  padding-top: 1rem;
  border-top: 1px solid var(--page-rule);
  color: var(--page-muted);
  font-size: .9rem;
}