/* Shared by /privacy and /terms. Same type as the app: Fraunces for the
   headings that carry the brand, Inter for everything a person reads. */
@import url('/fonts.css');

:root {
  --ink-950: #0b0d10;
  --ink-900: #12151a;
  --ink-700: #2a2f38;
  --ink-400: #7a8494;
  --ink-200: #c3cad6;
  --ink-50: #f3f4f7;
  --accent: #80e0d1;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  padding: 0 24px 96px;
  background: var(--ink-950);
  color: var(--ink-200);
  font-family: Inter, system-ui, sans-serif;
  font-size: 17px;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
}

main { max-width: 680px; margin: 0 auto; }

header { padding: 72px 0 8px; }

.wordmark {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: var(--ink-50);
  font-family: Fraunces, Georgia, serif;
  font-size: 24px;
  font-weight: 700;
  letter-spacing: -0.01em;
  line-height: 1;
  text-decoration: none;
}
.wordmark img { width: 38px; height: 38px; border-radius: 11px; }

h1 {
  font-family: Fraunces, Georgia, serif;
  font-weight: 700;
  font-size: 40px;
  line-height: 1.15;
  color: var(--ink-50);
  margin: 24px 0 8px;
  letter-spacing: -0.02em;
}

.updated { color: var(--ink-400); font-size: 15px; margin: 0 0 40px; }

h2 {
  font-family: Fraunces, Georgia, serif;
  font-weight: 600;
  font-size: 24px;
  color: var(--ink-50);
  margin: 44px 0 12px;
}

p, li { margin: 0 0 14px; }
ul { padding-left: 22px; }
strong { color: var(--ink-50); font-weight: 600; }
a { color: var(--accent); }

table { width: 100%; border-collapse: collapse; margin: 16px 0 24px; font-size: 16px; }
th, td { text-align: left; padding: 10px 12px; border-bottom: 1px solid var(--ink-700); vertical-align: top; }
th { color: var(--ink-50); font-weight: 600; }

footer {
  margin-top: 64px;
  padding-top: 24px;
  border-top: 1px solid var(--ink-700);
  color: var(--ink-400);
  font-size: 15px;
}

@media (prefers-color-scheme: light) {
  :root { --accent: #0f766e; }
  body { background: #f3f4f7; color: #3a4250; }
  .wordmark, h1, h2, strong, th { color: #12151a; }
  .updated, footer { color: #5c6675; }
  th, td { border-bottom-color: #dfe3ea; }
}