/* Quiet, centered figures from the author's revised manuscript. */
.revision-figure { margin-top: 32px; margin-bottom: 38px; }
.revision-figure img { display: block; width: 100%; height: auto; }
.revision-figure figcaption { max-width: 780px; margin-top: 16px; }
.revision-medium { width: 660px; max-width: 100%; margin-left: 0; margin-right: 0; }
.revision-broad { width: 900px; margin-left: -120px; margin-right: -120px; }
.revision-details { margin-top: 16px; font: 13px/1.6 var(--sans); color: var(--muted); }
.revision-details summary { cursor: pointer; color: var(--accent); }
.revision-details img { margin-top: 20px; }
.revision-details p { font: 13px/1.6 var(--sans); margin-top: 14px; }
.anchor-alias { display: block; scroll-margin-top: 85px; }
#appendix { margin-top: 90px; border-top: 1px solid var(--line); }
@media(max-width: 1000px) {
 .revision-broad { width: 100%; max-width: 100%; margin-left: 0; margin-right: 0; }
}
@media(max-width: 600px) {
 .revision-figure { margin-top: 24px; margin-bottom: 28px; }
 .revision-figure figcaption { font-size: 12px; }
}

/* The measured 13-neuron viewer follows the paper's existing wide-figure geometry. */
.c13.wide { width: min(1040px, calc(100vw - 80px)); margin: 36px 0 42px; position: relative; left: 50%; transform: translateX(-50%); }
@media (max-width: 760px) { .c13.wide { width: 100%; } }
@media print { .c13.wide { width: 100%; left: 0; transform: none; } }
#essay > section > h3 { margin-top: 42px; scroll-margin-top: 85px; font-size: 21px; line-height: 1.3; }
@media (max-width: 760px) { #essay > section > h3 { font-size: 19px; } }

#essay > section > h4.subsub { font-family: var(--display); font-size: 21px; font-weight: 600; line-height: 1.3; letter-spacing: 0; margin: 40px 0 14px; scroll-margin-top: 85px; color: var(--ink); }
@media (max-width: 720px) { #essay > section > h4.subsub { font-size: 19px; } }

/* One caption style for every figure (round-4 figure audit). Only top-level figure captions; nested labels keep their own styles. */
#essay section > figure > figcaption, #essay section > .wide > figure > figcaption { font-family: var(--sans) !important; font-size: 13px !important; line-height: 1.5 !important; color: #717a80 !important; text-align: left; }
#essay #city-hero > figcaption, #essay #recursive-explainability > figcaption, #essay #routes-to-understanding > figcaption { text-align: center; }

/* Hidden footnote popovers take no width, so a mark near the right edge can’t widen the page. The width is removed only
   after the fade-out, so a closing popover doesn’t squeeze into a tall, thin column while it fades. */
.fn-pop{max-width:0;overflow:hidden;transition:opacity .15s,transform .15s,visibility .15s,max-width 0s .15s}
.fn:hover .fn-pop,.fn.fn-open .fn-pop,.fn-mark:focus-visible+.fn-pop{max-width:min(300px,80vw);overflow:visible;transition:opacity .15s,transform .15s,visibility .15s}

/* Pause/play for animated figures (dist/figure-pause.js; contract in proposals/pause-control.md).
   Quiet caption type, pinned to the figure's top-right corner so it never moves the layout. */
.fig-pause{position:absolute;top:0;right:0;z-index:3;display:inline-flex;align-items:center;gap:5px;margin:0;padding:3px 2px 3px 6px;border:0;border-radius:3px;background:none;font:13px/1.5 var(--sans);color:#717a80;cursor:pointer;white-space:nowrap;-webkit-tap-highlight-color:transparent}
.fig-pause:hover{color:#28627b}
.fig-pause.fig-pause:focus-visible{outline:3px solid #3585ab;outline-offset:5px}   /* doubled class: outranks figures' own `.x button:focus-visible` */
.fig-pause svg{display:block;width:12px;height:12px;flex:none;fill:currentColor}
.fig-pause[hidden]{display:none}
@media print{.fig-pause{display:none}}

/* numbered list in the essay body: same type as article p (style.css), so it reads as prose */
article ol.essay-list{margin:0 0 23px;padding-left:1.5em}
article ol.essay-list li{font:19px/1.75 var(--serif);margin:0 0 6px;padding-left:.25em}
@media (max-width:760px){article ol.essay-list li{font-size:18px}}