/*
 * The holding site on the root domain: a homepage, the privacy policy and the
 * terms. Static files served by the edge Caddy until the app itself runs on
 * this domain. No web fonts and no scripts, so a visitor's browser talks to
 * nobody but us, which is the least a privacy page can do.
 */
:root {
  --ink: #101014;
  --body: #44444c;
  --muted: #8a8a93;
  --hairline: #ececef;
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: #fff;
  color: var(--body);
  font: 16px/1.65 Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}
a { color: var(--ink); text-underline-offset: 3px; }

.top { max-width: 720px; margin: 0 auto; padding: 40px 24px 0; }
.top img { display: block; height: 28px; width: auto; }

.doc { max-width: 720px; margin: 0 auto; padding: 56px 24px 32px; }
.doc h1 { margin: 0; color: var(--ink); font-size: 38px; line-height: 1.12; letter-spacing: -0.025em; font-weight: 700; }
.doc .meta { margin: 10px 0 44px; color: var(--muted); font-size: 14px; }
.doc h2 { margin: 44px 0 8px; color: var(--ink); font-size: 19px; line-height: 1.35; letter-spacing: -0.01em; font-weight: 650; }
.doc h3 { margin: 24px 0 4px; color: var(--ink); font-size: 16px; font-weight: 600; }
.doc p, .doc li { max-width: 68ch; }
.doc ul { padding-left: 1.25em; }
.doc li { margin: 4px 0; }
.doc table { display: block; overflow-x: auto; width: 100%; margin: 14px 0; border-collapse: collapse; font-size: 15px; }
.doc th, .doc td { padding: 10px 16px 10px 0; border-bottom: 1px solid var(--hairline); text-align: left; vertical-align: top; }
.doc th { color: var(--ink); font-weight: 600; }

.foot { max-width: 720px; margin: 0 auto; padding: 28px 24px 56px; border-top: 1px solid var(--hairline); color: var(--muted); font-size: 14px; }
.foot p { margin: 4px 0; }
.foot a { color: var(--body); }

.home { display: flex; min-height: 100vh; flex-direction: column; }
.hero { flex: 1; width: 100%; max-width: 720px; margin: 0 auto; padding: 104px 24px 72px; }
.hero h1 { margin: 0; color: var(--ink); font-size: clamp(44px, 8vw, 68px); line-height: 1; letter-spacing: -0.035em; font-weight: 750; }
.hero .lede { max-width: 34ch; margin: 22px 0 0; color: var(--body); font-size: 20px; line-height: 1.5; }
.hero .soon { margin: 36px 0 0; color: var(--muted); font-size: 15px; }