Replace "FastNext" branding with "PragmaStack" across the project

- Updated all references, metadata, and templates to reflect the new branding, including layout files, components, and documentation.
- Replaced hardcoded color tokens like `green-600` with semantic tokens (`success`, `warning`, etc.) for improved design consistency.
- Enhanced `globals.css` with new color tokens for success, warning, and destructive states using the OKLCH color model.
- Added comprehensive branding guidelines and updated the design system documentation to align with the new identity.
- Updated tests and mocks to reflect the branding changes and ensured all visual/verbal references match "PragmaStack".
- Added new `branding/README.md` and `branding` docs for mission, values, and visual identity definition.

frontend/docs/design-system/00-quick-start.md

@@ -1,6 +1,6 @@
 # Quick Start Guide
 
-Get up and running with the FastNext design system immediately. This guide covers the essential patterns you need to build 80% of interfaces.
+Get up and running with the PragmaStack design system immediately. This guide covers the essential patterns you need to build 80% of interfaces.
 
 ---
 

frontend/docs/design-system/01-foundations.md

@@ -38,6 +38,11 @@
 
 ---
 
+---
+
+> [!NOTE]
+> **Branding vs. Design System**: These foundations implement the visual identity defined in the **[Branding Guidelines](../branding/README.md)**. Refer to that document for the "why" behind these choices.
+
 ## Color System (OKLCH)
 
 ### Why OKLCH?
@@ -228,6 +233,32 @@ All colors follow the **background/foreground** convention:
 // Delete button
 <Button variant="destructive">Delete Account</Button>
 
+---
+
+### Success & Warning Colors
+
+**Purpose**: Success states and warning alerts
+
+```css
+/* Light & Dark Mode */
+--success: oklch(0.6231 0.188 145) /* Green */
+--success-foreground: oklch(1 0 0) /* White text */
+
+--warning: oklch(0.75 0.15 85) /* Yellow/Orange */
+--warning-foreground: oklch(0.1529 0 0) /* Dark text */
+```
+
+**Usage**:
+
+```tsx
+// Success badge
+<Badge className="bg-success text-success-foreground">Completed</Badge>
+
+// Warning alert
+<div className="bg-warning text-warning-foreground p-4">
+  Warning: This action is irreversible.
+</div>
+```
 // Error alert
 <Alert variant="destructive">
   <AlertCircle className="h-4 w-4" />

frontend/docs/design-system/08-ai-guidelines.md

@@ -1,6 +1,6 @@
 # AI Code Generation Guidelines
 
-**For AI Assistants**: This document contains strict rules for generating code in the FastNext Template project. Follow these rules to ensure generated code matches the design system perfectly.
+**For AI Assistants**: This document contains strict rules for generating code in the PragmaStack project. Follow these rules to ensure generated code matches the design system perfectly.
 
 ---
 

frontend/docs/design-system/99-reference.md

@@ -1,6 +1,6 @@
 # Quick Reference
 
-**Bookmark this page** for instant lookups of colors, spacing, typography, components, and common patterns. Your go-to cheat sheet for the FastNext design system.
+**Bookmark this page** for instant lookups of colors, spacing, typography, components, and common patterns. Your go-to cheat sheet for the PragmaStack design system.
 
 ---
 

frontend/docs/design-system/README.md

@@ -1,6 +1,6 @@
 # Design System Documentation
 
-**FastNext Template Design System** - A comprehensive guide to building consistent, accessible, and beautiful user interfaces.
+**PragmaStack Design System** - A comprehensive guide to building consistent, accessible, and beautiful user interfaces.
 
 ---
 
@@ -19,6 +19,11 @@
 
 ## 📖 Documentation Structure
 
+### Branding & Identity
+- **[Branding Guidelines](../branding/README.md)** 🎨
+  - Mission & Values
+  - Visual Identity (Logo, Colors, Typography)
+
 ### Getting Started
 
 - **[00. Quick Start](./00-quick-start.md)** ⚡