Calc() in animation css property is not working in only microsft edge

This loader animation is working fine in Chrome, Opera, Firefox and Safari too. But not working in Microsoft Edge. Is it possible to make it work in 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>

STYLE

._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)
        }

This jsfiddle https://jsfiddle.net/03ddygdx/20/ shows the animation in the described browsers perfectly except microsft edge.