动画 css 属性中的 Calc() 仅在 microsft edge 中不起作用

Question

这个加载器动画在 Chrome、Opera、Firefox 和 Safari 中也能正常工作。但不适用于 Microsoft Edge。是否可以使其在 Edge 中工作？

<div class="_preLoader" style="--n:5">
            <div class="_circle _c1" style="--i:0"></div>
            <div class="_circle _c2" style="--i:1"></div>
            <div class="_circle _c3" style="--i:2"></div>
            <div class="_circle _c4" style="--i:3"></div>
            <div class="_circle _c5" style="--i:4"></div>
        </div>

风格

._preloader {
        display: flex;
        align-content: space-around;
        justify-content: center;
    }

    ._circle,
    ._circle::after {
        background: rgb(255, 99, 71);
        display: inline-block;
        width: 2em;
        height: 2em;
        border-radius: 50%;
        animation: a 1s calc(((var(--i) + var(--o, 0))/var(--n) - 1)*1s) infinite
    }


    ._circle::after {
        --o: 1;
        background: #3C4252;
        content: ''
    }



    @keyframes a {
        0%,
        50% {
            transform: scale(0)
        }

这个 jsfiddle https://jsfiddle.net/03ddygdx/20/完美地显示了所描述的浏览器中的动画，除了 microsft edge。