.evaluation input[type='radio']{
    display: none;
}

.evaluation label .text{
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    text-align: center;
    font-size: 12px;
    color: gray;
}

.evaluation label:hover,
.evaluation label:has(+ input[type='radio']:hover),
.evaluation label:has(+ input[type='radio']:not(:hover) + label + input[type='radio']:hover),
.evaluation label:has(+ input[type='radio']:not(:hover) + label + input[type='radio']:not(:hover) + label + input[type='radio']:hover),
.evaluation label:has(+ input[type='radio']:not(:hover) + label + input[type='radio']:not(:hover) + label + input[type='radio']:not(:hover) + label + input[type='radio']:hover),
.evaluation input[type='radio']:checked + label,
.evaluation label:has(+ input[type='radio']:checked),
.evaluation label:has(+ input[type='radio']:not(:checked) + label + input[type='radio']:checked),
.evaluation label:has(+ input[type='radio']:not(:checked) + label + input[type='radio']:not(:checked) + label + input[type='radio']:checked),
.evaluation label:has(+ input[type='radio']:not(:checked) + label+ input[type='radio']:not(:checked) + label + input[type='radio']:not(:checked) + label + input[type='radio']:checked){
    color: #ffcc00;
}
.evaluation label{
    position: relative;
    padding: 10px 10px 0;
    color: gray;
    cursor: pointer;
    font-size: 20px;
}