.page-rating-centered {
  text-align: center;
}
.page-rating {
  display: inline-flex;
  text-align: center;
}
.rating-wrapper-alt {
  display: inline-block;
}
.rating-wrapper-alt .star {
  margin: 0 3px;
  display: inline-block;
  transition: transform 0.3s ease, fill 0.3s ease, stroke 0.3s ease;
}
.rating-wrapper-alt .star .star-icon {
  vertical-align: middle;
}

/* Hover effect: когда контейнер .page-rating имеет класс hovered, можно добавить эффекты */
.page-rating:hover .rating-wrapper-alt .star {
  opacity: 0.8;
}

/* В состоянии "voted", добавляем эффект (например, увеличение) */
.page-rating.voted .rating-wrapper-alt .star {
  transform: scale(1.2);
}