Update app.py

app.py

@@ -603,15 +603,10 @@ def create_interface():
                 display: block !important;
             }
             .container { padding: 10px !important; }
-            .gradio-button { width: 100% !important; }
-            .gradio-textbox { width: 100% !important; }
-            .gradio-audio { width: 100% !important; }
-            .gradio-image { width: 100% !important; }
-            #audio-recorder { width: 100% !important; }
-            #result-image { width: 100% !important; }
-            .gradio-dataframe {
-                overflow-x: auto !important;
-                max-width: 100% !important;
+            .gradio-button { 
+                width: 100% !important; 
+                margin: 5px 0 !important;
+                min-height: 44px !important;
             }
         }
         
@@ -620,38 +615,56 @@ def create_interface():
             #logo-container { 
                 padding: 20px 0;
                 width: 100%;
+                max-width: 800px;
+                margin: 0 auto;
             }
             #logo-image {
                 content: url('/static/DIGITAL_GUTPAN_LOGO_w.png');
                 width: 100%;
                 height: auto;
-                max-width: 600px;
+                max-width: 800px;
                 margin: 0 auto;
                 display: block;
             }
         }
         
         /* 공통 스타일 */
+        #logo-container {
+            background: transparent !important;
+            text-align: center;
+            margin-bottom: 20px;
+        }
+        
+        #logo-image img {
+            width: 100% !important;
+            height: auto !important;
+            object-fit: contain !important;
+        }
+        
+        .gradio-container {
+            margin: 0 auto !important;
+        }
+        
         .gradio-button {
             transition: all 0.3s ease;
         }
         .gradio-button:active {
             transform: scale(0.98);
         }
-        #logo-container {
-            background: transparent !important;
-            text-align: center;
-        }
     """
 
     with gr.Blocks(theme=gr.themes.Soft(), css=css) as app:
         state = gr.State(value=initial_state)
         
-        with gr.Row(elem_id="logo-container"):
-            gr.Image(value="/static/DIGITAL_GUTPAN_LOGO_w.png", 
-                    show_label=False,
-                    interactive=False,
-                    elem_id="logo-image")
+        with gr.Box(elem_id="logo-container"):
+            gr.Image(
+                value="/static/DIGITAL_GUTPAN_LOGO_w.png",
+                show_label=False,
+                interactive=False,
+                elem_id="logo-image",
+                scale=1,  # 스케일 값 추가
+                width="100%"  # 너비 100% 설정
+            )
 
         gr.Markdown("""
         1. 입장 → 2. 청신 → 3. 기원 → 4. 송신