/* Duelos Troll MLBB - "Imagen del duelo" (js/ui-imagen.js): el botón que la pide y la ficha de vista previa.
   Prefijo im. La imagen en sí se dibuja en un canvas con sus propios colores (no cambia con el tema);
   aquí solo va lo que la rodea, con los tokens de base.css. */

/* botón "Crear imagen…" al pie de la ficha del héroe y del duelo: siempre en su propia fila, a todo el
   ancho, haya los botones que haya antes */
.sbtns .imgo{grid-column:1 / -1}

/* ---------- vista previa ---------- */
.imlead{margin:6px 0 0;font-size:15px;line-height:21px;color:var(--fg2)}
.imbox{
  display:grid;place-items:center;
  width:100%;max-width:400px;margin:14px auto 0;aspect-ratio:4 / 5;
  border-radius:16px;overflow:hidden;background:var(--sheet-card);
}
.imbox img{display:block;width:100%;height:auto}
.imwait{margin:0;padding:24px 16px;font-size:15px;line-height:21px;color:var(--fg2);text-align:center}
.imnote{margin:12px 0 0;padding:10px 14px;border-radius:12px;background:var(--sheet-card);font-size:13px;line-height:18px;color:var(--fg2)}
.imbtns{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:16px}
.imbtns.one{grid-template-columns:1fr}
.imdl{display:flex;align-items:center;justify-content:center;text-align:center;text-decoration:none}
.imhint{margin:10px 0 0;font-size:13px;line-height:18px;color:var(--fg2);text-align:center}