Update style.css

style.css

@@ -1,24 +1,29 @@
 /* style.css */
-/* ===== WARNA UTAMA ===== */
 body {
     background: #f0faff !important;
     font-family: 'Comic Sans MS', cursive;
+    min-height: 100vh;
 }
 
 .header-container {
     text-align: center;
-    margin: 20px 0;
+    margin: 20px auto;
+    width: 90%;
 }
 
 .banner {
-    width: 90%;
-    border: 4px solid #89CFF0;
+    width: 100%;
     border-radius: 20px;
+    border: 4px solid #89CFF0 !important;
     box-shadow: 0 8px 20px rgba(137, 207, 240, 0.3);
 }
 
 .title-overlay {
-    color: #ffffff !important;
+    position: absolute;
+    bottom: 30px;
+    left: 50%;
+    transform: translateX(-50%);
+    color: white !important;
     font-size: 2.5em !important;
     text-shadow: 2px 2px 4px rgba(137, 207, 240, 0.5);
     background: rgba(137, 207, 240, 0.3);
@@ -30,13 +35,18 @@ body {
 #chatbot {
     border: 3px solid #89CFF0 !important;
     background: white !important;
+    border-radius: 20px;
+    margin: 20px auto;
+    width: 85%;
 }
 
 #send-btn {
     background: #89CFF0 !important;
     color: white !important;
+    border-radius: 15px;
 }
 
 #clear-btn {
     background: #ffb3ba !important;
+    color: white !important;
 }