Add Inter font and zenlm logo branding

app.py

@@ -336,12 +336,45 @@ def train_model(
         import traceback
         yield from log(f"\n{traceback.format_exc()}")
 
+# Custom CSS for Inter font and branding
+custom_css = """
+@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');
+
+* {
+    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
+}
+
+.logo-header {
+    display: flex;
+    align-items: center;
+    gap: 16px;
+    margin-bottom: 24px;
+}
+
+.logo-header img {
+    height: 48px;
+    width: auto;
+}
+
+h1, h2, h3, h4 {
+    font-weight: 600 !important;
+}
+"""
+
 # Build Gradio Interface
-with gr.Blocks(title="Zen Training Space", theme=gr.themes.Soft()) as demo:
-    gr.Markdown("""
-    # 🧘 Zen Training Space
-    ### Unified Training Platform for All Zen Models
+with gr.Blocks(title="Zen Training Space", css=custom_css, theme=gr.themes.Soft()) as demo:
+    with gr.Row(elem_classes="logo-header"):
+        gr.HTML("""
+        <div style="display: flex; align-items: center; gap: 16px;">
+            <img src="https://zenlm.org/logo.png" alt="Zen LM" style="height: 48px; width: auto;">
+            <div>
+                <h1 style="margin: 0; font-size: 28px; font-weight: 600;">Zen Training Space</h1>
+                <p style="margin: 0; color: #666; font-size: 16px;">Unified Training Platform for All Zen Models</p>
+            </div>
+        </div>
+        """)
     
+    gr.Markdown("""
     Train any Zen model with any dataset combination from HuggingFace.
     All datasets are loaded directly from HF - no local storage needed!
     """)