STD-COD-003: Styling & UI Composition

1. Context

To prevent "Visual Chaos". Styles should be predictable, maintainable, and token-based.

2. The Standard (The Floor)

• [MUST] Tokens Only: No Magic Values (w-[37px]). Use Design Tokens (w-10).
• [MUST] Layout Primitives: Use Stack, Grid, and Flex components (or consistent Utility classes) for layout. Avoid absolute positioning unless necessary for overlays.
• [MUST] Mobile-First: Default styles are Mobile. Use md: and lg: for desktop overrides.
• [MUST] No Global CSS: Styles allowed only in Modules or Tailwind Utilities. No Global CSS files except globals.css (reset). <<<<<<< HEAD
• [MUST] Third-Party Taming: External components (Syncfusion, etc.) MUST be overridden to match the Design System tokens (Fonts, Colors, Border Radius). Use :global CSS modules or specificity hacks if necessary to ensure brand consistency.

=======

origin/main

3. Best Practices (The Path)

• [SHOULD] clsx / cva: Use class-variance-authority (CVA) for component variants.
• [SHOULD] Whitespace: Use "Rhythm" (margin/padding) from the space- scale (4, 8, 12, 16).

5. Version History

Version	Date	Author	Change
1.0	2026-01-25	AI	Established Styling Standards

Version History

Version	Date	Author	Change
0.1.0	2026-01-26	Antigravity	Initial Audit & Metadata Injection