/* The legal pages: plain reading pages in the app's colors and fonts. */
@font-face {
  font-family: 'Fraunces';
  src: url('/fonts/fraunces.woff2') format('woff2');
  font-weight: 500 800;
  font-display: swap;
}
@font-face {
  font-family: 'Figtree';
  src: url('/fonts/figtree.woff2') format('woff2');
  font-weight: 400 700;
  font-display: swap;
}

:root {
  color-scheme: dark;
  --bg: #07040a;
  --ink: #fff1e2;
  --ink-2: rgba(255, 236, 214, 0.78);
  --ink-3: rgba(255, 236, 214, 0.5);
  --line: rgba(255, 214, 178, 0.14);
  --ember-hot: #ffb547;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  padding: 20px 20px 40px;
  background: var(--bg);
  color: var(--ink-2);
  font: 16px/1.6 'Figtree', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
}

main, header, footer { width: min(720px, 100%); margin: 0 auto; }
header { padding-bottom: 28px; }
.brand { font: 700 21px 'Fraunces', Georgia, serif; color: var(--ink); text-decoration: none; }
h1 { margin: 0 0 4px; font: 700 clamp(30px, 7vw, 40px)/1.1 'Fraunces', Georgia, serif; color: var(--ink); }
h2 { margin: 30px 0 6px; font: 700 21px/1.25 'Fraunces', Georgia, serif; color: var(--ink); }
p, ul { margin: 0 0 12px; }
ul { padding-left: 20px; }
li { margin-bottom: 5px; }
a { color: var(--ember-hot); }
.updated { color: var(--ink-3); font-size: 14px; }
footer { display: flex; flex-wrap: wrap; gap: 8px 18px; margin-top: 36px; padding-top: 18px; border-top: 1px solid var(--line); font-size: 14px; }