Update app.py

app.py

@@ -42,6 +42,10 @@ def generate_response(model_id, conversation, user_message, max_length=512, temp
     # Build messages in proper chat format
     messages = []
     
+    # Add system prompt first
+    system_prompt = "You are Athena, a helpful, harmless, and honest AI assistant. You provide clear, accurate, and concise responses to user questions. You are knowledgeable across many domains and always aim to be respectful and helpful. You are finetuned by Aayan Mishra"
+    messages.append({"role": "system", "content": system_prompt})
+    
     # Add conversation history
     for user_msg, assistant_msg in conversation:
         if user_msg:
@@ -130,10 +134,18 @@ css = """
 #chatbot {
     height: 600px;
 }
-.message {
-    padding: 10px;
-    margin: 5px;
-    border-radius: 10px;
+#chatbot .message {
+    padding: 8px 12px !important;
+    margin: 3px 0 !important;
+    border-radius: 8px !important;
+    max-width: 80% !important;
+    font-size: 14px !important;
+}
+#chatbot .message.user {
+    background-color: #e3f2fd !important;
+}
+#chatbot .message.bot {
+    background-color: #f5f5f5 !important;
 }
 """
 
@@ -142,46 +154,56 @@ with gr.Blocks(title="Athena Playground Chat", css=css) as demo:
     gr.Markdown("# 🚀 Athena Playground Chat")
     gr.Markdown("*Powered by HuggingFace ZeroGPU*")
     
+    # Main chat interface
+    chat_history = gr.Chatbot(
+        elem_id="chatbot",
+        show_label=False,
+        show_share_button=False,
+        container=False
+    )
+    
+    user_input = gr.Textbox(
+        placeholder="Ask Athena anything...",
+        label="Your message",
+        lines=2,
+        max_lines=10
+    )
+    
     with gr.Row():
-        with gr.Column(scale=1):
+        submit_btn = gr.Button("📤 Send", variant="primary")
+        clear_btn = gr.Button("🗑️ Clear Chat", variant="secondary")
+    
+    stats_output = gr.Textbox(
+        label="Stats", 
+        interactive=False,
+        show_label=False,
+        placeholder="Stats will appear here..."
+    )
+    
+    # Configuration settings at the bottom
+    gr.Markdown("---")
+    gr.Markdown("## ⚙️ Configuration")
+    
+    with gr.Row():
+        with gr.Column():
             model_choice = gr.Dropdown(
                 label="📱 Model",
                 choices=list(MODELS.keys()),
                 value="Athena-R3X 8B",
                 info="Select which Athena model to use"
             )
+        with gr.Column():
             max_length = gr.Slider(
                 32, 2048, value=512, 
                 label="📝 Max Tokens",
                 info="Maximum number of tokens to generate"
             )
+        with gr.Column():
             temperature = gr.Slider(
                 0.1, 2.0, value=0.7, 
                 label="🎨 Creativity",
                 info="Higher values = more creative responses"
             )
-            clear_btn = gr.Button("🗑️ Clear Chat", variant="secondary")
-        
-        with gr.Column(scale=3):
-            chat_history = gr.Chatbot(
-                elem_id="chatbot",
-                show_label=False,
-                avatar_images=["👤", "🤖"]
-            )
-            user_input = gr.Textbox(
-                placeholder="Ask Athena anything...",
-                label="Your message",
-                lines=2,
-                max_lines=10
-            )
-            with gr.Row():
-                submit_btn = gr.Button("📤 Send", variant="primary")
-                stats_output = gr.Textbox(
-                    label="Stats", 
-                    interactive=False,
-                    show_label=False,
-                    placeholder="Stats will appear here..."
-                )
     
     # Event handlers
     submit_btn.click(