adjusted width

app.py

@@ -59,7 +59,7 @@ def start_app():
         
         gr.HTML(f"""
             <div class="app-header">
-                <img src="{logo_data_url}" alt="AlpineLLM" style="max-height:10%; width: 800px; margin: 10px auto; display: block;">
+                <img src="{logo_data_url}" alt="AlpineLLM" style="max-height:10%; width: auto; margin: 10px auto; display: block;">
             </div>
             <div class="quick-links">
                 <a href="https://github.com/Borzyszkowski/AlpineLLM" target="_blank">GitHub</a> | <a href="https://huggingface.co/Borzyszkowski/AlpineLLM-Tiny-10M-Base" target="_blank">Model Page</a>

style.py

@@ -3,12 +3,12 @@
 # =========================
 custom_css = """
 body, .gradio-container { font-family: "Noto Sans SC", "Microsoft YaHei", "PingFang SC", sans-serif; }
-.app-header { text-align: center; max-width: 1200px; margin: 0 auto 8px !important; }
+.app-header { text-align: center; max-width: 800px; margin: 0 auto 8px !important; }
 .gradio-container { padding: 4px 0 !important; max-width: 1200px !important; margin: 0 auto !important; }
 .gradio-container [data-testid="tabs"], .gradio-container .tabs { margin-top: 0 !important; }
 .gradio-container [data-testid="tabitem"], .gradio-container .tabitem { padding-top: 4px !important; }
 .gradio-container .wrap { gap: 0 !important; }
-.quick-links { text-align: center; padding: 8px 0; border: 1px solid #e5e7eb; border-radius: 8px; margin: 8px auto; max-width: 1200px; }
+.quick-links { text-align: center; padding: 8px 0; border: 1px solid #e5e7eb; border-radius: 8px; margin: 8px auto; max-width: 800px; }
 .quick-links a { margin: 0 12px; font-size: 14px; font-weight: 600; color: #3b82f6; text-decoration: none; }
 .quick-links a:hover { text-decoration: underline; }
 .prompt-grid { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 6px; }
@@ -18,7 +18,7 @@ body, .gradio-container { font-family: "Noto Sans SC", "Microsoft YaHei", "PingF
 #md_preview_vl, #md_preview_doc { max-height: 540px; min-height: 180px; overflow: auto; scrollbar-gutter: stable both-edges; }
 #md_preview_vl .prose, #md_preview_doc .prose { line-height: 1.7 !important; }
 #md_preview_vl .prose img, #md_preview_doc .prose img { display: block; margin: 0 auto; max-width: 100%; height: auto; }
-.notice { margin: 8px auto 0; max-width: 1200px; padding: 10px 12px; border: 1px solid #e5e7eb; border-radius: 8px; background: #f8fafc; font-size: 14px; line-height: 1.6; }
+.notice { margin: 8px auto 0; max-width: 800px; padding: 10px 12px; border: 1px solid #e5e7eb; border-radius: 8px; background: #f8fafc; font-size: 14px; line-height: 1.6; }
 .notice strong { font-weight: 700; }
 .notice a { color: #3b82f6; text-decoration: none; }
 .notice a:hover { text-decoration: underline; }