Update app.py

app.py

@@ -58,75 +58,85 @@ with gr.Blocks(fill_height=True) as demo:
             </section>
             """
         )
-
         # Main two-column layout
-        gr.HTML("<div style='max-width:1120px;margin:0 auto;'>")
-        with gr.Row(elem_classes=["two-col"], equal_height=True):
-            # Left: input card
-            with gr.Column(scale=3):
-                with gr.Group(elem_classes=["glass-card"]):
-                    card_start()
-                    gr.Markdown(
-                        "#### Text input\n"
-                        "Cebuano only. This tool checks linguistic patterns; it does not verify facts."
-                    )
-                    gr.Markdown(
-                        "> **Example**  \n"
-                        "> “Nakadisubre og milagro nga tambal sa COVID‑19 ang usa ka local doktor, "
-                        "giingon nga walay side effects ug dili kinahanglan og bakuna.”"
-                    )
-                    news_text = gr.Textbox(
-                        lines=7,
-                        label="",
-                        placeholder="Paste Cebuano news text here...",
-                    )
-                    with gr.Row():
-                        analyze_btn = gr.Button(
-                            "Analyze", elem_classes=["btn-primary-custom"]
-                        )
-                        clear_btn = gr.Button(
-                            "Clear", elem_classes=["btn-secondary-custom"]
-                        )
-                    gr.Markdown(
-                        "<span style='font-size:11px;opacity:0.8;'>"
-                        "Tip: Keep inputs under 1,000 characters for faster results."
-                        "</span>",
-                        container=False,
-                    )
-                    card_end()
+gr.HTML("<div style='max-width:1120px;margin:0 auto;'>")
+with gr.Row(elem_classes=["two-col"], equal_height=True):
+    # Left: input card
+    with gr.Column(scale=3):
+        with gr.Group(elem_classes=["glass-card"]):
+            card_start()
+            gr.Markdown(
+                "#### Text input\n"
+                "Cebuano only. This tool checks linguistic patterns; it does not verify facts."
+            )
+            gr.Markdown(
+                "> **Example**  \n"
+                "> “Nakadisubre og milagro nga tambal sa COVID‑19 ang usa ka local doktor, "
+                "giingon nga walay side effects ug dili kinahanglan og bakuna.”"
+            )
+
+            # give the textbox its own margin inside the card
+            gr.HTML("<div style='margin-top:12px;margin-bottom:14px;'>")
+            news_text = gr.Textbox(
+                lines=7,
+                label="",
+                placeholder="Paste Cebuano news text here...",
+            )
+            gr.HTML("</div>")
+
+            with gr.Row():
+                analyze_btn = gr.Button(
+                    "Analyze", elem_classes=["btn-primary-custom"]
+                )
+                clear_btn = gr.Button(
+                    "Clear", elem_classes=["btn-secondary-custom"]
+                )
+            gr.Markdown(
+                "<span style='font-size:11px;opacity:0.8;'>"
+                "Tip: Keep inputs under 1,000 characters for faster results."
+                "</span>",
+                container=False,
+            )
+            card_end()
+
+    # Right: result card
+    with gr.Column(scale=2):
+        with gr.Group(elem_classes=["glass-card"]):
+            card_start()
+            gr.Markdown("#### Result")
+            result_label_html = gr.HTML(
+                '<span class="badge-pill badge-fake">FAKE</span>'
+            )
+            conf_text = gr.HTML(
+                """
+                <div style="display:flex;align-items:flex-end;gap:6px;margin-top:10px;">
+                  <span style="font-size:28px;font-weight:600;" id="conf-val">0.00</span>
+                  <span style="font-size:12px;opacity:0.8;">confidence</span>
+                </div>
+                """
+            )
+
+            # margin around the confidence bar
+            gr.HTML("<div style='margin-top:10px;margin-bottom:10px;'>")
+            conf_bar = gr.HTML(
+                """
+                <div class="conf-bar-bg">
+                  <div class="conf-bar-fill" style="width:0%;"></div>
+                </div>
+                """
+            )
+            gr.HTML("</div>")
+
+            gr.Markdown(
+                "<span style='font-size:11px;opacity:0.85;'>"
+                "Model: CMD‑BERT (fine‑tuned BERT‑base). "
+                "Output: Label and confidence score for the submitted text."
+                "</span>",
+                container=False,
+            )
+            card_end()
+gr.HTML("</div>")
 
-            # Right: result card
-            with gr.Column(scale=2):
-                with gr.Group(elem_classes=["glass-card"]):
-                    card_start()
-                    gr.Markdown("#### Result")
-                    result_label_html = gr.HTML(
-                        '<span class="badge-pill badge-fake">FAKE</span>'
-                    )
-                    conf_text = gr.HTML(
-                        """
-                        <div style="display:flex;align-items:flex-end;gap:6px;margin-top:10px;">
-                          <span style="font-size:28px;font-weight:600;" id="conf-val">0.00</span>
-                          <span style="font-size:12px;opacity:0.8;">confidence</span>
-                        </div>
-                        """
-                    )
-                    conf_bar = gr.HTML(
-                        """
-                        <div class="conf-bar-bg">
-                          <div class="conf-bar-fill" style="width:0%;"></div>
-                        </div>
-                        """
-                    )
-                    gr.Markdown(
-                        "<span style='font-size:11px;opacity:0.85;'>"
-                        "Model: CMD‑BERT (fine‑tuned BERT‑base). "
-                        "Output: Label and confidence score for the submitted text."
-                        "</span>",
-                        container=False,
-                    )
-                    card_end()
-        gr.HTML("</div>")
 
         # backend → UI glue
         def analyze_ui(text):