Theme
Layers
Stacking order for what sits above the page, and the cascade layers every app's CSS is ordered by.
Stacking order
Popovers and modal dialogs use the browser's top layer where they can, which no z-index reaches; these values order what cannot.
| Token | Value | Use |
|---|---|---|
layer.raised | 1 | |
layer.sticky | 10 | |
layer.overlay | 40 | |
layer.popover | 50 | |
layer.toast | 60 | |
layer.skipLink | 100 |
Cascade layers
@serre/design/base.css declares @layer reset, tokens, base, components, utilities. The reset and the document rules sit low; each app puts the extracted StyleX rules in components; a deliberate override belongs in utilities, above them, rather than in a more specific selector.