/* The plain text pages (about, privacy): the app's paper, ink and type, one readable column. */
:root {
  --page: #e3dfd2;
  --rule: #d8d3c5;
  --ink: #141413;
  --muted: #7a776d;
  --serif: 'Source Serif 4', 'Iowan Old Style', Charter, Georgia, serif;
  --sans: 'Hanken Grotesk', 'Avenir Next', 'Seravek', ui-sans-serif, system-ui, sans-serif;
}
html { background: var(--page); }
body { margin: 0; color: var(--ink); font: 18px/1.6 var(--serif); -webkit-font-smoothing: antialiased; }
main { max-width: 640px; margin: 0 auto; padding: 40px 20px 96px; }
.home { display: inline-block; font: 500 28px/0.9 var(--serif); letter-spacing: -0.03em; color: var(--ink); text-decoration: none; }
h1 { margin: 72px 0 8px; font: 500 clamp(44px, 9vw, 72px)/0.95 var(--serif); letter-spacing: -0.03em; }
.dek { margin: 16px 0 44px; font-size: 21px; color: var(--muted); }
h2 { margin: 48px 0 10px; font: 500 26px/1.2 var(--serif); letter-spacing: -0.01em; }
p, ul { margin: 0 0 16px; }
ul { padding-left: 20px; }
li { margin-bottom: 6px; }
a { color: inherit; text-decoration-color: var(--muted); text-underline-offset: 3px; }
a:hover { text-decoration-color: var(--ink); }
.small { font-size: 15px; color: var(--muted); }
footer { margin-top: 64px; padding-top: 16px; border-top: 1px solid var(--rule); font: 14px var(--sans); color: var(--muted); }
footer a { margin-right: 18px; }
@media (max-width: 600px) {
  body { font-size: 17px; }
  main { padding-top: 24px; }
  h1 { margin-top: 48px; }
}