/* Load after styles.css. Horizontal tracks must overflow to be scrollable. */
.moment-track {
  display: flex;
  flex-wrap: nowrap;
  overflow-x: hidden;
  scroll-snap-type: x mandatory;
  overscroll-behavior-x: contain;
  gap: 24px;
  min-width: 0;
  max-width: 100%;
  scrollbar-width: thin;
}
.moment-track > .moment-card {
  flex: 0 0 350px;
  min-width: 0;
  scroll-snap-align: start;
}
.review-grid {
  display: flex;
  flex-wrap: nowrap;
  overflow-x: hidden;
    overflow-y: hidden;
  scroll-snap-type: x mandatory;
  overscroll-behavior-x: contain;
  gap: 24px;
  min-width: 0;
  max-width: 100%;
  padding-bottom: 24px;
  scrollbar-width: thin;
}
.review-grid > .review {
  flex: 0 0 calc((100% - 48px) / 3);
  min-width: 0;
  margin: 0;
  scroll-snap-align: start;
}
.carousel-prev svg,
.review-prev svg {
  transform: rotate(180deg);
}
.carousel-prev:disabled,
.carousel-next:disabled,
.review-prev:disabled,
.review-next:disabled {
  opacity: 0.4;
  cursor: default;
}
@media (max-width: 1023px) {
  .review-grid {
    gap: 16px;
  }
  .review-grid > .review {
    flex-basis: calc((100% - 16px) / 2);
  }
}
@media (max-width: 767px) {
  .moment-track {
    gap: 16px;
  }
  .moment-track > .moment-card {
    flex-basis: min(82vw, 330px);
  }
  .review-grid > .review {
    flex-basis: 100%;
  }
}