dark: values are working on chrome, but not on safari

[mjnyland]

What version of Tailwind CSS are you using?

For example: v4.0.12

What build tool (or framework if it abstracts the build tool) are you using?

Next.js 15.2.1

What version of Node.js are you using?

15.2.1

What browser are you using?

Safari

What operating system are you using?

macOS

Reproduction URL

https://github.com/mjnyland/fiddle

Describe your issue

I've installed tailwind v4 properly. Im using next-themes to set a light or dark value at the root html element. When toggling back and forth, elements styled with "dark:" do not change on safari. they do change on chrome.

[philipp-spiess]

Hey! I was running your reproduction locally and the behavior of Chrome and Safari was the same for me. Do you have more context as to what is not working as expected? This also seems to compile to very simple CSS:

/*! tailwindcss v4.0.12 | MIT License | https://tailwindcss.com */
@layer theme, base, components, utilities;
@layer utilities;
@layer theme {
  .dark {
    --page-background: #171819;
  }
}