SVG在Chrome中渲染，但不在Firefox中渲染

Question

所以，我一直在使用一些手写的SVG代码处理图片。其中一些是我自己的原创作品，其中一些是我从一些教程中复制和粘贴的。

我的问题是该文件在浏览器之间或图像编辑器之间不能一致地呈现。这是我的SVG文件：

<?xml version="1.0"?>
<svg xmlns="http://www.w3.org/2000/svg" version="1.2" height="75px">
 <defs id="wordDef">
  <filter id="outerbevel" x0="-50%" y0="-50%" width="200%" height="200%">
    <feGaussianBlur stdDeviation="1" result="blur"/>
    <feOffset dy="1" dx="1"/>
    <feComposite in2="SourceAlpha" operator="arithmetic" k2="1" k3="-1" result="hlDiff"/>
    <feFlood flood-color="white" flood-opacity=".7"/>
    <feComposite in2="hlDiff" operator="in"/>
    <feComposite in2="SourceGraphic" operator="over" result="withGlow"/>
    <feOffset in="blur" dy="-1" dx="-1"/>
    <feComposite in2="SourceAlpha" operator="arithmetic" k2="1" k3="-1" result="shadowDiff"/>
    <feFlood flood-color="black" flood-opacity="1"/>
    <feComposite in2="shadowDiff" operator="in" result="test1"/>
    <feComposite in2="withGlow" operator="over" result="test2"/>
    <feMerge>
      <feMergeNode in="test1"/>
      <feMergeNode in="test2"/>
      <feMergeNode in="SourceGraphic"/>
    </feMerge>
  </filter>
 </defs>

<text x="0" y="23" font-size="23px" fill="#aaa" fill-opacity="1" filter="url(#outerbevel)">SERVICES</text>
</svg>

Google Chrome版

与Firefox版本相比

我很难过。有什么想法吗？

编辑：按照Robert Longson的要求清理加价。