diff --git a/src/components/Sidebar.tsx b/src/components/Sidebar.tsx
index 5c7642f..877f523 100644
--- a/src/components/Sidebar.tsx
+++ b/src/components/Sidebar.tsx
@@ -64,12 +64,12 @@ function DesktopSidebar({
   return (
     <div
       className={`
-        flex transition-all duration-300 ease-in-out overflow-hidden
+        flex transition-[transform,opacity] duration-300 ease-in-out overflow-hidden
         ${isOpen ? 'w-64 opacity-100' : 'w-0 opacity-0'}
       `}
     >
       {activePanel && (
-        <div className="w-64 flex flex-col border-r border-muted">
+        <div className="w-64 flex flex-col border-r border-muted transition-theme">
           <div className="flex items-center justify-between px-4 py-3 border-b border-muted shrink-0">
             <span className="text-sm font-semibold text-accent">
               {activePanel.label}
@@ -165,7 +165,7 @@ export default function Sidebar({ panels }: { panels: SidebarPanel[] }) {
   const isOpen = !!activePanel;
 
   return (
-    <div className="flex border-r border-t border-muted">
+    <div className="flex border-r border-t border-muted transition-theme">
       {/* Desktop */}
       {isWide && (
         <DesktopSidebar
diff --git a/src/components/chat/ChatUI.tsx b/src/components/chat/ChatUI.tsx
index 1d6e772..90ef180 100644
--- a/src/components/chat/ChatUI.tsx
+++ b/src/components/chat/ChatUI.tsx
@@ -47,22 +47,22 @@ export default function ChatUI({
     setInput('');
     setLoading(true);
 
-    try {
-      const body: ChatRequest = {
-        model: selectedModel!,
-        messages: newMessages,
-        temperature: settings.temp,
-        top_p: settings.topP,
-        top_k: settings.topK,
-        num_predict: settings.maxTokens,
-        num_ctx: settings.numCtx,
-        repeat_penalty: settings.repeatPenalty,
-        seed: settings.seed,
-        stream: settings.stream,
-        keep_alive: settings.keepAlive,
-        stop: settings.stop,
-      };
+    const body: ChatRequest = {
+      model: selectedModel!,
+      messages: newMessages,
+      temperature: settings.temp,
+      top_p: settings.topP,
+      top_k: settings.topK,
+      num_predict: settings.maxTokens,
+      num_ctx: settings.numCtx,
+      repeat_penalty: settings.repeatPenalty,
+      seed: settings.seed,
+      stream: settings.stream,
+      keep_alive: settings.keepAlive,
+      stop: settings.stop,
+    };
 
+    try {
       const res = await fetch(
         process.env.NEXT_PUBLIC_API_URL + '/chat/completions',
         {
@@ -74,14 +74,43 @@ export default function ChatUI({
           body: JSON.stringify(body),
         },
       );
-      const data = await res.json();
+
+      const data = await res.json().catch(() => null);
+
+      if (!res.ok) {
+        let message = "Request failed";
+
+        if (res.status === 500) {
+          message = "Server error (likely model too large or OOM)";
+        } else if (res.status === 401) {
+          message = "Unauthorized";
+        } else {
+          message = data?.message || data?.error || message;
+        }
+
+        throw new Error(message);
+      }
+
       const assistant = data?.choices?.[0]?.message;
-      if (assistant) setMessages((prev) => [...prev, assistant]);
+      if (assistant) {
+        setMessages((prev) => [...prev, assistant]);
+      }
+
     } catch (err: any) {
       console.error(err);
-      setNotification(
-        err?.message || 'Something went wrong while sending request',
-      );
+
+      const message =
+        err?.message || 'Something went wrong while sending request';
+
+      setMessages((prev) => [
+        ...prev,
+        {
+          role: 'assistant',
+          content: `❌ ${message}`,
+        },
+      ]);
+
+      setNotification(message);
 
       setTimeout(() => setNotification(null), 3000);
     } finally {