Force desktop layout with min-width and viewport meta tag modification

app.py

@@ -1212,20 +1212,34 @@ custom_css = """
     min-width: 150px !important;
 }
 
-/* Scale down on mobile to show desktop layout */
+/* Force desktop layout on all screen sizes */
+.gradio-container, .main, .wrap, .contain, .app {
+    min-width: 800px !important;
+    width: 100% !important;
+}
+
+/* Prevent Gradio's mobile responsive behavior */
 @media screen and (max-width: 768px) {
-    .gradio-container {
-        zoom: 0.8;
-        -moz-transform: scale(0.8);
-        -moz-transform-origin: 0 0;
+    .gradio-container, .main, .wrap, .contain, .app {
+        min-width: 800px !important;
     }
-}
 
-@media screen and (max-width: 480px) {
-    .gradio-container {
-        zoom: 0.65;
-        -moz-transform: scale(0.65);
-        -moz-transform-origin: 0 0;
+    /* Force rows to stay horizontal */
+    .gradio-row, .row, .flex-row {
+        flex-direction: row !important;
+        flex-wrap: nowrap !important;
+    }
+
+    /* Force columns to maintain width */
+    .gradio-column, .column, .col {
+        min-width: 300px !important;
+        flex: 1 !important;
+    }
+
+    /* Force radio buttons horizontal */
+    [role="radiogroup"], .radio-group {
+        flex-direction: row !important;
+        flex-wrap: nowrap !important;
     }
 }
 
@@ -1486,6 +1500,17 @@ custom_css = """
 
 custom_js = """
 function() {
+    // Force desktop viewport on mobile
+    var viewport = document.querySelector('meta[name="viewport"]');
+    if (viewport) {
+        viewport.setAttribute('content', 'width=900, initial-scale=0.4, maximum-scale=2.0, user-scalable=yes');
+    } else {
+        var meta = document.createElement('meta');
+        meta.name = 'viewport';
+        meta.content = 'width=900, initial-scale=0.4, maximum-scale=2.0, user-scalable=yes';
+        document.head.appendChild(meta);
+    }
+
     // Add click-to-expand functionality for the plot
     document.addEventListener('click', function(e) {
         const plot = e.target.closest('.expandable-plot');