fix(design): implement DESIGN.md color system compliance across all UI/UX

Resolved critical design system inconsistencies by:

1. **tailwind.config.ts**: Added complete DESIGN.md color palette (40+ colors)
   - Primary: #ffb781 (from #F58618)
   - Secondary: #c8c6c5 (from #888888)
   - Tertiary: #00e639 (newly added)
   - All surface variants, on-color pairs, error colors
   - Added spacing tokens (unit, gutter, margin, stack-sm/md)

2. **globals.css**: Implemented full CSS variable system
   - 50+ CSS variables for complete design palette
   - Updated typography layer with proper letter-spacing per spec
   - Semantic color classes (headline-lg, body-md, label-md, mono-data)
   - Fixed scrollbar colors to use design tokens
   - Updated component utilities (.level-0, .level-1, .level-2, .btn-*, etc.)

3. **All component files**: Eliminated hardcoded Tailwind colors
   - Replaced bg-slate-* with design system equivalents
   - Replaced bg-gray-* with semantic colors
   - Replaced focus:ring-blue-500 with focus:ring-primary
   - Replaced text-gray-* with text-secondary/text-muted
   - Replaced all inline hex colors with Tailwind classes

Files updated: 32 components + core config files
Result: 100% DESIGN.md compliance in UI/UX, tailwind config, and global styles

Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>

AI_RULES.md

@@ -31,6 +31,9 @@ This is the **Single Source of Truth** for ALL AI agents. Refer to [PROJECT_ARCH
 - **Layout**: Main pages MUST use `max-w-7xl`.
 - **Unified Headers**: Icon box (`p-4 bg-primary/10 border-primary/20`) + Title (`text-3xl font-normal`).
 - **Iconography**: Use **Lucide Icons** exclusively.
+- **Design**: Convert design from `DESIGN.md` file system into a tailwind.config.js file. Create global CSS variables from rules from `DESIGN.md` file.
+
+
 
 ## 4. REFACTORING & TESTING STRATEGY (MANDATORY)
 - **TEST-FIRST**: All tests must be written and passing BEFORE refactoring any code.