/* blogkit — picture layout shared by every site that renders posts. Colours come from the site's own
   variables (--fig-caption, --fig-bg, --fig-border, --callout-bg, --callout-border, --draft-bg); each site sets them. */
.prose .figure { margin: 1.75rem 0; }
.prose .figure a { display: block; }
.prose .figure img { width: 100%; height: auto; border-radius: 10px; margin: 0; box-shadow: 0 2px 14px rgba(0,0,0,.08); background: var(--fig-bg, #eee); }
.prose .figure figcaption { font-size: .9rem; line-height: 1.45; color: var(--fig-caption, #666); text-align: center; margin-top: .6rem; padding: 0 .5rem; }
.prose .figure.wide { width: min(100vw - 2 * var(--pad, 28px), var(--maxw, 1160px)); max-width: none; margin-left: 50%; transform: translateX(-50%); }
.prose .figure.small { max-width: 28rem; margin-left: auto; margin-right: auto; }
.prose .figure.left { float: left; max-width: 20rem; margin: .3rem 1.5rem 1rem 0; }
.prose .figure.right { float: right; max-width: 20rem; margin: .3rem 0 1rem 1.5rem; }
.prose .figure.plain img { border-radius: 0; box-shadow: none; }
.prose h2, .prose h3, .prose .gallery, .prose .callout, .prose hr { clear: both; }
.prose .gallery { display: grid; gap: 14px; margin: 1.75rem 0; }
.prose .gallery.cols-2 { grid-template-columns: repeat(2, 1fr); }
.prose .gallery.cols-3 { grid-template-columns: repeat(3, 1fr); }
.prose .gallery .figure { margin: 0; }
.prose .gallery .figure img { aspect-ratio: 4 / 3; object-fit: cover; }
.prose .gallery .figure figcaption { font-size: .82rem; }
@media (max-width: 600px) {
  .prose .figure.left, .prose .figure.right { float: none; max-width: none; margin: 1.5rem 0; }
  .prose .gallery.cols-3 { grid-template-columns: repeat(2, 1fr); }
  .prose .figure.wide { width: auto; margin-left: 0; transform: none; }
}
.prose .callout { margin: 1.75rem 0; padding: 1rem 1.25rem; border-left: 4px solid var(--callout-border, #999); background: var(--callout-bg, #f4f4f4); border-radius: 0 10px 10px 0; }
.prose .callout .callout-title { font-weight: 600; margin: 0 0 .4rem; }
.prose .callout p:last-child { margin-bottom: 0; }
.prose .missing-image { color: #b00; font-family: monospace; }
.cover { margin: 0 0 2rem; }
.cover img { width: 100%; height: auto; border-radius: 14px; box-shadow: 0 8px 30px rgba(0,0,0,.12); }
.draft-ribbon { position: sticky; top: 0; z-index: 60; background: var(--draft-bg, #b05e3c); color: #fff; text-align: center; font-size: .85rem; font-weight: 600; letter-spacing: .06em; padding: .45rem 1rem; }
.also-on { font-size: .95rem; margin: 2rem 0 0; padding: .9rem 1.1rem; border-radius: 10px; background: var(--callout-bg, #f4f4f4); }