/* THE READING LAYOUT, SHARED (research round 2026-09-13).

   One reading column for every server-rendered public page: the blog and
   the research page both link this file, so the two cannot drift apart.

   It is the product's own reading column. The Zen reading layout in chat
   sets prose in Georgia/Noto Serif at 16px, line-height 1.8, letter-
   spacing .01em, over a 660px measure; a page reads like a reply reads.
   Code, tables and metadata keep the UI face, as they do in chat. No
   client script is needed to read any of it. */

.prose{max-width:660px;
  font-family:Georgia,'Noto Serif',serif;font-size:16px;line-height:1.8;
  letter-spacing:.01em;color:var(--ink2)}
:root[data-theme=light] .prose{color:#3c414b}
.prose p{margin:0 0 18px}
.prose h2{font-family:"Space Grotesk",system-ui,sans-serif;
  font-size:21px;line-height:1.3;letter-spacing:-.01em;color:var(--ink);
  margin:34px 0 10px}
.prose h3{font-family:"Space Grotesk",system-ui,sans-serif;
  font-size:17px;color:var(--ink);margin:24px 0 8px}
.prose ul,.prose ol{padding-left:22px;margin:0 0 18px}
.prose li{margin:6px 0}
.prose strong{color:var(--ink);font-weight:600}
.prose a{text-decoration:underline;text-underline-offset:3px}
.prose blockquote{margin:22px 0;padding:2px 0 2px 18px;
  border-left:2px solid var(--line-bright);color:var(--ink3)}
.prose hr{border:0;border-top:1px solid var(--line);margin:30px 0}
.prose img{display:block;border-radius:10px;margin:22px 0;
  border:1px solid var(--line);height:auto}
/* the exceptions keep the UI face, as the chat reading layout does */
.prose pre,.prose code{
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  letter-spacing:0}
.prose code{font-size:13px;background:var(--field);
  border:1px solid var(--fieldline);border-radius:5px;padding:1px 5px}
.prose pre{font-size:13px;line-height:1.55;background:var(--field);
  border:1px solid var(--fieldline);border-radius:10px;padding:14px 16px;
  overflow-x:auto}
.prose pre code{background:none;border:0;padding:0}

/* THE PAGE HEADLINE AND LEAD, SHARED (download round 2026-09-14). The
   research page and the download page each carried the same headline,
   lead and desktop widening rules; they live here once. A page opts in
   with class="readpage" on its <main>. Written for 390px first. */
.readpage{padding-block:28px 12px}
.readpage h1{font-size:30px;line-height:1.15;letter-spacing:-.02em;
  margin:6px 0 14px}
.readpage .lead{font-size:18px;line-height:1.55;color:var(--ink);
  margin:0 0 22px;max-width:38ch}
@media (min-width:720px){
  .readpage{padding-block:56px 20px}
  .readpage h1{font-size:42px}
  .readpage .lead{font-size:21px}
}