.gallery-grid {
  transition: opacity 175ms ease, transform 175ms ease;
}
.gallery-grid.is-page-leaving {
  opacity: 0;
  transform: translateY(12px) scale(.992);
}
.gallery-grid.is-page-entering {
  opacity: 0;
  transform: translateY(14px);
  transition: none;
}
.gallery-pagination[hidden] { display: none; }
.gallery-pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 16px 26px;
  margin: 64px auto 20px;
  padding: 15px 20px;
  width: fit-content;
  max-width: 100%;
  color: #52647c;
  background: linear-gradient(135deg, rgba(255,255,255,.72), rgba(231,241,255,.42));
  border: 1px solid rgba(255,255,255,.84);
  border-radius: 24px;
  box-shadow: 0 12px 30px rgba(42,72,112,.08), inset 0 1px rgba(255,255,255,.8);
  -webkit-backdrop-filter: blur(18px) saturate(1.25);
  backdrop-filter: blur(18px) saturate(1.25);
}
.gallery-pagination__summary {
  white-space: nowrap;
  font-size: 13px;
  letter-spacing: .04em;
}
.gallery-pagination__controls,
.gallery-pagination__numbers,
.gallery-pagination__jump {
  display: flex;
  align-items: center;
  gap: 7px;
}
.gallery-pagination button {
  display: inline-grid;
  place-items: center;
  height: 38px;
  min-width: 38px;
  padding: 0 11px;
  border: 1px solid rgba(138,162,191,.22);
  border-radius: 12px;
  background: rgba(255,255,255,.5);
  color: #344b68;
  font: inherit;
  font-size: 14px;
  cursor: pointer;
  transition: transform 180ms ease, background 180ms ease, border-color 180ms ease, box-shadow 180ms ease, color 180ms ease;
}
.gallery-pagination button:hover:not(:disabled) {
  transform: translateY(-2px);
  background: rgba(255,255,255,.9);
  border-color: rgba(89,129,180,.44);
  box-shadow: 0 5px 12px rgba(57,88,135,.1);
}
.gallery-pagination button:active:not(:disabled) { transform: scale(.92); }
.gallery-pagination button:focus-visible,
.gallery-pagination input:focus-visible { outline: 2px solid #4784d8; outline-offset: 2px; }
.gallery-pagination button:disabled { opacity: .35; cursor: default; }
.gallery-pagination .gallery-pagination__page.is-active {
  color: #fff;
  background: #263d5b;
  border-color: #263d5b;
  box-shadow: 0 5px 12px rgba(38,61,91,.18);
}
.gallery-pagination__arrow { font-size: 24px !important; line-height: 1; }
.gallery-pagination__ellipsis { padding: 0 4px; color: #71839a; }
.gallery-pagination__jump { font-size: 13px; white-space: nowrap; }
.gallery-pagination__jump input {
  box-sizing: border-box;
  width: 52px;
  height: 38px;
  padding: 0 5px;
  border: 1px solid rgba(138,162,191,.28);
  border-radius: 11px;
  background: rgba(255,255,255,.62);
  color: #263d5b;
  font: inherit;
  text-align: center;
  appearance: textfield;
}
.gallery-pagination__jump input::-webkit-inner-spin-button,
.gallery-pagination__jump input::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
.gallery-pagination .gallery-pagination__jump button { padding: 0 14px; }
@media (max-width: 640px) {
  .gallery-pagination { width: 100%; box-sizing: border-box; margin-top: 40px; padding: 14px 10px; gap: 12px; }
  .gallery-pagination__summary { width: 100%; text-align: center; }
  .gallery-pagination__controls { gap: 4px; }
  .gallery-pagination__numbers { gap: 4px; }
  .gallery-pagination button { min-width: 34px; height: 34px; padding: 0 8px; }
  .gallery-pagination__jump input { height: 34px; }
}
@media (prefers-reduced-motion: reduce) {
  .gallery-grid, .gallery-pagination button { transition: none; }
}
@media (prefers-reduced-transparency: reduce) {
  .gallery-pagination { background: #edf4fc; -webkit-backdrop-filter: none; backdrop-filter: none; }
}