Text Field Outline/Border Color breaks under Label into a Black Segment

[jtng3]

What is affected?

Component, Theming

Description

When I use a m3 web component in a svelte app, the outline is not consistently the primary color, instead, under where the label is, the outline becomes partially black.

Reproduction

https://secret.labs.tozny.com/create

Workaround

have not

Is this a regression?

No or unsure. This never worked, or I haven't tried before.

Affected versions

failing @material/web@1.5.1

Browser/OS/Node environment

node: v20.14.0
safari: Version 17.4 (19618.1.15.11.12)

[jtng3]

problem present in chrome and safari on ios. problem not present in chrome(mac), but present in safari(mac)

[rosasck]

I am also seeing this issue occur on ios safari