/* Posts and plain pages: a readable column. Guide-article typography comes from the body's own classes. */
.wrap-page, .post-page { max-width: 860px; margin: 0 auto; padding: 56px 24px 80px; }
.page-snapshot .wrap-page { max-width: 1240px; }
.post-page { display: flex; flex-direction: column; }
.post-page > .post { display: contents; }
.post-title, .page-title { font-size: clamp(32px, 3vw, 42px); line-height: 1.25; font-weight: 400; margin: 0 0 .5em; order: 1; color: var(--ink-alt); }
.post-meta { order: 2; margin: 0 0 28px; font-size: 16px; color: var(--muted); }
.post-meta .author { color: var(--link); font-weight: 600; text-transform: capitalize; }
.post-figure { order: 3; margin: 0 0 34px; }
.post-figure img { display: block; width: auto; max-width: 100%; border-radius: 14px; } /* never upscaled past its own width (old posts carry small originals) */
.post-page .prose-body { order: 4; }
.post-plain .post-meta { margin-bottom: 18px; }
.prose-body { font-size: 18px; line-height: 1.75; }
.prose-body h2 { font-size: clamp(1.45rem, 3vw, 1.85rem); margin: 2.8rem 0 1rem; }
.prose-body h3 { font-size: 24px; margin: 2rem 0 .7rem; }
.prose-body h4 { font-size: 22px; } .prose-body h5 { font-size: 20px; } .prose-body h6 { font-size: 18px; }
.prose-body a { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .16em; }
.prose-body ul, .prose-body ol { padding-left: 1.4em; }
.prose-body li { margin-bottom: .35em; }
.prose-body figure { margin: 2.5rem 0; }
.prose-body figcaption { font-size: 14px; color: var(--muted); margin-top: .6em; }
.prose-body blockquote { margin: 1.5em 0; padding: 0 0 0 18px; border-left: 3px solid var(--line-strong); }
.prose-body table { border-collapse: collapse; width: 100%; font-size: 16px; }
.prose-body th { background: var(--teal); color: var(--on-brand); text-align: left; }
.prose-body th, .prose-body td { padding: 10px 14px; border: 1px solid var(--line); vertical-align: top; }
.prose-body details { border: 1px solid var(--line); border-radius: 12px; padding: 12px 18px; margin: 1.2em 0; background: var(--surface); }
.prose-body summary { cursor: pointer; font-weight: 600; }
.prose-body img { height: auto; border-radius: 8px; }
.prose-body iframe { max-width: 100%; }
.ro-table-scroll { overflow-x: auto; }
.ro-mode { text-transform: uppercase; font-size: 15px; letter-spacing: .04em; margin: 0 0 1.2em; padding-bottom: 1em; border-bottom: 1px solid var(--line); }
.ro-standfirst { font-size: 19px; color: var(--muted); }
.ro-note { margin: 1.5em 0; padding-left: 18px; border-left: 3px solid var(--line-strong); color: var(--ink); }
.ro-contents { margin: 2em 0; padding: 18px 24px; background: var(--shell); border: 1px solid var(--line); border-radius: 14px; }
.ro-contents ul { columns: 2; column-gap: 30px; }
@media (max-width: 767px) { .wrap-page, .post-page { padding: 32px 20px 56px; } .ro-contents ul { columns: 1; } }