initial work on message history and data transfer

frontend/styles.css

@@ -2,6 +2,7 @@ body {
     background-color: transparent !important;
     margin: 0;
     color: #f0f0f0;
+    font-family: "Inter", sans-serif;
 }
 
 .window-shell {
@@ -22,21 +23,45 @@ body {
     border-radius: 15px;
 }
 
+.dark-input {
+    padding: 12px 20px;
+    margin: 8px 0;
+
+    /* Colors & Background */
+    background-color: #1e1e1e;
+    color: #ffffff;
+    border: 1px solid #333333;
+    border-radius: 8px; /* Soft rounded corners */
+
+    /* Typography */
+    font-family: "Inter", sans-serif;
+    font-size: 16px;
+
+    /* Smooth Transition */
+    transition: all 0.3s ease;
+    outline: none;
+}
+
 .response-area {
     width: 100%;
     height: 300px;
     overflow-y: auto;
+    gap: 10px;
+    flex-direction: column;
+    display: flex;
 }
 
 .msg {
-    margin: 1px;
-    border: solid 1px #808080;
+    background-color: #303030;
+    border-radius: 8px;
+    padding: 8px 16px;
+    margin: 8px 0;
     animation: slideIn 0.3s ease-out;
     max-width: 70%;
 }
 
 .msg-user {
-    text-align: end;
+    align-self: flex-end;
 }
 
 @keyframes slideIn {