.rating-popup {
  position: fixed;
  left: 50%;
  bottom: 28px;
  z-index: 80;
  display: grid;
  gap: 14px;
  justify-items: center;
  min-width: 280px;
  padding: 18px 20px 16px;
  border: 1px solid rgba(255, 0, 110, 0.16);
  border-radius: 16px;
  background: rgba(10, 10, 10, 0.94);
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.38), 0 0 24px rgba(255, 0, 110, 0.08);
  backdrop-filter: blur(14px);
  opacity: 0;
  transform: translateX(-50%) translateY(12px) scale(0.97);
  transition: opacity 220ms ease, transform 220ms ease;
}

.rating-popup.is-visible {
  opacity: 1;
  transform: translateX(-50%) translateY(0) scale(1);
}

.rating-popup.is-hiding {
  opacity: 0;
  transform: translateX(-50%) translateY(10px) scale(0.98);
}

.rating-popup__title {
  margin: 0;
  color: rgba(255, 255, 255, 0.92);
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0.02em;
}

.rating-popup__stars {
  display: flex;
  gap: 6px;
}

.rating-popup__star {
  appearance: none;
  border: 0;
  padding: 0;
  background: transparent;
  color: rgba(255, 255, 255, 0.26);
  font-size: 28px;
  line-height: 1;
  cursor: pointer;
  transition: color 150ms ease, transform 150ms ease, text-shadow 150ms ease;
}

.rating-popup__star:hover,
.rating-popup__star:focus-visible,
.rating-popup__star.is-active {
  color: #ff7cab;
  transform: translateY(-1px);
  text-shadow: 0 0 12px rgba(255, 0, 110, 0.24);
  outline: none;
}

.rating-popup__skip {
  appearance: none;
  border: 0;
  background: transparent;
  color: rgba(255, 255, 255, 0.62);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  cursor: pointer;
  transition: color 150ms ease, opacity 150ms ease;
}

.rating-popup__skip:hover,
.rating-popup__skip:focus-visible {
  color: rgba(255, 124, 171, 0.95);
  outline: none;
}

@media (max-width: 480px) {
  .rating-popup {
    left: 12px;
    right: 12px;
    bottom: 18px;
    min-width: 0;
    width: auto;
    transform: translateY(12px) scale(0.97);
  }

  .rating-popup.is-visible {
    transform: translateY(0) scale(1);
  }

  .rating-popup.is-hiding {
    transform: translateY(10px) scale(0.98);
  }
}