/* ═══ AJUSTES QUE DEBEN GANAR ═══
   Esta hoja se enlaza la ULTIMA a proposito: lo de aqui tiene que pisar
   tanto al bloque en linea de la pagina como al CSS de cada juego. */

/* El resultado tiene su hueco reservado desde el principio. Sin esto, al
   aparecer el texto crece el contenido, el escalador reescala la pagina
   entera y todo pega un salto justo cuando la rueda para. */
#resRuleta, #resTrago, #resBJ, #resDados, #resGuerra, #resRasca,
#resMult, #resMinas, #resTorre, #resPesca, .panel > .res, section > .res{
  min-height:52px !important;
  display:flex; flex-direction:column;
  align-items:center; justify-content:center;
}

/* ── AJUSTES VISTOS JUGANDO (2026-07-20) ── */

/* Guerra de cartas: .gc-mando es flex con space-between; al envolver, el
   boton REPARTIR quedaba pegado a la izquierda en vez de centrado.
   (Ojo: la clase de escena es escena-guerra, NO escena-guerracartas: sale
   del data-j de la tarjeta, que es 'guerra'.) */
#p-guerra .gc-mando{ justify-content:center !important; flex-wrap:wrap; gap:10px; }
#p-guerra .gc-barra{ margin:0 auto !important; }

/* Rasca: la ficha de 500 se salia del boleto por la derecha. */
body.escena-rasca #p-rasca .rs-fichas,
#p-rasca .rs-fichas{
  display:flex; flex-wrap:wrap; gap:6px;
  justify-content:flex-start; max-width:100%;
}
body.escena-rasca #p-rasca .chip{ flex:0 0 auto; }

/* Canjea: los nombres largos se cortaban ("Pergamino de EXP - 3 ..."). */
#j-tienda #listaTienda .art .info{ min-width:0; flex:1 1 auto; }
#j-tienda #listaTienda .art .nm{
  white-space:normal; overflow:visible; text-overflow:clip; line-height:1.2;
}

/* Minas: con campo 7x7 la rejilla se salia 8px del foso.
   NO tocar .mn-foso ni dar height/width a la rejilla: probado, la hunde.
   Basta con dejar que las placas encojan y que la rejilla no rebase el hueco. */
#j-minas #rejillaMinas{ max-height:100%; }
#j-minas #rejillaMinas .cas{ min-width:0; min-height:0; }

/* ── MINAS: en pantalla ancha y baja (lo normal en Discord) el foso va a la
   izquierda y los mandos a la derecha. Apilados no caben y la rejilla queda
   enana; repartidos, el foso aprovecha TODO el alto disponible. ── */
@media (min-width: 620px) and (max-height: 720px){
  #j-minas .mn-campo{
    display:grid;
    grid-template-columns: 1fr clamp(190px, 32%, 300px);
    grid-template-rows: auto 1fr;
    gap: 12px 16px;
    align-items:center;
  }
  #j-minas .mn-foso     { grid-column:1; grid-row:1 / span 2; height:100%; min-height:0; }
  #j-minas .mn-tablilla { grid-column:2; grid-row:1; margin:0; }
  #j-minas .mn-caja     { grid-column:2; grid-row:2; margin:0; }
  #j-minas .mn-ruedas   { flex-wrap:wrap; }
}

/* Dentro del reparto lateral: la rejilla centrada en el foso (si no, queda
   pegada arriba con un hueco muerto debajo) y el sello sin partirse. */
@media (min-width: 620px) and (max-height: 720px){
  body.escena-minas #j-minas .mn-sello{
    white-space:nowrap; font-size:7.5px; letter-spacing:.1em; padding:2px 5px;
  }
  body.escena-minas #j-minas .mn-lectura{ gap:6px; }
}
