/* =========================
   Swap de imágenes por tema (robusto)
   ========================= */

/* Por defecto: CLARO (solo se ve la light) */
.seiton-light { display: block !important; }
.seiton-dark  { display: none  !important; }

/* Tema OSCURO: Quarto/Bootstrap puede marcarlo de varias formas */
html.quarto-dark .seiton-light,
body.quarto-dark .seiton-light,
:root[data-bs-theme="dark"] .seiton-light,
body[data-bs-theme="dark"] .seiton-light {
  display: none !important;
}

html.quarto-dark .seiton-dark,
body.quarto-dark .seiton-dark,
:root[data-bs-theme="dark"] .seiton-dark,
body[data-bs-theme="dark"] .seiton-dark {
  display: block !important;
}

/* =========================
   Tamaño / presentación
   ========================= */
.seiton-img{
  width: min(220px, 100%);
  height: auto;
  display: block;
}

/* Si lo estás mostrando en el margen (column-margin), que no crezca */
.column-margin .seiton-img{
  width: min(200px, 100%);
}