/* Give prose images their own line instead of aligning them to a text baseline. */
.article-body img {
  display: block;
  max-width: 100%;
  height: auto;
  margin-inline: auto;
}
.article-body p a:has(img) {
  display: block;
  width: fit-content;
  max-width: 100%;
  margin: 24px auto;
}
.article-body p > img { margin: 24px auto; }
.article-body p a:has(img) img { margin: 0 auto; }
.article-body p > img:first-child,
.article-body p > a:has(img):first-child { margin-top: 0; }
.article-body .imageblock a { display: inline-block; max-width: 100%; }

/* Both classic and Gutenberg gallery structures have the same grid behavior. */
.article-body .article-gallery > ul {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  list-style: none;
  padding: 0;
  margin: 0;
}
.article-body .article-gallery > ul > li { margin:0; padding:0; min-width:0; }
.article-body .article-gallery figure { margin:0; min-width:0; }
.article-body .article-gallery > ul img { width:auto; max-width:100%; max-height:400px; }
@media (max-width:580px) { .article-body .article-gallery > ul { gap:8px; } }

.article-body figure img[width] { min-width:0; }
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,summary:focus-visible { outline-color:var(--green); }