.images--party { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.images--party .images__item { aspect-ratio: 2 / 3; }
.images--party .images__item--party-wide { grid-column: 1 / -1; aspect-ratio: 3 / 2; }
@media (min-width: 640px) {
  .images--party { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .images--party .images__item { grid-column: span 2; aspect-ratio: 4 / 5; }
  .images--party .images__item--party-wide { order: -1; aspect-ratio: 3 / 2; }
}
.images__item[role="button"] { cursor: var(--photo-zoom-in, zoom-in); }
.images__item:focus-visible { outline: 3px solid #b87827; outline-offset: 4px; }
.photo-viewer {
  position: fixed; inset: 0; width: 100%; max-width: none;
  height: 100%; height: 100dvh; max-height: none; margin: 0; border: 0;
  padding: var(--base-space);
  background: #292928; cursor: var(--photo-zoom-out, zoom-out); outline: none;
}
.photo-viewer::backdrop { background: #292928; animation: photo-reveal 140ms ease-out; }
.photo-viewer[open] { display: flex; flex-direction: column; align-items: center; animation: photo-reveal 140ms ease-out; }
.photo-viewer__image { display: block; width: 100%; height: 100%; min-height: 0; object-fit: contain; touch-action: pan-y pinch-zoom; }
@keyframes photo-reveal { from { opacity: 0; } to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) {
  .photo-viewer[open], .photo-viewer::backdrop { animation: none; }
}