/* wordcatch.app: privacy and support pages. Same tokens as docs/showcase. */
@import url("https://fonts.googleapis.com/css2?family=Atkinson+Hyperlegible:wght@400;700&family=Bricolage+Grotesque:opsz,wght@12..96,700;12..96,800&display=swap");

:root {
  color-scheme: dark;
  --ground: #07090c;
  --panel: #10161e;
  --edge: #1f2a36;
  --ink: #eef3f8;
  --muted: #93a1b2;
  --cyan: #36e3ff;
  --violet: #8b5cff;
  --display: "Bricolage Grotesque", "Avenir Next", "Segoe UI", system-ui, sans-serif;
  --body: "Atkinson Hyperlegible", "Helvetica Neue", Arial, system-ui, sans-serif;
}
@media (prefers-color-scheme: light) {
  :root { color-scheme: light; --ground: #f3f6fa; --panel: #fff; --edge: #d9e1ea; --ink: #0c1219; --muted: #4f5d6d;
          --cyan: #0487a6; --violet: #6a3ee6; }
}

* { box-sizing: border-box; }
body { margin: 0; background: var(--ground); color: var(--ink); font: 400 17px/1.65 var(--body);
       padding-inline: 20px; padding-block: 40px 72px; }
.doc { max-width: 720px; margin: 0 auto; display: grid; gap: 14px; }
.home { display: inline-flex; align-items: center; gap: 10px; color: var(--ink); text-decoration: none;
        font: 700 18px/1 var(--display); margin-bottom: 18px; justify-self: start; }
.home img { border-radius: 10px; }
h1, h2, h3 { font-family: var(--display); line-height: 1.15; margin: 0; text-wrap: balance; }
h1 { font-size: clamp(34px, 6vw, 46px); font-weight: 800; letter-spacing: -.02em; }
h2 { font-size: 24px; font-weight: 700; margin-top: 22px; }
h3 { font-size: 18px; font-weight: 700; margin-top: 10px; }
p, ul, ol { margin: 0; }
ul, ol { padding-left: 22px; display: grid; gap: 8px; }
.lede { font-size: 19px; }
.updated { color: var(--muted); font-size: 15px; }
a { color: var(--cyan); }
a:focus-visible { outline: 2px solid var(--violet); outline-offset: 2px; }
.email { font-weight: 700; color: var(--cyan); user-select: all; }
.links { margin-top: 26px; color: var(--muted); }