/* Two compact rows; native horizontal scrolling is the baseline and motion is opt-in enhancement. */
#gallery { scroll-margin-top:24px; }
.gallery-head { gap:28px; margin-bottom:24px; }
.gallery-head > div:first-child { min-width:0; }
.photo-wall-tools { display:flex; flex-direction:column; align-items:flex-end; gap:10px; min-width:0; }
.gallery-filters { gap:6px 18px; justify-content:flex-end; }
.gallery-filters button { min-height:44px; padding-block:10px; }
.photo-wall-motion { display:flex; align-items:center; justify-content:flex-end; flex-wrap:wrap; gap:10px 18px; }
#photo-wall-help { font-size:10px; line-height:1.5; color:#5d7385; }
#photo-wall-toggle { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:44px; padding:8px 12px; border:1px solid #bfceda; color:#254660; font-size:10px; line-height:1.4; white-space:nowrap; }
#photo-wall-toggle > span:first-child { display:flex; }
#photo-wall-toggle .icon { width:14px; height:14px; }
#photo-wall-toggle:hover:not(:disabled) { border-color:#005ba3; background:#e4edf3; }
#photo-wall-toggle:disabled { opacity:.65; cursor:default; }
.culture-gallery.photo-wall { display:flex; flex-direction:column; gap:16px; max-width:100%; min-width:0; }
.photo-wall-row { position:relative; max-width:100%; min-width:0; overflow-x:auto; overflow-y:hidden; scrollbar-width:thin; scrollbar-color:#a4b8c8 transparent; overscroll-behavior-x:contain; touch-action:auto; }
.photo-wall-row.is-looping { overflow-x:hidden; touch-action:pan-y; }
.photo-wall-track { display:flex; align-items:flex-start; gap:16px; width:max-content; padding:4px 0; direction:ltr; }
.photo-wall .gallery-slot { flex:0 0 220px; width:220px; min-width:0; }
.photo-wall-row.is-looping .gallery-slot { will-change:transform; }
.photo-wall-park[hidden],.photo-wall-row[hidden] { display:none; }
html[dir=rtl] .photo-wall .gallery-slot { direction:rtl; }
.culture-gallery .gallery-photo {
  display:grid;
  place-items:center;
  width:100%;
  height:auto;
  aspect-ratio:4 / 3;
  padding:0;
  border:1px solid #cbd7e0;
  background:#e5edf3;
  isolation:isolate;
}
.culture-gallery .gallery-photo > img,
.culture-gallery .gallery-photo:hover > img,
.culture-gallery .gallery-photo:focus-visible > img {
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:50% 50%;
  transform:none;
  filter:none;
  transition:none;
}
.culture-gallery .gallery-photo > .icon {
  width:27px;
  height:27px;
  padding:6px;
  inset-inline-end:8px;
  bottom:8px;
  border:1px solid #ffffff60;
  background:#12263ae8;
  color:#fff;
}
.culture-gallery .gallery-caption { padding:10px 2px 0; }
.culture-gallery .gallery-caption h4 { font-size:12px; line-height:1.5; overflow-wrap:anywhere; }
.culture-gallery .gallery-caption .gallery-date { margin-top:4px; font-size:10px; line-height:1.6; color:#5d7385; }
.photo-wall .gallery-photo:focus-visible { outline:2px solid #005ba3; outline-offset:-3px; }

/* A single shared dialog is reset by the central dialog handler after closing. */
.detail-dialog.gallery-dialog {
  width:min(1240px,calc(100% - 32px));
  height:min(900px,calc(100svh - 32px));
  max-height:calc(100svh - 32px);
  padding:0;
  overflow:hidden;
  background:#12263a;
  color:#fff;
}
.gallery-dialog > .dialog-close {
  position:absolute;
  top:14px;
  inset-inline-start:auto;
  inset-inline-end:14px;
  width:44px;
  height:44px;
  margin:0;
  border-color:#ffffff50;
  background:#fff;
  color:#12263a;
}
.gallery-dialog #dialog-body { height:100%; }
.gallery-viewer { display:flex; flex-direction:column; gap:18px; height:100%; min-height:0; padding:24px; }
.gallery-viewer-head { flex:none; min-height:44px; padding-inline-end:56px; }
.gallery-viewer-caption h2 { margin:0; font-size:26px; font-weight:400; line-height:1.3; letter-spacing:-.015em; overflow-wrap:anywhere; }
.gallery-viewer-caption p { margin-top:7px; font-size:12px; line-height:1.5; color:#bfd0de; }
.gallery-viewer-stage { display:grid; place-items:center; flex:1; min-height:0; overflow:hidden; background:#061523; }
.gallery-viewer-stage > .lightbox-image {
  display:block;
  width:100%;
  height:100%;
  max-width:100%;
  max-height:100%;
  object-fit:contain;
  object-position:50% 50%;
  background:transparent;
  filter:none;
  transform:none;
}
.gallery-viewer-controls { display:flex; flex:none; align-items:center; justify-content:space-between; gap:14px; }
.gallery-viewer-controls button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  min-width:44px;
  min-height:44px;
  padding:10px 16px;
  border:1px solid #ffffff45;
  background:#ffffff0a;
  color:#fff;
  font-size:12px;
  line-height:1.4;
}
.gallery-viewer-controls button:hover:not(:disabled) { background:#ffffff18; border-color:#bdd8ec; }
.gallery-viewer-controls button > .icon { width:19px; height:19px; }
#gallery-viewer-counter { flex:none; min-width:56px; text-align:center; font-size:12px; color:#c9d7e2; font-variant-numeric:tabular-nums; }
html[dir=rtl] .gallery-previous > .icon { transform:none; }
html[dir=rtl] .gallery-next > .icon { transform:rotate(180deg); }

@media (max-width:1080px) {
  .photo-wall-tools { align-items:flex-start; width:100%; }
  .gallery-filters,.photo-wall-motion { justify-content:flex-start; }
}
@media (max-width:760px) {
  .culture-gallery.photo-wall { gap:12px; }
  .photo-wall-track { gap:12px; }
  .photo-wall .gallery-slot { flex-basis:168px; width:168px; }
  .gallery-filters { gap:4px 15px; }
  .photo-wall-motion { gap:6px 14px; }
  .culture-gallery .gallery-caption h4 { font-size:11px; }
  .gallery-viewer { padding:16px; gap:14px; }
  .gallery-viewer-caption h2 { font-size:21px; }
  .gallery-viewer-head { padding-inline-end:52px; }
  .gallery-dialog > .dialog-close { top:12px; inset-inline-end:12px; }
  .gallery-viewer-controls { gap:8px; }
  .gallery-viewer-controls button { gap:7px; padding:10px 12px; font-size:11px; }
}
@media (max-height:500px) {
  .gallery-viewer { padding:12px; gap:10px; }
  .gallery-viewer-caption h2 { font-size:18px; }
  .gallery-viewer-caption p { margin-top:3px; font-size:11px; }
  .gallery-viewer-head { min-height:40px; }
  .gallery-viewer-controls button { min-height:40px; padding-block:8px; }
}
.gallery-viewer-stage{position:relative;min-width:0;min-height:0}.gallery-viewer-stage>.lightbox-image{position:absolute;inset:0;width:100%;height:100%;min-height:0;max-height:100%;max-width:100%;object-fit:contain}