space formatting

app.py

@@ -20,6 +20,9 @@ if logo_path.exists():
     except Exception as e:
         print(f"⚠️ Unable to load logo.png: {e}")
 
+DEFAULT_LOGO_URL = "https://storage.googleapis.com/desivocal-prod/desi-vocal/logo.png"
+LOGO_URL = os.environ.get("STT_LOGO_URL", DEFAULT_LOGO_URL).strip()
+
 # Custom CSS for Ringg branding
 custom_css = """
 .gradio-container {
@@ -30,12 +33,15 @@ custom_css = """
     align-items: center;
     justify-content: center;
     gap: 20px;
-    flex-wrap: wrap;
+    flex-wrap: nowrap;
     padding: 20px;
     background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
     color: white;
     border-radius: 10px;
     margin-bottom: 20px;
+    max-width: 900px;
+    margin-left: auto;
+    margin-right: auto;
 }
 .main-header .main-logo {
     height: 60px;
@@ -56,6 +62,10 @@ custom_css = """
 }
 .main-header .main-text {
     text-align: left;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    min-width: 0;
 }
 .main-header .main-text h1 {
     margin: 0 0 6px;
@@ -63,6 +73,15 @@ custom_css = """
 .main-header .main-text p {
     margin: 0;
 }
+@media (max-width: 640px) {
+    .main-header {
+        flex-wrap: wrap;
+    }
+    .main-header .main-text {
+        text-align: center;
+        width: 100%;
+    }
+}
 .status-dot {
     display: inline-block;
     width: 8px;
@@ -220,11 +239,14 @@ def create_interface():
         title="Ringg STT V0", theme=gr.themes.Soft(), css=custom_css
     ) as demo:
         status_class = "healthy" if health_status["status"] == "healthy" else "error"
-        logo_html = (
-            '<div class="main-logo"><img src="https://storage.googleapis.com/desivocal-prod/desi-vocal/logo.png" width="50" height="50"></div>'
-            if LOGO_BASE64
-            else '<div class="main-logo main-logo--placeholder"></div>'
-        )
+        if LOGO_URL:
+            logo_html = (
+                f'<div class="main-logo"><img src="{LOGO_URL}" alt="Ringg Logo"></div>'
+            )
+        elif LOGO_BASE64:
+            logo_html = f'<div class="main-logo"><img src="data:image/png;base64,{LOGO_BASE64}" alt="Ringg Logo"></div>'
+        else:
+            logo_html = '<div class="main-logo main-logo--placeholder"></div>'
 
         gr.Markdown(f"""
         <div class="main-header">