diff --git a/docs/screenshots/issue-35-mobile-onboarding.png b/docs/screenshots/issue-35-mobile-onboarding.png
new file mode 100644
index 0000000..072d607
Binary files /dev/null and b/docs/screenshots/issue-35-mobile-onboarding.png differ
diff --git a/frontend/src/lib/supabase.ts b/frontend/src/lib/supabase.ts
index f10bc78..e9aa08a 100644
--- a/frontend/src/lib/supabase.ts
+++ b/frontend/src/lib/supabase.ts
@@ -1,36 +1,52 @@
-import { createClient } from '@supabase/supabase-js';
+import { createClient, SupabaseClient } from '@supabase/supabase-js';
 
-const supabaseUrl = import.meta.env.VITE_SUPABASE_URL!;
-const supabaseAnonKey = import.meta.env.VITE_SUPABASE_ANON_KEY!;
+const supabaseUrl = import.meta.env.VITE_SUPABASE_URL ?? '';
+const supabaseAnonKey = import.meta.env.VITE_SUPABASE_ANON_KEY ?? '';
 
-export const supabase = createClient(supabaseUrl, supabaseAnonKey);
+export const supabase: SupabaseClient =
+  supabaseUrl && supabaseAnonKey
+    ? createClient(supabaseUrl, supabaseAnonKey)
+    : (null as unknown as SupabaseClient);
 
 // Helper to get current session
 export async function getSession() {
-  const { data: { session } } = await supabase.auth.getSession();
-  return session;
+  if (!supabase) return null;
+  try {
+    const { data: { session } } = await supabase.auth.getSession();
+    return session;
+  } catch {
+    return null;
+  }
 }
 
 // Helper to get current user
 export async function getCurrentUser() {
+  if (!supabase) return null;
   const { data: { user } } = await supabase.auth.getUser();
   return user;
 }
 
 // Helper to sign in anonymously
 export async function signInAnonymously() {
+  if (!supabase) {
+    return { data: null, error: { message: 'Supabase not configured. Add VITE_SUPABASE_URL and VITE_SUPABASE_ANON_KEY to .env' } as any };
+  }
   const { data, error } = await supabase.auth.signInAnonymously();
   return { data, error };
 }
 
 // Helper to sign out
 export async function signOut() {
+  if (!supabase) return { error: null };
   const { error } = await supabase.auth.signOut();
   return { error };
 }
 
 // Helper to create user profile
 export async function createProfile(userId: string, nickname: string, avatar: string) {
+  if (!supabase) {
+    return { data: null, error: { message: 'Supabase not configured' } as any };
+  }
   const { data, error } = await supabase
     .from('profiles')
     .insert({
@@ -46,6 +62,7 @@ export async function createProfile(userId: string, nickname: string, avatar: st
 
 // Helper to get user profile
 export async function getProfile(userId: string) {
+  if (!supabase) return { data: null, error: { message: 'Supabase not configured' } as any };
   const { data, error } = await supabase
     .from('profiles')
     .select('*')
diff --git a/frontend/src/pages/Home.tsx b/frontend/src/pages/Home.tsx
index 4773060..f4a4f60 100644
--- a/frontend/src/pages/Home.tsx
+++ b/frontend/src/pages/Home.tsx
@@ -11,10 +11,14 @@ export default function Home() {
   }, []);
 
   async function checkSession() {
-    const session = await getSession();
-    if (session) {
-      navigate('/dashboard');
-    } else {
+    try {
+      const session = await getSession();
+      if (session) {
+        navigate('/dashboard');
+      }
+    } catch {
+      // ignore
+    } finally {
       setLoading(false);
     }
   }
diff --git a/frontend/src/pages/Onboarding.tsx b/frontend/src/pages/Onboarding.tsx
index 09dd7b8..12a276c 100644
--- a/frontend/src/pages/Onboarding.tsx
+++ b/frontend/src/pages/Onboarding.tsx
@@ -55,8 +55,8 @@ export default function Onboarding() {
   }
 
   return (
-    <div className="min-h-screen bg-gradient-to-b from-blue-50 to-white flex items-center justify-center px-4">
-      <div className="max-w-md w-full">
+    <div className="min-h-screen bg-gradient-to-b from-blue-50 to-white flex items-center justify-center px-4 py-6 overflow-x-hidden">
+      <div className="max-w-md w-full min-w-0">
         {/* Crisis Banner */}
         <div className="bg-red-600 text-white py-2 px-4 rounded-lg text-center text-sm mb-6">
           <strong>⚠️ IN CRISIS?</strong> 🇺🇸 988 | 🇮🇳 9152987821 (iCall) | KIRAN 1800-599-0019
@@ -90,21 +90,21 @@ export default function Onboarding() {
               <p className="text-xs text-gray-500 mt-1">3-20 characters, no personal info</p>
             </div>
 
-            {/* Avatar Selection */}
-            <div className="mb-6">
+            {/* Avatar Selection - responsive for mobile */}
+            <div className="mb-6 min-w-0">
               <label className="block text-sm font-medium text-gray-700 mb-2">
                 Choose an Avatar
               </label>
-              <div className="grid grid-cols-5 gap-2">
+              <div className="grid grid-cols-4 sm:grid-cols-5 gap-2 sm:gap-2">
                 {AVATAR_OPTIONS.map((avatar) => (
                   <button
                     key={avatar}
                     type="button"
                     onClick={() => setSelectedAvatar(avatar)}
-                    className={`text-4xl p-3 rounded-lg border-2 transition-all ${
+                    className={`min-h-[48px] min-w-[48px] sm:min-h-[52px] sm:min-w-[52px] flex items-center justify-center text-2xl sm:text-3xl md:text-4xl p-2 sm:p-3 rounded-lg border-2 transition-all touch-manipulation ${
                       selectedAvatar === avatar
-                        ? 'border-primary-600 bg-primary-50 scale-110'
-                        : 'border-gray-300 hover:border-primary-400'
+                        ? 'border-primary-600 bg-primary-50 scale-105 sm:scale-110'
+                        : 'border-gray-300 hover:border-primary-400 active:border-primary-400'
                     }`}
                     disabled={loading}
                   >