Update UI layout and overlay visuals

README.md

@@ -9,7 +9,7 @@ Analyze aerial RGB imagery to detect safe drone landing sites. Combines monocula
 </p>
 
 ## What’s inside
-- **Main app (`landing_app.py`)** — runs full inference with adjustable thresholds, overlays, and camera assumptions; requires >8GB VRAM (assuming default 1024px processing resolution); runtime is ~1000ms per image.
+- **Main app (`landing_app.py`)** — runs full inference with adjustable thresholds, overlays, and camera assumptions; requires >8GB VRAM (assuming default 1024 px processing resolution); runtime is ~1000ms per image.
 - **Curated gallery (`demo/curated_app.py`)** — precomputed PNG/JPG/JSON artifacts for fast, zero-GPU browsing.
 
 ## Prereqs

app/safety.py

@@ -113,6 +113,15 @@ class SafetyAnalyzer:
         area_thresh = max(footprint_px * footprint_px // 4, 64)
         num_labels, labels, stats, _ = cv2.connectedComponentsWithStats(roof_mask, connectivity=8)
         refined = np.zeros_like(roof_mask, dtype=bool)
+        depth_norm = (depth - depth.min()) / (np.ptp(depth) + 1e-6)
+        global_mad = np.median(np.abs(depth_norm - np.median(depth_norm))) + 1e-6
+        ring_kernel = cv2.getStructuringElement(
+            cv2.MORPH_ELLIPSE,
+            (
+                max(3, int(round(footprint_px * 0.6)) | 1),
+                max(3, int(round(footprint_px * 0.6)) | 1),
+            ),
+        )
         max_area = max_area_frac * depth_mask.size if max_area_frac > 0 else None
         for i in range(1, num_labels):
             area = stats[i, cv2.CC_STAT_AREA]
@@ -121,7 +130,17 @@ class SafetyAnalyzer:
             if max_area is not None and area > max_area:
                 # Skip overly large blobs (e.g., entire fields) to avoid over-masking
                 continue
-            refined |= labels == i
+            comp_mask = labels == i
+            ring = cv2.dilate(comp_mask.astype(np.uint8), ring_kernel, iterations=1).astype(bool) & (~comp_mask)
+            if not ring.any():
+                continue
+            comp_mean = float(depth_norm[comp_mask].mean())
+            ring_mean = float(depth_norm[ring].mean())
+            prominence = ring_mean - comp_mean
+            min_prominence = max(0.02, 0.5 * global_mad)
+            if prominence < min_prominence or ring_mean <= comp_mean:
+                continue
+            refined |= comp_mask
         return refined if refined.any() else None
 
     def analyze_image(self, image: Image.Image, request: AnalysisRequest) -> AnalysisResult:

app/ui.py

@@ -2,6 +2,7 @@ from __future__ import annotations
 
 from pathlib import Path
 from typing import Dict
+from PIL import Image
 
 import gradio as gr
 
@@ -65,38 +66,33 @@ def _make_request(
 
 def _format_status(summary: AnalysisSummary | None) -> str:
     if not summary:
-        return "**Status:** Awaiting analysis."
-    mask_bits = []
-    for label, enabled, pct in (
-        ("Water", summary.water_mask_enabled, summary.water_mask_pct),
-        ("Road", summary.road_mask_enabled, summary.road_mask_pct),
-        ("Roof", summary.roof_mask_enabled, summary.roof_mask_pct),
-    ):
-        if enabled:
-            pct_text = "n/a" if pct is None else f"{pct:.1f}%"
-            mask_bits.append(f"{label} {pct_text}")
-        else:
-            mask_bits.append(f"{label} off")
-    masks_line = " • ".join(mask_bits)
-    lines = [
-        "**Status**",
-        f"Model: `{summary.model_id}` — Process res: {summary.process_resolution}px — Runtime: {summary.runtime_ms:.0f} ms",
-        f"Footprint: {summary.footprint_m:.1f} m ({summary.footprint_image_px}px image scale)",
-        f"Masks: {masks_line}",
-    ]
-    return "<br/>".join(lines)
+        return "**Status**\nAwaiting analysis."
+    masks_line = " / ".join(
+        f"{label}:{'off' if not enabled else ('n/a' if pct is None else f'{pct:.1f}%')}"
+        for label, enabled, pct in (
+            ("Water", summary.water_mask_enabled, summary.water_mask_pct),
+            ("Road", summary.road_mask_enabled, summary.road_mask_pct),
+            ("Roof", summary.roof_mask_enabled, summary.roof_mask_pct),
+        )
+    )
+    warning_text = ""
+    if summary.warnings:
+        warning_text = "\nWarnings: " + " | ".join(summary.warnings)
+    return (
+        "**Run Status**\n"
+        f"- Model: `{summary.model_id}`\n"
+        f"- Process res: {summary.process_resolution}px; Runtime: {summary.runtime_ms:.0f} ms\n"
+        f"- Footprint: {summary.footprint_m:.1f} m (~{summary.footprint_image_px}px)\n"
+        f"- Safe: {summary.safe_area_pct:.1f}% | Hazard: {summary.hazard_pct:.1f}%\n"
+        f"- Masks: {masks_line}"
+        f"{warning_text}"
+    )
 
 
 def _format_metrics(summary: AnalysisSummary | None) -> str:
     if not summary:
         return "No metrics yet. Run the analyzer to populate this section."
-    lines = [
-        f"**Safe coverage:** {summary.safe_area_pct:.1f}% of frame",
-        f"**Hazard coverage:** {summary.hazard_pct:.1f}%",
-        f"**Landing center (px):** {summary.landing_center_image[0]}, {summary.landing_center_image[1]}",
-        f"**Footprint size:** {summary.footprint_m:.1f} m ≈ {summary.footprint_image_px}px",
-        f"**Effective thresholds:** std ≤ {summary.std_thresh_applied:.4f}, grad ≤ {summary.grad_thresh_applied:.3f}",
-    ]
+    lines = []
     if not summary.used_valid_center:
         lines.append("Warning: No fully safe footprint; showing lowest-variance patch.")
     if summary.warnings:
@@ -110,20 +106,21 @@ def build_ui(analyzer: SafetyAnalyzer | None = None) -> gr.Blocks:
     defaults = DEFAULT_ANALYZER_SETTINGS
     data_inputs = list_all_data_inputs()
 
-    with gr.Blocks(title="Landing Site Safety Analyzer (VISLOC)") as demo:
+    with gr.Blocks(title="Drone Landing Site Safety Analyzer", theme=gr.themes.Base()) as demo:
         gr.Markdown(
-            "## Landing Site Safety Analyzer\n"
-            "Evaluate VISLOC imagery with DepthAnything3 to spot flat, obstacle-free landing sites."
+            "## Drone Landing Site Safety Analyzer\n"
+            "Evaluate aerial imagery to spot flat, obstacle-free landing sites.",
+            elem_classes="tight-title",
         )
         gr.HTML(
-            """
-            <style>
-            #preview-wrap { position: relative; }
-            #preview-wrap .hover-legend {
-                position: absolute;
-                right: 12px;
-                bottom: 12px;
-                background: rgba(0, 0, 0, 0.65);
+                    """
+                    <style>
+                    #preview-wrap { position: relative; }
+                    #preview-wrap .hover-legend {
+                        position: absolute;
+                        right: 12px;
+                        bottom: 12px;
+                        background: rgba(0, 0, 0, 0.65);
                 color: #fff;
                 padding: 8px 10px;
                 border-radius: 10px;
@@ -134,31 +131,22 @@ def build_ui(analyzer: SafetyAnalyzer | None = None) -> gr.Blocks:
                 pointer-events: none;
             }
             #preview-wrap:hover .hover-legend { opacity: 1; }
-            #preview-wrap .hover-legend .row { display: flex; align-items: center; gap: 6px; margin-bottom: 4px; }
-            #preview-wrap .hover-legend .swatch { width: 12px; height: 12px; border-radius: 3px; display: inline-block; }
-            </style>
-            """
-        )
+                    #preview-wrap .hover-legend .row { display: flex; align-items: center; gap: 6px; margin-bottom: 4px; }
+                    #preview-wrap .hover-legend .swatch { width: 12px; height: 12px; border-radius: 3px; display: inline-block; }
+                    </style>
+                    """
+                )
         images_state = gr.State({})
 
         with gr.Row(equal_height=False):
-            with gr.Column(scale=1, min_width=360):
+            with gr.Column(scale=1, min_width=280):
                 input_path = gr.Dropdown(
                     label="Input file",
                     choices=data_inputs,
                     value=data_inputs[0] if data_inputs else "",
                     info="Pick any VISLOC image under data/Image/VISLOC/.",
                 )
-                model_id = gr.Dropdown(
-                    label="DepthAnything3 model",
-                    value=defaults.model_id,
-                    choices=[
-                        "depth-anything/DA3MONO-LARGE",
-                        "depth-anything/DA3METRIC-LARGE",
-                        "depth-anything/DA3NESTED-GIANT-LARGE",
-                    ],
-                    info="Select a pretrained checkpoint.",
-                )
+                model_id = defaults.model_id
                 process_res_cap = gr.Slider(
                     label="Processing max side (px)",
                     value=defaults.process_res_cap,
@@ -191,34 +179,14 @@ def build_ui(analyzer: SafetyAnalyzer | None = None) -> gr.Blocks:
                     step=0.01,
                     info="Lower suppresses slopes/edges; higher tolerates tilt.",
                 )
-                use_water_mask = gr.Checkbox(
-                    label="Exclude water (segmentation)",
-                    value=True,
-                    info="Runs SAM3 segmentation with water prompts.",
-                )
-                water_prompt = gr.Textbox(
-                    label="Water prompt",
-                    value=defaults.water_prompt,
-                    placeholder="e.g., water",
-                )
-                use_road_mask = gr.Checkbox(label="Exclude roads (segmentation)", value=True)
-                road_prompt = gr.Textbox(
-                    label="Road prompt",
-                    value=defaults.road_prompt,
-                    placeholder="e.g., road",
-                )
-                use_tree_mask = gr.Checkbox(label="Exclude trees (segmentation)", value=True)
-                tree_prompt = gr.Textbox(
-                    label="Tree prompt",
-                    value=defaults.tree_prompt,
-                    placeholder="e.g., tree",
-                )
-                use_roof_mask = gr.Checkbox(label="Exclude rooftops (depth-based)", value=True)
                 with gr.Row():
-                    run_btn = gr.Button("Run", variant="primary")
-                    stop_btn = gr.Button("Stop", variant="stop")
+                    use_water_mask = gr.Checkbox(label="Exclude water", value=True, info="Mask water regions.")
+                    use_road_mask = gr.Checkbox(label="Exclude roads", value=True, info="Mask road surfaces.")
+                with gr.Row():
+                    use_tree_mask = gr.Checkbox(label="Exclude trees", value=True, info="Mask trees/foliage.")
+                    use_roof_mask = gr.Checkbox(label="Exclude rooftops", value=True, info="Mask rooftop areas.")
                 with gr.Accordion("Segmentation settings", open=False):
-                    gr.Markdown("Control SAM3/Mask2Former and thresholds.")
+                    gr.Markdown("Control SAM3 and prompts.")
                     segmentation_model_id = gr.Dropdown(
                         label="Segmentation model",
                         value=defaults.segmentation_model_id,
@@ -235,6 +203,21 @@ def build_ui(analyzer: SafetyAnalyzer | None = None) -> gr.Blocks:
                         step=32,
                         info="Largest long-side resolution for running the segmentation model.",
                     )
+                    water_prompt = gr.Textbox(
+                        label="Water prompt",
+                        value=defaults.water_prompt,
+                        placeholder="e.g., water",
+                    )
+                    road_prompt = gr.Textbox(
+                        label="Road prompt",
+                        value=defaults.road_prompt,
+                        placeholder="e.g., road",
+                    )
+                    tree_prompt = gr.Textbox(
+                        label="Tree prompt",
+                        value=defaults.tree_prompt,
+                        placeholder="e.g., tree",
+                    )
                     segmentation_score_thresh = gr.Slider(
                         label="Segmentation score threshold",
                         value=defaults.segmentation_score_thresh,
@@ -286,33 +269,6 @@ def build_ui(analyzer: SafetyAnalyzer | None = None) -> gr.Blocks:
                         info="Lower values avoid visually textured (high-contrast) regions like tracks or debris.",
                     )
                     # Plane removal fixed to least squares; toggle removed.
-                with gr.Accordion("Overlay settings", open=False):
-                    gr.Markdown("Toggle visualization layers.")
-                    base_view = gr.Dropdown(
-                        label="Base view",
-                        value="RGB",
-                        choices=[
-                            "RGB",
-                            "Depth",
-                            "Flatness map (std)",
-                            "Depth gradient",
-                            "Gradient mask",
-                            "Water mask",
-                            "Road mask",
-                            "Tree mask",
-                            "Safety score",
-                            "Safety heatmap overlay",
-                        ],
-                    )
-                    with gr.Row():
-                        heat_on = gr.Checkbox(label="Safety highlight", value=True, info="Show safe landing mask (green).")
-                        hazard_on = gr.Checkbox(label="Hazard highlight", value=False, info="Show hazard mask (red).")
-                    with gr.Row():
-                        water_on = gr.Checkbox(label="Water overlay", value=True, info="Color water masks blue.")
-                        road_on = gr.Checkbox(label="Road overlay", value=True, info="Color road masks orange.")
-                        tree_on = gr.Checkbox(label="Tree overlay", value=True, info="Color tree masks green.")
-                    grad_on = gr.Checkbox(label="Depth gradient", value=False, info="Gradient magnitude overlay.")
-                    spot_on = gr.Checkbox(label="Show landing spot", value=True)
                 with gr.Accordion("Camera settings", open=False):
                     gr.Markdown("Configure capture assumptions for footprint sizing.")
                     altitude_m = gr.Slider(
@@ -329,25 +285,55 @@ def build_ui(analyzer: SafetyAnalyzer | None = None) -> gr.Blocks:
                         maximum=150,
                         step=1,
                     )
-            with gr.Column(scale=2, min_width=520, elem_id="preview-wrap"):
+            with gr.Column(scale=2, min_width=520, elem_id="preview-wrap", elem_classes="preview-col"):
                 main_view = gr.Image(
-                    label="Preview",
-                    height=720,
+                    label="Analyzed",
+                    height=441,
                     elem_id="main-preview",
+                    show_download_button=True,
+                    show_fullscreen_button=False,
+                )
+                orig_view = gr.Image(
+                    label="Original",
+                    height=441,
+                    show_download_button=True,
                     show_fullscreen_button=False,
                 )
                 gr.HTML(
                     """
-                    <div class="hover-legend">
-                      <div class="row"><span class="swatch" style="background: linear-gradient(90deg, #1e0a3c 0%, #fcfecf 100%);"></span><span>Continuous safety gradient</span></div>
-                      <div class="row"><span class="swatch" style="background: #00ff00;"></span><span>Safe outline</span></div>
-                      <div class="row"><span class="swatch" style="background: #007aff;"></span><span>Water hazards</span></div>
-                      <div class="row"><span class="swatch" style="background: #ff6200;"></span><span>Road hazards</span></div>
-                    </div>
+                    <style>
+                    .preview-col { gap: 0 !important; }
+                    .tight-status { margin-top: 0 !important; padding-top: 0 !important; }
+                    .tight-title { margin-bottom: 0 !important; }
+                    </style>
                     """
                 )
-                status_card = gr.Markdown("**Status:** Awaiting analysis.")
-                metrics_card = gr.Markdown("No metrics yet. Run the analyzer to get results.")
+            with gr.Column(scale=1, min_width=220):
+                base_view = gr.Dropdown(
+                    label="Base view",
+                    value="RGB",
+                    choices=[
+                        "RGB",
+                        "Depth",
+                        "Flatness map (std)",
+                        "Depth gradient",
+                        "Gradient mask",
+                        "Water mask",
+                        "Road mask",
+                        "Tree mask",
+                        "Safety score",
+                        "Safety heatmap overlay",
+                    ],
+                )
+                spot_on = gr.Checkbox(label="Show optimal landing spot", value=True, info="Show recommended landing box/marker.")
+                hazard_on = gr.Checkbox(label="Risk highlight", value=True, info="Show depth-based risk map.")
+                hazards_on = gr.Checkbox(label="Segmented hazard highlight", value=True, info="Show segmentation + roof hazards.")
+                grad_on = gr.Checkbox(label="Depth gradient", value=False, info="Gradient magnitude overlay.")
+                with gr.Row():
+                    run_btn = gr.Button("Run", variant="primary")
+                    stop_btn = gr.Button("Stop", variant="stop")
+                status_card = gr.Markdown("**Status:** Awaiting analysis.", elem_classes="tight-status")
+                metrics_card = gr.Markdown("")
 
         def process_any(
             input_path,
@@ -370,15 +356,11 @@ def build_ui(analyzer: SafetyAnalyzer | None = None) -> gr.Blocks:
             segmentation_score_thresh,
             segmentation_mask_thresh,
             coverage_strictness,
-            model_id,
             openness_weight,
             texture_threshold,
             base_view,
-            heat_on,
             hazard_on,
-            water_on,
-            road_on,
-            tree_on,
+            hazards_on,
             grad_on,
             spot_on,
         ):
@@ -422,19 +404,22 @@ def build_ui(analyzer: SafetyAnalyzer | None = None) -> gr.Blocks:
             composed = compose_view(
                 imgs,
                 base_view,
-                heat_on,
+                True,
                 0.2,
                 hazard_on,
                 0.2,
-                water_on,
-                road_on,
-                tree_on,
+                hazards_on,
                 grad_on,
                 False,
                 False,
                 spot_on=spot_on,
             )
-            return imgs, composed, _format_status(summary), _format_metrics(summary)
+            orig = imgs.get("RGB")
+            orig_with_spot = orig
+            if spot_on and imgs.get("Landing spot overlay") is not None and orig is not None:
+                orig_with_spot = Image.alpha_composite(orig.convert("RGBA"), imgs["Landing spot overlay"]).convert("RGB")
+            view = composed
+            return imgs, view, orig_with_spot or orig, _format_status(summary), _format_metrics(summary)
 
         run_inputs = [
             input_path,
@@ -457,15 +442,11 @@ def build_ui(analyzer: SafetyAnalyzer | None = None) -> gr.Blocks:
             segmentation_score_thresh,
             segmentation_mask_thresh,
             coverage_strictness,
-            model_id,
             openness_weight,
             texture_threshold,
             base_view,
-            heat_on,
             hazard_on,
-            water_on,
-            road_on,
-            tree_on,
+            hazards_on,
             grad_on,
             spot_on,
         ]
@@ -473,18 +454,15 @@ def build_ui(analyzer: SafetyAnalyzer | None = None) -> gr.Blocks:
         run_event = run_btn.click(
             fn=process_any,
             inputs=run_inputs,
-            outputs=[images_state, main_view, status_card, metrics_card],
+            outputs=[images_state, main_view, orig_view, status_card, metrics_card],
         )
         stop_btn.click(fn=None, inputs=None, outputs=None, cancels=[run_event])
 
         overlay_inputs = [
             images_state,
             base_view,
-            heat_on,
             hazard_on,
-            water_on,
-            road_on,
-            tree_on,
+            hazards_on,
             grad_on,
             spot_on,
         ]
@@ -492,44 +470,36 @@ def build_ui(analyzer: SafetyAnalyzer | None = None) -> gr.Blocks:
         def update_overlays_only(
             images_state_val,
             base_view_val,
-            heat_on_val,
             hazard_on_val,
-            water_on_val,
-            road_on_val,
-            tree_on_val,
+            hazards_on_val,
             grad_on_val,
             spot_on_val,
         ):
             if not images_state_val:
-                return images_state_val, gr.update(), gr.update(), gr.update()
+                return images_state_val, gr.update(), gr.update(), gr.update(), gr.update()
             composed = compose_view(
                 images_state_val,
                 base_view_val,
-                heat_on_val,
+                True,
                 0.2,
                 hazard_on_val,
                 0.2,
-                water_on_val,
-                road_on_val,
-                tree_on_val,
+                hazards_on_val,
                 grad_on_val,
                 False,
                 False,
                 spot_on_val,
             )
-            return images_state_val, composed, gr.update(), gr.update()
+            return images_state_val, composed, gr.update(), gr.update(), gr.update()
 
         base_view.change(
             fn=update_overlays_only,
             inputs=overlay_inputs,
-            outputs=[images_state, main_view, status_card, metrics_card],
+            outputs=[images_state, main_view, orig_view, status_card, metrics_card],
         )
         overlay_toggle_controls = (
-            heat_on,
             hazard_on,
-            water_on,
-            road_on,
-            tree_on,
+            hazards_on,
             grad_on,
             spot_on,
         )
@@ -537,7 +507,7 @@ def build_ui(analyzer: SafetyAnalyzer | None = None) -> gr.Blocks:
             control.change(
                 fn=update_overlays_only,
                 inputs=overlay_inputs,
-                outputs=[images_state, main_view, status_card, metrics_card],
+                outputs=[images_state, main_view, orig_view, status_card, metrics_card],
             )
         # Opacity sliders removed; overlays now use fixed alpha.
 

app/visualization.py

@@ -10,6 +10,23 @@ from .depth_pipeline import visualize_depth
 GRAD_ALPHA = 0.35
 FLAT_ALPHA = 0.25
 
+
+def _outline_mask(mask: np.ndarray | None) -> np.ndarray:
+    """Compute a 1px outline around a boolean mask without external deps."""
+    if mask is None:
+        return np.zeros((1, 1), dtype=bool)
+    mask_bool = mask.astype(bool)
+    h, w = mask_bool.shape
+    padded = np.pad(mask_bool, 1, mode="edge")
+    dilated = np.zeros_like(mask_bool, dtype=bool)
+    for dy in (-1, 0, 1):
+        for dx in (-1, 0, 1):
+            if dx == 0 and dy == 0:
+                continue
+            dilated |= padded[1 + dy : 1 + dy + h, 1 + dx : 1 + dx + w]
+    border = dilated & (~mask_bool)
+    return border
+
 def make_safety_heatmap(
     rgb: Image.Image,
     safe_mask: np.ndarray,
@@ -23,17 +40,23 @@ def make_safety_heatmap(
 
     h, w = safe.shape
     safe_overlay = np.zeros((h, w, 4), dtype=np.uint8)
-    safe_pixels = safe > 0.0
-    safe_overlay[safe_pixels, 1] = 255
-    safe_overlay[safe_pixels, 3] = 255
+    safe_mask_bool = safe > 0.0
+    # Semi-transparent fill plus thicker outline for visibility (#00BF00) at ~80% alpha
+    safe_overlay[safe_mask_bool, :] = (0, 191, 0, 204)
+    safe_border = _outline_mask(safe_mask_bool)
+    safe_border |= _outline_mask(safe_border)  # thicken outline to ~2px
+    safe_overlay[safe_border, :] = (0, 191, 0, 255)
 
     risk_focus = np.zeros_like(risk)
     risk_focus[risk > risk_threshold] = risk[risk > risk_threshold]
     hazard_intensity = np.where(hazard, np.maximum(risk_focus, 1.0), risk_focus)
     hazard_alpha = (np.clip(hazard_intensity, 0.0, 1.0) * 255).astype(np.uint8)
     hazard_overlay = np.zeros((h, w, 4), dtype=np.uint8)
-    hazard_overlay[..., 0] = 255
+    hazard_overlay[..., 0] = 255  # pure red for depth-based hazards
     hazard_overlay[..., 3] = hazard_alpha
+    hazard_mask_bool = hazard
+    hazard_border = _outline_mask(hazard_mask_bool)
+    hazard_overlay[hazard_border, :] = (255, 0, 0, 255)
 
     safe_img = Image.fromarray(safe_overlay, mode="RGBA").resize(rgb.size, resample=Image.NEAREST)
     hazard_img = Image.fromarray(hazard_overlay, mode="RGBA").resize(rgb.size, resample=Image.NEAREST)
@@ -102,16 +125,53 @@ def build_result_layers(
     roof_mask_img = _mask_to_image(roof_mask)
     tree_mask_img = _mask_to_image(tree_mask)
 
-    def _color_overlay(mask: np.ndarray | None, color: tuple[int, int, int]) -> Image.Image:
+    def _hatched_overlay(
+        mask: np.ndarray | None,
+        color: tuple[int, int, int],
+        alpha: int = 180,
+        hatch_step: int = 8,
+        hatch_thickness: int = 3,
+    ) -> Image.Image:
         if mask is None:
             return Image.new("RGBA", image.size, (0, 0, 0, 0))
-        m = Image.fromarray((mask.astype(np.uint8) * 255)).resize(image.size, resample=Image.NEAREST)
-        rgba = Image.new("RGBA", image.size, color + (255,))
-        return Image.composite(rgba, Image.new("RGBA", image.size, (0, 0, 0, 0)), m)
-
-    water_hazard_overlay = _color_overlay(water_mask, (0, 122, 255))  # blue
-    road_hazard_overlay = _color_overlay(road_mask, (255, 98, 0))  # orange/red
-    tree_hazard_overlay = _color_overlay(tree_mask, (34, 139, 34))  # forest green
+        m = np.array(
+            Image.fromarray((mask.astype(np.uint8) * 255)).resize(image.size, resample=Image.NEAREST)
+        ).astype(bool)
+        overlay = np.zeros((image.height, image.width, 4), dtype=np.uint8)
+        overlay[..., :3] = np.array(color, dtype=np.uint8)
+        overlay[..., 3] = np.where(m, alpha, 0).astype(np.uint8)
+        if hatch_step > 0 and hatch_thickness > 0:
+            xs = np.arange(image.width, dtype=np.int32)
+            ys = np.arange(image.height, dtype=np.int32)
+            grid_x, grid_y = np.meshgrid(xs, ys)
+            stripe = ((grid_x + grid_y) % hatch_step) < hatch_thickness
+            stripe_alpha = (alpha // 3)
+            overlay[..., 3] = np.where(m & stripe, stripe_alpha, overlay[..., 3])
+        return Image.fromarray(overlay, mode="RGBA")
+
+    # Segmentation hazards: black with hatch to separate from depth-risk red.
+    hazard_color = (0, 0, 0)
+    overlays = []
+    for mask, alpha in (
+        (water_mask, 130),
+        (road_mask, 130),
+        (tree_mask, 130),
+        (roof_mask, 150),
+    ):
+        ov = _hatched_overlay(mask, hazard_color, alpha=alpha, hatch_step=24, hatch_thickness=2)
+        overlays.append(ov)
+    water_hazard_overlay, road_hazard_overlay, tree_hazard_overlay, roof_hazard_overlay = overlays
+    for overlay in overlays:
+        mask = np.array(overlay.getchannel("A")) > 0
+        if not mask.any():
+            continue
+        border = _outline_mask(mask)
+        if not border.any():
+            continue
+        arr = np.array(overlay)
+        arr[border, :] = (0, 0, 0, 255)
+        arr[np.logical_and(border, arr[..., 3] > 0), 3] = 255
+        overlay.paste(Image.fromarray(arr, mode="RGBA"))
 
     safe_overlay, hazard_overlay, heat_gray = make_safety_heatmap(image, safe_mask, hazard_mask, risk_map)
     flat_heat_overlay = make_flatness_heatmap(std_map_vis, image.size)
@@ -157,23 +217,23 @@ def build_result_layers(
         cy_draw = int(round(min(max(cy_img, by0), by1)))
     overlay_box = Image.new("RGBA", image.size, (0, 0, 0, 0))
     box_draw = ImageDraw.Draw(overlay_box)
-    fill = (0, 102, 255, 60)
-    outline = (0, 102, 255, 255)
+    fill = (255, 140, 0, 90)  # translucent orange
+    outline = (255, 140, 0, 255)
 
-    # Crosshair sized 3x the landing box for clearer focus.
+    # Crosshair sized 3x the landing box for clearer focus, thicker lines.
     cross_half = int(round(side_img * 1.5))
     hx0 = max(0, cx_draw - cross_half)
     hx1 = min(image.width - 1, cx_draw + cross_half)
     hy0 = max(0, cy_draw - cross_half)
     hy1 = min(image.height - 1, cy_draw + cross_half)
-    cross_width = 4
+    cross_width = 6
     draw.line((hx0, cy_draw, hx1, cy_draw), fill=outline, width=cross_width)
     draw.line((cx_draw, hy0, cx_draw, hy1), fill=outline, width=cross_width)
 
-    box_draw.rectangle((bx0, by0, bx1, by1), fill=fill, outline=outline, width=4)
-    box_draw.line((cx_draw, by0, cx_draw, by1), fill=outline, width=2)
-    box_draw.line((bx0, cy_draw, bx1, cy_draw), fill=outline, width=2)
-    radius = 8
+    box_draw.rectangle((bx0, by0, bx1, by1), fill=fill, outline=outline, width=6)
+    box_draw.line((cx_draw, by0, cx_draw, by1), fill=outline, width=3)
+    box_draw.line((bx0, cy_draw, bx1, cy_draw), fill=outline, width=3)
+    radius = 10
     box_draw.ellipse((cx_draw - radius, cy_draw - radius, cx_draw + radius, cy_draw + radius), fill=outline)
 
     return {
@@ -191,6 +251,7 @@ def build_result_layers(
         "Water hazard overlay": water_hazard_overlay,
         "Road hazard overlay": road_hazard_overlay,
         "Tree hazard overlay": tree_hazard_overlay,
+        "Roof hazard overlay": roof_hazard_overlay,
         "Flatness heatmap overlay": flat_heat_overlay,
         "Safety score": heat_gray,
         "Landing spot overlay": Image.alpha_composite(spot_overlay, overlay_box),
@@ -202,11 +263,9 @@ def compose_view(
     base_view: str,
     heat_on: bool,
     heat_alpha: float,
-    hazard_on: bool,
-    hazard_alpha: float,
-    water_on: bool,
-    road_on: bool,
-    tree_on: bool,
+    risk_on: bool,
+    risk_alpha: float,
+    hazards_on: bool,
     grad_on: bool,
     flat_on: bool,
     flat_heat_on: bool,
@@ -234,45 +293,33 @@ def compose_view(
             safe_rgba.putalpha(Image.fromarray(alpha_channel, mode="L"))
             out = Image.alpha_composite(out, safe_rgba)
 
-    if hazard_on and "Hazard overlay" in images_dict:
+    if risk_on and "Hazard overlay" in images_dict:
         hazard = images_dict.get("Hazard overlay")
         if hazard is not None:
             hazard_rgba = hazard.convert("RGBA")
-            alpha_factor = max(0.0, min(1.0, hazard_alpha))
+            alpha_factor = max(0.0, min(1.0, risk_alpha))
             alpha_channel = np.array(hazard_rgba.getchannel("A"), dtype=np.uint8)
             alpha_channel = (alpha_channel.astype(np.float32) * alpha_factor).astype(np.uint8)
             hazard_rgba.putalpha(Image.fromarray(alpha_channel, mode="L"))
             out = Image.alpha_composite(out, hazard_rgba)
 
-    if water_on and "Water hazard overlay" in images_dict:
-        water = images_dict.get("Water hazard overlay")
-        if water is not None:
-            water_rgba = water.convert("RGBA")
-            alpha_factor = max(0.0, min(1.0, hazard_alpha))
-            alpha_channel = np.array(water_rgba.getchannel("A"), dtype=np.uint8)
-            alpha_channel = (alpha_channel.astype(np.float32) * alpha_factor).astype(np.uint8)
-            water_rgba.putalpha(Image.fromarray(alpha_channel, mode="L"))
-            out = Image.alpha_composite(out, water_rgba)
-
-    if road_on and "Road hazard overlay" in images_dict:
-        road = images_dict.get("Road hazard overlay")
-        if road is not None:
-            road_rgba = road.convert("RGBA")
-            alpha_factor = max(0.0, min(1.0, hazard_alpha))
-            alpha_channel = np.array(road_rgba.getchannel("A"), dtype=np.uint8)
-            alpha_channel = (alpha_channel.astype(np.float32) * alpha_factor).astype(np.uint8)
-            road_rgba.putalpha(Image.fromarray(alpha_channel, mode="L"))
-            out = Image.alpha_composite(out, road_rgba)
-
-    if tree_on and "Tree hazard overlay" in images_dict:
-        tree = images_dict.get("Tree hazard overlay")
-        if tree is not None:
-            tree_rgba = tree.convert("RGBA")
-            alpha_factor = max(0.0, min(1.0, hazard_alpha))
-            alpha_channel = np.array(tree_rgba.getchannel("A"), dtype=np.uint8)
-            alpha_channel = (alpha_channel.astype(np.float32) * alpha_factor).astype(np.uint8)
-            tree_rgba.putalpha(Image.fromarray(alpha_channel, mode="L"))
-            out = Image.alpha_composite(out, tree_rgba)
+    if hazards_on:
+        if "Water hazard overlay" in images_dict:
+            water = images_dict.get("Water hazard overlay")
+            if water is not None:
+                out = Image.alpha_composite(out, water.convert("RGBA"))
+        if "Road hazard overlay" in images_dict:
+            road = images_dict.get("Road hazard overlay")
+            if road is not None:
+                out = Image.alpha_composite(out, road.convert("RGBA"))
+        if "Tree hazard overlay" in images_dict:
+            tree = images_dict.get("Tree hazard overlay")
+            if tree is not None:
+                out = Image.alpha_composite(out, tree.convert("RGBA"))
+        if "Roof hazard overlay" in images_dict:
+            roof = images_dict.get("Roof hazard overlay")
+            if roof is not None:
+                out = Image.alpha_composite(out, roof.convert("RGBA"))
 
     if grad_on and "Depth gradient" in images_dict:
         grad_img = images_dict["Depth gradient"]