.pool-gallery {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 24px;
  width: min(760px, 100%);
  min-width: 0;
  margin-inline: auto;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x mandatory;
  scroll-padding-inline: 0;
  overscroll-behavior-x: contain;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  scrollbar-color: #23adf2 #101923;
  padding-bottom: 12px;
}
.pool-gallery-row {
  display: grid;
  grid-template-columns: repeat(3, calc(100% - 28px));
  align-items: stretch;
  gap: 14px;
  min-width: 0;
}
.pool-card {
  display: flex;
  flex-direction: column;
  min-width: 0;
  margin: 0;
  overflow: hidden;
  border: 1px solid #24313f;
  border-radius: 18px;
  background: #101923;
  scroll-snap-align: start;
  scroll-snap-stop: always;
}
.pool-card-image {
  flex: 0 0 auto;
  width: 100%;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  padding: 0;
  background: #08121c;
  border-bottom: 1px solid #24313f;
}
.pool-card-image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  border-radius: 0;
}
.pool-card figcaption { padding: 12px 16px 14px; min-height: 116px; flex: 1; }
.pool-card h3 {
  margin: 0 0 5px;
  font-family: Manrope, sans-serif;
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.3;
}
.pool-card p { margin: 0; color: #c0cddd; font-size: .83rem; line-height: 1.5; }
.gallery-navigation { max-width: 760px; margin-inline: auto; padding-top: 15px; }
.gallery-navigation[hidden] { display: none; }
.gallery-hint { margin: 0 0 10px; color: #a9b5c5; font-size: .8rem; text-align: center; }
.gallery-buttons { display: flex; align-items: center; justify-content: center; gap: 14px; }
.gallery-buttons button {
  padding: 9px 15px;
  color: #f0f4fa;
  background: #101923;
  border: 1px solid #35b9ff;
  border-radius: 99px;
  cursor: pointer;
  font-size: .82rem;
}
.gallery-buttons button:hover:not(:disabled) { background: #173449; }
.gallery-buttons button:disabled { opacity: .35; cursor: default; }
.gallery-progress { color: #c0cddd; min-width: 66px; text-align: center; font-size: .8rem; }
@media (max-width: 700px) {
  .pool-gallery { gap: 20px; }
  .pool-gallery-row { gap: 12px; }
  .pool-card figcaption { padding: 10px 12px 12px; min-height: 116px; }
  .pool-card h3 { font-size: .93rem; }
  .pool-card p { font-size: .79rem; }
}
@media (prefers-reduced-motion: reduce) { .pool-gallery { scroll-behavior: auto; } }