feat: comprehensive mobile optimization, role-based AI chatbot, and multi-role dashboard enhancements

- Rewrote AI chatbot context system with deep role-aware data injection for all 7 roles (Owner, Admin, Field Agent, Contractor, Subcontractor, Vendor, Customer) plus guest fallback
- Added mobile-responsive bottom-sheet modals across all roles (ChangeOrderDrawer, InvoiceDetailModal, FinancialSummaryModal, VendorFinancialSummaryModal, FinancialDetailsModal)
- Converted Owner Project List and Vendor Orders tables to mobile card views with touch-friendly layouts
- Optimized Vendor Management and People Directory with mobile list/detail toggle and back navigation
- Fixed Document Control mobile view: horizontally scrollable filter tabs, proper overflow chain for document visibility
- Added responsive padding, text scaling, and flex-wrap across StatCard, TaskDetailsModal, OwnerSnapshot, OwnerProjectDetail, VendorDashboard, and DocumentManagement
- Expanded mock data store with richer vendor invoices, orders, documents, and compliance records
- Enhanced Owner Snapshot with financial KPI cards, urgent items panel, and Action Center modal
- Built Contractor Dashboard with task management, financial summary, and performance metrics
- Built Subcontractor Dashboard with clock-in tracking, task assignments, and invoice management
- Enhanced Vendor Dashboard with earnings summary, active orders, compliance status, and performance rating
- Added icon-only tab navigation on mobile for OwnerProjectDetail
- Extended attribution signatures across all platform pages

src/components/StatCard.jsx

@@ -68,14 +68,14 @@ export const StatCard = ({ label, value, suffix = '', icon: Icon, trend, trendLa
     const bgColor = colorClass.split(' ')[1];
 
     return (
-        <SpotlightCard className="h-full flex flex-col justify-between p-6">
+        <SpotlightCard className="h-full flex flex-col justify-between p-4 sm:p-6">
             <div className="flex items-start justify-between mb-4">
                 <div>
                     <h3 className="text-sm font-medium text-zinc-500 dark:text-zinc-400 uppercase tracking-wider">{label}</h3>
                     <div className="mt-2 flex items-baseline gap-1">
                         <span
                             ref={counterRef}
-                            className={`text-3xl font-mono font-bold ${textColor} tracking-tight`}
+                            className={`text-2xl sm:text-3xl font-mono font-bold ${textColor} tracking-tight`}
                         >
                             0
                         </span>