Css translate rotate scale properties not output in css bundle if used before transform

[Samael-TLB]

Link to the code that reproduces this issue

https://github.com/Samael-TLB/

To Reproduce

If we write css like below:

.element{
      rotate: 90deg;
      transform: skewY(7deg);  
      translate: 0% 100%; 
    }

Then the css bundle removes all individual transformation properties written before transform property and all those transformation properties written after transform property are merged into the transform property appended in order. This is not expected and breaks transformation order as per css.

Current vs. Expected behavior

Expectation is that the properties are retained as they were written and not processed any further. It was working correctly till NextJS@15 but on upgrade to version 16 this issue arose.

Provide environment information

Operating System:
   Platform: Windows 10
Binaries:
   Node: 20.18.0
   npm: 11.4.2
   NextJS: 16.0.3

Which area(s) are affected? (Select all that apply)

CSS

Which stage(s) are affected? (Select all that apply)

next dev (local), next build (local), next start (local), Vercel (Deployed)

Additional context

No response

[Samael-TLB]

Kindly either detail out your solution or refrain from sharing conspicuous files

[timneutkens]

Deleted that comment 👍