diff --git a/frontend/src/contexts/ConfigContext.tsx b/frontend/src/contexts/ConfigContext.tsx
index a64791b..63e1e91 100644
--- a/frontend/src/contexts/ConfigContext.tsx
+++ b/frontend/src/contexts/ConfigContext.tsx
@@ -36,7 +36,10 @@ export function ConfigProvider({ children }: { children: ReactNode }) {
         const response = await fetch('/api/config');
         if (response.ok) {
           const data = await response.json();
+          console.log('[Config] Loaded runtime config:', data);
           setConfig(data);
+          // Also update the global cached config for non-React usage
+          cachedConfig = data;
         }
       } catch (error) {
         console.warn('[Config] Failed to fetch runtime config, using defaults:', error);
@@ -48,6 +51,14 @@ export function ConfigProvider({ children }: { children: ReactNode }) {
     fetchConfig();
   }, []);
 
+  if (isLoading) {
+    return (
+      <div className="flex h-screen w-screen items-center justify-center bg-background">
+        <div className="h-8 w-8 animate-spin rounded-full border-4 border-primary border-t-transparent" />
+      </div>
+    );
+  }
+
   return (
     <ConfigContext.Provider value={{ config, isLoading }}>
       {children}
@@ -70,7 +81,7 @@ let cachedConfig: RuntimeConfig | null = null;
 
 export async function getConfig(): Promise<RuntimeConfig> {
   if (cachedConfig) return cachedConfig;
-  
+
   try {
     const response = await fetch('/api/config');
     if (response.ok) {
@@ -80,7 +91,7 @@ export async function getConfig(): Promise<RuntimeConfig> {
   } catch {
     console.warn('[Config] Failed to fetch config, using defaults');
   }
-  
+
   return defaultConfig;
 }