/* The public, indexable pages. Loaded ONLY by `templates/public/base.html`,
   after `app.css` and never instead of it.

   WHY IT IS A SECOND FILE AND NOT A SECTION OF app.css
   The portal is the thing that has to stay fast for the people using it during
   a release window, and it should not carry bytes that exist for a page it
   never renders. Keeping them apart also means this file can be deleted, or
   the whole public surface reverted, without touching the stylesheet the
   portal depends on.

   IT INTRODUCES NO COLOUR. Every value below is either a layout property or an
   existing custom property from app.css, so the light/dark/system contract is
   inherited whole and there is nothing here that can drift away from it. The
   same external-asset rule applies and is tested: no @import, no @font-face,
   no http(s) URL, system fonts only. */

/* Long-form text wants a measure. 68ch is about 10-12 words a line, which is
   where reading speed peaks; wider than that and the eye loses the line it is
   returning to. The cards keep their own full width — only the prose inside
   them is constrained. */
.prose > .card > p,
.prose > .card > ul,
.prose > .card > ol { max-width: 68ch; }

.prose > .card > ul,
.prose > .card > ol { padding-left: 1.2em; }

.prose > .card > ul > li,
.prose > .card > ol > li { margin-bottom: 6px; }

.prose > .card > p:last-child,
.prose > .card > ul:last-child { margin-bottom: 0; }

/* A question is a heading, and there are ten of them in a row. Slightly larger
   than a card heading elsewhere so the page scans as a list of questions
   rather than as a wall of equally-weighted boxes. */
.qa .card { margin-bottom: 12px; }
.qa h2 { font-size: 18px; }
.qa p { margin-bottom: 0; }

/* Buttons sat next to each other in prose need air between them; elsewhere in
   the portal they live in a flex `.actions` row that already provides it. */
.prose .btn + .btn { margin-left: 8px; }

/* The footer carries the disclaimer, which is the one piece of text on the
   page a reader is owed before they believe anything else. It stays quiet but
   it does not shrink below the portal's own small size. */
.foot p { margin: 4px 0; max-width: 78ch; }