. Text wraps around them; they
never crowd headings or the next section. Pair the enlarge control with
.view-larger. Use only on About / field / personal / conceptual pages. */
.scrapbook-figure, .wrap-figure, .float-figure{
float:right; clear:right;
width:min(380px, 42%); /* 340–420px range, capped at 42% of the text column */
margin:32px 0 28px 52px; /* >=32px below a preceding heading; 52px text gutter */
}
.scrapbook-figure > img, .wrap-figure > img, .float-figure > img{
display:block; width:100%; height:auto; border-radius:18px;
}
.scrapbook-figure > figcaption, .wrap-figure > figcaption, .float-figure > figcaption{ margin-top:8px; }
/* ── Image captions — GLOBAL spacing rule ─────────────────────────────────
Captions sit 8px below their image (connected, not glued), line-height 1.3.
Never exceed 10px margin-top unless a specific layout requires it. */
figure figcaption, .image-caption, .caption{ margin-top:8px; line-height:1.3; }
/* Clearfix: keep the float inside its own section (never leaks into the next). */
.prose::after, .legal::after, .ms::after,
.about-section::after, .article-section::after, .content-section::after{
content:""; display:table; clear:both;
}
@media(max-width:800px){
.scrapbook-figure, .wrap-figure, .float-figure{
float:none; width:100%; max-width:none; margin:28px 0 32px;
}
}
/* ── Editorial insert system (magazine-style side rail) — OPT-IN ───────────
Two image/insert modes on PolyglotMint:
• MODE 1 — Academic / article figures (DEFAULT): not wrapped, no class. They
stay centered / full-width in the article flow, placed after the paragraph
that discusses them, and never drift into the next section.
• MODE 2 — Editorial side-rail inserts (opt-in): give a section body a right
rail. Wrap it in .editorial-row containing a .editorial-main reading column
and a .editorial-rail. Drop inserts (.editorial-insert + a variant:
.rail-image / .rail-quote / .rail-card / .rail-note / .rail-related) into
the rail. The rail collapses BELOW the text before the reading column gets
cramped, so text never drops under ~58ch. For a single paragraph-anchored
cut-in, use the floated .scrapbook-figure instead. */
.editorial-row{ display:grid; grid-template-columns:minmax(0,680px) minmax(300px,360px); gap:clamp(48px,5vw,64px); align-items:start; max-width:1120px; margin-inline:auto; }
.editorial-main{ max-width:700px; min-width:0; }
.editorial-rail{ max-width:380px; margin-top:48px; } /* >=40px (preferred 48) below the section heading */
.editorial-insert{ margin:0 0 36px; }
.editorial-insert:last-child{ margin-bottom:0; }
.editorial-insert > img, .rail-image > img{ display:block; width:100%; height:auto; border-radius:18px; border:1px solid var(--line); box-shadow:0 6px 22px rgba(17,17,17,.08); }
.editorial-insert figcaption{ margin-top:8px; font-family:var(--serif-body); font-size:.9rem; line-height:1.3; color:var(--ink-faint); }
/* ── "↗ View larger" button — mirrors the Psychomedia .board-expand button EXACTLY
(source of truth), with native