Fix UI overflow and refine error message formatting

frontend/src/index.css

@@ -65,6 +65,8 @@ body {
   border-radius: 1rem;
   position: relative;
   animation: fadeIn 0.3s ease-out;
+  word-break: break-word;
+  overflow-wrap: anywhere;
 }
 
 @keyframes fadeIn {

openrouter_client.py

@@ -35,7 +35,18 @@ class OpenRouterClient:
                 async with client.stream("POST", self.base_url, headers=headers, json=payload) as response:
                     if response.status_code != 200:
                         error_detail = await response.aread()
-                        yield f"Error: {response.status_code} - {error_detail.decode()}"
+                        try:
+                            error_json = json.loads(error_detail)
+                            error_msg = error_json.get("error", {}).get("message", "Unknown error")
+                            
+                            if response.status_code == 429:
+                                yield "I apologize, but my premium brain is currently taking a short breather (rate limit reached). Please try again in a few moments."
+                            elif response.status_code == 401:
+                                yield "Connection error: API key is invalid or expired."
+                            else:
+                                yield f"I'm having a little trouble connecting to my service (Error {response.status_code}: {error_msg}). Please try again soon."
+                        except:
+                            yield f"Error: {response.status_code} - Encountered an unexpected response format."
                         return
 
                     async for line in response.aiter_lines():