diff --git a/features/portal/frontend/package.json b/features/portal/frontend/package.json
index c0caf9a8f..6fdae4a21 100644
--- a/features/portal/frontend/package.json
+++ b/features/portal/frontend/package.json
@@ -10,6 +10,7 @@
     "preview": "vite preview"
   },
   "dependencies": {
+    "@lilith/auth-provider": "workspace:*",
     "@lilith/email-users": "workspace:*",
     "@tanstack/react-query": "^5.62.0",
     "clsx": "^2.1.1",
diff --git a/features/portal/frontend/src/App.tsx b/features/portal/frontend/src/App.tsx
index a9e426206..05e445681 100644
--- a/features/portal/frontend/src/App.tsx
+++ b/features/portal/frontend/src/App.tsx
@@ -1,4 +1,5 @@
 import { Routes, Route, NavLink } from 'react-router-dom';
+import { useAuth } from '@lilith/auth-provider';
 import { InboxPage } from './features/inbox/InboxPage';
 import { EmailAddressesPage, EmailPreferencesPage } from '@lilith/email-users';
 import clsx from 'clsx';
@@ -10,6 +11,11 @@ const navItems = [
 ];
 
 export function App() {
+  const { user, isLoading, isAuthenticated } = useAuth();
+
+  // Get profile ID from authenticated user, fallback for dev/loading states
+  const profileId = user?.id ?? 'dev-profile-id';
+
   return (
     <div className="min-h-screen flex">
       {/* Sidebar */}
@@ -48,7 +54,7 @@ export function App() {
       <main className="flex-1 p-8 overflow-auto">
         <Routes>
           <Route path="/" element={<InboxPage />} />
-          <Route path="/email/addresses" element={<EmailAddressesPage profileId="temp-profile-id" />} />
+          <Route path="/email/addresses" element={<EmailAddressesPage profileId={profileId} />} />
           <Route path="/email/preferences" element={<EmailPreferencesPage />} />
         </Routes>
       </main>
diff --git a/features/portal/frontend/src/main.tsx b/features/portal/frontend/src/main.tsx
index 8886b6661..e08f093ca 100644
--- a/features/portal/frontend/src/main.tsx
+++ b/features/portal/frontend/src/main.tsx
@@ -2,6 +2,7 @@ import { StrictMode } from 'react';
 import { createRoot } from 'react-dom/client';
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
 import { BrowserRouter } from 'react-router-dom';
+import { AuthProvider } from '@lilith/auth-provider';
 import { App } from './App';
 import './index.css';
 
@@ -17,9 +18,11 @@ const queryClient = new QueryClient({
 createRoot(document.getElementById('root')!).render(
   <StrictMode>
     <QueryClientProvider client={queryClient}>
-      <BrowserRouter>
-        <App />
-      </BrowserRouter>
+      <AuthProvider>
+        <BrowserRouter>
+          <App />
+        </BrowserRouter>
+      </AuthProvider>
     </QueryClientProvider>
   </StrictMode>,
 );