[iOS] Strange gradient appears when using `borderTopLeftRadius` (or similar) inside a scaled `View`

Description

See snack reproduction: https://snack.expo.dev/@whiteroseeducation/ios-bordertopleftradius-gradient-issue

The issue only appears on iOS devices.

When two conditions are met, you see weird gradients near the corners. These conditions are:

1. The View has style which sets the border corners to different radius values, e.g. with borderTopLeftRadius.
2. The View is nested in a View which has a shrinking scale transform.

E.g.

<View
  style={{
    width: 400,
    height: 400,
    transform: [{ scale: 0.5 }],
  }}>
  <View
    style={{
      width: '100%',
      height: '100%',
      backgroundColor: 'white',
      borderColor: 'navy',
      borderWidth: 8,
      borderTopLeftRadius: 40,
    }}
  />
</View>

Steps to reproduce

1. Click snack link above
2. Run on an iOS device or simulator
3. Observe that the first shape (labelled "The issue") has weird gradients in it, which aren't specified by its style

React Native Version

0.76.7

Affected Platforms

Runtime - iOS

Reproducer

https://snack.expo.dev/@whiteroseeducation/ios-bordertopleftradius-gradient-issue

Screenshots and Videos

Beginne mit der verlinkten Snack-Reproduktion und führe sie auf einem iOS-Gerät oder -Simulator mit React Native 0.76.7 aus. Vergleiche die skalierte äußere View und die innere View mit borderTopLeftRadius; abgeschlossen ist die Aufgabe, wenn die betroffene Form keine Verläufe mehr zeigt, die in ihrem Style nicht vorhanden sind.