Update app.py

app.py

@@ -1703,6 +1703,76 @@ html, body {
   margin-top: 23px !important;
 }
 
+/* =========================================================
+   GRADIO FLOATING-UI / OUTPUT CLIPPING FIXES
+   - Dropdown menus use floating positioning. backdrop-filter on
+     an ancestor creates a new containing block and can shift the
+     popup by the panel's page offset.
+   - The original app-panel rule also used overflow:hidden, which
+     can clip dropdowns and first-line Markdown headings.
+   ========================================================= */
+.app-panel {
+  overflow: visible !important;
+  backdrop-filter: none !important;
+  -webkit-backdrop-filter: none !important;
+}
+
+#main-tabs,
+#main-tabs [role="tabpanel"],
+#main-tabs .tab-body,
+.model-controls-row,
+.model-control {
+  overflow: visible !important;
+}
+
+.model-controls-row {
+  position: relative !important;
+  z-index: 40 !important;
+}
+
+.model-control {
+  position: relative !important;
+  z-index: 41 !important;
+}
+
+.model-control:focus-within {
+  z-index: 1000 !important;
+}
+
+/* Keep Gradio/Floating-UI dropdown option panels above the rest of the model tab. */
+.gradio-container [role="listbox"] {
+  z-index: 100000 !important;
+}
+
+/* Result Markdown: prevent the first heading (Model evaluation,
+   Baseline comparison, or an agent heading such as ML assessment)
+   from being clipped by the component's top edge. */
+.result-markdown {
+  overflow: visible !important;
+  padding-top: 10px !important;
+  padding-bottom: 4px !important;
+  min-height: 0 !important;
+}
+
+.result-markdown > div,
+.result-markdown .prose,
+.result-markdown [data-testid="markdown"] {
+  overflow: visible !important;
+}
+
+.result-markdown h1,
+.result-markdown h2,
+.result-markdown h3,
+.result-markdown h4,
+.result-markdown h5,
+.result-markdown h6 {
+  margin-top: .35rem !important;
+  margin-bottom: .65rem !important;
+  padding-top: .08em !important;
+  line-height: 1.35 !important;
+  overflow: visible !important;
+}
+
 /* Responsive refinement */
 @media (max-width: 1100px) {
   .hero-signal-grid {
@@ -1832,16 +1902,33 @@ def build_app():
                             with gr.Column(elem_classes=["tab-body"]):
                                 gr.HTML('''<div class="section-head"><div class="section-kicker">Supervised Learning</div><h2>Choose a Target, Algorithm, and Evaluation Setup</h2><p>Build a preprocessing + model pipeline, evaluate it on a holdout split, compare baselines, and inspect generated code.</p></div>''')
 
-                                # Groups the target, problem-type, and algorithm selectors on a single modeling row
-                                with gr.Row():
-                                    target = gr.Dropdown(label="Target column", choices=[], value=None, interactive=True)
+                                # Groups the target, problem-type, and algorithm selectors on a single modeling row.
+                                # The CSS hooks keep Gradio's floating dropdown menus anchored to these controls.
+                                with gr.Row(elem_classes=["model-controls-row"]):
+                                    target = gr.Dropdown(
+                                        label="Target column",
+                                        choices=[],
+                                        value=None,
+                                        interactive=True,
+                                        elem_id="target-column-dropdown",
+                                        elem_classes=["model-control"],
+                                    )
                                     problem_type = gr.Dropdown(
                                         label="Problem type",
                                         choices=["Auto", "classification", "regression"],
                                         value="Auto",
                                         interactive=True,
+                                        elem_id="problem-type-dropdown",
+                                        elem_classes=["model-control"],
+                                    )
+                                    algorithm = gr.Dropdown(
+                                        label="Algorithm",
+                                        choices=ALL_ALGORITHMS,
+                                        value="Auto",
+                                        interactive=True,
+                                        elem_id="algorithm-dropdown",
+                                        elem_classes=["model-control"],
                                     )
-                                    algorithm = gr.Dropdown(label="Algorithm", choices=ALL_ALGORITHMS, value="Auto", interactive=True)
 
                                 # Configures the holdout-size control used by training, comparison, and code generation
                                 test_size = gr.Slider(0.1, 0.4, value=0.2, step=0.05, label="Holdout test size")
@@ -1862,10 +1949,10 @@ def build_app():
                                     code_btn = gr.Button("Generate Pipeline Code", variant="primary", elem_id="code-button")
 
                                 # Creates the components that display model summaries, metrics, importance, comparisons, code, and artifacts
-                                model_summary = gr.Markdown("")
+                                model_summary = gr.Markdown("", elem_id="model-summary", elem_classes=["result-markdown"])
                                 model_metrics = gr.JSON(label="Evaluation metrics")
                                 feature_importance = gr.Dataframe(label="Feature importance / coefficient magnitude", interactive=False, wrap=True, elem_id="feature-importance")
-                                compare_summary = gr.Markdown("")
+                                compare_summary = gr.Markdown("", elem_id="compare-summary", elem_classes=["result-markdown"])
                                 leaderboard = gr.Dataframe(label="Baseline leaderboard", interactive=False, wrap=True, elem_id="leaderboard")
                                 pipeline_code = gr.Code(label="Selected algorithm pipeline", language="python", lines=30)
                                 model_artifact = gr.File(label="Trained pipeline artifact (.joblib)", interactive=False)
@@ -1884,7 +1971,7 @@ def build_app():
                                 )
                                 # Creates the agent execution button and result components for answers, code, and tool traces
                                 agent_btn = gr.Button("Run Machine Learning Agent", variant="primary", elem_id="agent-button")
-                                agent_answer = gr.Markdown("")
+                                agent_answer = gr.Markdown("", elem_id="agent-answer", elem_classes=["result-markdown"])
                                 with gr.Tabs(elem_classes=["result-tabs"]):
                                     with gr.Tab("Recommended Pipeline"):
                                         agent_code = gr.Code(label="Generated Python", language="python", lines=28)