SVG 线性渐变在 Firefox 中不起作用

我有一个 Flash 设计师给我的以下 SVG 示例，它是使用 Adob​​e Illustrator 构建的：

<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 15.0.2, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
 width="30px" height="35px" viewBox="0 0 30 35" enable-background="new 0 0 30 35" xml:space="preserve">
<symbol  id="replay_icon" viewBox="0 -12 14 12">
    <g id="Layer_1_2_">
        <defs><linearGradient id="SVGID_1_" gradientUnits="userSpaceOnUse" x1="7" y1="1" x2="7" y2="-13">
            <stop  offset="0" style="stop-color:#0000FF"/>
            <stop  offset="1" style="stop-color:#00FF00"/>
        </linearGradient></defs>
        <path fill-rule="evenodd" clip-rule="evenodd" fill="url(#SVGID_1_)" d="M12.25-10.25C11.083-11.417,9.667-12,8-12v2
            c1.1,0,2.05,0.383,2.85,1.15C11.617-8.083,12-7.133,12-6c0,1.1-0.383,2.033-1.15,2.8C10.05-2.4,9.1-2,8-2S5.95-2.4,5.15-3.2
            C4.383-3.967,4-4.883,4-5.95h2l-3-4l-3,4h2c0,1.633,0.583,3.034,1.75,4.2S6.333,0,8,0s3.083-0.583,4.25-1.75S14-4.333,14-6
            S13.417-9.083,12.25-10.25z"/>
    </g>
</symbol>
<use xlink:href="#replay_icon"  width="14" height="12" y="-12" transform="matrix(1 0 0 -1 10 11)" overflow="visible"/>
</svg>

SVG 图像可以在所有浏览器中显示，甚至 IE9 (*gasp*)，但不会在 Firefox 中显示。问题出在线性梯度上。如果向路径添加描边，路径将正确描边并变得可见，但未填充。我尝试了许多不同的变体来使渐变起作用，但没有成功。有人知道 Firefox 的 SVG 的哪一部分有问题以及如何纠正它吗？

此问题从 Firefox 77 开始已得到修复。要解决早期版本 Firefox 中的问题，只需将渐变定义移到符号元素之外，例如

<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
 width="30px" height="35px" viewBox="0 0 30 35" enable-background="new 0 0 30 35" xml:space="preserve">
        <defs>
          <linearGradient id="SVGID_1_" gradientUnits="userSpaceOnUse" x1="7" y1="-13" x2="7" y2="1">
            <stop  offset="0" stop-color="#0000FF"/>
            <stop  offset="1" style="stop-color:#00FF00"/>
          </linearGradient>
        </defs>
<symbol  id="replay_icon" viewBox="0 -12 14 12">
    <g id="Layer_1_2_">
        <path fill-rule="evenodd" clip-rule="evenodd" fill="url(#SVGID_1_)" d="M12.25-10.25C11.083-11.417,9.667-12,8-12v2
            c1.1,0,2.05,0.383,2.85,1.15C11.617-8.083,12-7.133,12-6c0,1.1-0.383,2.033-1.15,2.8C10.05-2.4,9.1-2,8-2S5.95-2.4,5.15-3.2
            C4.383-3.967,4-4.883,4-5.95h2l-3-4l-3,4h2c0,1.633,0.583,3.034,1.75,4.2S6.333,0,8,0s3.083-0.583,4.25-1.75S14-4.333,14-6
            S13.417-9.083,12.25-10.25z"/>
    </g>
</symbol>
<use xlink:href="#replay_icon"  width="14" height="12" y="-12" transform="matrix(1 0 0 -1 10 11)" overflow="visible"/>
</svg>