Incorrect CSS minification when using next build

[RobinMalfait]

Link to the code that reproduces this issue

https://github.com/RobinMalfait/nextjs-incorrect-css-minification

To Reproduce

next dev will result in the correct result:

next build && next start will result in the incorrect result:

Current vs. Expected behavior

Given CSS like this:

.example {
  border: 2px solid red;
  width: 100px;
  height: 100px;
  background-image: conic-gradient(in oklch decreasing hue, oklch(0.491 0.27 292.580994) var(--tw-gradient-from-position), oklch(0.897 0.196 126.665001) 50%, oklch(0.491 0.27 292.580994) 100%);
}

@property --tw-gradient-from-position {
  syntax: "<length-percentage>";
  inherits: false;
  initial-value: 0%
}

This will work as-is in development mode because no minification is happening. Once you run a production build, the initial-value: 0% is defined as initial-value: 0 which makes the CSS property invalid.

I expect that the initial-value stays the same and not break when running a production build.

You also don't get any errors, so it might not be obvious that this bug happened.

Provide environment information

Operating System:
  Platform: darwin
  Arch: arm64
  Version: Darwin Kernel Version 24.4.0: Fri Apr 11 18:33:47 PDT 2025; root:xnu-11417.101.15~117/RELEASE_ARM64_T6000
  Available memory (MB): 65536
  Available CPU cores: 10
Binaries:
  Node: 23.11.0
  npm: 10.9.2
  Yarn: N/A
  pnpm: 9.15.1
Relevant Packages:
  next: 15.4.0-canary.33 // Latest available version is detected (15.4.0-canary.33).
  eslint-config-next: N/A
  react: 19.1.0
  react-dom: 19.1.0
  typescript: N/A
Next.js Config:
  output: N/A

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

CSS

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

next build (local)

Additional context

Related issue: tailwindlabs/tailwindcss#17977

[Multiply]

Should be fixed with cssnano/cssnano#1702