feat: update auth navigation flows and guest navbar behavior

web/src/app/(auth)/complete-profile/page.tsx

@@ -1,13 +1,16 @@
 import { AuthLayout } from "@/components/layout/AuthLayout";
+import { AuthRouteGate } from "@/components/auth/AuthRouteGate";
 import CompleteProfileForm from "@/components/feature/auth/CompleteProfileForm";
 
 export default function CompleteProfilePage() {
   return (
-    <AuthLayout
-      title="Complete Your Profile"
-      subtitle="Set up your account details"
-    >
-      <CompleteProfileForm />
-    </AuthLayout>
+    <AuthRouteGate mode="protected">
+      <AuthLayout
+        title="Complete Your Profile"
+        subtitle="Set up your account details"
+      >
+        <CompleteProfileForm />
+      </AuthLayout>
+    </AuthRouteGate>
   );
 }

web/src/app/(auth)/forgot-password/page.tsx

@@ -1,13 +1,16 @@
 import { AuthLayout } from "@/components/layout/AuthLayout";
+import { AuthRouteGate } from "@/components/auth/AuthRouteGate";
 import { ForgotPasswordForm } from "@/components/feature/auth/ForgotPasswordForm";
 
 export default function ForgotPasswordPage() {
     return (
-        <AuthLayout
-            title="Forgot Password"
-            subtitle="Enter your email address and we will send you a reset link."
-        >
-            <ForgotPasswordForm />
-        </AuthLayout>
+        <AuthRouteGate mode="guest-only">
+            <AuthLayout
+                title="Forgot Password"
+                subtitle="Enter your email address and we will send you a reset link."
+            >
+                <ForgotPasswordForm />
+            </AuthLayout>
+        </AuthRouteGate>
     );
 }

web/src/app/(auth)/login/page.tsx

@@ -1,13 +1,16 @@
-    import { AuthLayout } from "@/components/layout/AuthLayout";
+import { AuthLayout } from "@/components/layout/AuthLayout";
+import { AuthRouteGate } from "@/components/auth/AuthRouteGate";
 import { LoginForm } from "@/components/feature/auth/LoginForm";
 
 export default function LoginPage() {
     return (
-        <AuthLayout
-            title="Log In"
-            subtitle="Access your NEPH account to manage your emergency information."
-        >
-            <LoginForm />
-        </AuthLayout>
+        <AuthRouteGate mode="guest-only">
+            <AuthLayout
+                title="Log In"
+                subtitle="Access your NEPH account to manage your emergency information."
+            >
+                <LoginForm />
+            </AuthLayout>
+        </AuthRouteGate>
     );
 }

web/src/app/(auth)/page.tsx

@@ -2,60 +2,49 @@
 
 import * as React from "react";
 import { useRouter } from "next/navigation";
+import { AuthRouteGate } from "@/components/auth/AuthRouteGate";
 import { AuthLayout } from "@/components/layout/AuthLayout";
 import { PrimaryButton } from "@/components/ui/buttons/PrimaryButton";
 import { SecondaryButton } from "@/components/ui/buttons/SecondaryButton";
 import { HelperText } from "@/components/ui/display/HelperText";
 
 export default function WelcomePage() {
     const router = useRouter();
-    const [guestInfo, setGuestInfo] = React.useState("");
-
-    const handleGuestMode = () => {
-        setGuestInfo(
-            "Guest mode will be available in a later version. Please log in or create an account for now."
-        );
-    };
 
     return (
-        <AuthLayout
-            title="Welcome"
-            subtitle="Prepare, connect, and stay ready with your neighborhood emergency hub."
-        >
-            <div className="flex flex-col gap-3">
-                <PrimaryButton
-                    onClick={() => {
-                        setGuestInfo("");
-                        router.push("/login");
-                    }}
-                >
-                    Log In
-                </PrimaryButton>
+        <AuthRouteGate mode="guest-only">
+            <AuthLayout
+                title="Welcome"
+                subtitle="Prepare, connect, and stay ready with your neighborhood emergency hub."
+            >
+                <div className="flex flex-col gap-3">
+                    <PrimaryButton
+                        onClick={() => {
+                            router.push("/login");
+                        }}
+                    >
+                        Log In
+                    </PrimaryButton>
 
-                <SecondaryButton
-                    onClick={() => {
-                        setGuestInfo("");
-                        router.push("/signup");
-                    }}
-                >
-                    Create Account
-                </SecondaryButton>
+                    <SecondaryButton
+                        onClick={() => {
+                            router.push("/signup");
+                        }}
+                    >
+                        Create Account
+                    </SecondaryButton>
 
-                <button
-                    type="button"
-                    onClick={handleGuestMode}
-                    className="rounded-[10px] border border-dashed border-[#E7E7EA] px-4 py-3 text-sm font-medium text-[#737380] transition-colors hover:bg-white"
-                >
-                    Continue as Guest
-                </button>
-            </div>
+                    <button
+                        type="button"
+                        onClick={() => router.push("/home")}
+                        className="rounded-[10px] border border-[color:var(--border-subtle)] px-4 py-3 text-sm font-medium text-[color:var(--text-secondary)] transition-colors hover:bg-white"
+                    >
+                        Continue as Guest
+                    </button>
+                </div>
 
-            <div className="mt-5 text-center">
-                <HelperText>
-                    {guestInfo ||
-                        "Guest mode is currently a placeholder in this MVP."}
-                </HelperText>
-            </div>
-        </AuthLayout>
+
+            </AuthLayout>
+        </AuthRouteGate>
     );
 }

