diff --git a/apps/web/src/app/(auth)/layout.tsx b/apps/web/src/app/(auth)/layout.tsx
index 819fc61..8ff3499 100644
--- a/apps/web/src/app/(auth)/layout.tsx
+++ b/apps/web/src/app/(auth)/layout.tsx
@@ -1,11 +1,14 @@
 import type { ReactNode } from 'react';
+import { GuestGuard } from '@/components/guest-guard';
 
 export default function AuthLayout({ children }: { children: ReactNode }): React.ReactElement {
   return (
-    <div className="flex min-h-screen items-center justify-center bg-surface-bg">
-      <div className="w-full max-w-md rounded-xl border border-surface-border bg-surface-card p-8 shadow-lg">
-        {children}
+    <GuestGuard>
+      <div className="flex min-h-screen items-center justify-center bg-surface-bg">
+        <div className="w-full max-w-md rounded-xl border border-surface-border bg-surface-card p-8 shadow-lg">
+          {children}
+        </div>
       </div>
-    </div>
+    </GuestGuard>
   );
 }
diff --git a/apps/web/src/app/(auth)/login/page.tsx b/apps/web/src/app/(auth)/login/page.tsx
index 40e86e8..b01d04f 100644
--- a/apps/web/src/app/(auth)/login/page.tsx
+++ b/apps/web/src/app/(auth)/login/page.tsx
@@ -1,14 +1,50 @@
 'use client';
 
+import { useState } from 'react';
+import { useRouter } from 'next/navigation';
 import Link from 'next/link';
