CSS issues with @property

Hello I’m trying to add an animation to my website loader, in my local project works amazing but when I upload to Galaxy is not recognize the property @property here is an example of the code

.rtqh7xB {
width: var(–sh-242-120);
height: var(–sh-242-120);
border-radius: 400px;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
z-index: 10;
display: flex;
align-items: center;
opacity: 0.84;
background: conic-gradient(#11141C var(–percentage), transparent 0);
animation: timer 8s infinite linear;
}

@property --percentage {
initial-value: 0%;
inherits: false;
syntax: “”;
}

@keyframes timer {
0% {
–percentage: 100%;
}
100% {
–percentage: 0%;
}
}

Appreciate any help to get this accomplished

Thanks in advance

I am not too familiar with this but do you have a valid syntax in your definition? CSS Properties and Values API Level 1

You need to run your css postprocessor when building for production.

Isn’t it pure CSS?! "@property" | Can I use... Support tables for HTML5, CSS3, etc

Thanks for the response, in developer local mode works well but this was not the case in production, so I ended up using svg instead, thanks for the support