Update app.py

src/app.py

@@ -375,12 +375,25 @@ CUSTOM_CSS = """
     border: 1px solid #e5e7eb !important;
     color: #111827 !important;
 }
+/* Tighter horizontal spacing between the three boxes in the configuration
+   row (domain group / alpha slider / Detect button) — Gradio's default Row
+   gap reads as loose once all three are stretched to the same height. */
+#controls-row {
+    gap: 0.6rem !important;
+}
+/* #detect-btn's height is set to match the rendered height of its sibling
+   boxes (the domain group and the alpha slider — each a label line plus a
+   control) in this exact row. Gradio's Row(equal_height=True) (set in
+   build_interface) stretches the *wrapper* around the button to match the
+   tallest sibling, but the <button> element itself doesn't inherit that via
+   percentage/flex sizing, so it still needs an explicit height — 5.625rem
+   was measured against this row's actual rendered box height, not guessed. */
 #detect-btn {
     background-color: #fdae6b !important;
     border-color: white !important;
     color: black !important;
     font-weight: 600 !important;
-    height: 4.3rem !important;
+    height: 5.625rem !important;
     font-size: 1.1rem !important;
 }
 #detect-btn:hover {
@@ -483,7 +496,10 @@ def build_interface() -> gr.Blocks:
             show_label=False,
         )
 
-        with gr.Row():
+        # equal_height=True stretches every direct child (the domain group,
+        # the alpha slider, and the Detect button) to the height of the
+        # tallest one, so the three read as a single row of matching boxes.
+        with gr.Row(elem_id="controls-row", equal_height=True):
             with gr.Row(scale=2):
                 # Level 1 + level 2 of the domain hierarchy, grouped together
                 # in their own row so they read as one control cluster even
@@ -497,10 +513,15 @@ def build_interface() -> gr.Blocks:
                     label="Domain",
                     visible=(DEFAULT_DOMAIN_MODE == "Manual"),
                 )
-            detect_btn = gr.Button("🔍 Detect", variant="primary", elem_id="detect-btn", scale=1)
             alpha_slider = gr.Slider(
                 minimum=0.01, maximum=0.2, value=0.05, step=0.005,
-                label="Significance level (α)", scale=1,
+                # min_width keeps "Significance level (α)" on one line —
+                # without it, a narrow flex-basis wraps the label to two
+                # lines and makes this box taller than its siblings.
+                label="Significance level (α)", scale=1, min_width=340,
+            )
+            detect_btn = gr.Button(
+                "🔍 Detect", variant="primary", elem_id="detect-btn", scale=1, min_width=120,
             )
 
         # Hidden by default; `run_detection` toggles it on for the duration of
@@ -516,6 +537,10 @@ def build_interface() -> gr.Blocks:
                 "— please select a domain manually._"
             )
 
+        # Sits between the configuration row above and the verdict card
+        # below, so "how long that took" reads before "what it found".
+        elapsed_caption = gr.Markdown(visible=False)
+
         conclusion_md = gr.Markdown(visible=False, latex_delimiters=LATEX_DELIMITERS)
 
         with gr.Accordion("📋 Interpretation and Suggestions", open=False, visible=False) as interpretation_box:
@@ -523,8 +548,6 @@ def build_interface() -> gr.Blocks:
                 build_interpretation_text(DEFAULT_DOMAIN_MODE), latex_delimiters=LATEX_DELIMITERS,
             )
 
-        elapsed_caption = gr.Markdown(visible=False)
-
         with gr.Column(visible=False) as feedback_section:
             gr.HTML(
                 '<div style="margin-top: 0.6rem;"><strong>📝 Result Feedback</strong>: '