.meet-photos {
  padding: clamp(14px, 3vw, 24px);
  border: 1px solid #dbe3ec;
  border-radius: 14px;
  background: #fff;
  text-align: left;
}

.meet-photo-folder-preview {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 12px;
  width: 100%;
  max-width: 100%;
}

.meet-photo-folder-preview[hidden] { display: none; }
.meet-photo-folder-preview > p { grid-column: 1 / -1; }
.meet-photo-card { display: block; min-width: 0; color: #334155; text-decoration: none; }
.meet-photo-thumbnail { display: block; aspect-ratio: 4 / 3; overflow: hidden; border-radius: 8px; background: #f1f5f9; }
.meet-photo-thumbnail img { display: block; width: 100%; height: 100%; object-fit: cover; }
.meet-photo-unavailable { display: flex; align-items: center; justify-content: center; height: 100%; padding: 12px; text-align: center; font-size: .8rem; }
.meet-photo-caption { display: block; margin-top: 6px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .8rem; }
.meet-photo-card:hover .meet-photo-caption { text-decoration: underline; }
.meet-photo-card:focus-visible { outline: 3px solid #0d6efd; outline-offset: 4px; border-radius: 8px; }

@media (max-width: 767px) {
  .meet-photo-folder-preview { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media print {
  .meet-photo-folder-preview { display: none; }
}