Add API Key Onboarding Modal and Firebase Local Mode

App.tsx

@@ -1845,6 +1845,57 @@ const App: React.FC = () => {
   return (
     <div className="flex h-screen bg-[#0B0F19] text-slate-100 overflow-hidden font-sans selection:bg-indigo-500/30">
       
+      {/* API Key Gateway Modal */}
+      {!userGeminiKey && (
+        <div className="fixed inset-0 bg-[#0B0F19] z-[100] flex flex-col items-center justify-center p-4">
+          <div className="max-w-md w-full bg-slate-800 border border-indigo-500/30 rounded-2xl p-8 shadow-2xl shadow-indigo-500/10 text-center">
+            <div className="w-16 h-16 bg-indigo-500/20 rounded-full flex items-center justify-center mx-auto mb-6">
+              <Key className="w-8 h-8 text-indigo-400" />
+            </div>
+            <h2 className="text-2xl font-black text-white mb-2 tracking-tight">Welcome to MindSpark</h2>
+            <p className="text-slate-400 text-sm mb-6 leading-relaxed">
+              To use this AI Workspace, you need your own Google Gemini API Key. 
+              Your key is stored securely in your browser's local storage and is never sent to our servers.
+            </p>
+            <a href="https://aistudio.google.com/app/apikey" target="_blank" rel="noreferrer" className="text-indigo-400 hover:text-indigo-300 text-sm font-medium mb-6 inline-block transition-colors">
+              Get your free API key here &rarr;
+            </a>
+            <div className="space-y-4 text-left">
+              <label className="block text-xs font-bold text-slate-400 uppercase tracking-wider">Gemini API Key</label>
+              <input 
+                type="password" 
+                id="gateway-api-key"
+                placeholder="AIzaSy..."
+                className="w-full bg-black/40 border border-white/10 rounded-xl px-4 py-3 text-white focus:border-indigo-500 outline-none transition-all"
+                onKeyDown={(e) => {
+                  if (e.key === 'Enter') {
+                    const val = e.currentTarget.value.trim();
+                    if (val) {
+                      localStorage.setItem('user_gemini_api_key', val);
+                      setUserGeminiKey(val);
+                      window.location.reload();
+                    }
+                  }
+                }}
+              />
+              <button 
+                onClick={() => {
+                  const val = (document.getElementById('gateway-api-key') as HTMLInputElement).value.trim();
+                  if (val) {
+                    localStorage.setItem('user_gemini_api_key', val);
+                    setUserGeminiKey(val);
+                    window.location.reload();
+                  }
+                }}
+                className="w-full bg-indigo-600 hover:bg-indigo-500 text-white font-black py-3 rounded-xl transition-all shadow-lg shadow-indigo-600/20"
+              >
+                Save & Continue
+              </button>
+            </div>
+          </div>
+        </div>
+      )}
+
       {/* Mobile Sidebar Overlay */}
       {isMobileMenuOpen && (
         <div 

firebase.ts

@@ -13,8 +13,9 @@ const firebaseConfig = {
 };
 
 // Check if Firebase config is complete to avoid "invalid-api-key" error
-if (!firebaseConfig.apiKey) {
-  console.warn("Firebase API Key is missing. Please check your .env file or environment variables.");
+const isDummy = firebaseConfig.apiKey === "dummy-api-key" || !firebaseConfig.apiKey;
+if (isDummy) {
+  console.log("Firebase is running in Local Workspace Mode (No API keys provided). Data will be saved locally.");
 }
 
 const app = initializeApp(firebaseConfig);
@@ -23,6 +24,9 @@ export const db = getFirestore(app, import.meta.env.VITE_FIREBASE_FIRESTORE_DATA
 export const googleProvider = new GoogleAuthProvider();
 
 export const signInWithGoogle = async () => {
+  if (isDummy) {
+    throw new Error("LocalMode");
+  }
   try {
     const result = await signInWithPopup(auth, googleProvider);
     return result.user;
@@ -33,6 +37,7 @@ export const signInWithGoogle = async () => {
 };
 
 export const logOut = async () => {
+  if (isDummy) return;
   try {
     await signOut(auth);
   } catch (error) {
@@ -43,11 +48,12 @@ export const logOut = async () => {
 
 // Test connection
 async function testConnection() {
+  if (isDummy) return;
   try {
     await getDocFromServer(doc(db, 'test', 'connection'));
   } catch (error) {
     if(error instanceof Error && error.message.includes('the client is offline')) {
-      console.error("Please check your Firebase configuration. ");
+      console.warn("Firebase client is offline. Defaulting to local mode.");
     }
   }
 }

services/geminiService.ts

@@ -4,10 +4,10 @@ import { ProjectPlan, NoteType, StyleMemory } from "../types";
 const getAI = () => {
     const userKey = localStorage.getItem('user_gemini_api_key');
     const apiKey = userKey || process.env.GEMINI_API_KEY;
-    if (!apiKey) {
-        console.warn("Gemini API Key is missing. Please set it in Settings.");
+    if (!apiKey || apiKey === 'dummy-key') {
+        throw new Error("API_KEY_MISSING");
     }
-    return new GoogleGenAI({ apiKey: apiKey || 'dummy-key' });
+    return new GoogleGenAI({ apiKey: apiKey });
 };
 
 // Helper to compress base64 images to avoid Firestore 1MB limit