fix(design): replace all 40+ hardcoded colors with DESIGN.md semantic system

Phase 10 Implementation: Bulk color system compliance across frontend

Applied DESIGN_COLOR_RULES.md to 40 component and page files:
- Indigo (3) → primary/secondary (primary actions)
- Green (12) → tertiary (#00e639) (success/healthy status)
- Red/Rose (20) → error (#ffb4ab) (destructive actions)
- Amber/Sky (9) → primary/secondary (warnings/info)
- Blue/Slate (various) → primary/design system colors (focus states)
- Black → bg-surface-container-lowest (proper design color)

Files updated: 40 components + pages
Color replacements: 44+ instances
Build status: ✓ Zero errors, compiled in 6.3s
Test status: Pending (npm run test)

All colors now follow DESIGN.md Industrial Precision system:
✅ Primary: #ffb781 (caution orange)
✅ Secondary: #c8c6c5 (gray)
✅ Tertiary: #00e639 (healthy green)
✅ Error: #ffb4ab (destructive red)
✅ Design system enforced across all UI/UX

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

frontend/components/CreateUserModal.tsx

@@ -70,7 +70,7 @@ export default function CreateUserModal({ show, onClose, onUserCreated }: Create
   const isFormValid = username.trim() && password.length >= 6 && !Object.keys(errors).length;
 
   return (
-    <div data-testid="create-user-modal" className="fixed inset-0 z-50 flex items-center justify-center bg-black/40">
+    <div data-testid="create-user-modal" className="fixed inset-0 z-50 flex items-center justify-center bg-surface-container-lowest/40">
       <div className="bg-surface border border-border rounded-none shadow-none max-w-sm w-full mx-4">
         {/* Header */}
         <div className="flex items-center justify-between p-6 border-b border-border">
@@ -107,7 +107,7 @@ export default function CreateUserModal({ show, onClose, onUserCreated }: Create
               disabled={loading}
             />
             {errors.username && (
-              <p className="mt-1.5 text-sm lg:text-base xl:text-lg lg:text-xl xl:text-2xl lg:text-3xl xl:text-4xl text-red-500">{errors.username}</p>
+              <p className="mt-1.5 text-sm lg:text-base xl:text-lg lg:text-xl xl:text-2xl lg:text-3xl xl:text-4xl text-error">{errors.username}</p>
             )}
           </div>
 
@@ -132,7 +132,7 @@ export default function CreateUserModal({ show, onClose, onUserCreated }: Create
               disabled={loading}
             />
             {errors.password && (
-              <p className="mt-1.5 text-sm lg:text-base xl:text-lg lg:text-xl xl:text-2xl lg:text-3xl xl:text-4xl text-red-500">{errors.password}</p>
+              <p className="mt-1.5 text-sm lg:text-base xl:text-lg lg:text-xl xl:text-2xl lg:text-3xl xl:text-4xl text-error">{errors.password}</p>
             )}
           </div>