style: make chat layout responsive for screens smaller than 1100px

static/style.css

@@ -71,7 +71,7 @@ button:hover {
   display: flex;
   justify-content: center;
   align-items: flex-start;
-  gap: 40px;
+  gap: 2rem;
 }
 
 .chat-box,
@@ -116,3 +116,15 @@ button:hover {
     gap: 0.5rem;
     margin-bottom: 1rem;
 }
+
+@media (max-width: 1100px) {
+  .chat-container {
+    display: flex;
+    flex-direction: column;
+    gap: 2rem;
+  }
+
+  .chat-box, .response-box {
+    width: 100%;
+  }
+}