SVG滤镜在广色域显示器输出异常，如何实现跨色域一致效果？

我尝试为图像应用SVG滤镜，该滤镜在sRGB显示器上表现正常，但在DCI-P3广色域显示器上输出异常。

最小示例为分离源图像红色通道的滤镜：

<filter id="red-mat" x="0" y="0" width="100%" height="100%">
  <feColorMatrix type="matrix"
    values="
      1 0 0 0 0
      1 0 0 0 0
      1 0 0 0 0
      0 0 0 1 0" />
</filter>

源图像是R通道沿X轴线性递增、G通道沿Y轴线性递增的基础UV贴图。应用滤镜后，预期显示从黑到白的水平线性渐变，但在MacBook Pro M1、AW2725DF等广色域显示器上出现额外垂直渐变，且无法显示纯白色#FFFFFF。

完整SVG示例如下：

<svg width="600" height="364" viewBox="0 0 600 364"
     xmlns="http://www.w3.org/2000/svg">
  <defs>
<filter id="red-mat" x="0" y="0" width="100%" height="100%">
  <feColorMatrix type="matrix"
    values="
      1 0 0 0 0
      1 0 0 0 0
      1 0 0 0 0
      0 0 0 1 0" />
</filter>
  </defs>

  <image id="broken" x="0" y="0" width="300" height="300"
         href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAASwAAAEsCAIAAAD2HxkiAAAAAXNSR0IB2cksfwAAAAlwSFlzAAALEwAACxMBAJqcGAAAA9NJREFUeJzt2TEOAjEMAEGD8v8nB06U0EC1QpkRFdU1Kzvymsfc5v03H/+8/Xm5f/3n7fX/l3/++iW+2Tf/+zevK0IgJEKIiRBiIoSYCCEmQoit+gPgdCYhxEQIMRFCTIQQEyHERAgxJwqImYQQEyHERAgxb0KIrdn1J8DZrKMQs45CzCSEmAghJkKIeRNCzIkCYtZRiFlHIWYSQkyEEBMhxLwJIWYSQsydEGLWUYhZRyEmQoiJEGLehBAzCSHmRAEx6yjErKMQEyHERAgxb0KImYQQEyHERAgxEUJMhBATIcScKCBmEkJMhBATIcRECDERQkyEEHOigJhJCDERQkyEEBMhxEQIMRFCzIkCYiYhxEQIMRFCTIQQEyHERAgxJwqImYQQEyHERAgxb0KIrdn1J8DZrKMQs45CzCSEmAghJkKIeRNCzIkCYtZRiFlHIWYSQkyEEBMhxLwJIWYSQsydEGLWUYhZRyEmQoiJEGLehBAzCSHmRAEx6yjErKMQEyHERAgxb0KImYQQEyHERAgxEUJMhBATIcScKCBmEkJMhBATIcRECDERQkyEEHOigJhJCDERQkyEEBMhxEQIMRFCzIkCYiYhxEQIMRFCTIQQEyHERAgxJwqImYQQEyHERAgxb0KIrdn1J8DZrKMQs45CzCSEmAghJkKIeRNCzIkCYtZRiFlHIWYSQkyEEBMhxLwJIWYSQsydEGLWUYhZRyEmQoiJEGLehBAzCSHmRAEx6yjErKMQEyHERAgxb0KImYQQEyHERAgxEUJMhBATIcScKCBmEkJMhBATIcRECDERQkyEEHsC3STwsH4dV+MAAAAASUVORK5CYII=" />

  <use href="#broken" x="300" y="0" filter="url(#red-mat)" />

  <rect x="0" y="300" width="600" height="64" fill="white"/>
  <text x="150" y="340" font-size="24" text-anchor="middle" fill="black">
    Source
  </text>
  <text x="450" y="340" font-size="24" text-anchor="middle" fill="black">
    Isolated Red
  </text>

</svg>

不同浏览器表现 #

Windows系统 #

• Google Chrome：广色域显示器下滤镜输出异常，sRGB显示器下正常；
• Firefox：两台显示器下均输出异常，推测因其中一台为广色域，统一使用该色域；
• VSCode Image Preview：与Chrome表现一致，推测使用相同渲染器。

macOS系统（内置Liquid Retina显示器） #

• Safari：广色域与标准色域模式下均表现正常；
• Google Chrome：广色域模式下输出异常，sRGB模式下正常。

存在关联的Chromium Bug（编号373410239）。

现问询：如何让该滤镜在任意输出显示器色域下都生成相同的线性渐变？

内容的提问来源于stack exchange，提问作者Pranav Nutalapati