.comment-animate{opacity:0;transform:translateY(20px);transition:all 0.4s ease}
.comment-visible{opacity:1;transform:translateY(0)}
@keyframes flyDown{0%{transform:translateY(-100px);opacity:0}100%{transform:translateY(0);opacity:1}}
@keyframes flyUp{0%{transform:translateY(0);opacity:1}100%{transform:translateY(-100px);opacity:0}}
.modal-show{animation:flyDown 0.5s ease forwards}
.modal-hide{animation:flyUp 0.4s ease forwards}
div#modalContentRating{background-color:#2A314E;border:none!important;border-radius:.75rem;padding:1.5rem;max-width:600px;width:96%;margin:auto}
.rating-options .item-v.active,.rating-options .item-v:hover{filter:none}
.item-v{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.6rem;transition:all .3s}
.item-v:hover{background-color:hsla(0,0%,100%,.1);transform:translateY(-5px)}
.item-v .inc-icon{width:60px;height:60px;flex-shrink:0}
.rating-options .item-v{flex:1 1;padding:1rem .4rem;color:#fff;font-size:13px;cursor:pointer;border-radius:.75rem;filter:grayscale(1)}
.item-v.active{background:linear-gradient(135deg,#3a47d5,#00d2ff);box-shadow:0 10px 20px rgba(0,210,255,.2);transform:translateY(-5px);font-weight:600}
.item-v.disable{filter:grayscale(1)!important;opacity:.3!important;cursor:default!important}
.inc-icon{width:16px;height:16px;flex-shrink:0;font-size:0!important;line-height:0!important}
.rating-options{display:flex;align-items:stretch;justify-content:space-between;background-color:rgba(0,0,0,.3);border-radius:1rem;padding:1rem;gap:.6rem}
@media screen and (max-width:640px){.rating-options .item-v .inc-icon{width:30px;height:30px;margin:0}.rating-options .item-v{flex-direction:row;border-radius:.4rem;background-color:rgba(0,0,0,.3)}.rating-options{display:grid;grid-template-columns:repeat(3,1fr);grid-gap:.5rem;gap:.5rem;background-color:transparent;padding:0}}
@media screen and (max-width:479px){.rating-options{grid-template-columns:repeat(2,1fr)}}
.rating-modal-header{display:flex;flex-direction:column;align-items:center}
button.rating-modal-close{align-items:center;background-color:hsla(0,0%,100%,.2);border:none;border-radius:50%;color:#fff;cursor:pointer;display:flex;font-size:16px;height:30px;justify-content:center;position:absolute;right:15px;top:15px;transition:all .2s;width:30px}
button.rating-modal-close:hover {
    background-color: hsla(0, 0%, 100%, .3);
    transform: rotate(90deg);
}
h3#title-rating{font-weight:600;font-size:20px}
div#label-rating{background-color:rgba(0,0,0,.2);border-radius:30px;color:#fff;font-size:14px;padding:8px 15px}