Smallest reproducable example is
data- attributes are highlighted differently for some reason.
Adding {}</style> anywhere else in the file after the highlighting is broken will fix it.
<span class="foo" style="baz" data-foo="qux">bar</span>
<style>a</style>
<span class="foo" style="baz">bar</span>
<span class="foo" style="baz" data-foo="qux">bar</span>
{}</style>
<span class="foo" style="baz">bar</span>
<span class="foo" style="baz" data-foo="qux">bar</span>

I came accross this editing an email template that has HTML comment markers around the style content
<style>
<!--
.foo { bar: baz; }
-->
</style>
However in this case I think its just treating --> as an unfinished selector.
The highlighting changes depending on the last bit of code before the closing </style> tag. The following three each have different results.
--> Not working
-->{ Not working, but different
-->{} OK
Smallest reproducable example is
data-attributes are highlighted differently for some reason.Adding
{}</style>anywhere else in the file after the highlighting is broken will fix it.I came accross this editing an email template that has HTML comment markers around the style content
However in this case I think its just treating
-->as an unfinished selector.The highlighting changes depending on the last bit of code before the closing
</style>tag. The following three each have different results.-->Not working-->{Not working, but different-->{}OK