/* Long text: a readable column on paper, sticky contents list on wide screens. */
.ex.prose { padding: clamp(56px, 7vw, 104px) 0; background: var(--ex-paper); color: var(--ex-ink-text); }
.ex.prose .prose-grid { display: grid; grid-template-columns: 240px minmax(0, 760px); gap: clamp(32px, 5vw, 80px); justify-content: center; align-items: start; }
.ex.prose .prose-grid.is-single { grid-template-columns: minmax(0, 760px); }
.ex.prose .prose-toc { position: sticky; top: calc(var(--ex-hdr) + 24px); padding: 20px 0 0; border-top: 3px solid transparent; border-image: var(--ex-arc) 1; }
.ex.prose .prose-toc p { margin-bottom: 12px; font-size: 12px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--ex-green-dark); }
.ex.prose .prose-toc ol { display: grid; gap: 8px; counter-reset: ex-toc; }
.ex.prose .prose-toc li { counter-increment: ex-toc; display: grid; grid-template-columns: 26px 1fr; font-size: 14.5px; line-height: 1.4; }
.ex.prose .prose-toc li::before { content: counter(ex-toc, decimal-leading-zero); font-weight: 800; font-style: italic; font-stretch: 115%; color: var(--ex-brand); }
.ex.prose .prose-toc a { color: var(--ex-ink-dim); }
.ex.prose .prose-toc a:hover { color: var(--ex-ink-text); text-decoration: underline; }

.ex.prose .prose-body { font-size: 17px; line-height: 1.7; color: var(--ex-ink-text); }
.ex.prose .prose-updated { margin-bottom: 28px; font-size: 14px; font-weight: 600; color: var(--ex-ink-dim); }
.ex.prose .prose-body > * + * { margin-top: 1em; }
.ex.prose .prose-body h2 { margin-top: 2em; scroll-margin-top: calc(var(--ex-hdr) + 20px); font-size: clamp(22px, 2vw, 28px); font-weight: 800; font-stretch: 112%; font-style: italic; text-transform: uppercase; line-height: 1.1; color: var(--ex-ink-text); }
.ex.prose .prose-body h2:first-of-type { margin-top: 0; }
.ex.prose .prose-body h3 { margin-top: 1.6em; font-size: 19px; font-weight: 700; }
.ex.prose .prose-body ul, .ex.prose .prose-body ol { padding-left: 1.3em; }
.ex.prose .prose-body ul { list-style: disc; }
.ex.prose .prose-body ol { list-style: decimal; }
.ex.prose .prose-body li + li { margin-top: .4em; }
.ex.prose .prose-body a { color: var(--ex-brand); text-decoration: underline; text-underline-offset: 2px; }
.ex.prose .prose-body strong { font-weight: 700; }
.ex.prose .prose-body table { width: 100%; border-collapse: collapse; font-size: 15px; }
.ex.prose .prose-body th, .ex.prose .prose-body td { padding: 10px 12px; border-bottom: 1px solid var(--ex-line-light); text-align: left; vertical-align: top; }

@media (max-width: 900px) {
	.ex.prose .prose-grid { grid-template-columns: minmax(0, 1fr); }
	.ex.prose .prose-toc { position: static; }
}
@media (max-width: 640px) {
	.ex.prose .prose-body { font-size: 16px; }
}