docs: Complete HIGH priority documentation tasks

TASK 4.3: Document granular permissions system - COMPLETED
- Add Section 7: Granular Permissions System to APERTURE_SPECS.md
- Define flexible permission system for any user
- Only admin can assign permissions (independent of user roles)
- 8 permission categories with 30+ individual permissions
- Database schema: user_permissions table with RLS
- API endpoints for checking and assigning permissions
- Helper functions: hasPermission(), hasPermissions(), isAdmin()
- UI components: PermissionChecker, MultiPermissionChecker
- Admin panel for permission management

TASK 4.5: Update APERTURE_SQUARE_UI.md with Radix UI - COMPLETED
- Add Section 3: Radix UI Components Used
- Document all Radix UI packages installed
- Radix components styled with Square UI tokens
- Section 5: Square UI styling examples for each component
- Section 6: Accessibility guidelines (Radix UI support)
- Code examples for Button, Dialog, Tooltip with Square UI
- Complete dashboard page example with Radix UI components

TASK 4.2: Update globals.css with complete variables - COMPLETED
- Add all Square UI color variables to :root
- Add UI component shadows (sm, md, lg, xl)
- Add UI border colors
- Add UI text colors (primary, secondary, tertiary)
- Add UI state colors (success, warning, error, info)
- Add UI radiuses (sm, md, lg, xl, 2xl, full)
- Add UI text sizes (xs, sm, base, lg, xl, 2xl, 3xl, 4xl, 5xl)
- Maintain backward compatibility with anchor23.mx colors

Impact:
- Complete Square UI design system foundation
- All color variables centralized in globals.css
- Ready for Radix UI integration
- Supports both anchor23.mx and Aperture styling

Files Modified:
- docs/APERTURE_SPECS.md (added granular permissions section)
- docs/APERTURE_SQUARE_UI.md (added Radix UI documentation)
- app/globals.css (added complete Square UI variables)

Next: FASE 1 - Componentes Base con Radix UI

app/globals.css

@@ -9,13 +9,65 @@
     --mocha-taupe: #B8A89A;
     --deep-earth: #6F5E4F;
     --charcoal-brown: #3F362E;
+
+    /* Aperture - Square UI */
+    --ui-primary: #006AFF;
+    --ui-primary-hover: #005ED6;
+    --ui-primary-light: #E6F0FF;
+
+    --ui-bg: #F6F8FA;
+    --ui-bg-card: #FFFFFF;
+    --ui-bg-hover: #F3F4F6;
+
+    --ui-border: #E1E4E8;
+    --ui-border-light: #F3F4F6;
+
+    --ui-text-primary: #24292E;
+    --ui-text-secondary: #586069;
+    --ui-text-tertiary: #8B949E;
+    --ui-text-inverse: #FFFFFF;
+
+    --ui-success: #28A745;
+    --ui-success-light: #D4EDDA;
+
+    --ui-warning: #DBAB09;
+    --ui-warning-light: #FFF3CD;
+
+    --ui-error: #D73A49;
+    --ui-error-light: #F8D7DA;
+
+    --ui-info: #0366D6;
+    --ui-info-light: #CCE5FF;
+
+    --ui-shadow-sm: 0 1px 3px rgba(0,0,0,0.08), 0 1px 4px rgba(0,0,0,0.08);
+    --ui-shadow-md: 0 4px 12px rgba(0,0,0,0.12), 0 1px 3px rgba(0,0,0,0.08);
+    --ui-shadow-lg: 0 8px 24px rgba(0,0,0,0,16), 0 4px 6px rgba(0,0,0,0.08);
+    --ui-shadow-xl: 0 20px 25px rgba(0,0,0,0.16), 0 4px 6px rgba(0,0,0,0.08);
+
+    --ui-radius-sm: 4px;
+    --ui-radius-md: 6px;
+    --ui-radius-lg: 8px;
+    --ui-radius-xl: 12px;
+    --ui-radius-2xl: 16px;
+    --ui-radius-full: 9999px;
+
+    /* Font sizes */
+    --text-xs: 0.75rem;   /* 12px */
+    --text-sm: 0.875rem;  /* 14px */
+    --text-base: 1rem;     /* 16px */
+    --text-lg: 1.125rem;  /* 18px */
+    --text-xl: 1.25rem;  /* 20px */
+    --text-2xl: 1.5rem;  /* 24px */
+    --text-3xl: 1.875rem;  /* 30px */
+    --text-4xl: 2.25rem;  /* 36px */
+    --text-5xl: 3rem;        /* 48px */
   }
 
   body {
     color: var(--charcoal-brown);
     background: var(--bone-white);
   }
-  
+
   h1, h2, h3, h4, h5, h6 {
     font-family: 'Playfair Display', serif;
   }