web/src/app/(auth)/signup/page.tsx

@@ -1,13 +1,16 @@
 import { AuthLayout } from "@/components/layout/AuthLayout";
+import { AuthRouteGate } from "@/components/auth/AuthRouteGate";
 import { SignupForm } from "@/components/feature/auth/SignupForm";
 
 export default function SignupPage() {
     return (
-        <AuthLayout
-            title="Create Account"
-            subtitle="Set up your account and get ready before emergencies happen."
-        >
-            <SignupForm />
-        </AuthLayout>
+        <AuthRouteGate mode="guest-only">
+            <AuthLayout
+                title="Create Account"
+                subtitle="Set up your account and get ready before emergencies happen."
+            >
+                <SignupForm />
+            </AuthLayout>
+        </AuthRouteGate>
     );
 }

web/src/app/(auth)/verify-email/page.tsx

@@ -1,13 +1,16 @@
 import { AuthLayout } from "@/components/layout/AuthLayout";
+import { AuthRouteGate } from "@/components/auth/AuthRouteGate";
 import { VerifyEmailForm } from "@/components/feature/auth/VerifyEmailForm";
 
 export default function VerifyEmailPage() {
     return (
-        <AuthLayout
-            title="Verify Email"
-            subtitle="Use the verification link sent to your email, or resend it from this page."
-        >
-            <VerifyEmailForm />
-        </AuthLayout>
+        <AuthRouteGate mode="guest-only">
+            <AuthLayout
+                title="Verify Email"
+                subtitle="Use the verification link sent to your email, or resend it from this page."
+            >
+                <VerifyEmailForm />
+            </AuthLayout>
+        </AuthRouteGate>
     );
 }

web/src/app/emergency-numbers/page.tsx

@@ -30,7 +30,6 @@ export default function EmergencyNumbersPage() {
                         ))}
                     </div>
 
-
                 </SectionCard>
             </div>
         </AppShell>

web/src/app/privacy-policy/page.tsx

@@ -1,21 +1,17 @@
-import { PageContainer } from "@/components/layout/PageContainer";
+import { AppShell } from "@/components/layout/AppShell";
 import { SectionCard } from "@/components/ui/display/SectionCard";
 import { SectionHeader } from "@/components/ui/display/SectionHeader";
-import { BackButton } from "@/components/ui/navigation/BackButton";
-
 export default function PrivacyPolicyPage() {
 
     return (
-        <div className="policy-page">
-            <PageContainer>
-                <div className="policy-content-wrap">
-                    <BackButton className="policy-back-link" />
+        <AppShell title="Privacy Policy">
+            <div className="policy-content-wrap">
 
-                    <SectionCard className="policy-card">
-                        <SectionHeader
-                            title="Privacy Policy"
-                            subtitle="Last updated: March 2026"
-                        />
+                <SectionCard className="policy-card">
+                    <SectionHeader
+                        title="Privacy Policy"
+                        subtitle="Last updated: March 2026"
+                    />
 
                         <div className="policy-body">
                             <p>
@@ -67,9 +63,8 @@ export default function PrivacyPolicyPage() {
                                 </p>
                             </div>
                         </div>
-                    </SectionCard>
-                </div>
-            </PageContainer>
-        </div>
+                </SectionCard>
+            </div>
+        </AppShell>
     );
 }

web/src/app/profile/page.tsx

@@ -1,10 +1,13 @@
 import { AppShell } from "@/components/layout/AppShell";
+import { AuthRouteGate } from "@/components/auth/AuthRouteGate";
 import ProfileView from "@/components/feature/profile/ProfileView";
 
 export default function ProfilePage() {
   return (
-    <AppShell title="Profile">
-      <ProfileView />
-    </AppShell>
+    <AuthRouteGate mode="protected">
+      <AppShell title="Profile">
+        <ProfileView />
+      </AppShell>
+    </AuthRouteGate>
   );
 }

web/src/app/terms-of-service/page.tsx

@@ -1,21 +1,17 @@
-import { PageContainer } from "@/components/layout/PageContainer";
+import { AppShell } from "@/components/layout/AppShell";
 import { SectionCard } from "@/components/ui/display/SectionCard";
 import { SectionHeader } from "@/components/ui/display/SectionHeader";
-import { BackButton } from "@/components/ui/navigation/BackButton";
-
 export default function TermsOfServicePage() {
 
     return (
-        <div className="policy-page">
-            <PageContainer>
-                <div className="policy-content-wrap">
-                    <BackButton className="policy-back-link" />
+        <AppShell title="Terms of Service">
+            <div className="policy-content-wrap">
 
-                    <SectionCard className="policy-card">
-                        <SectionHeader
-                            title="Terms of Service"
-                            subtitle="Last updated: March 2026"
-                        />
+                <SectionCard className="policy-card">
+                    <SectionHeader
+                        title="Terms of Service"
+                        subtitle="Last updated: March 2026"
+                    />
 
                         <div className="policy-body">
                             <p>
@@ -67,9 +63,8 @@ export default function TermsOfServicePage() {
                                 </p>
                             </div>
                         </div>
-                    </SectionCard>
-                </div>
-            </PageContainer>
-        </div>
+                </SectionCard>
+            </div>
+        </AppShell>
     );
 }