/* Tata letak gambar di isi berita/halaman — kelas dari editor admin (lihat SafeHtml::FIGURE_CLASSES).
   Dimuat oleh partials/theme-head sebelum CSS tema, jadi berlaku di semua tema dan tetap bisa ditimpa tema. */
/* Awalan "html" menaikkan prioritas di atas aturan tema seperti ".prose figure { margin: 22px 0 }". */
html figure:is(.img-w25, .img-w50, .img-w75) { margin-left: auto; margin-right: auto; }
figure.img-w25 { width: 25%; }
figure.img-w50 { width: 50%; }
figure.img-w75 { width: 75%; }
figure.img-w25 img, figure.img-w50 img, figure.img-w75 img { width: 100%; height: auto; }

/* Rata kiri/kanan: teks mengalir di samping gambar (hanya bila gambar tidak selebar konten). */
html figure.img-kiri:is(.img-w25, .img-w50, .img-w75)  { float: left;  margin: 4px 22px 14px 0; }
html figure.img-kanan:is(.img-w25, .img-w50, .img-w75) { float: right; margin: 4px 0 14px 22px; }
.prose::after { content: ''; display: table; clear: both; }

/* Layar HP: gambar kecil dibuat lebih lebar dan tidak mengapung agar tetap terbaca. */
@media (max-width: 600px) {
  figure.img-w25 { width: 50%; }
  figure.img-w50, figure.img-w75 { width: 100%; }
  figure.img-kiri, figure.img-kanan { float: none !important; margin: 18px auto !important; }
}