/* Story-origins articles: illustration and timeline. Loaded only on pages that use them (layout $extraCss). */
.origin-figure { margin: 24px 0; border-radius: 24px; overflow: hidden; border: 1px solid var(--line); background: var(--panel-soft); }
.origin-figure img { display: block; width: 100%; max-height: 420px; object-fit: cover; }
.origin-figure figcaption { padding: 12px 18px; color: var(--muted); font-size: 14px; line-height: 1.5; }
.origin-timeline { list-style: none; margin: 18px 0 0; padding: 0 0 0 18px; border-left: 3px solid var(--mint); }
.origin-timeline li { position: relative; display: grid; gap: 2px; padding: 0 0 18px 20px; }
.origin-timeline li::before { content: ""; position: absolute; left: -29px; top: 6px; width: 14px; height: 14px; border-radius: 50%; background: var(--gold); box-shadow: 0 0 0 4px var(--bg); }
.origin-timeline .when { color: var(--gold); font-weight: 800; font-size: 15px; }
.origin-timeline .what { color: var(--text-soft); font-size: 17px; line-height: 1.6; }
.origin-sources li { font-size: 15px; color: var(--muted); }