/* Виджет оценки в форме отзыва — иконки-звёзды на шрифте вместо SVG */
.score { margin: 16px 0; }
.rating-area { overflow: hidden; width: 300px; max-width: 100%; }
.rating-area:not(:checked) > input { display: none; }
.rating-area:not(:checked) > label {
  float: right; width: 30px; height: 24px;
  padding: 0; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  font-size: 18px;
  color: var(--bdc-darker);
}
.rating-area > label::before {
  font-family: 'Font Awesome 5 Pro';
  font-weight: 300;
  content: "\f005";
}
.rating-area > input:checked ~ label,
.rating-area:not(:checked) > label:hover,
.rating-area:not(:checked) > label:hover ~ label,
.rating-area > input:checked + label:hover,
.rating-area > input:checked + label:hover ~ label,
.rating-area > input:checked ~ label:hover,
.rating-area > input:checked ~ label:hover ~ label,
.rating-area > label:hover ~ input:checked ~ label {
  color: var(--accent);
}
.rating-area > input:checked ~ label::before,
.rating-area:not(:checked) > label:hover::before,
.rating-area:not(:checked) > label:hover ~ label::before {
  font-weight: 900;
}
.rating-area > label:active { position: relative; }