diff --git a/demo/src/components/ChatApp.tsx b/demo/src/components/ChatApp.tsx
index 116872b..e01aa2d 100644
--- a/demo/src/components/ChatApp.tsx
+++ b/demo/src/components/ChatApp.tsx
@@ -115,7 +115,7 @@ const ChatApp: React.FC<ChatAppProps> = () => {
           onModelChange={handleModelChange}
           apiKeyUpdateTrigger={apiKeyUpdateTrigger}
         />
-        <div className="flex flex-col flex-grow h-full w-[calc(100%-16rem)]">
+        <div className="flex flex-col flex-grow h-full w-[calc(100%-16rem)] lg:w-[calc(100%-32rem)]">
           <ChatNavbar
             sidebarVisible={sidebarVisible}
             setSidebarVisible={setSidebarVisible}
diff --git a/demo/src/components/ChatSidebar.tsx b/demo/src/components/ChatSidebar.tsx
index cc31848..0fdef8c 100644
--- a/demo/src/components/ChatSidebar.tsx
+++ b/demo/src/components/ChatSidebar.tsx
@@ -70,7 +70,7 @@ const ChatSidebar: React.FC<ChatSidebarProps> = ({
           
           ${
             sidebarVisible
-              ? "w-64 translate-x-0"
+              ? "w-64 lg:w-[32rem] translate-x-0"
               : "w-0 -translate-x-full md:translate-x-0"
           }
         `}