css - SVG 背景图像仅在 Chrome 上不清晰（在 Firefox 和 Safari 上显示正确）

Question

我不明白为什么当使用 SVG 图像作为背景图像时，背景重复在 Chrome 上看起来如此不清晰，但在 Safari 或 Firefox 上看起来却很好。这是重现该问题的CodePen。

.bg {
  width: 100%;
  height: 3000px;
  background-size: max(100%, 1080px);
  background-repeat: repeat-y;
  background-image: url('bg.svg');
}

body {
  margin: 0;
}

铬 火狐

如您所见，在上述链接中或直接在 Chrome 或 Safari 浏览器中，曲线在 Chrome 中不清晰（为什么？），但在 Firefox 中它们看起来干净锐利（在 Safari 中相同）。

我不敢相信在 2020 年，Chrome 在使用 SVG 图像作为背景方面表现得如此糟糕。

任何帮助表示赞赏！谢谢！小心！