SVG not rendering

[simonewebdesign]

Hi, I'm having trouble rendering a particular SVG. I have other similar SVGs that render just fine, but this one doesn't, for some reason. Here's the markup:

<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="24" height="24">
  <defs>
    <circle id="tick-b" cx="7.995" cy="7.995" r="7.995"/>
    <filter id="tick-a" width="168.8%" height="168.8%" x="-34.4%" y="-34.4%" filterUnits="objectBoundingBox">
      <feMorphology in="SourceAlpha" operator="dilate" radius="1" result="shadowSpreadOuter1"/>
      <feOffset in="shadowSpreadOuter1" result="shadowOffsetOuter1"/>
      <feGaussianBlur in="shadowOffsetOuter1" result="shadowBlurOuter1" stdDeviation="1.5"/>
      <feComposite in="shadowBlurOuter1" in2="SourceAlpha" operator="out" result="shadowBlurOuter1"/>
      <feColorMatrix in="shadowBlurOuter1" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.229223279 0"/>
    </filter>
  </defs>
  <g fill="none" fill-rule="evenodd" transform="translate(4 4)">
    <use fill="#000" filter="url(#tick-a)" xlink:href="#tick-b"/>
    <use fill="#99B9AE" stroke="#FFF" stroke-width="2" xlink:href="#tick-b"/>
    <path fill="#FFF" d="M5.809 11.562L3.665 9.364a.578.578 0 0 1 .012-.82c.23-.223.6-.218.825.012l1.735 1.78 5.31-5.17a.585.585 0 0 1 .824.008.577.577 0 0 1-.009.82l-5.726 5.579a.585.585 0 0 1-.827-.01z"/>
  </g>
</svg>

Note this renders fine if I just put it as is in an HTML file, so I suspect it's something JS related?

I made an example project here to reproduce the issue, if you could check it out that'd be great. Thank you.