Gradient SVGs not working in Mozilla Firefox on mobile devices?

Question

HTML

There is SVG in the site code

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 50 50">
            <linearGradient id="linear-gradient">
              	<stop offset="0%" stop-color="#7fce5c"/>
              	<stop offset="100%" stop-color="#0e999f"/>
            	</linearGradient>
              <path fill="url(#linear-gradient)" style="line-height:normal;text-indent:0;text-align:start;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:#000;text-transform:none;block-progression:tb;isolation:auto;mix-blend-mode:normal" d="M 13.21875 5.375 L 7.375 12.84375 L 4.65625 10.4375 L 3.34375 11.9375 L 6.84375 15.0625 L 7.625 15.75 L 8.28125 14.90625 L 14.78125 6.625 L 13.21875 5.375 z M 19 10 L 19 12 L 46 12 L 46 10 L 19 10 z M 13.21875 19.375 L 7.375 26.84375 L 4.65625 24.4375 L 3.34375 25.9375 L 6.84375 29.0625 L 7.625 29.75 L 8.28125 28.90625 L 14.78125 20.625 L 13.21875 19.375 z M 19 24 L 19 26 L 46 26 L 46 24 L 19 24 z M 13.21875 33.375 L 7.375 40.84375 L 4.65625 38.4375 L 3.34375 39.9375 L 6.84375 43.0625 L 7.625 43.75 L 8.28125 42.90625 L 14.78125 34.625 L 13.21875 33.375 z M 19 38 L 19 40 L 46 40 L 46 38 L 19 38 z"></path>
          </svg>

With a gradient, the picture does not want to be displayed either in the Mozilla mobile application or on the desktop in Responsive Design Mode. How to decide?