/* A compact photographic contact sheet, with the complete image kept visible. */
.longship-digital .galleries {
  background: #141719;
  border-bottom: 1px solid #aa89555c;
}
.photo-collection { margin-top: 1.5rem; }
.photo-grid-note {
  color: #b9c2bf;
  font: 400 1rem/1.6 var(--body);
  margin: 0 0 1.1rem;
}
.gallery-collections:has(.gallery-grid figure) { grid-template-columns: 1fr; }
.gallery-grid:has(figure), .gallery-grid[data-kind="all"],
.longship-digital .portfolio-gallery {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1rem;
}
.gallery-grid figure, .portfolio-gallery figure {
  min-width: 0;
  margin: 0;
  padding: 0;
  background: #1b1f20;
  border: 1px solid #a68d6545;
}
.gallery-photo, .portfolio-gallery a {
  display: block;
  position: relative;
  width: 100%;
  padding: 0;
  overflow: hidden;
  background: #0f1214;
  border: 0;
  cursor: zoom-in;
  text-decoration: none;
  transition: box-shadow 180ms ease;
}
.gallery-photo img, .portfolio-gallery img,
.gallery-grid[data-business="battle-ready"] .gallery-photo img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 3;
  object-fit: contain;
}
.photo-open, .portfolio-gallery a::after {
  position: static;
  display: block;
  text-align: right;
  min-height: 28px;
  padding: .25rem .5rem;
  border: 0;
  border-top: 1px solid #d1b58540;
  background: #101719ed;
  color: #f1dcc0;
  font: 600 .8rem/1.5 var(--body);
  pointer-events: none;
}
.portfolio-gallery a::after { content: 'View ↗'; }
.gallery-photo:hover, .gallery-photo:focus-visible,
.portfolio-gallery a:hover, .portfolio-gallery a:focus-visible {
  box-shadow: inset 0 0 0 2px #a6c6c1, 0 0 20px #a6c6c118;
  outline: 2px solid #a6c6c1;
  outline-offset: -2px;
}
.gallery-grid figcaption, .portfolio-gallery figcaption {
  margin: 0;
  padding: .85rem;
  color: #ded5c7;
  font: 400 1rem/1.55 var(--body);
  overflow-wrap: anywhere;
}
.photo-category {
  display: block;
  margin-bottom: .4rem;
  color: #d9b87b;
  font: 600 .65rem/1.5 var(--serif);
  letter-spacing: .04em;
  text-transform: uppercase;
}
.photo-viewer-open { overflow: hidden; }
dialog.photo-viewer {
  box-sizing: border-box;
  width: min(1320px, calc(100% - 2rem));
  height: min(960px, calc(100dvh - 2rem));
  max-width: none;
  max-height: none;
  margin: auto;
  padding: 0;
  border: 1px solid #b69a6d;
  background: #14191c;
  color: #eee5d2;
  overflow: hidden;
  box-shadow: 0 30px 100px #0008;
  font-family: var(--body);
}
#gallery-viewer.photo-viewer, #portfolio-viewer.photo-viewer {
  padding: 0;
  max-height: none;
  width: min(1320px, calc(100% - 2rem));
}
.photo-viewer[open] {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
}
.photo-viewer::backdrop { background: #080c10f5; }
.photo-toolbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  min-height: 58px;
  padding: .45rem .8rem .45rem 1.2rem;
  border-bottom: 1px solid #a98a5e44;
}
.photo-toolbar p, #portfolio-viewer.photo-viewer .photo-toolbar p {
  margin: 0;
  font: 600 .8rem/1.5 var(--serif);
  color: #d9bd91;
  text-align: left;
}
.photo-viewer button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .4rem;
  min-width: 44px;
  min-height: 44px;
  padding: .5rem .8rem;
  border: 1px solid #a98a5e66;
  background: #21292b;
  color: #f1dcc0;
  font: 600 1rem/1.3 var(--body);
  cursor: pointer;
}
.photo-viewer button:hover:not(:disabled) { border-color: #b5d3ce; background: #2a3638; }
.photo-viewer button:disabled { opacity: .4; cursor: default; }
.photo-viewer button:focus-visible { outline: 2px solid #b5d3ce; outline-offset: 2px; }
.photo-viewer .photo-close { font-size: 1.5rem; padding: 0; }
.photo-viewport {
  min-width: 0;
  min-height: 0;
  overflow: auto;
  position: relative;
  background-color: #0b1013;
  background-image: linear-gradient(#d3b17a08 1px, transparent 1px),
    linear-gradient(90deg, #d3b17a08 1px, transparent 1px);
  background-size: 36px 36px;
  overscroll-behavior: contain;
  scroll-behavior: auto !important;
  touch-action: pan-x pan-y pinch-zoom;
  cursor: zoom-in;
}
.photo-viewport.is-zoomed { cursor: grab; }
.photo-viewport.is-dragging { cursor: grabbing; }
.photo-stage { width: 100%; height: 100%; }
#gallery-viewer.photo-viewer img, #portfolio-viewer.photo-viewer img {
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  max-height: none;
  margin: 0;
  object-fit: contain;
  pointer-events: none;
  user-select: none;
}
.photo-viewer-footer { min-width: 0; border-top: 1px solid #a98a5e44; padding: .85rem 1.2rem; }
.photo-viewer-footer p, #portfolio-viewer.photo-viewer .photo-viewer-footer p {
  margin: 0;
  font-size: 1rem;
  line-height: 1.5;
  text-align: left;
}
.photo-viewer-footer [data-viewer-caption] { max-height: 4.5em; overflow-y: auto; }
.photo-controls {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: .6rem;
  margin: .8rem 0 .6rem;
}
.photo-zoom { justify-self: center; display: flex; align-items: center; gap: .35rem; }
.photo-zoom [data-photo-scale] { min-width: 3.5rem; text-align: center; font: 1rem var(--body); font-variant-numeric: tabular-nums; }
.photo-zoom [data-zoom-in], .photo-zoom [data-zoom-out] { font-size: 1.3rem; padding: .4rem; }
.photo-viewer .photo-help, #portfolio-viewer.photo-viewer .photo-help {
  color: #b0bab7;
  font-size: .875rem;
}
.photo-help a { color: #e5c18c; text-underline-offset: 3px; }
.photo-status:empty { display: none; }
.photo-status { color: #e0ba80; }
@media (max-width: 1100px) {
  .gallery-grid:has(figure), .gallery-grid[data-kind="all"], .longship-digital .portfolio-gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
  dialog.photo-viewer, #gallery-viewer.photo-viewer, #portfolio-viewer.photo-viewer { width: calc(100% - 1rem); height: calc(100dvh - 1rem); }
  .photo-controls { grid-template-columns: 1fr 1fr; }
  .photo-zoom { grid-column: 1 / -1; grid-row: 1; }
  .photo-viewer-footer { padding: .7rem; }
  .photo-toolbar { padding-left: .8rem; }
  .gallery-grid:has(figure), .gallery-grid[data-kind="all"], .longship-digital .portfolio-gallery { gap: .65rem; }
  .gallery-grid figcaption, .portfolio-gallery figcaption { padding: .7rem; font-size: .95rem; }
}
.gallery-photo picture{display:block;width:100%;min-width:0}
.gallery-photo picture img{width:100%;height:100%;object-fit:contain}