SVG矩形宽度动画在Firefox中不起作用

Question

我一直在尝试使用css为svg矩形的宽度设置动画，并且它似乎可以与chrome和Opera一起使用，但不适用于Firefox，对此我将不胜感激，在此先感谢您

https://codepen.io/goprime/pen/BOPBjM

这是代码：

HTML：

<?xml version="1.0" standalone="no"?>
                    <!-- Generator: Gravit.io --><svg class="responsive-svg" xmlns="http://www.w3.org/2000/svg"
                        xmlns:xlink="http://www.w3.org/1999/xlink" style="isolation:isolate" viewBox="908.444 448 948 1114"
                        width="948" height="1114">

                        <!-- This is the main background -->
                        <g>
                            <rect x="908.444" y="448" width="948" height="1114" transform="matrix(1,0,0,1,0,0)" fill="white" />
                            <g transform="matrix(1,0,0,1,1232.227,773.652)">

                                <text transform="matrix(1,0,0,1,0,76.957)" style="font-family:'Source Sans Pro';font-weight:400;font-size:72px;font-style:normal;fill:#A4A598;stroke:none;">INTERIOR</text></g>

                           </g>

                            <!-- First box cover-->
                            <rect class="anim_test_top" x="1130" y="773.652" transform="matrix(1,0,0,1,0,0) rotate(180 1430 820.652)"
                                fill="white" />

 </svg>

CSS：

.anim_test_top {
  /* stroke:cyan; */
  width: 530px;
  height: 80px;
  animation: anim 2s linear forwards;
}



@keyframes anim {
  from {
    width: 630.214px;
  }

  to {
    width: 0;
  }
}