False "Avoid non-composited animations" when animating custom properties

### FAQ

- [x] Yes, my issue is not about [variability](https://github.com/GoogleChrome/lighthouse/blob/main/docs/variability.md) or [throttling](https://github.com/GoogleChrome/lighthouse/blob/main/docs/throttling.md).
- [x] Yes, my issue is not about a specific accessibility audit (file with [axe-core](https://github.com/dequelabs/axe-core) instead).
- [x] Yes, my issue is not answered by [other FAQs](https://github.com/GoogleChrome/lighthouse#faq).

### URL

https://gist.github.com/nextend/8d744edc65e537ba283d64466556d2b1

### What happened?

Run Lighthouse performance report on the attached HTML file.

In the Diagnostics there will a record called "Avoid non-composited animations 1 animated element found" -> "Animations which are not composited can be janky and increase CLS. " -> "Unsupported CSS Property: --variable-rotate-z"

### What did you expect?

`--variable-rotate-z` is defined with @property at-rule and this CSS variable will be used in transform property, so it I think this will be composited animation.

### What have you tried?

_No response_

### How were you running Lighthouse?

Chrome DevTools

### Lighthouse Version

12.6.0

### Chrome Version

138.0.7204.96

### Node Version

_No response_

### OS

Windows 10

### Relevant log output

```sh

```