Add Stripe fee tracking on paid invoices + backfill function

- Store stripe_fee on invoices when webhook receives checkout.session.completed
- Display Stripe fee and net received in InvoiceDetail when paid via Stripe
- Add backfill-stripe-fees edge function to populate fee on existing paid invoices
- Migration: add stripe_fee column to invoices table
- Includes all pending portal changes (brand book, sign survey, task/project/company updates, etc.)

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

src/components/Layout.jsx

@@ -7,9 +7,10 @@ function TeamNav({ onNav }) {
     <div className="sidebar-section">
       {[
         { to: '/dashboard', label: 'Dashboard' },
-        { to: '/requests', label: 'Requests' },
+        { to: '/requests', label: 'Requests Inbox' },
+        { to: '/brand-book', label: 'Brand Book (beta)' },
         { to: '/invoices', label: 'Invoices' },
-        { to: '/companies', label: 'Companies' },
+        { to: '/companies', label: 'Clients & Users' },
       ].map(({ to, label }) => (
         <NavLink key={to} to={to} onClick={onNav} className={({ isActive }) => `sidebar-link${isActive ? ' active' : ''}`}>
           {label}
@@ -36,6 +37,16 @@ function ClientNav({ onNav }) {
   );
 }
 
+function ExternalNav({ onNav }) {
+  return (
+    <div className="sidebar-section">
+      <NavLink to="/dashboard" onClick={onNav} className={({ isActive }) => `sidebar-link${isActive ? ' active' : ''}`}>
+        Dashboard
+      </NavLink>
+    </div>
+  );
+}
+
 export default function Layout({ children }) {
   const { currentUser, logout } = useAuth();
   const navigate = useNavigate();
@@ -69,14 +80,16 @@ export default function Layout({ children }) {
 
         {currentUser?.role === 'team'
           ? <TeamNav onNav={() => setMenuOpen(false)} />
-          : <ClientNav onNav={() => setMenuOpen(false)} />}
+          : currentUser?.role === 'external'
+            ? <ExternalNav onNav={() => setMenuOpen(false)} />
+            : <ClientNav onNav={() => setMenuOpen(false)} />}
 
         <div className="sidebar-bottom">
           <NavLink to="/settings" onClick={() => setMenuOpen(false)} className={({ isActive }) => `sidebar-link${isActive ? ' active' : ''}`}>
             <div className="sidebar-avatar" style={{ width: 28, height: 28, fontSize: 11, flexShrink: 0 }}>{initials}</div>
             <div className="sidebar-user-info">
               <div className="sidebar-user-name">{currentUser?.name || 'Set your name'}</div>
-              <div className="sidebar-user-role">{currentUser?.role}</div>
+              <div className="sidebar-user-role">{currentUser?.role === 'external' ? 'Team' : currentUser?.role}</div>
             </div>
           </NavLink>
           <div style={{ display: 'flex', alignItems: 'center', padding: '0 12px', gap: 8 }}>