.pt-star-rating {
    display: inline-flex;
    align-items: center;
    flex-wrap: nowrap;

    --start-no: rgb(var(--color-text-title));
    --start-active: #ffd32a;
}

.pt-star-rating label {
    margin: 0;
}

.pt-star-rating label span {
    font-size: 20px;
    line-height: 1;
    color: var(--start-no);
    transition: 220ms all;
    opacity: 0.25;
}

.pt-star-rating:not(.can-edit) label:has(~ .checked) span,
.pt-star-rating:not(.can-edit) label.checked span {
    color: var(--start-active);
    opacity: 1;
}

.pt-star-rating [type="radio"] {
    display: none;
    appearance: none;
}

.pt-star-rating.can-edit label {
    cursor: pointer;
}

.pt-star-rating.can-edit label.checked:not(:has(~ .edited:checked)) span,
.pt-star-rating.can-edit label:has(~ .checked):not(:has(~ .edited:checked)) span {
    color: var(--start-active);
}

.pt-star-rating.can-edit label:has(~ .start:checked) span {
    color: var(--start-active);
}

.pt-star-rating.can-edit label:is(:hover, :has(~ .start:hover)) span {
    color: var(--start-active);
}