Best Practices
One file per component
Keep styles isolated in ui.<component>.css files for maintainability.
Use semantic tokens
Name tokens by intent (primary, elevated) not by appearance (blue, shadow-lg).
Compose freely
Don't over-engineer token hierarchies. Let developers combine as needed.
Use CSS variables for dynamics
Prefer --ui-* variables over inline styles for dynamic values.
Keep @style minimal
Only use @style for values that can't be expressed with @apply.