+import { signIn } from '@/lib/auth-client';
 
 export default function LoginPage(): React.ReactElement {
+  const router = useRouter();
+  const [error, setError] = useState<string | null>(null);
+  const [loading, setLoading] = useState(false);
+
+  async function handleSubmit(e: React.FormEvent<HTMLFormElement>): Promise<void> {
+    e.preventDefault();
+    setError(null);
+    setLoading(true);
+
+    const form = new FormData(e.currentTarget);
+    const email = form.get('email') as string;
+    const password = form.get('password') as string;
+
+    const result = await signIn.email({ email, password });
+
+    if (result.error) {
+      setError(result.error.message ?? 'Sign in failed');
+      setLoading(false);
+      return;
+    }
+
+    router.push('/chat');
+  }
+
   return (
     <div>
       <h1 className="text-2xl font-semibold">Sign in</h1>
       <p className="mt-1 text-sm text-text-secondary">Sign in to your Mosaic account</p>
 
-      <form className="mt-6 space-y-4" onSubmit={(e) => e.preventDefault()}>
+      {error && (
+        <div
+          role="alert"
+          className="mt-4 rounded-lg border border-error/30 bg-error/10 px-4 py-3 text-sm text-error"
+        >
+          {error}
+        </div>
+      )}
+
+      <form className="mt-6 space-y-4" onSubmit={handleSubmit}>
         <div>
           <label htmlFor="email" className="block text-sm font-medium text-text-secondary">
             Email
@@ -19,7 +55,8 @@ export default function LoginPage(): React.ReactElement {
             type="email"
             autoComplete="email"
             required
-            className="mt-1 block w-full rounded-lg border border-surface-border bg-surface-elevated px-3 py-2 text-sm text-text-primary placeholder:text-text-muted focus:border-blue-500 focus:outline-none focus:ring-1 focus:ring-blue-500"
+            disabled={loading}
+            className="mt-1 block w-full rounded-lg border border-surface-border bg-surface-elevated px-3 py-2 text-sm text-text-primary placeholder:text-text-muted focus:border-blue-500 focus:outline-none focus:ring-1 focus:ring-blue-500 disabled:opacity-50"
             placeholder="you@example.com"
           />
         </div>
@@ -34,16 +71,18 @@ export default function LoginPage(): React.ReactElement {
             type="password"
             autoComplete="current-password"
             required
-            className="mt-1 block w-full rounded-lg border border-surface-border bg-surface-elevated px-3 py-2 text-sm text-text-primary placeholder:text-text-muted focus:border-blue-500 focus:outline-none focus:ring-1 focus:ring-blue-500"
+            disabled={loading}
+            className="mt-1 block w-full rounded-lg border border-surface-border bg-surface-elevated px-3 py-2 text-sm text-text-primary placeholder:text-text-muted focus:border-blue-500 focus:outline-none focus:ring-1 focus:ring-blue-500 disabled:opacity-50"
             placeholder="••••••••"
           />
         </div>
 
         <button
           type="submit"
-          className="w-full rounded-lg bg-blue-600 px-4 py-2.5 text-sm font-medium text-white transition-colors hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 focus:ring-offset-surface-card"
+          disabled={loading}
+          className="w-full rounded-lg bg-blue-600 px-4 py-2.5 text-sm font-medium text-white transition-colors hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 focus:ring-offset-surface-card disabled:opacity-50"
         >
-          Sign in
+          {loading ? 'Signing in...' : 'Sign in'}
         </button>
       </form>
 
diff --git a/apps/web/src/app/(auth)/register/page.tsx b/apps/web/src/app/(auth)/register/page.tsx
index 12d30bd..a17228c 100644
--- a/apps/web/src/app/(auth)/register/page.tsx
+++ b/apps/web/src/app/(auth)/register/page.tsx
@@ -1,14 +1,51 @@
 'use client';
 
+import { useState } from 'react';
+import { useRouter } from 'next/navigation';
 import Link from 'next/link';
+import { signUp } from '@/lib/auth-client';
 
 export default function RegisterPage(): React.ReactElement {
+  const router = useRouter();
+  const [error, setError] = useState<string | null>(null);
+  const [loading, setLoading] = useState(false);
+
+  async function handleSubmit(e: React.FormEvent<HTMLFormElement>): Promise<void> {
+    e.preventDefault();
+    setError(null);
+    setLoading(true);
+
+    const form = new FormData(e.currentTarget);
+    const name = form.get('name') as string;
+    const email = form.get('email') as string;
+    const password = form.get('password') as string;
+
+    const result = await signUp.email({ name, email, password });
+
+    if (result.error) {
+      setError(result.error.message ?? 'Registration failed');
+      setLoading(false);
+      return;
+    }
+
+    router.push('/chat');
+  }
+
   return (
     <div>
       <h1 className="text-2xl font-semibold">Create account</h1>
       <p className="mt-1 text-sm text-text-secondary">Get started with Mosaic</p>
 
-      <form className="mt-6 space-y-4" onSubmit={(e) => e.preventDefault()}>
+      {error && (
+        <div
+          role="alert"
+          className="mt-4 rounded-lg border border-error/30 bg-error/10 px-4 py-3 text-sm text-error"
+        >
+          {error}
+        </div>
+      )}
+
+      <form className="mt-6 space-y-4" onSubmit={handleSubmit}>
         <div>
           <label htmlFor="name" className="block text-sm font-medium text-text-secondary">
             Name
@@ -19,7 +56,8 @@ export default function RegisterPage(): React.ReactElement {
             type="text"
             autoComplete="name"
             required
-            className="mt-1 block w-full rounded-lg border border-surface-border bg-surface-elevated px-3 py-2 text-sm text-text-primary placeholder:text-text-muted focus:border-blue-500 focus:outline-none focus:ring-1 focus:ring-blue-500"
+            disabled={loading}
+            className="mt-1 block w-full rounded-lg border border-surface-border bg-surface-elevated px-3 py-2 text-sm text-text-primary placeholder:text-text-muted focus:border-blue-500 focus:outline-none focus:ring-1 focus:ring-blue-500 disabled:opacity-50"
             placeholder="Your name"
           />
         </div>
@@ -34,7 +72,8 @@ export default function RegisterPage(): React.ReactElement {
             type="email"
             autoComplete="email"
             required
-            className="mt-1 block w-full rounded-lg border border-surface-border bg-surface-elevated px-3 py-2 text-sm text-text-primary placeholder:text-text-muted focus:border-blue-500 focus:outline-none focus:ring-1 focus:ring-blue-500"
+            disabled={loading}
+            className="mt-1 block w-full rounded-lg border border-surface-border bg-surface-elevated px-3 py-2 text-sm text-text-primary placeholder:text-text-muted focus:border-blue-500 focus:outline-none focus:ring-1 focus:ring-blue-500 disabled:opacity-50"
             placeholder="you@example.com"
           />
         </div>
@@ -49,16 +88,18 @@ export default function RegisterPage(): React.ReactElement {
             type="password"
             autoComplete="new-password"
             required
-            className="mt-1 block w-full rounded-lg border border-surface-border bg-surface-elevated px-3 py-2 text-sm text-text-primary placeholder:text-text-muted focus:border-blue-500 focus:outline-none focus:ring-1 focus:ring-blue-500"
+            disabled={loading}
+            className="mt-1 block w-full rounded-lg border border-surface-border bg-surface-elevated px-3 py-2 text-sm text-text-primary placeholder:text-text-muted focus:border-blue-500 focus:outline-none focus:ring-1 focus:ring-blue-500 disabled:opacity-50"
             placeholder="••••••••"
           />
         </div>
 
         <button
           type="submit"
-          className="w-full rounded-lg bg-blue-600 px-4 py-2.5 text-sm font-medium text-white transition-colors hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 focus:ring-offset-surface-card"
+          disabled={loading}
+          className="w-full rounded-lg bg-blue-600 px-4 py-2.5 text-sm font-medium text-white transition-colors hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 focus:ring-offset-surface-card disabled:opacity-50"
         >
-          Create account
+          {loading ? 'Creating account...' : 'Create account'}
         </button>
       </form>
 
diff --git a/apps/web/src/app/(dashboard)/layout.tsx b/apps/web/src/app/(dashboard)/layout.tsx
index 7e70dc1..9edd362 100644
--- a/apps/web/src/app/(dashboard)/layout.tsx
+++ b/apps/web/src/app/(dashboard)/layout.tsx
@@ -1,6 +1,11 @@
 import type { ReactNode } from 'react';
 import { AppShell } from '@/components/layout/app-shell';
+import { AuthGuard } from '@/components/auth-guard';
 
 export default function DashboardLayout({ children }: { children: ReactNode }): React.ReactElement {
-  return <AppShell>{children}</AppShell>;
+  return (
+    <AuthGuard>
+      <AppShell>{children}</AppShell>
+    </AuthGuard>
+  );
 }
diff --git a/apps/web/src/components/auth-guard.tsx b/apps/web/src/components/auth-guard.tsx
new file mode 100644
index 0000000..3de8aef
--- /dev/null
+++ b/apps/web/src/components/auth-guard.tsx
@@ -0,0 +1,34 @@
+'use client';
+
+import { useRouter } from 'next/navigation';
+import { useEffect } from 'react';
+import { useSession } from '@/lib/auth-client';
+
+interface AuthGuardProps {
+  children: React.ReactNode;
+}
+
+export function AuthGuard({ children }: AuthGuardProps): React.ReactElement | null {
+  const { data: session, isPending } = useSession();
+  const router = useRouter();
+
+  useEffect(() => {
+    if (!isPending && !session) {
+      router.replace('/login');
+    }
+  }, [isPending, session, router]);
+
+  if (isPending) {
+    return (
+      <div className="flex min-h-screen items-center justify-center">
+        <div className="text-sm text-text-muted">Loading...</div>
+      </div>
+    );
+  }
+
+  if (!session) {
+    return null;
+  }
+
+  return <>{children}</>;
+}
diff --git a/apps/web/src/components/guest-guard.tsx b/apps/web/src/components/guest-guard.tsx
new file mode 100644
index 0000000..d71e210
--- /dev/null
+++ b/apps/web/src/components/guest-guard.tsx
@@ -0,0 +1,35 @@
+'use client';
+
+import { useRouter } from 'next/navigation';
+import { useEffect } from 'react';
+import { useSession } from '@/lib/auth-client';
+
+interface GuestGuardProps {
+  children: React.ReactNode;
+}
+
+/** Redirects authenticated users away from auth pages. */
+export function GuestGuard({ children }: GuestGuardProps): React.ReactElement | null {
+  const { data: session, isPending } = useSession();
+  const router = useRouter();
+
+  useEffect(() => {
+    if (!isPending && session) {
+      router.replace('/chat');
+    }
+  }, [isPending, session, router]);
+
+  if (isPending) {
+    return (
+      <div className="flex min-h-screen items-center justify-center">
+        <div className="text-sm text-text-muted">Loading...</div>
+      </div>
+    );
+  }
+
+  if (session) {
+    return null;
+  }
+
+  return <>{children}</>;
+}
diff --git a/apps/web/src/components/layout/topbar.tsx b/apps/web/src/components/layout/topbar.tsx
index 2d4bb7d..49e3538 100644
--- a/apps/web/src/components/layout/topbar.tsx
+++ b/apps/web/src/components/layout/topbar.tsx
@@ -1,9 +1,16 @@
 'use client';
 
+import { useRouter } from 'next/navigation';
 import { useSession, signOut } from '@/lib/auth-client';
 
 export function Topbar(): React.ReactElement {
   const { data: session } = useSession();
+  const router = useRouter();
+
+  async function handleSignOut(): Promise<void> {
+    await signOut();
+    router.replace('/login');
+  }
 
   return (
     <header className="sticky top-0 z-20 flex h-14 items-center justify-between border-b border-surface-border bg-surface-card/80 px-6 backdrop-blur-sm">
@@ -17,7 +24,7 @@ export function Topbar(): React.ReactElement {
             </span>
             <button
               type="button"
-              onClick={() => signOut()}
+              onClick={handleSignOut}
               className="rounded-md px-3 py-1.5 text-sm text-text-muted transition-colors hover:bg-surface-elevated hover:text-text-primary"
             >
               Sign out
diff --git a/docs/TASKS.md b/docs/TASKS.md
index 3fba3c0..11516c3 100644
--- a/docs/TASKS.md
+++ b/docs/TASKS.md
@@ -29,8 +29,8 @@
 | P2-005 | done        | Phase 2   | @mosaic/coord — migrate from v0, gateway integration          | #77 | #23   |
 | P2-006 | done        | Phase 2   | Agent session management — tmux + monitoring                  | #78 | #24   |
 | P2-007 | done        | Phase 2   | Verify Phase 2 — multi-provider routing works                 | #79 | #25   |
-| P3-001 | in-progress | Phase 3   | apps/web scaffold — Next.js 16 + BetterAuth + Tailwind        | —   | #26   |
-| P3-002 | not-started | Phase 3   | Auth pages — login, registration, SSO redirect                | —   | #27   |
+| P3-001 | done        | Phase 3   | apps/web scaffold — Next.js 16 + BetterAuth + Tailwind        | #82 | #26   |
+| P3-002 | in-progress | Phase 3   | Auth pages — login, registration, SSO redirect                | —   | #27   |
 | P3-003 | not-started | Phase 3   | Chat UI — conversations, messages, streaming                  | —   | #28   |
 | P3-004 | not-started | Phase 3   | Task management — list view + kanban board                    | —   | #29   |
 | P3-005 | not-started | Phase 3   | Project & mission views — dashboard + PRD viewer              | —   | #30   |