Update app.py

app.py

@@ -52,14 +52,49 @@ def chat_math_virtuoso(message: str, temperature: float = 0.7, max_new_tokens: i
         yield "".join(outputs)
 
 with gr.Blocks(css="""
-    body {background-color: #f4f4f9; font-family: 'Arial', sans-serif;}
-    .gr-block {border-radius: 15px; box-shadow: 0 8px 20px rgba(0,0,0,0.1);}
-    .gr-button {background-color: #6C63FF; color: white; font-weight: bold;}
-    .gr-textbox {border-radius: 10px;}
-    .gr-slider {color: #6C63FF;}
+    body {
+        background: linear-gradient(135deg, #f0f2ff, #d9e4ff);
+        font-family: 'Helvetica Neue', Arial, sans-serif;
+    }
+    .gr-block {
+        border-radius: 20px;
+        box-shadow: 0 10px 30px rgba(0,0,0,0.12);
+        padding: 20px;
+    }
+    .gr-button {
+        background: linear-gradient(90deg, #6C63FF, #8B78FF);
+        color: white;
+        font-weight: bold;
+        border-radius: 12px;
+        padding: 10px 25px;
+        transition: all 0.3s ease;
+    }
+    .gr-button:hover {
+        transform: translateY(-2px);
+        box-shadow: 0 6px 15px rgba(0,0,0,0.2);
+    }
+    .gr-textbox {
+        border-radius: 12px;
+        border: 1px solid #ccc;
+        padding: 10px;
+        transition: border-color 0.3s;
+    }
+    .gr-textbox:focus {
+        border-color: #6C63FF;
+        box-shadow: 0 0 8px rgba(108, 99, 255, 0.3);
+    }
+    .gr-slider .noUi-connect {
+        background: #6C63FF;
+    }
+    h2 {
+        text-align: center;
+        color: #6C63FF;
+        font-weight: 700;
+        margin-bottom: 25px;
+    }
 """) as demo:
 
-    gr.Markdown("<h2 style='text-align:center; color:#6C63FF;'>🤖 Math Virtuoso 7B Chat</h2>")
+    gr.Markdown("<h2>🤖 Math Virtuoso 7B Chat</h2>")
     
     with gr.Row():
         with gr.Column(scale=2):