/* =====================================================
   LE MUSÉE DU TEMPS VOLÉ — Hub (plan du musée)
   Grille des portes de salles et état de résolution.
   ===================================================== */

.grille-salles {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 16px;
  margin: 24px 0;
}
.porte-salle {
  background: var(--carte);
  border: 2px solid var(--bord);
  border-radius: 14px;
  padding: 18px;
  text-align: center;
  cursor: pointer;
  transition: border-color 0.2s, transform 0.2s;
  position: relative;
}
.porte-salle:hover { border-color: var(--or); transform: translateY(-3px); }
/* le décor photographique de la salle, comme sur sa première page */
.porte-salle .photo-porte {
  display: block;
  width: 100%;
  height: 110px;
  object-fit: cover;
  border-radius: 8px;
  border: 1px solid var(--bord);
  margin-bottom: 10px;
}
.porte-salle .num {
  display: inline-block;
  width: 40px; height: 40px;
  line-height: 38px;
  border-radius: 50%;
  background: var(--fond2);
  border: 2px solid var(--or);
  color: var(--or-clair);
  font-weight: 700;
  margin-bottom: 8px;
}
.porte-salle .nom-salle { font-weight: 700; font-size: 19px; color: var(--or-clair); }
.porte-salle .nom-heloine { color: var(--texte2); font-size: 16px; margin-top: 4px; }
.porte-salle.resolue { border-color: var(--vert); }
.porte-salle.resolue .num { background: var(--vert); border-color: var(--vert); color: #fff; }
.porte-salle.resolue::after {
  content: "Mémoire restaurée";
  display: block;
  margin-top: 10px;
  color: var(--vert);
  font-size: 14px;
  font-weight: 700;
}
.porte-salle .chiffre-trouve {
  margin-top: 8px;
  font-size: 26px;
  font-weight: 700;
  color: var(--vert);
}