diff --git a/client/package.json b/client/package.json
index 72630a1..459d525 100644
--- a/client/package.json
+++ b/client/package.json
@@ -30,6 +30,7 @@
         "test": "react-scripts test",
         "eject": "react-scripts eject"
     },
+    "proxy": "http://localhost:5000",
     "eslintConfig": {
         "extends": [
             "react-app",
diff --git a/client/public/index.html b/client/public/index.html
index acd4373..514f04b 100644
--- a/client/public/index.html
+++ b/client/public/index.html
@@ -3,12 +3,16 @@
   <head>
     <meta charset="utf-8" />
     <link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
-    <meta name="viewport" content="width=device-width, initial-scale=1" />
-    <meta name="theme-color" content="#000000" />
+    <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
+    <meta name="theme-color" content="#6200ee" />
     <meta
       name="description"
-      content="KinTree"
-    />  
+      content="KinTree - Preserve and share your family history"
+    />
+    <meta name="apple-mobile-web-app-capable" content="yes" />
+    <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
+    <meta name="apple-mobile-web-app-title" content="KinTree" />
+    <meta name="mobile-web-app-capable" content="yes" />
     <!--
       manifest.json provides metadata used when your web app is installed on a
       user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
diff --git a/client/public/manifest.json b/client/public/manifest.json
index 1f2f141..a67381f 100644
--- a/client/public/manifest.json
+++ b/client/public/manifest.json
@@ -1,15 +1,32 @@
 {
-  "short_name": "React App",
-  "name": "Create React App Sample",
+  "short_name": "KinTree",
+  "name": "KinTree - Family Tree Application",
+  "description": "Preserve and share your family history with KinTree",
   "icons": [
     {
       "src": "favicon.ico",
       "sizes": "64x64 32x32 24x24 16x16",
-      "type": "image/x-icon"
+      "type": "image/x-icon",
+      "purpose": "any"
     }
   ],
-  "start_url": ".",
+  "start_url": "/",
+  "scope": "/",
   "display": "standalone",
-  "theme_color": "#000000",
-  "background_color": "#ffffff"
+  "theme_color": "#6200ee",
+  "background_color": "#ffffff",
+  "orientation": "portrait-primary",
+  "categories": ["family", "social", "productivity"],
+  "screenshots": [
+    {
+      "src": "favicon.ico",
+      "sizes": "540x720",
+      "form_factor": "narrow"
+    },
+    {
+      "src": "favicon.ico",
+      "sizes": "1280x720",
+      "form_factor": "wide"
+    }
+  ]
 }
diff --git a/client/public/service-worker.js b/client/public/service-worker.js
new file mode 100644
index 0000000..ca9bf74
--- /dev/null
+++ b/client/public/service-worker.js
@@ -0,0 +1,100 @@
+const CACHE_NAME = 'kintree-v1';
+const urlsToCache = [
+  '/',
+  '/index.html',
+  '/manifest.json',
+  '/favicon.ico',
+];
+
+// Install event - cache essential assets
+self.addEventListener('install', event => {
+  event.waitUntil(
+    caches.open(CACHE_NAME)
+      .then(cache => {
+        return cache.addAll(urlsToCache).catch(err => {
+          console.warn('Failed to cache some assets:', err);
+          // Continue even if some assets fail to cache
+          return Promise.resolve();
+        });
+      })
+      .then(() => self.skipWaiting())
+  );
+});
+
+// Activate event - clean up old caches
+self.addEventListener('activate', event => {
+  event.waitUntil(
+    caches.keys().then(cacheNames => {
+      return Promise.all(
+        cacheNames.map(cacheName => {
+          if (cacheName !== CACHE_NAME) {
+            return caches.delete(cacheName);
+          }
+        })
+      );
+    }).then(() => self.clients.claim())
+  );
+});
+
+// Fetch event - serve from cache, fallback to network
+self.addEventListener('fetch', event => {
+  // Skip non-GET requests
+  if (event.request.method !== 'GET') {
+    return;
+  }
+
+  // Skip API calls - let them go through network
+  if (event.request.url.includes('/api/') || 
+      event.request.url.includes('supabase') ||
+      event.request.url.includes('localhost')) {
+    event.respondWith(
+      fetch(event.request)
+        .catch(() => {
+          // Return offline page or cached response if available
+          return caches.match(event.request);
+        })
+    );
+    return;
+  }
+
+  // For other requests, use cache-first strategy
+  event.respondWith(
+    caches.match(event.request)
+      .then(response => {
+        // Return cached version if available
+        if (response) {
+          return response;
+        }
+
+        // Otherwise, fetch from network
+        return fetch(event.request).then(response => {
+          // Don't cache if it's not a successful response
+          if (!response || response.status !== 200 || response.type === 'error') {
+            return response;
+          }
+
+          // Clone the response
+          const responseToCache = response.clone();
+
+          // Cache the new response
+          caches.open(CACHE_NAME)
+            .then(cache => {
+              cache.put(event.request, responseToCache);
+            });
+
+          return response;
+        });
+      })
+      .catch(() => {
+        // Return a custom offline page if available
+        return caches.match('/');
+      })
+  );
+});
+
+// Handle messages from clients
+self.addEventListener('message', event => {
+  if (event.data && event.data.type === 'SKIP_WAITING') {
+    self.skipWaiting();
+  }
+});
diff --git a/client/src/components/AddFamilyMember/AddFamilyMember.js b/client/src/components/AddFamilyMember/AddFamilyMember.js
index e958389..7b6c502 100644
--- a/client/src/components/AddFamilyMember/AddFamilyMember.js
+++ b/client/src/components/AddFamilyMember/AddFamilyMember.js
@@ -277,7 +277,7 @@ function AddFamilyMemberPopup({ trigger, userid }) {
       console.log('Relationships to create (Existing):', relsToCreate);
 
       for (const rel of relsToCreate) {
-        const relRes = await fetch(`http://localhost:5000/api/relationships/`, {
+        const relRes = await fetch(`/api/relationships/`, {
           method: 'POST',
           headers: { 'Content-Type': 'application/json' },
           body: JSON.stringify({
@@ -408,7 +408,7 @@ function AddFamilyMemberPopup({ trigger, userid }) {
       console.log('Relationships to create (Manual):', relsToCreate);
 
       for (const rel of relsToCreate) {
-        const relRes = await fetch(`http://localhost:5000/api/relationships/`, {
+        const relRes = await fetch(`/api/relationships/`, {
           method: 'POST',
           headers: { 'Content-Type': 'application/json' },
           body: JSON.stringify({
diff --git a/client/src/components/AddFamilyMember/styles.js b/client/src/components/AddFamilyMember/styles.js
index e762cfa..14d728f 100644
--- a/client/src/components/AddFamilyMember/styles.js
+++ b/client/src/components/AddFamilyMember/styles.js
@@ -9,7 +9,6 @@ export const FieldStyle = {
     backgroundColor: 'var(--surface-alt)',
     color: 'var(--text-color)',
     padding: 'var(--space-2) var(--space-4)',
-    marginLeft: 'var(--space-2)',
     outline: 'none',
     fontFamily: 'inherit',
     fontSize: '0.95rem',
@@ -35,8 +34,10 @@ export const ListStyle = {
     display: 'flex',
     flexDirection: 'column',
     textAlign: 'left',
-    marginRight: '15%',
+    margin: '0',
+    paddingLeft: '0',
     width: '100%',
+    boxSizing: 'border-box',
 };
 
 export const ButtonDivStyle = {
@@ -82,6 +83,7 @@ export const FormStyle = {
     paddingTop: '0px',
     minWidth: '360px',
     width: '100%',
+    boxSizing: 'border-box',
 }
 
 export const ItemStyle = {
@@ -96,11 +98,12 @@ export const DateFieldStyle = {
     border: '1px solid var(--input-border)',
     backgroundColor: 'var(--input-bg)',
     color: 'var(--text-color)',
-    marginLeft: 'var(--space-2)',
-    width: '150px',
+    marginLeft: '0',
+    width: '100%',
     padding: 'var(--space-1) var(--space-2)',
     fontFamily: 'inherit',
     outline: 'none',
+    boxSizing: 'border-box',
 };
 
 
@@ -114,6 +117,8 @@ export const MainContainerStyle = {
     minHeight: '150px',
     justifyContent: 'space-between',
     backgroundColor: 'var(--card-bg)',
+    boxSizing: 'border-box',
+    width: '100%',
 }
 
 export const AddOptionsStyle = {
@@ -137,4 +142,4 @@ export const ListingStyle = {
     marginBottom: 'var(--space-2)',
     borderRadius: 'var(--radius-sm)',
     backgroundColor: 'var(--surface-alt)',
-}
\ No newline at end of file
+}
diff --git a/client/src/components/UserMemory/CreateMemory.js b/client/src/components/UserMemory/CreateMemory.js
index 5d526ff..9d46ade 100644
--- a/client/src/components/UserMemory/CreateMemory.js
+++ b/client/src/components/UserMemory/CreateMemory.js
@@ -41,7 +41,7 @@ function CreateMemoryPopup({ trigger, profileID, onMemoryCreated }) {
         return;
       }
 
-      const response = await fetch('http://localhost:5000/api/memories', { 
+      const response = await fetch('/api/memories', { 
         method: 'POST',
         body: formData, 
       });
diff --git a/client/src/components/UserMemory/EditMemory.js b/client/src/components/UserMemory/EditMemory.js
index 9005570..1658425 100644
--- a/client/src/components/UserMemory/EditMemory.js
+++ b/client/src/components/UserMemory/EditMemory.js
@@ -14,7 +14,7 @@ function EditMemoryPopup({ memory, onMemoryUpdated }) {
 
   const onSubmit = async (data, close) => {
     try {
-      const response = await fetch(`http://localhost:5000/api/memories/${memory.id}`, {
+      const response = await fetch(`/api/memories/${memory.id}`, {
         method: 'PUT',
         headers: { 'Content-Type': 'application/json' },
         body: JSON.stringify(data),
diff --git a/client/src/components/UserMemory/MemoryCard.js b/client/src/components/UserMemory/MemoryCard.js
index 8d0ae6b..afe7b2f 100644
--- a/client/src/components/UserMemory/MemoryCard.js
+++ b/client/src/components/UserMemory/MemoryCard.js
@@ -9,7 +9,7 @@ const MemoryCard = ({ memory, onDeleted, onUpdated }) => {
     if (!window.confirm("Are you sure you want to delete this memory?")) return;
 
     try {
-      const response = await fetch(`http://localhost:5000/api/memories/${memory.id}`, {
+      const response = await fetch(`/api/memories/${memory.id}`, {
         method: 'DELETE',
       });
 
diff --git a/client/src/config/urls.js b/client/src/config/urls.js
index fde50ab..c6ed6bf 100644
--- a/client/src/config/urls.js
+++ b/client/src/config/urls.js
@@ -1,2 +1,2 @@
-export const CLIENT_URL = process.env.REACT_APP_CLIENT_URL || 'http://localhost:3000';
-export const SERVER_URL = process.env.REACT_APP_SERVER_URL || 'http://localhost:5000';
+export const CLIENT_URL = process.env.REACT_APP_CLIENT_URL || window.location.origin;
+export const SERVER_URL = process.env.REACT_APP_SERVER_URL || '';
diff --git a/client/src/hooks/usePWAInstall.js b/client/src/hooks/usePWAInstall.js
new file mode 100644
index 0000000..088feea
--- /dev/null
+++ b/client/src/hooks/usePWAInstall.js
@@ -0,0 +1,73 @@
+import { useState, useEffect } from 'react';
+
+/**
+ * Custom hook to handle PWA install prompt
+ * Returns deferredPrompt and functions to show/dismiss install prompt
+ * 
+ * Usage:
+ * const { installPrompt, showInstallPrompt, dismissPrompt } = usePWAInstall();
+ * 
+ * return (
+ *   installPrompt && (
+ *     <div>
+ *       <p>Install KinTree as an app!</p>
+ *       <button onClick={showInstallPrompt}>Install</button>
+ *       <button onClick={dismissPrompt}>Dismiss</button>
+ *     </div>
+ *   )
+ * );
+ */
+export function usePWAInstall() {
+  const [installPrompt, setInstallPrompt] = useState(null);
+  const [showPrompt, setShowPrompt] = useState(false);
+
+  useEffect(() => {
+    const handleBeforeInstallPrompt = (e) => {
+      // Prevent the mini-infobar from appearing on mobile
+      e.preventDefault();
+      // Stash the event for later use
+      setInstallPrompt(e);
+      setShowPrompt(true);
+    };
+
+    const handleAppInstalled = () => {
+      console.log('KinTree installed as PWA');
+      setInstallPrompt(null);
+      setShowPrompt(false);
+    };
+
+    window.addEventListener('beforeinstallprompt', handleBeforeInstallPrompt);
+    window.addEventListener('appinstalled', handleAppInstalled);
+
+    return () => {
+      window.removeEventListener('beforeinstallprompt', handleBeforeInstallPrompt);
+      window.removeEventListener('appinstalled', handleAppInstalled);
+    };
+  }, []);
+
+  const showInstallPrompt = () => {
+    if (installPrompt) {
+      installPrompt.prompt();
+      installPrompt.userChoice.then((choiceResult) => {
+        if (choiceResult.outcome === 'accepted') {
+          console.log('User accepted the install prompt');
+        } else {
+          console.log('User dismissed the install prompt');
+        }
+        setInstallPrompt(null);
+        setShowPrompt(false);
+      });
+    }
+  };
+
+  const dismissPrompt = () => {
+    setShowPrompt(false);
+  };
+
+  return {
+    installPrompt: showPrompt ? installPrompt : null,
+    showInstallPrompt,
+    dismissPrompt,
+    isPromptVisible: showPrompt,
+  };
+}
diff --git a/client/src/index.js b/client/src/index.js
index de10c96..c4a778a 100644
--- a/client/src/index.js
+++ b/client/src/index.js
@@ -23,6 +23,7 @@ import Chat from './pages/Chat/Chat';
 import ViewSharedTree from './pages/ViewSharedTree/ViewSharedTree';
 import CreateAccount from './pages/CreateAccount/CreateAccount';
 import ProtectedRoute from './components/ProtectedRoute/ProtectedRoute';
+import * as serviceWorkerRegistration from './serviceWorkerRegistration';
 
 // creates pages for different paths - buttons should be links to the paths and then the components will populate
 const router = createBrowserRouter([
@@ -175,3 +176,13 @@ root.render(
 // to log results (for example: reportWebVitals(console.log))
 // or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals
 reportWebVitals();
+
+// Register service worker for PWA support
+serviceWorkerRegistration.register({
+  onSuccess: (registration) => {
+    console.log('Service Worker registered successfully');
+  },
+  onUpdate: (registration) => {
+    console.log('Service Worker update available');
+  },
+});
diff --git a/client/src/pages/Account/Account.js b/client/src/pages/Account/Account.js
index 6a30d7e..6bc8b91 100644
--- a/client/src/pages/Account/Account.js
+++ b/client/src/pages/Account/Account.js
@@ -5,6 +5,7 @@ import NavBar from '../../components/NavBar/NavBar';
 import { useCurrentUser } from '../../CurrentUserProvider';
 import { supabase } from '../../utils/supabaseClient';
 import { handleLogout } from '../../utils/authHandlers';
+import { delay } from '../../utils/delay';
 import { SERVER_URL } from '../../config/urls';
 
 function Account() {
@@ -650,9 +651,8 @@ function Account() {
             if (error) throw error;
             setEmailVerificationStatus('Verification email sent! Please check your inbox and click the confirmation link.');
             // Refresh verification status after a delay
-            setTimeout(() => {
-                checkEmailVerification();
-            }, 2000);
+            await delay(2000);
+            await checkEmailVerification();
         } catch (error) {
             console.error('Resend verification email error:', error);
             setEmailVerificationStatus(error.message || 'Failed to send verification email.');
diff --git a/client/src/pages/Reset/UpdatePassword.js b/client/src/pages/Reset/UpdatePassword.js
index c3e5a64..8ad0845 100644
--- a/client/src/pages/Reset/UpdatePassword.js
+++ b/client/src/pages/Reset/UpdatePassword.js
@@ -1,6 +1,7 @@
 import { useState } from "react";
 import { useNavigate } from "react-router-dom";
 import { handleUpdatePassword } from "../../utils/authHandlers";
+import { delay } from "../../utils/delay";
 import * as styles from '../Login/styles';
 import logo from '../../assets/kintreelogo-adobe.png';
 
@@ -46,7 +47,8 @@ export default function UpdatePassword() {
     try {
       await handleUpdatePassword(password);
       setMessage("Password updated. Redirecting to login...");
-      setTimeout(() => navigate('/login'), 1200);
+      await delay(1200);
+      navigate('/login');
     } catch (error) {
       setPasswordError(error.message || "Failed to update password");
     }
diff --git a/client/src/pages/Tree/Tree.js b/client/src/pages/Tree/Tree.js
index 5bd3fec..893fb70 100644
--- a/client/src/pages/Tree/Tree.js
+++ b/client/src/pages/Tree/Tree.js
@@ -10,6 +10,7 @@ import { useLocation, Outlet } from 'react-router-dom';
 import { useCurrentUser, supabaseUser } from '../../CurrentUserProvider'; // import the context
 import { familyTreeService } from '../../services/familyTreeService';
 import { removeNodeFromTree, rebuildTreeFromDatabase } from '../../utils/relationUtil';
+import { delay } from '../../utils/delay';
 import * as d3 from 'd3';
 import { ReactComponent as ImportIcon } from '../../assets/import.svg';
 import Popup from 'reactjs-popup';
@@ -63,15 +64,14 @@ function FamilyTree({ refreshKey }) {
             await familyTreeService.updateTreeInfo(currentAccountID, updatedTreeData);
 
             setErrorMessage(`Successfully removed ${firstName} ${lastName}`);
-            setTimeout(() => {
-                setErrorMessage('');
-                // If onTreeUpdate is provided (from props), use it to refresh instead of reload
-                if (window.refreshTree) {
-                    window.refreshTree();
-                } else {
-                    window.location.reload();
-                }
-            }, 1000);
+            await delay(1000);
+            setErrorMessage('');
+            // If onTreeUpdate is provided (from props), use it to refresh instead of reload
+            if (window.refreshTree) {
+                window.refreshTree();
+            } else {
+                window.location.reload();
+            }
         } catch (error) {
             console.error('[DETAILED DEBUG] Deletion Error:', error);
             setErrorMessage(`Deletion Failed: ${error.message}`);
diff --git a/client/src/serviceWorkerRegistration.js b/client/src/serviceWorkerRegistration.js
new file mode 100644
index 0000000..3d14734
--- /dev/null
+++ b/client/src/serviceWorkerRegistration.js
@@ -0,0 +1,137 @@
+// This optional code is used to register a service worker.
+// register() is not called by default.
+
+// This lets the app load faster on subsequent visits in production, and gives
+// it offline capabilities. However, it also means that developers (and users)
+// will only see deployed updates on subsequent visits to a page, after all the
+// existing tabs open on the page have been closed, since previously cached
+// resources are updated in the background.
+
+// To learn more about the benefits of this model and instructions on how to
+// opt-in, read https://cra.link/PWA
+
+const isLocalhost = Boolean(
+  window.location.hostname === 'localhost' ||
+    // [::1] is the IPv6 localhost address.
+    window.location.hostname === '[::1]' ||
+    // 127.0.0.0/8 are considered localhost for IPv4.
+    window.location.hostname.match(/^127(?:\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/)
+);
+
+export function register(config) {
+  if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {
+    // The URL constructor is available in all browsers that support SW.
+    const publicUrl = new URL(process.env.PUBLIC_URL, window.location.href);
+    if (publicUrl.origin !== window.location.origin) {
+      // Our service worker won't work if PUBLIC_URL is on a different origin
+      // from what our page is served on. This might happen if a CDN is used to
+      // serve assets; see https://github.com/facebook/create-react-app/issues/2374
+      return;
+    }
+
+    window.addEventListener('load', () => {
+      const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;
+
+      if (isLocalhost) {
+        // This is running on localhost. Let's check if a service worker still exists or not.
+        checkValidServiceWorker(swUrl, config);
+
+        // Add some additional logging to localhost, pointing developers to the
+        // service worker/PWA documentation.
+        navigator.serviceWorker.ready.then(() => {
+          console.log(
+            'This web app is being served cache-first by a service ' +
+              'worker. To learn more, visit https://cra.link/PWA'
+          );
+        });
+      } else {
+        // Is not localhost. Just register service worker
+        registerValidSW(swUrl, config);
+      }
+    });
+  }
+}
+
+function registerValidSW(swUrl, config) {
+  navigator.serviceWorker
+    .register(swUrl)
+    .then((registration) => {
+      registration.onupdatefound = () => {
+        const installingWorker = registration.installing;
+        if (installingWorker == null) {
+          return;
+        }
+        installingWorker.onstatechange = () => {
+          if (installingWorker.state === 'installed') {
+            if (navigator.serviceWorker.controller) {
+              // At this point, the updated precached content has been fetched,
+              // but the previous service worker will still serve the older
+              // content until all client tabs are closed.
+              console.log(
+                'New content is available and will be used when all ' +
+                  'tabs for this page are closed. See https://cra.link/PWA.'
+              );
+
+              // Execute callback
+              if (config && config.onUpdate) {
+                config.onUpdate(registration);
+              }
+            } else {
+              // At this point, everything has been precached.
+              // It's the perfect time to display a
+              // "Content is cached for offline use." message.
+              console.log('Content is cached for offline use.');
+
+              // Execute callback
+              if (config && config.onSuccess) {
+                config.onSuccess(registration);
+              }
+            }
+          }
+        };
+      };
+    })
+    .catch((error) => {
+      console.error('Error during service worker registration:', error);
+    });
+}
+
+function checkValidServiceWorker(swUrl, config) {
+  // Check if the service worker can be found. If it can't reload the page.
+  fetch(swUrl, {
+    headers: { 'Service-Worker': 'script' },
+  })
+    .then((response) => {
+      // Ensure service worker exists, and that we really are getting a JS file.
+      const contentType = response.headers.get('content-type');
+      if (
+        response.status === 404 ||
+        (contentType != null && contentType.indexOf('javascript') === -1)
+      ) {
+        // No service worker found. Probably a different app. Reload the page.
+        navigator.serviceWorker.ready.then((registration) => {
+          registration.unregister().then(() => {
+            window.location.reload();
+          });
+        });
+      } else {
+        // Service worker found. Proceed as normal.
+        registerValidSW(swUrl, config);
+      }
+    })
+    .catch(() => {
+      console.log('No internet connection found. App is running in offline mode.');
+    });
+}
+
+export function unregister() {
+  if ('serviceWorker' in navigator) {
+    navigator.serviceWorker.ready
+      .then((registration) => {
+        registration.unregister();
+      })
+      .catch((error) => {
+        console.error(error.message);
+      });
+  }
+}
\ No newline at end of file
diff --git a/client/src/services/familyTreeService.js b/client/src/services/familyTreeService.js
index 4d8d762..0f03def 100644
--- a/client/src/services/familyTreeService.js
+++ b/client/src/services/familyTreeService.js
@@ -142,7 +142,7 @@ export const familyTreeService = {
      * @returns 
      */
     async deleteFamilyMember(memberId) {
-        const response = await fetch(`http://localhost:5000/api/family-members/${memberId}`, {
+        const response = await fetch(`/api/family-members/${memberId}`, {
             method: 'DELETE',
             headers: { 'Content-Type': 'application/json' },
         });
@@ -234,7 +234,7 @@ export const familyTreeService = {
      * @returns JSON Array of all relationships for the user's tree
      */
     async getRelationshipsByUser(userId) {
-        const response = await fetch(`http://localhost:5000/api/relationships/user/${userId}`, {
+        const response = await fetch(`/api/relationships/user/${userId}`, {
             method: 'GET',
             headers: { 'Content-Type': 'application/json' },
         });
@@ -250,7 +250,7 @@ export const familyTreeService = {
      * @param {string} userId 
      */
     async clearFamilyTree(userId) {
-        const response = await fetch(`http://localhost:5000/api/family-members/clear/${userId}`, {
+        const response = await fetch(`/api/family-members/clear/${userId}`, {
             method: 'DELETE',
             headers: { 'Content-Type': 'application/json' },
         });
diff --git a/client/src/utils/delay.js b/client/src/utils/delay.js
new file mode 100644
index 0000000..c64f24c
--- /dev/null
+++ b/client/src/utils/delay.js
@@ -0,0 +1,19 @@
+export const delay = (ms) => new Promise((resolve) => {
+  if (typeof requestAnimationFrame !== 'function' || typeof performance === 'undefined') {
+    resolve();
+    return;
+  }
+
+  const start = performance.now();
+
+  const tick = (now) => {
+    if (now - start >= ms) {
+      resolve();
+      return;
+    }
+
+    requestAnimationFrame(tick);
+  };
+
+  requestAnimationFrame(tick);
+});
diff --git a/docs/KinTree SRS Spring 2026.docx b/docs/KinTree SRS Spring 2026.docx
new file mode 100644
index 0000000..073c4c0
Binary files /dev/null and b/docs/KinTree SRS Spring 2026.docx differ
diff --git a/docs/PWA_SETUP.md b/docs/PWA_SETUP.md
new file mode 100644
index 0000000..1e6060b
--- /dev/null
+++ b/docs/PWA_SETUP.md
@@ -0,0 +1,167 @@
+# Progressive Web App (PWA) Support
+
+KinTree now supports Progressive Web App functionality, allowing users to install the app on their devices and use it offline.
+
+## What's Been Added
+
+### 1. **Service Worker** (`client/public/service-worker.js`)
+   - Handles offline functionality with cache-first strategy for static assets
+   - Network-first strategy for API calls
+   - Automatic cache management and cleanup
+
+### 2. **Manifest File** (`client/public/manifest.json`)
+   - Updated with app metadata, colors, and display modes
+   - Includes app icons and screenshots configuration
+   - Configured for standalone display mode
+
+### 3. **Service Worker Registration** (`client/src/serviceWorkerRegistration.js`)
+   - Manages service worker lifecycle
+   - Handles updates and offline scenarios
+   - Environment-aware registration (production only)
+
+### 4. **PWA Install Hook** (`client/src/hooks/usePWAInstall.js`)
+   - Custom React hook to handle install prompts
+   - Allows showing/dismissing install dialog
+
+### 5. **HTML Meta Tags** (`client/public/index.html`)
+   - Added iOS PWA support meta tags
+   - Added theme color and viewport configuration
+   - Improved mobile web app experience
+
+## Features
+
+### Offline Support
+- Static assets (HTML, CSS, JS) are cached on first visit
+- API calls remain network-first but fallback to cache if offline
+- Users can view cached content when offline
+
+### Install Prompt
+- Automatic install prompt on compatible browsers
+- Optional custom install button in your app
+
+### Caching Strategy
+- **Cache-First**: Static assets (JS, CSS, images)
+- **Network-First**: API calls (with cache fallback)
+- **Stale-While-Revalidate**: Background updates
+
+## How to Use
+
+### Basic Usage (Already Configured)
+The service worker is automatically registered in `client/src/index.js`. No additional setup is needed.
+
+### Custom Install Prompt (Optional)
+To add a custom install button in your component:
+
+```javascript
+import { usePWAInstall } from '../hooks/usePWAInstall';
+
+function YourComponent() {
+  const { isPromptVisible, showInstallPrompt, dismissPrompt } = usePWAInstall();
+
+  return (
+    isPromptVisible && (
+      <div className="install-prompt">
+        <p>Install KinTree to get quick access to your family tree!</p>
+        <button onClick={showInstallPrompt}>Install App</button>
+        <button onClick={dismissPrompt}>Not Now</button>
+      </div>
+    )
+  );
+}
+```
+
+## Building for Production
+
+1. **Build the app:**
+   ```bash
+   npm run build
+   ```
+
+2. **Serve over HTTPS:**
+   Service workers require HTTPS in production (localhost works for development)
+
+3. **Test PWA Features:**
+   - Use Chrome DevTools → Application → Service Workers
+   - Use Chrome DevTools → Application → Manifest
+   - Use Chrome DevTools → Network → check "Offline"
+
+## Browser Support
+
+- **Chrome/Edge**: Full support including install prompt
+- **Firefox**: Full support excluding install prompt
+- **Safari**: Limited support (iOS 13.4+)
+- **Mobile browsers**: Varies by vendor
+
+## Cache Versioning
+
+When deploying updates:
+1. Update `CACHE_NAME` in `client/public/service-worker.js` (e.g., 'kintree-v2')
+2. Service workers will detect the update and notify users
+3. Users will see "New content available; please refresh" message
+
+## Configuration
+
+### Changing Cache Name
+Edit `client/public/service-worker.js`:
+```javascript
+const CACHE_NAME = 'kintree-v1'; // Increment for new version
+```
+
+### Modifying Cache Strategy
+Adjust URLs in `client/public/service-worker.js`:
+```javascript
+if (event.request.url.includes('/api/') || 
+    event.request.url.includes('your-api-host')) {
+  // Network-first strategy
+}
+```
+
+### Updating Manifest
+Edit `client/public/manifest.json` to change:
+- App name and short name
+- Theme colors
+- Display mode
+- App icons and screenshots
+
+## Troubleshooting
+
+### Service Worker Not Registering
+- Ensure you're on HTTPS (or localhost)
+- Check browser console for errors
+- Verify `service-worker.js` is accessible at `<domain>/service-worker.js`
+
+### Cache Issues
+- Open DevTools → Application → Clear all data
+- Increment `CACHE_NAME` version in service worker
+- Hard refresh browser (Ctrl+Shift+R or Cmd+Shift+R)
+
+### Install Prompt Not Showing
+- Must be on HTTPS (except localhost)
+- App must be installable (manifest.json requirements met)
+- Chrome requires at least 30 seconds of user engagement
+- Try in Chrome DevTools → Application → Add to home screen
+
+## Next Steps
+
+### Recommended Enhancements
+1. **Generate App Icons**: Create 192x192 and 512x512 pixel icons
+   - Update paths in `manifest.json`
+
+2. **Add Offline Page**: Create an offline fallback page
+   - Modify service worker fetch handler
+
+3. **Update Check**: Show update notifications when new version available
+   - Use `usePWAInstall` hook patterns
+
+4. **Background Sync**: Sync user changes when back online
+   - Implement Background Sync API in service worker
+
+5. **Web App Shortcuts**: Add shortcuts for common tasks
+   - Configure in `manifest.json` shortcuts field
+
+## Resources
+
+- [MDN Web App Manifest](https://developer.mozilla.org/en-US/docs/Web/Manifest)
+- [MDN Service Workers](https://developer.mozilla.org/en-US/docs/Web/API/Service_Worker_API)
+- [Google PWA Checklist](https://developers.google.com/web/progressive-web-apps/checklist)
+- [WebDevDocs: PWA](https://web.dev/progressive-web-apps/)
diff --git a/docs/kintree-dev-guide.pdf b/docs/kintree-dev-guide.pdf
deleted file mode 100644
index 3f4b18c..0000000
Binary files a/docs/kintree-dev-guide.pdf and /dev/null differ
diff --git a/docs/sample-data.json b/docs/sample-data.json
deleted file mode 100644
index 4274418..0000000
--- a/docs/sample-data.json
+++ /dev/null
@@ -1 +0,0 @@
-[{"id": "23", "data": {"email": "ronald@gmail.com", "avatar": "https://i.imgur.com/mfojszj.png", "gender": "M", "last name": "Smith", "first name": "Ronald"}, "rels": {"father": "20", "mother": "19", "children": ["18"]}}, {"id": "20", "data": {"flag": "paternal", "gender": "M", "last name": "Smith", "first name": "John"}, "rels": {"father": "22", "mother": "21", "spouses": ["19"], "children": ["23"]}}, {"id": "19", "data": {"flag": "maternal", "gender": "F", "last name": "Smith", "first name": "Jane"}, "rels": {"spouses": ["20"], "children": ["23"]}}, {"id": "21", "data": {"flag": "paternal", "gender": "F", "last name": "Smith", "first name": "Alice"}, "rels": {"spouses": ["22"], "children": ["20"]}}, {"id": "22", "data": {"flag": "paternal", "gender": "M", "last name": "Smith", "first name": "Bob"}, "rels": {"spouses": ["21"], "children": ["20"]}}, {"id": "18", "data": {"gender": "M", "last name": "Smith", "first name": "Tom"}, "rels": {"father": "23"}}]
\ No newline at end of file
diff --git a/docs/srs.pdf b/docs/srs.pdf
deleted file mode 100644
index 2327478..0000000
Binary files a/docs/srs.pdf and /dev/null differ
diff --git a/server/package-lock.json b/server/package-lock.json
index a5ef855..6e98895 100644
--- a/server/package-lock.json
+++ b/server/package-lock.json
@@ -14,6 +14,7 @@
         "cors": "^2.8.5",
         "dotenv": "^16.5.0",
         "express": "^4.21.1",
+        "fs": "^0.0.1-security",
         "jsonwebtoken": "^9.0.2",
         "knex": "^3.1.0",
         "multer": "^2.1.0",
@@ -1300,6 +1301,11 @@
         "node": ">= 0.6"
       }
     },
+    "node_modules/fs": {
+      "version": "0.0.1-security",
+      "resolved": "https://registry.npmjs.org/fs/-/fs-0.0.1-security.tgz",
+      "integrity": "sha512-3XY9e1pP0CVEUCdj5BmfIZxRBTSDycnbqhIOGec9QYtmVH2fbLpj86CFWkrNOkt/Fvty4KZG5lTglL9j/gJ87w=="
+    },
     "node_modules/fsevents": {
       "version": "2.3.3",
       "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz",
diff --git a/server/package.json b/server/package.json
index 2ba7798..d7e71db 100644
--- a/server/package.json
+++ b/server/package.json
@@ -7,7 +7,8 @@
     "test": "echo \"Error: no test specified\" && exit 1",
     "start": "node server.js",
     "start:dev-test": "node --env-file=.env.test server.js",
-    "start:ci-test": "cross-env NODE_ENV=test node server.js"
+    "start:ci-test": "cross-env NODE_ENV=test node server.js",
+    "start:prod": "cross-env NODE_ENV=production node server.js"
   },
   "keywords": [],
   "author": "",
@@ -18,6 +19,7 @@
     "cors": "^2.8.5",
     "dotenv": "^16.5.0",
     "express": "^4.21.1",
+    "fs": "^0.0.1-security",
     "jsonwebtoken": "^9.0.2",
     "knex": "^3.1.0",
     "multer": "^2.1.0",
diff --git a/server/server.js b/server/server.js
index c13a831..16b4cae 100644
--- a/server/server.js
+++ b/server/server.js
@@ -1,8 +1,10 @@
 // server.js
 const express = require('express');
+const path = require('path');
 const dotenv = require('dotenv');
 dotenv.config();
 const cors = require('cors');
+const fs = require('fs');
 const authRoutes = require('./routes/authRoutes');
 const treeMemberRoutes = require('./routes/treeMemberRoute');
 const relationshipRoutes = require('./routes/relationshipRoutes');
@@ -12,23 +14,35 @@ const treeInfoRoutes = require('./routes/treeInfoRoutes');
 const eventRoutes = require('./routes/eventRoutes');
 const memoryRoutes = require('./routes/memoryRoutes');
 
+const app = express();
+const port = process.env.PORT || 5000;
+const isProduction = process.env.NODE_ENV === 'production';
+const clientBuildPath = path.join(__dirname, '../client/build');
+
+app.use(express.json());
+app.use(cors());
+
+// Load environment variables from .env.test in test environment, otherwise from .env
 if (process.env.NODE_ENV === 'test') {
   dotenv.config({ path: '.env.test' });
 } else {
   dotenv.config(); 
 }
 
-const app = express();
-const port = process.env.PORT || 5000;
-
-app.use(express.json());
-app.use(cors());
+// Only serve built frontend in production
+if (isProduction) {
+  if (!fs.existsSync(clientBuildPath)) {
+    console.error('ERROR: Client build directory not found at', clientBuildPath);
+    console.error('Please run: `npm run build` in the /client/ directory. Then try again.');
+    process.exit(1);
+  }
+  app.use(express.static(clientBuildPath));
+}
 
 // Status check  
 app.get('/', (req, res) => {
   res.status(200).json();
 });
-
 app.use('/api/share-trees', sharedTreeRoutes)
 app.use('/api/family-members', treeMemberRoutes);
 app.use('/api/relationships', relationshipRoutes);
@@ -38,6 +52,13 @@ app.use('/api/tree-info', treeInfoRoutes);
 app.use('/api/events', eventRoutes); 
 app.use('/api/memories', memoryRoutes);
 
+// Let React Router handle all non-API routes
+if (isProduction) {
+  app.get('*', (req, res) => {
+    res.sendFile(path.join(clientBuildPath, 'index.html'));
+  });
+}
+
 app.listen(port, () => {
   console.log(`Server running on port ${port}`);
 });
