feat(FN-1409): extract color-theme CSS to separate theme-data.css

- Extract all color-theme CSS variable blocks from styles.css into a dedicated theme-data.css file
- Add dynamic loading of theme-data.css for non-default color themes via useTheme hook
- Preload theme-data.css for the default theme in index.html to avoid flash
- Update status-colors-theme tests for dynamic theme loading behavior
- Update memory and README with theme-data.css file location

packages/dashboard/README.md

@@ -466,10 +466,12 @@ Theme preferences are automatically saved to localStorage and persist across ses
 To add a new color theme:
 
 1. Add the theme to `COLOR_THEMES` in `packages/core/src/types.ts`
-2. Add CSS variables in `packages/dashboard/app/styles.css` under `[data-color-theme="your-theme"]`
+2. Add CSS variables in `packages/dashboard/app/public/theme-data.css` under `[data-color-theme="your-theme"]` (dark variant) and `[data-color-theme="your-theme"][data-theme="light"]` (light variant)
 3. Add the swatch class for the theme picker in the CSS
 4. Update `ThemeSelector.tsx` with the new theme option
 
+**Note:** Theme variable blocks are stored in a separate `theme-data.css` file for optimized loading. This file is only loaded when a non-default color theme is active, reducing the initial payload for users with the default theme.
+
 ### Theme-Driven Logo and Task-Creation CTAs
 
 The Fusion logo and all task-creation action buttons (including the "+ New Task" and "Save" buttons in board view, list view, and inline creation surfaces) are fully tokenized and respond to the active color theme. This ensures branding and task-creation affordances stay visually consistent across all 12 color themes and both light/dark modes.