PR Checklist

• The PR title follows our guidelines: https://github.com/NativeScript/NativeScript/blob/master/tools/notes/CONTRIBUTING.md#commit-messages.
• There is an issue for the bug/feature this PR is for. To avoid wasting your time, it's best to open a suggestion issue first and wait for approval before working on it.
• You have signed the CLA.
• All existing tests are passing: https://github.com/NativeScript/NativeScript/blob/master/tools/notes/DevelopmentWorkflow.md#running-unit-tests-application.
• Tests for the changes are included - https://github.com/NativeScript/NativeScript/blob/master/tools/notes/WritingUnitTests.md.

What is the current behavior?

Rules inside @layer blocks are silently dropped: _populateRules (ui/styling/style-scope.ts) only descends into @media at-rules, so every modern build-time CSS pipeline that emits cascade layers (Tailwind v4, Panda CSS, Bamboo, UnoCSS) produces a stylesheet that is dead on NativeScript — see NativeScript/tailwind#197 for the same wall hit from the Tailwind side.

What is the new behavior?

@layer applies per CSS Cascading and Inheritance Level 5:

• Parsers:
  • css/css-tree-parser.ts (default __CSS_PARSER__) — @layer nodes keep their prelude (layer name list) alongside nested rules; the statement form (@layer a, b;) parses with no block.
  • css/lib/parse (vendored rework parser) — same support, which also fixes the legacy __CSS_PARSER__=rework runtime path and gives the bundler-side serializers a layer-aware parser to converge on.
• Ordering (ui/styling/style-scope.ts): a name→ordinal registry shared across all stylesheets feeding the cascade (document-wide, per spec). Statement form pre-declares order; block form registers on first sight; dotted names (a.b) walk ancestors so a top-level @layer a.b refers to the same layer as @layer a { @layer b { … } }; anonymous blocks get synthesized names that can't be re-referenced.
• Cascade (ui/styling/css-selector.ts): each RuleSet carries layerPath: number[]; compareSelectors compares layer paths before specificity. Unlayered rules carry an infinite rank at every depth, so they always beat layered rules — matching the spec, which also handles nested-layer comparison lexicographically.
• Imports: @import "x.css" layer(name) (and bare layer for anonymous) nests the imported sheet under that layer.

Deliberately not implemented: !important layer-order reversal — NativeScript does not implement !important at all today (cleanupImportantFlags warns and strips), so there is nothing to reverse. @supports/@container/@scope remain dropped (they need real condition evaluation; dropping is safer than unconditional application).

Known follow-up (out of scope here)

The bundler-side serializers — @nativescript/vite's bundled-css path (helpers/main-entry.ts, parseCssToAst) and webpack's css2json-loader — run the npm css package (reworkcss/css), which misparses @layer into bogus selectors and drops the rules. That package is a separate upstream; swapping those call sites to core's now-layer-aware vendored parser (or css-tree) is the natural follow-up.

Tests

New ui/styling/css-layer.spec.ts — 13 cases covering population, statement ordering over specificity+position, unlayered-beats-layered, nested/dotted equivalence, anonymous ordering, media queries inside layers, keyframes inside layers, and the same ordering driven through the rework-parser AST end to end. Verified on-device (iOS sim) via a harness probe: a class rule in the later layer beat an id selector in the earlier one, and an unlayered rule beat a layered id selector. Full packages/core suite: 510 tests passing locally.

Implements #11461.