/* Long-form Pergamena history. Only this editorial page uses these reading rules. */
body .prose--page .history-toc {
    max-width: 730px;
    margin: 0 0 54px;
    padding: 24px 28px 27px;
    border-top: 2px solid var(--accent);
    background: var(--surface-sage);
    text-align: left;
    hyphens: none;
}
.history-toc__title {
    margin: 0 0 14px !important;
    font: 600 12px/1.4 var(--font-latin-body, var(--font-body));
    letter-spacing: .07em;
    color: var(--accent);
    text-transform: uppercase;
}
.history-toc ol {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px 22px;
    margin: 0 !important;
    padding: 0;
    list-style: none;
    font: 15px/1.5 var(--font-latin-body, var(--font-body));
}
.history-toc li { margin: 0; padding: 0; }
.history-toc a { color: var(--ink); text-decoration: none; text-underline-offset: 3px; }
.history-toc a:hover, .history-toc a:focus-visible { text-decoration: underline; }
.history-chapter { max-width: 75ch; scroll-margin-top: 38px; }
.history-chapter + .history-chapter { margin-top: 46px; }
.prose--page .history-chapter h2 {
    font: 600 clamp(24px, 2.8vw, 30px)/1.3 var(--font-latin-display, var(--font-display));
    margin: 0 0 21px;
    color: var(--ink);
    text-align: left;
    hyphens: none;
}
.prose--page .history-chapter h3 {
    font: 600 clamp(20px, 2.2vw, 24px)/1.35 var(--font-latin-display, var(--font-display));
    margin: 34px 0 14px;
    text-align: left;
    hyphens: none;
}
.prose--page .history-chapter p {
    font-size: 18px;
    line-height: 1.75;
    text-align: justify;
    text-align-last: start;
    hyphens: auto;
}
.history-chapter a { text-decoration-thickness: 1px; text-underline-offset: 3px; }
.history-chapter h2 a { color: inherit; text-decoration: none; border-bottom: 1px solid var(--accent); }
.history-chapter h2 a:hover, .history-chapter h2 a:focus-visible { color: var(--accent); }
.prose--page .history-chapter .history-closing {
    margin-top: 32px;
    padding-top: 18px;
    border-top: 1px solid var(--rule);
    text-align: justify;
    text-align-last: start;
    hyphens: auto;
    font-size: 20px;
}
body .page-heading .history-subtitle {
    margin: 12px 0 0;
    color: var(--muted);
    font: italic 24px/1.4 var(--font-latin-display, var(--font-display));
    text-align: left;
}
.history-link-panel {
    margin: 34px 0 38px;
    border-top: 1px solid var(--accent);
    padding-top: 20px;
    text-align: left;
}
.history-link-panel h2 { margin: 0 0 8px !important; font: 600 23px/1.35 var(--font-latin-display, var(--font-display)); }
.history-link-panel p { margin: 0 0 12px; font-size: 16px; line-height: 1.6; }
.history-link-panel a { text-underline-offset: 3px; }
@media (max-width: 700px) {
    body .prose--page .history-toc { margin-bottom: 40px; padding: 19px 20px 22px; }
    .history-toc ol { grid-template-columns: 1fr; gap: 12px; }
    .history-chapter + .history-chapter { margin-top: 38px; }
    .prose--page .history-chapter p { font-size: 17px; line-height: 1.72; text-align: justify; text-align-last: start; hyphens: auto; }
    .prose--page .history-chapter h2 { font-size: 24px; }
    .prose--page .history-chapter h3 { font-size: 21px; }
    body .page-heading .history-subtitle { font-size: 21px; }
    .prose--page .history-chapter .history-closing { font-size: 19px; }
}

/* Short orientation before the full article; nothing is hidden on small screens. */
body .prose--page .history-lead {
    max-width: 72ch;
    margin: 0 0 30px;
    text-align: left;
    text-align-last: auto;
    hyphens: none;
}
.prose--page .history-lead .history-lead__label {
    font: 600 12px/1.4 var(--font-latin-body, var(--font-body));
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--accent);
    margin: 0 0 9px;
}
.prose--page .history-lead p:not(.history-lead__label) {
    font-size: 18px;
    line-height: 1.7;
    margin: 0;
    text-align: justify;
    text-align-last: start;
    hyphens: auto;
}
@media (max-width: 700px) {
    body .prose--page .history-lead { margin-bottom: 24px; }
    .prose--page .history-lead p:not(.history-lead__label) {
        font-size: 17px;
        line-height: 1.65;
    }
}

/* On phones, a quiet route back to the table of contents after each chapter. */
.history-backlink { display: none; }
@media (max-width: 700px) {
    .prose--page .history-chapter .history-backlink { display: block; margin: 16px 0 0; font: 14px/1.5 var(--font-latin-body, var(--font-body)); text-align: left; hyphens: none; }
    .history-backlink a { color: var(--muted); text-decoration: none; }
    .history-backlink a:hover, .history-backlink a:focus-visible { color: var(--accent); text-decoration: underline; }
}