.photo-set-card {
  width: min(100%, 430px);
  margin: 24px auto 0;
}

.photo-set-preview {
  position: relative;
  overflow: hidden;
  aspect-ratio: 9 / 12;
  border-radius: 18px;
  background: #2b0a17;
}

.photo-set-track {
  position: absolute;
  inset: 0;
}

.photo-set-slide {
  position: absolute;
  inset: -7%;
  width: 114%;
  height: 114%;
  object-fit: cover;
  filter: blur(22px);
  transform: scale(1.06);
  opacity: 0;
  transition: opacity .8s ease;
}

.photo-set-slide.is-active { opacity: 1; }

.photo-set-preview::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, #2d091138, transparent 42%, #16040dea);
}

.photo-set-dots {
  position: absolute;
  z-index: 3;
  left: 50%;
  bottom: 18px;
  display: flex;
  gap: 7px;
  transform: translateX(-50%);
}

.photo-set-dots i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #ffffff66;
  transition: width .35s, background .35s;
}

.photo-set-dots i.is-active {
  width: 22px;
  border-radius: 99px;
  background: #fff;
}