/* =====================================================================
   Mod BloodDate: la pantalla «Mods» del juego (ficha, lo que incluye, instalación y vinculación).
   ===================================================================== */

.md-cab-in { align-items: center; }
.md-ficha { display: flex; align-items: flex-start; gap: 24px; flex: 1; min-width: 0; }
.md-icono { width: 112px; height: 112px; }
.md-icono img { width: 88px; height: 88px; image-rendering: auto; }
.md-ficha .mc-etiquetas { margin: 12px 0 0; }
.md-acciones { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 20px; }
.md-incluye { flex: none; width: 280px; padding: 14px; }
.md-incluye ul { display: grid; gap: 4px; margin: 0; padding: 0; list-style: none; }
.md-incluye li { display: grid; grid-template-columns: 40px 1fr; align-items: center; gap: 10px; padding: 4px; }
.md-incluye .mc-slot { width: 40px; height: 40px; }
.md-incluye .mc-slot img { width: 24px; height: 24px; }
.md-incluye strong { display: block; font-family: var(--pixel); font-size: 16px; font-weight: 400; color: #fff; text-shadow: .125em .125em 0 #3f3f3f; }
.md-incluye small { display: block; color: var(--tinta-3); font-size: 13px; }

.md-lista > li { grid-template-columns: 64px 1fr; align-items: center; }
.md-lista h3 { font-size: 24px; }
.bd-page main .bd-mision code, .bd-page main .md-lista code { padding: 1px 5px; background: #000; color: var(--oro-claro); font-size: 13px; }

.md-vincular { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 24px; align-items: center; padding: 24px; }
.md-titulo { margin: 0; font-family: var(--pixel); font-size: 32px; font-weight: 400; line-height: 1.15; color: #fff; text-shadow: .125em .125em 0 #3f3f3f; }
.md-vincular p { margin: 10px 0 0; color: var(--tinta-2); }
/* La orden en la barra del chat del juego */
.md-chat { display: grid; gap: 8px; padding: 16px; background: rgba(0, 0, 0, .65); box-shadow: inset 0 0 0 2px rgba(0, 0, 0, .4); }
.md-chat code { display: block; padding: 10px 12px; background: rgba(0, 0, 0, .55); font-family: var(--pixel); font-size: 24px; color: #fff; text-shadow: .125em .125em 0 #3f3f3f; user-select: all; overflow-wrap: anywhere; }
.md-chat small { color: var(--tinta-3); font-size: 13px; }

.md-cierre { flex-wrap: wrap; justify-content: space-between; }
.md-cierre .md-acciones { margin-top: 0; }

@media (max-width: 1023px) {
  .md-cab-in { flex-wrap: wrap; }
  .md-incluye { width: 100%; }
  .md-incluye ul { grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); }
  .md-vincular { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .md-ficha { flex-direction: column; gap: 16px; }
  .md-icono { width: 80px; height: 80px; }
  .md-icono img { width: 64px; height: 64px; }
  .md-titulo { font-size: 24px; }
  .md-chat code { font-size: 16px; }
}