[data-photo-expand] { cursor: zoom-in; }
[data-photo-expand]:focus-visible { outline: 3px solid #a9dfff; outline-offset: -4px; }
#explore .card-visual[data-photo-expand]::after {
  content: 'Expand ↗'; position: absolute; right: 8px; bottom: 8px; z-index: 3;
  padding: 7px 9px; border: 1px solid #b9d2e2; border-radius: 3px;
  background: #080d12e8; color: #fff; font: 500 12px/1.2 sans-serif;
  pointer-events: none;
}
#photo-viewer {
  box-sizing: border-box; margin: auto; padding: 0; width: min(1440px, 96vw);
  height: min(1040px, 94dvh); max-width: 96vw; max-height: 94dvh;
  border: 1px solid #76828a; background: #080b0e; color: #fff;
  overflow: hidden; overscroll-behavior: contain;
}
#photo-viewer[open] { display: grid; grid-template-rows: auto minmax(0, 1fr); }
#photo-viewer::backdrop { background: #000e; }
#photo-viewer .photo-viewer-toolbar {
  display: flex; align-items: center; justify-content: space-between;
  gap: 1rem; padding: 8px 18px; border-bottom: 1px solid #394750;
  font: 500 15px/1.4 sans-serif;
}
#photo-viewer button {
  display: flex; align-items: center; gap: 12px; min-width: 88px; min-height: 44px;
  border: 1px solid #8fb8d0; border-radius: 3px; padding: 8px 12px;
  color: #fff; background: #15232d; cursor: pointer; font: inherit;
}
#photo-viewer button span { font-size: 24px; line-height: 1; }
#photo-viewer button:focus-visible { outline: 3px solid #a9dfff; outline-offset: 3px; }
#photo-viewer figure {
  display: grid; grid-template-rows: minmax(0, 1fr) auto; gap: 10px;
  min-height: 0; margin: 0; padding: 16px;
}
#photo-viewer figure img {
  display: block; width: 100%; height: 100%; min-height: 0; max-width: 100%;
  object-fit: contain; object-position: center; filter: none; transform: none; animation: none;
}
#photo-viewer figcaption { color: #d2d8dc; font: 400 14px/1.4 sans-serif; text-align: center; }
@media(max-width:600px) {
  #photo-viewer { width: 100vw; max-width: 100vw; height: 96dvh; max-height: 96dvh; }
  #photo-viewer figure { padding: 8px; }
}
