uniwind-theme-variables

Styling is UniWind (className on RN components), not NativeWind. The metro plugin treats src/global.css as the CSS entry, and _layout.tsx must import it or every className silently becomes a no-op.

Theme variables have exactly one working form, and the two obvious ones both fail silently:

@layer theme {
  :root {
    @variant light { --color-surface: #ffffff; }
    @variant dark  { --color-surface: #1c1e35; }
  }
}

• light-dark(#fff, #1c1e35) inside @theme compiles to #000000. The transformer handles that function for ordinary declarations, not for custom properties.
• A media query plus a .dark selector does not work. Variables are flattened to one resolver per name, so whichever block is written last becomes the only theme and the app is permanently light or permanently dark.
• Every variable must appear in BOTH @variant blocks, including ones whose value does not change. A name missing from one resolves to black in that theme.

src/theme/tokens.test.ts asserts both themes against global.css.

Related: tokens