Alpha channel is lost when applying a mask

[Alfinch]

In the main view of my watchface, I'm applying a mask to an SVG element. This SVG element itself has some transparent parts.

I'm finding that, when applying the mask to the SVG element, the alpha channel is lost, and instead displayed as a black background.

Below is a simple example:

  <rect x="0" y="0" width="100%" height="100%" fill="blue" />

  <mask id="mask">
    <rect x="0" y="0" width="50%" height="100%" />
  </mask>

  <svg mask="#mask" width="100%" height="100%">
    <rect x="0" y="0" width="100%" height="50%" fill="red" />
  </svg>

I would expect to see a blue background with a red square in the top-left corner:

Instead I also see a black square in the bottom left, where the transparent part of the SVG element should be:

Is it possible to preserve this transparency at all? In my case both the mask and SVG element are quite complex and have dynamic elements, so it's not going to be easy to work around. Thanks.

[Gondwana]

I've seen this behaviour. I wasn't able to find a workaround. ☹️

[Alfinch]

Oof, okay thanks. I have a workaround in mind but it's not pretty! (Involves prerendering a lot of images)