.article-shell { max-width: 760px; margin: 60px auto 100px; padding: 0 24px; }
.article-shell:has(> .article-list) { max-width: 1300px; padding-inline: 40px; }
.article-shell h1 { font-size: clamp(2.5rem, 6vw, 4rem); line-height: 1.12; }
.article-body { font-size: 1.125rem; line-height: 1.75; overflow-wrap: anywhere; }
.article-body h2 { margin-top: 2em; line-height: 1.3; }
.article-body h3 { line-height: 1.4; }
.article-body img { display: block; max-width: 100%; height: auto; margin: 24px auto; }
.article-body pre { overflow-x: auto; padding: 16px; background: var(--bg-subtle); border-radius: 8px; font-size: .85em; }
.article-body blockquote { margin: 24px 0; padding-left: 24px; border-left: 3px solid currentColor; }
.article-source, .article-body time { font-size: .9rem; }
.article-summary { padding: 24px 0; border-bottom: 1px solid var(--line); }
#article-filters { display: flex; gap: 8px; flex-wrap: wrap; margin: 24px 0; }
.skip-link { position: absolute; left: 16px; top: -80px; z-index: 10; padding: 8px; background: var(--bg); }
.skip-link:focus { top: 8px; }

.article-body h2, .article-summary h2, .article-shell h3 { font-family: "Instrument Serif", serif; font-weight: 400; line-height: 1.15; }
.article-body h2, .article-summary h2 { font-size: 2.5rem; }
.article-shell h3 { font-size: 2rem; }
@media (max-width: 600px) {
  .article-shell, .article-shell:has(> .article-list) { margin-block: 32px 60px; padding-inline: 20px; }
  .article-body h2, .article-summary h2 { font-size: 2rem; }
}