Update app.py

app.py

@@ -143,9 +143,34 @@ def combine_scores(ela_mean, hf_ratio, noise_incons_score, texture_corr=1.0):
 
 # ====================== Gradio handler ======================
 
+def _result_card(label: str, conf: float) -> str:
+    """
+    Build a clean, single-line verdict card with a subtle progress bar.
+    """
+    pct = max(0.0, min(1.0, conf)) * 100.0
+    color = "#d84a4a" if label.startswith("Likely Manipulated") else "#2e7d32"
+    bar_bg = "#e9ecef"
+    return f"""
+    <div style="max-width:860px;margin:0 auto;">
+      <div style="border:1px solid #e5e7eb;border-radius:14px;padding:18px 20px;background:#fff;
+                  box-shadow: 0 2px 10px rgba(16,24,40,.04);">
+        <div style="display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;">
+          <div style="font-size:18px;color:#111827;font-weight:600;">Deepfake likelihood</div>
+          <div style="font-weight:700;color:{color};">{pct:.1f}% — {label}</div>
+        </div>
+        <div style="width:100%;height:10px;background:{bar_bg};border-radius:999px;overflow:hidden;">
+          <div style="height:100%;width:{pct:.4f}%;background:{color};"></div>
+        </div>
+      </div>
+      <div style="color:#6b7280;font-size:12px;margin-top:10px;text-align:center;">
+        Heuristic detector (no training). Treat as an estimate, not forensic proof.
+      </div>
+    </div>
+    """
+
 def analyze_simple(pil_img: Image.Image):
     if pil_img is None:
-        return "Upload an image."
+        return _result_card("Likely Authentic", 0.0)
 
     # 1) Face crop + normalize
     pil_img = crop_face(pil_img)
@@ -165,16 +190,43 @@ def analyze_simple(pil_img: Image.Image):
     texture_corr = natural_texture_correction(pil_img)
     label, conf = combine_scores(ela_mean, hf_ratio, noi_score, texture_corr)
 
-    return f"Deepfake likelihood: {conf*100:.1f}% — {label}"
+    return _result_card(label, conf)
 
 # ====================== UI ======================
 
-with gr.Blocks(title="Deepfake Detector") as demo:
-    gr.Markdown("Upload an image to get a single likelihood estimate.")
-    inp = gr.Image(type="pil", label="Image")
-    btn = gr.Button("Analyze")
-    out = gr.Markdown()
+CUSTOM_CSS = """
+.gradio-container {max-width: 980px !important;}
+/* Card-like uploader */
+.sleek-card {
+  border: 1px solid #e5e7eb; border-radius: 16px; background: #fff;
+  box-shadow: 0 2px 10px rgba(16,24,40,.04); padding: 18px;
+}
+"""
+
+with gr.Blocks(title="Deepfake Detector", css=CUSTOM_CSS, theme=gr.themes.Soft()) as demo:
+    gr.Markdown(
+        "<h2 style='text-align:center;margin-bottom:6px;'>Deepfake Detector</h2>"
+        "<p style='text-align:center;color:#6b7280;'>Upload an image and get a single, clean likelihood estimate.</p>"
+    )
+
+    with gr.Row():
+        with gr.Column(scale=6, elem_classes=["sleek-card"]):
+            inp = gr.Image(
+                type="pil",
+                label="Upload / Paste Image",
+                sources=["upload", "clipboard", "webcam", "url"],
+                height=420,
+                show_label=True,
+                interactive=True,
+            )
+            btn = gr.Button("Analyze", variant="primary", size="lg")
+
+        with gr.Column(scale=6):
+            out = gr.HTML()
+
     btn.click(analyze_simple, inputs=inp, outputs=out)
+    # Also run immediately when an image is provided (nice UX)
+    inp.change(analyze_simple, inputs=inp, outputs=out)
 
 if __name__ == "__main__":
     demo.launch()