diff --git a/src/client/App.tsx b/src/client/App.tsx
index b6ed1ed..7077ff5 100644
--- a/src/client/App.tsx
+++ b/src/client/App.tsx
@@ -1,4 +1,4 @@
-import { BrowserRouter as Router, Routes, Route, Navigate } from 'react-router-dom';
+import { BrowserRouter as Router, Routes, Route, Navigate, useLocation } from 'react-router-dom';
 import { AuthProvider } from './context/AuthContext';
 import { useAuth } from './context/useAuth';
 import { SystemSettingsProvider } from './context/SystemSettingsContext';
@@ -17,6 +17,7 @@ import { DeveloperDashboard } from './pages/DeveloperDashboard';
 import { CalculatorDashboard } from './pages/CalculatorDashboard';
 import { StockDashboard } from './pages/StockDashboard';
 import { GuestDashboard } from './pages/GuestDashboard';
+import { Login } from './pages/Login';
 import InstrumentList from './pages/InstrumentList';
 
 const DeveloperRoute: React.FC<{ children: React.ReactNode }> = ({ children }) => {
@@ -29,64 +30,80 @@ const DeveloperRoute: React.FC<{ children: React.ReactNode }> = ({ children }) =
 };
 
 const AppContent: React.FC = () => {
+  const { isSignedIn, isLoading } = useAuth();
+  const location = useLocation();
+
+  if (isLoading) {
+    return (
+      <div className="min-h-screen bg-surface-soft flex items-center justify-center">
+        <div className="animate-spin rounded-full h-12 w-12 border-b-2 border-primary"></div>
+      </div>
+    );
+  }
+
+  // If not signed in and not on the callback page, show login
+  if (!isSignedIn && location.pathname !== '/callback') {
+    return <Login />;
+  }
+
   return (
     <ToastProvider>
-      <AuthProvider>
-        <SystemSettingsProvider>
-          <NotificationProvider>
-            <Layout>
-              <Routes>
-                <Route path="/" element={<ProjectList />} />
-                <Route path="/guest-dashboard" element={<GuestDashboard />} />
-                <Route path="/projects" element={<ProjectList />} />
-                <Route path="/project/:id" element={<ProjectDetails />} />
-                <Route path="/schemes" element={<SchemesList />} />
-                <Route path="/inspections" element={<InspectionsList />} />
-                <Route path="/library" element={
-                  <ProtectedRoute allowedRoles={['user', 'admin']}>
-                    <DataSheetLibrary />
+      <SystemSettingsProvider>
+        <NotificationProvider>
+          <Layout>
+            <Routes>
+              <Route path="/" element={<ProjectList />} />
+              <Route path="/login" element={<Login />} />
+              <Route path="/guest-dashboard" element={<GuestDashboard />} />
+              <Route path="/projects" element={<ProjectList />} />
+              <Route path="/project/:id" element={<ProjectDetails />} />
+              <Route path="/schemes" element={<SchemesList />} />
+              <Route path="/inspections" element={<InspectionsList />} />
+              <Route path="/library" element={
+                <ProtectedRoute allowedRoles={['user', 'admin']}>
+                  <DataSheetLibrary />
+                </ProtectedRoute>
+              } />
+              <Route path="/instruments" element={
+                <ProtectedRoute allowedRoles={['user', 'admin', 'guest']}>
+                  <InstrumentList />
+                </ProtectedRoute>
+              } />
+              <Route path="/yield-study" element={
+                <ProtectedRoute allowedRoles={['user', 'admin']}>
+                  <YieldStudyDashboard />
+                </ProtectedRoute>
+              } />
+              <Route path="/calculators" element={<CalculatorDashboard />} />
+              <Route
+                path="/admin"
+                element={
+                  <ProtectedRoute allowedRoles={['admin']}>
+                    <AdminDashboard />
                   </ProtectedRoute>
-                } />
-                <Route path="/instruments" element={
+                }
+              />
+              <Route
+                path="/stock"
+                element={
                   <ProtectedRoute allowedRoles={['user', 'admin', 'guest']}>
-                    <InstrumentList />
+                    <StockDashboard />
                   </ProtectedRoute>
-                } />
-                <Route path="/yield-study" element={
-                  <ProtectedRoute allowedRoles={['user', 'admin']}>
-                    <YieldStudyDashboard />
-                  </ProtectedRoute>
-                } />
-                <Route path="/calculators" element={<CalculatorDashboard />} />
-                <Route
-                  path="/admin"
-                  element={
-                    <ProtectedRoute allowedRoles={['admin']}>
-                      <AdminDashboard />
-                    </ProtectedRoute>
-                  }
-                />
-                <Route
-                  path="/stock"
-                  element={
-                    <ProtectedRoute allowedRoles={['user', 'admin', 'guest']}>
-                      <StockDashboard />
-                    </ProtectedRoute>
-                  }
-                />
-                <Route
-                  path="/developer"
-                  element={
-                    <DeveloperRoute>
-                      <DeveloperDashboard />
-                    </DeveloperRoute>
-                  }
-                />
-              </Routes>
-            </Layout>
-          </NotificationProvider>
-        </SystemSettingsProvider>
-      </AuthProvider>
+                }
+              />
+              <Route
+                path="/developer"
+                element={
+                  <DeveloperRoute>
+                    <DeveloperDashboard />
+                  </DeveloperRoute>
+                }
+              />
+              <Route path="*" element={<Navigate to="/" replace />} />
+            </Routes>
+          </Layout>
+        </NotificationProvider>
+      </SystemSettingsProvider>
     </ToastProvider>
   );
 };
@@ -94,7 +111,9 @@ const AppContent: React.FC = () => {
 function App() {
   return (
     <Router>
-      <AppContent />
+      <AuthProvider>
+        <AppContent />
+      </AuthProvider>
     </Router>
   );
 }
diff --git a/src/client/context/AuthContext.tsx b/src/client/context/AuthContext.tsx
index e0097b0..2f878da 100644
--- a/src/client/context/AuthContext.tsx
+++ b/src/client/context/AuthContext.tsx
@@ -1,7 +1,6 @@
 import React, { useState, useEffect, useCallback, useMemo } from 'react';
-import type { AppUser, UserRole } from '../types';
+import type { AppUser } from '../types';
 import { AuthContext } from './AuthContextType';
-import { getUser } from '../main';
 import { setApiOrganizationId } from '../services/api';
 
 interface AuthProviderProps {