feat: Add nnUNet integration, Dice metrics, and split INFO panel with overlap viewer

- Add nnUNet v2 wrapper (nnunet_wrapper.py) for brain lesion segmentation
- Register nnUNet and fix unet3d-brain-tumor model in registry
- Add Dice score, IoU, sensitivity, precision metrics computation
- Add GT upload endpoint and metrics API endpoints
- Split INFO panel: left (metrics), right (mask comparison viewer)
- Overlap viewer shows TP (green), FP (red), FN (blue) visualization
- Add scroll-based slice navigation for overlap viewer
- Set 3D U-Net (Baseline) as default model selection
- Reset mask/metrics/overlap when uploading new volume
- Update README with local run instructions

README.md

@@ -363,3 +363,176 @@ Key endpoints:
 - `POST /refine` – Refine segmentation with additional prompts
 - `GET /mask/{volume_id}/data` – Download raw mask data
 - `GET /health` – Health check endpoint
+
+---
+
+## 🧬 Integrating Your Own nnUNet Model
+
+This section explains how to integrate a trained nnUNet v2 model into the web application as a baseline model option.
+
+### Prerequisites
+
+1. **Trained nnUNet model**: You need a completed nnUNet v2 training run with:
+   - Code location (for reference): e.g., `/mnt/nvme0n1/Dataset/segmentation/CoreLesion/nnUNet/`
+   - **Checkpoints directory**: e.g., `/mnt/nvme0n1/Dataset/segmentation/CoreLesion/nnUNet_results/`
+
+2. **nnUNet v2 installed**: The nnunetv2 package must be installed in your conda environment
+
+### Step 1: Install nnUNet v2
+
+First, install nnUNet v2 in your conda environment:
+
+```powershell
+# Activate your environment
+conda activate seg_app
+
+# Install nnUNet v2
+pip install nnunetv2
+```
+
+Or uncomment the line in `requirements.txt`:
+
+```pip
+# nnunetv2>=2.2
+```
+
+And run:
+```powershell
+pip install -r requirements.txt
+```
+
+### Step 2: Locate Your nnUNet Checkpoint Path
+
+nnUNet training creates a specific folder structure. You need the path to the **trainer output folder**:
+
+```
+nnUNet_results/
+└── Dataset###_Name/                          # e.g., Dataset001_BrainLesion
+    └── nnUNetTrainer__nnUNetPlans__3d_fullres/   # ← THIS IS THE PATH YOU NEED
+        ├── plans.json                        # Training plans
+        ├── dataset.json                      # Dataset configuration
+        ├── fold_0/
+        │   ├── checkpoint_final.pth          # Model weights
+        │   └── checkpoint_best.pth           # Best validation weights
+        ├── fold_1/
+        │   └── ...
+        └── ...
+```
+
+**Your checkpoint path** should point to the trainer folder, for example:
+```
+/mnt/nvme0n1/Dataset/segmentation/CoreLesion/nnUNet_results/Dataset001_BrainLesion/nnUNetTrainer__nnUNetPlans__3d_fullres
+```
+
+### Step 3: Configure nnUNet in Settings
+
+Edit the file `seg_app/config/settings.py` and update the `NNUNET_CONFIG`:
+
+```python
+# Global nnUNet configuration instance
+NNUNET_CONFIG = nnUNetConfig(
+    # Set the path to your trained nnUNet model folder
+    checkpoint_path="/mnt/nvme0n1/Dataset/segmentation/CoreLesion/nnUNet_results/Dataset001_BrainLesion/nnUNetTrainer__nnUNetPlans__3d_fullres",
+    
+    # Optional: which folds to use for inference
+    # "all" = use all available folds (ensemble), or [0] for single fold
+    use_folds="all",
+    
+    # Optional: test-time augmentation (mirroring)
+    # True = more accurate but slower, False = faster inference
+    use_mirroring=True,
+    
+    # Optional: customize the display name in the UI dropdown
+    display_name="nnU-Net (Brain Lesion)",
+)
+```
+
+### Step 4: Verify the Integration
+
+After configuration, restart the application and verify nnUNet appears in the model dropdown:
+
+```powershell
+# For Gradio UI
+python app.py
+
+# For VTK.js Slicer (FastAPI backend)
+uvicorn seg_app.backend.api:app --reload --port 8000
+```
+
+Open the web interface and check that **"nnU-Net (Brain Lesion)"** appears in the model selection dropdown.
+
+### Step 5: Test Inference
+
+1. Upload a NIfTI volume (`.nii` or `.nii.gz`)
+2. Select **"nnU-Net (Brain Lesion)"** from the model dropdown
+3. Click **"Run Segmentation"**
+4. View the segmentation overlay and volume metrics
+
+### nnUNet Configuration Options
+
+| Option | Default | Description |
+|--------|---------|-------------|
+| `checkpoint_path` | `None` | **Required.** Path to nnUNet trainer output folder |
+| `use_folds` | `"all"` | Which folds to use. `"all"` for ensemble, `[0]` for single fold |
+| `use_mirroring` | `True` | Test-time augmentation. Improves accuracy but ~4x slower |
+| `display_name` | `"nnU-Net (Brain Lesion)"` | Name shown in UI dropdown |
+
+### Advanced: Multiple nnUNet Models
+
+To add multiple nnUNet models for different tasks, you can modify the registration logic in `seg_app/models/nnunet_wrapper.py`. The `register_nnunet()` function can be extended to register multiple models:
+
+```python
+# Example: Register multiple nnUNet models
+def register_nnunet() -> None:
+    from seg_app.inference.model_registry import register_model
+    
+    # Model 1: Brain Lesion
+    brain_config = ModelConfig(
+        model_id="nnunet-brain-lesion",
+        local_path="/path/to/nnUNet_results/DatasetBrain/nnUNetTrainer__nnUNetPlans__3d_fullres",
+        device="cuda",
+    )
+    register_model("nnunet-brain-lesion", nnUNetWrapper, brain_config)
+    
+    # Model 2: Liver (example)
+    liver_config = ModelConfig(
+        model_id="nnunet-liver",
+        local_path="/path/to/nnUNet_results/DatasetLiver/nnUNetTrainer__nnUNetPlans__3d_fullres",
+        device="cuda",
+    )
+    register_model("nnunet-liver", nnUNetWrapper, liver_config)
+```
+
+### Troubleshooting nnUNet Integration
+
+**"nnunetv2 is not installed"**
+```powershell
+pip install nnunetv2
+```
+
+**"plans.json not found"**
+- Ensure `checkpoint_path` points to the trainer folder (not the dataset folder)
+- The path should contain `plans.json` or `nnUNetPlans.json`
+
+**"checkpoint_final.pth not found"**
+- Verify training completed successfully
+- Check if only `checkpoint_best.pth` exists (modify the wrapper to use it)
+
+**"Model not appearing in dropdown"**
+- Check that `checkpoint_path` is not `None` in `NNUNET_CONFIG`
+- Look for warnings in the terminal when starting the app
+
+**Out of memory during inference**
+- Reduce `use_mirroring` to `False` (reduces memory by ~4x)
+- Use fewer folds: `use_folds=[0]` instead of `"all"`
+- Reduce input volume size
+
+### Files Modified for nnUNet Integration
+
+| File | Purpose |
+|------|---------|
+| [seg_app/models/nnunet_wrapper.py](seg_app/models/nnunet_wrapper.py) | nnUNet model wrapper implementing BaseModel interface |
+| [seg_app/config/settings.py](seg_app/config/settings.py) | nnUNet configuration (checkpoint path, inference settings) |
+| [seg_app/inference/model_registry.py](seg_app/inference/model_registry.py) | Registers nnUNet model during lazy initialization |
+| [seg_app/inference/orchestrator.py](seg_app/inference/orchestrator.py) | Adds nnUNet to available models list |
+| [requirements.txt](requirements.txt) | Optional nnunetv2 dependency |

app.py

@@ -131,3 +131,27 @@ if __name__ == "__main__":
             server_port=7869,
             share=False,
         )
+
+
+"""
+
+>>  First Launch API server backend: Start the FastAPI backend with uvicorn
+    # uvicorn seg_app.api.app:app --reload --host 127.0.0.1 --port 8000
+    uvicorn seg_app.backend.api:app --reload --host 127.0.0.1 --port 8000
+    
+>>  Second, Start the FastAPI Frontend:
+    cd seg_app/ui_slicer
+    python serve_frontend.py
+    
+    
+>>  Launch Gradio App for seg_app.
+    python app.py
+    
+# Terminal 1: FastAPI Backend
+uvicorn seg_app.backend.api:app --reload --host 127.0.0.1 --port 8000
+
+# Terminal 2: Frontend Server
+cd seg_app/ui_slicer
+python serve_frontend.py
+
+"""

requirements.txt

@@ -42,3 +42,9 @@ huggingface_hub>=0.20.0,<0.28.0
 # =============================================================================
 einops>=0.6.0
 timm>=0.9.0
+
+# =============================================================================
+# nnUNet v2 (optional - for local nnUNet models)
+# =============================================================================
+# Uncomment to enable nnUNet support:
+# nnunetv2>=2.2

seg_app/backend/api.py

@@ -108,6 +108,30 @@ class AvailableModelsResponse(BaseModel):
     models: List[Dict[str, str]]
 
 
+class MetricsResponse(BaseModel):
+    """Segmentation metrics including Dice score."""
+    volume_id: str
+    has_ground_truth: bool
+    voxel_count: int
+    volume_mm3: float
+    volume_ml: float
+    # Dice metrics (only if ground truth is available)
+    dice_score: Optional[float] = None
+    iou_score: Optional[float] = None
+    sensitivity: Optional[float] = None
+    precision: Optional[float] = None
+    true_positives: Optional[int] = None
+    false_positives: Optional[int] = None
+    false_negatives: Optional[int] = None
+
+
+class GroundTruthUploadResponse(BaseModel):
+    """Response after uploading ground truth mask."""
+    volume_id: str
+    gt_shape: Tuple[int, int, int]
+    message: str = "Ground truth uploaded successfully"
+
+
 # =============================================================================
 # In-Memory State Storage
 # =============================================================================
@@ -120,6 +144,7 @@ class VolumeState:
     spacing: Tuple[float, float, float]
     affine: Optional[np.ndarray] = None
     mask: Optional[np.ndarray] = None
+    ground_truth: Optional[np.ndarray] = None  # For Dice score computation
     last_model_id: Optional[str] = None
     metadata: Dict[str, Any] = field(default_factory=dict)
 
@@ -175,6 +200,17 @@ class StateManager:
             return True
         return False
     
+    def update_ground_truth(
+        self,
+        volume_id: str,
+        ground_truth: np.ndarray,
+    ) -> None:
+        """Update the ground truth mask for a volume."""
+        if volume_id not in self._volumes:
+            raise KeyError(f"Volume not found: {volume_id}")
+        self._volumes[volume_id].ground_truth = ground_truth
+        logger.info(f"Updated ground truth for volume {volume_id}")
+    
     def list_volumes(self) -> List[str]:
         """List all stored volume IDs."""
         return list(self._volumes.keys())
@@ -692,6 +728,181 @@ def create_api_app() -> FastAPI:
             }
         )
     
+    # -------------------------------------------------------------------------
+    # Ground Truth Upload (for Dice score computation)
+    # -------------------------------------------------------------------------
+    
+    @app.post("/ground-truth/{volume_id}", response_model=GroundTruthUploadResponse)
+    async def upload_ground_truth(volume_id: str, file: UploadFile = File(...)):
+        """Upload a ground truth segmentation mask for Dice score computation.
+        
+        The ground truth mask must match the shape of the uploaded volume.
+        Accepts .nii or .nii.gz files.
+        """
+        # Validate volume exists
+        volume_state = _state_manager.get_volume(volume_id)
+        if volume_state is None:
+            raise HTTPException(
+                status_code=404,
+                detail=f"Volume not found: {volume_id}. Please upload volume first."
+            )
+        
+        # Validate file extension
+        filename = file.filename or ""
+        if not (filename.endswith(".nii") or filename.endswith(".nii.gz")):
+            raise HTTPException(
+                status_code=400,
+                detail="Invalid file format. Please upload a NIfTI file (.nii or .nii.gz)"
+            )
+        
+        try:
+            # Save to temp file
+            suffix = ".nii.gz" if filename.endswith(".nii.gz") else ".nii"
+            with tempfile.NamedTemporaryFile(delete=False, suffix=suffix) as tmp:
+                content = await file.read()
+                tmp.write(content)
+                tmp_path = tmp.name
+            
+            # Load with nibabel
+            import nibabel as nib
+            img = nib.load(tmp_path)
+            gt_array = np.asarray(img.dataobj).copy()
+            del img
+            
+            # Clean up temp file
+            try:
+                Path(tmp_path).unlink(missing_ok=True)
+            except PermissionError:
+                logger.warning(f"Could not delete temp file: {tmp_path}")
+            
+            # Handle 4D with trivial dimension
+            if gt_array.ndim == 4 and gt_array.shape[-1] == 1:
+                gt_array = gt_array[..., 0]
+            
+            # Validate shape matches volume
+            if gt_array.shape != volume_state.array.shape:
+                raise HTTPException(
+                    status_code=400,
+                    detail=f"Shape mismatch: ground truth {gt_array.shape} vs volume {volume_state.array.shape}"
+                )
+            
+            # Binarize (any non-zero is foreground)
+            gt_array = (gt_array > 0).astype(np.uint8)
+            
+            # Store ground truth
+            _state_manager.update_ground_truth(volume_id, gt_array)
+            
+            return GroundTruthUploadResponse(
+                volume_id=volume_id,
+                gt_shape=gt_array.shape,
+            )
+            
+        except HTTPException:
+            raise
+        except Exception as e:
+            logger.error(f"Failed to load ground truth: {e}")
+            raise HTTPException(
+                status_code=400,
+                detail=f"Failed to load ground truth: {str(e)}"
+            )
+    
+    # -------------------------------------------------------------------------
+    # Ground Truth Mask Data Endpoint (raw bytes for overlap viewer)
+    # -------------------------------------------------------------------------
+    
+    @app.get("/ground-truth/{volume_id}/data")
+    async def get_ground_truth_data(volume_id: str):
+        """Get raw ground truth mask data as Uint8 array.
+        
+        Returns the ground truth data as a raw binary Uint8Array,
+        suitable for direct use in overlap visualization.
+        """
+        volume_state = _state_manager.get_volume(volume_id)
+        if volume_state is None:
+            raise HTTPException(
+                status_code=404,
+                detail=f"Volume not found: {volume_id}"
+            )
+        
+        if volume_state.ground_truth is None:
+            raise HTTPException(
+                status_code=404,
+                detail=f"No ground truth found for volume {volume_id}"
+            )
+        
+        # Convert to uint8 and return as raw bytes
+        data = volume_state.ground_truth.astype(np.uint8)
+        
+        return Response(
+            content=data.tobytes(),
+            media_type="application/octet-stream",
+            headers={
+                "Content-Disposition": f"attachment; filename=gt_{volume_id}.raw",
+                "X-GT-Shape": ",".join(map(str, volume_state.ground_truth.shape)),
+            }
+        )
+    
+    # -------------------------------------------------------------------------
+    # Metrics Endpoint (including Dice score)
+    # -------------------------------------------------------------------------
+    
+    @app.get("/metrics/{volume_id}", response_model=MetricsResponse)
+    async def get_metrics(volume_id: str):
+        """Get segmentation metrics including Dice score if ground truth is available.
+        
+        Returns volume, voxel count, and overlap metrics (Dice, IoU, etc.)
+        if a ground truth mask has been uploaded.
+        """
+        volume_state = _state_manager.get_volume(volume_id)
+        if volume_state is None:
+            raise HTTPException(
+                status_code=404,
+                detail=f"Volume not found: {volume_id}"
+            )
+        
+        if volume_state.mask is None:
+            raise HTTPException(
+                status_code=400,
+                detail="No segmentation mask found. Run /segment first."
+            )
+        
+        # Basic metrics
+        from seg_app.metrics.segmentation_metrics import (
+            compute_segmentation_metrics,
+            compute_metrics_with_ground_truth,
+        )
+        
+        basic_metrics = compute_segmentation_metrics(
+            volume_state.mask, volume_state.spacing
+        )
+        
+        voxel_count = sum(basic_metrics["voxel_counts"].values())
+        
+        response = MetricsResponse(
+            volume_id=volume_id,
+            has_ground_truth=volume_state.ground_truth is not None,
+            voxel_count=voxel_count,
+            volume_mm3=basic_metrics["total_volume_mm3"],
+            volume_ml=basic_metrics["total_volume_ml"],
+        )
+        
+        # Add Dice metrics if ground truth is available
+        if volume_state.ground_truth is not None:
+            gt_metrics = compute_metrics_with_ground_truth(
+                volume_state.mask,
+                volume_state.ground_truth,
+                volume_state.spacing,
+            )
+            response.dice_score = gt_metrics["dice_score"]
+            response.iou_score = gt_metrics["iou_score"]
+            response.sensitivity = gt_metrics["sensitivity"]
+            response.precision = gt_metrics["precision"]
+            response.true_positives = gt_metrics["true_positives"]
+            response.false_positives = gt_metrics["false_positives"]
+            response.false_negatives = gt_metrics["false_negatives"]
+        
+        return response
+    
     return app
 
 
@@ -704,13 +915,11 @@ if __name__ == "__main__":
     uvicorn.run(app, host="127.0.0.1", port=8000)
 
 
-"""
-Terminal 1 - Start Backend FIRST:
-cd e:\academia\research_projects\web_app
-conda activate seg_app
-uvicorn seg_app.backend.api:app --reload --port 8000
-
-Terminal 2 - Start Frontend SECOND:
-cd e:\academia\research_projects\web_app\seg_app\ui_slicer
-python serve_frontend.py
-"""
+# Terminal 1 - Start Backend FIRST:
+# cd e:/academia/research_projects/web_app
+# conda activate seg_app
+# uvicorn seg_app.backend.api:app --reload --port 8000
+#
+# Terminal 2 - Start Frontend SECOND:
+# cd e:/academia/research_projects/web_app/seg_app/ui_slicer
+# python serve_frontend.py

seg_app/config/settings.py

@@ -76,6 +76,47 @@ class HFHubConfig:
 HF_HUB_CONFIG = HFHubConfig()
 
 
+# =============================================================================
+# nnUNet Configuration
+# =============================================================================
+
+@dataclass
+class nnUNetConfig:
+    """Configuration for nnUNet models.
+    
+    Set checkpoint_path to enable nnUNet in the model dropdown.
+    
+    Attributes:
+        checkpoint_path: Path to the nnUNet training output folder.
+            This should point to the trainer directory, e.g.:
+            /path/to/nnUNet_results/DatasetXXX_Name/nnUNetTrainer__nnUNetPlans__3d_fullres
+        use_folds: Which folds to use for inference.
+            Options: "all" (default), or list of integers [0], [0, 1], etc.
+        use_mirroring: Whether to use test-time augmentation with mirroring.
+            Improves accuracy but increases inference time.
+        display_name: Name shown in the UI model dropdown.
+    """
+    # Path to nnUNet checkpoint folder
+    # Set this to your local nnUNet_results path to enable nnUNet
+    # Example: "/mnt/nvme0n1/Dataset/segmentation/CoreLesion/nnUNet_results/Dataset001_BrainLesion/nnUNetTrainer__nnUNetPlans__3d_fullres"
+    checkpoint_path: Optional[str] = None
+    
+    # Inference settings
+    use_folds: str = "all"  # "all" or specific fold like [0]
+    use_mirroring: bool = True  # Test-time augmentation (slower but more accurate)
+    
+    # Display settings
+    display_name: str = "nnU-Net (Brain Lesion)"
+
+
+# Global nnUNet configuration instance
+# Users should modify this path to point to their trained nnUNet model
+NNUNET_CONFIG = nnUNetConfig(
+    # Uncomment and set this path to enable nnUNet:
+    # checkpoint_path="/mnt/nvme0n1/Dataset/segmentation/CoreLesion/nnUNet_results/Dataset###_Name/nnUNetTrainer__nnUNetPlans__3d_fullres",
+)
+
+
 # =============================================================================
 # Application Settings
 # =============================================================================

seg_app/inference/model_registry.py

@@ -232,4 +232,12 @@ def _ensure_models_registered() -> None:
     from seg_app.models.medical_sam_3d import register_medical_sam_3d
     register_medical_sam_3d()
     
+    # Register nnUNet if configured (local checkpoint required)
+    try:
+        from seg_app.models.nnunet_wrapper import register_nnunet
+        register_nnunet()
+    except Exception as e:
+        import logging
+        logging.getLogger(__name__).debug(f"nnUNet registration skipped: {e}")
+    
     _models_registered = True

seg_app/inference/orchestrator.py

@@ -190,12 +190,24 @@ def get_available_models() -> List[Dict[str, str]]:
     """Get list of available models for brain lesion segmentation.
     
     Returns:
-        List of dicts with 'id' and 'display_name' for each model
+        List of dicts with 'id' and 'display_name' for each model.
+        nnUNet is included only if configured in settings.
     """
-    return [
+    from seg_app.config.settings import NNUNET_CONFIG
+    
+    models = [
         {"id": "medical-sam-3d", "display_name": "Medical SAM 3D (SA-Med3D-140K)"},
         {"id": "unet3d-brain-tumor", "display_name": "3D U-Net (Baseline)"},
     ]
+    
+    # Add nnUNet if checkpoint path is configured
+    if NNUNET_CONFIG.checkpoint_path is not None:
+        models.insert(0, {
+            "id": "nnunet-brain-lesion",
+            "display_name": NNUNET_CONFIG.display_name,
+        })
+    
+    return models
 
 
 def get_task_info(task_name: str) -> Dict[str, Any]:

seg_app/metrics/segmentation_metrics.py

@@ -102,6 +102,144 @@ def compute_segmentation_metrics(
     }
 
 
+def compute_dice_score(
+    prediction: np.ndarray,
+    ground_truth: np.ndarray,
+    smooth: float = 1e-6,
+) -> float:
+    """Compute the Dice similarity coefficient between prediction and ground truth.
+    
+    Dice = 2 * |P ∩ G| / (|P| + |G|)
+    
+    Args:
+        prediction: Predicted binary segmentation mask (D, H, W)
+        ground_truth: Ground truth binary segmentation mask (D, H, W)
+        smooth: Smoothing factor to avoid division by zero
+        
+    Returns:
+        Dice score in range [0, 1], where 1 is perfect overlap
+        
+    Raises:
+        ValueError: If masks have different shapes
+    """
+    if prediction.shape != ground_truth.shape:
+        raise ValueError(
+            f"Shape mismatch: prediction {prediction.shape} vs ground_truth {ground_truth.shape}"
+        )
+    
+    # Binarize masks
+    pred_binary = (prediction > 0).astype(np.float32)
+    gt_binary = (ground_truth > 0).astype(np.float32)
+    
+    # Compute intersection and unions
+    intersection = np.sum(pred_binary * gt_binary)
+    pred_sum = np.sum(pred_binary)
+    gt_sum = np.sum(gt_binary)
+    
+    # Dice formula with smoothing
+    dice = (2.0 * intersection + smooth) / (pred_sum + gt_sum + smooth)
+    
+    return float(dice)
+
+
+def compute_iou_score(
+    prediction: np.ndarray,
+    ground_truth: np.ndarray,
+    smooth: float = 1e-6,
+) -> float:
+    """Compute the Intersection over Union (Jaccard index) between masks.
+    
+    IoU = |P ∩ G| / |P ∪ G|
+    
+    Args:
+        prediction: Predicted binary segmentation mask (D, H, W)
+        ground_truth: Ground truth binary segmentation mask (D, H, W)
+        smooth: Smoothing factor to avoid division by zero
+        
+    Returns:
+        IoU score in range [0, 1], where 1 is perfect overlap
+    """
+    if prediction.shape != ground_truth.shape:
+        raise ValueError(
+            f"Shape mismatch: prediction {prediction.shape} vs ground_truth {ground_truth.shape}"
+        )
+    
+    pred_binary = (prediction > 0).astype(np.float32)
+    gt_binary = (ground_truth > 0).astype(np.float32)
+    
+    intersection = np.sum(pred_binary * gt_binary)
+    union = np.sum(pred_binary) + np.sum(gt_binary) - intersection
+    
+    iou = (intersection + smooth) / (union + smooth)
+    
+    return float(iou)
+
+
+def compute_metrics_with_ground_truth(
+    prediction: np.ndarray,
+    ground_truth: np.ndarray,
+    spacing: Tuple[float, float, float],
+) -> Dict[str, Any]:
+    """Compute comprehensive metrics comparing prediction to ground truth.
+    
+    Args:
+        prediction: Predicted segmentation mask (D, H, W)
+        ground_truth: Ground truth segmentation mask (D, H, W)
+        spacing: Voxel spacing in mm as (depth, height, width)
+        
+    Returns:
+        Dict containing all metrics including Dice, IoU, volumes, etc.
+    """
+    # Basic metrics for prediction
+    pred_metrics = compute_segmentation_metrics(prediction, spacing)
+    gt_metrics = compute_segmentation_metrics(ground_truth, spacing)
+    
+    # Overlap metrics
+    dice = compute_dice_score(prediction, ground_truth)
+    iou = compute_iou_score(prediction, ground_truth)
+    
+    # Additional statistics
+    pred_binary = prediction > 0
+    gt_binary = ground_truth > 0
+    
+    tp = np.sum(pred_binary & gt_binary)  # True positives
+    fp = np.sum(pred_binary & ~gt_binary)  # False positives
+    fn = np.sum(~pred_binary & gt_binary)  # False negatives
+    tn = np.sum(~pred_binary & ~gt_binary)  # True negatives
+    
+    # Derived metrics
+    sensitivity = tp / (tp + fn + 1e-6)  # Recall / TPR
+    specificity = tn / (tn + fp + 1e-6)  # TNR
+    precision = tp / (tp + fp + 1e-6)  # PPV
+    
+    return {
+        # Overlap metrics
+        "dice_score": round(dice, 4),
+        "iou_score": round(iou, 4),
+        
+        # Classification metrics
+        "sensitivity": round(sensitivity, 4),
+        "specificity": round(specificity, 4),
+        "precision": round(precision, 4),
+        
+        # Voxel counts
+        "true_positives": int(tp),
+        "false_positives": int(fp),
+        "false_negatives": int(fn),
+        
+        # Volume metrics
+        "prediction_volume_mm3": pred_metrics["total_volume_mm3"],
+        "ground_truth_volume_mm3": gt_metrics["total_volume_mm3"],
+        "volume_difference_mm3": round(
+            pred_metrics["total_volume_mm3"] - gt_metrics["total_volume_mm3"], 2
+        ),
+        
+        # Metadata
+        "mask_shape": prediction.shape,
+        "spacing_mm": spacing,
+    }
+
+
 def format_metrics_for_display(metrics: Dict[str, Any]) -> Dict[str, Any]:
     """Format metrics dictionary for UI display.
     

seg_app/models/monai_autoseg.py

@@ -344,6 +344,25 @@ def register_monai_models() -> None:
         ),
     )
     
+    # 3D U-Net for brain lesion segmentation (baseline model)
+    register_model(
+        model_id="unet3d-brain-tumor",
+        model_class=MONAIAuto3DSeg,
+        config=ModelConfig(
+            model_id="unet3d-brain-tumor",
+            hf_hub_path="your-org/brain-tumor-model",  # Placeholder HF path
+            device="cuda" if torch.cuda.is_available() else "cpu",
+            preprocessing={
+                "target_spacing": (1.0, 1.0, 1.0),
+                "normalize": True,
+            },
+            postprocessing={
+                "threshold": 0.5,
+                "min_component_size": 50,
+            },
+        ),
+    )
+    
     # Additional models can be registered here
     # register_model(
     #     model_id="monai-auto3dseg-spleen",

seg_app/models/nnunet_wrapper.py

@@ -0,0 +1,399 @@
+"""
+nnUNet model wrapper for brain lesion segmentation.
+
+Provides a standardized BaseModel interface for nnUNet v2 models,
+supporting loading from local checkpoint directories.
+
+nnUNet v2 Reference:
+    https://github.com/MIC-DKFZ/nnUNet
+
+Expected directory structure:
+    nnUNet_results/
+    └── DatasetXXX_Name/
+        └── nnUNetTrainer__nnUNetPlans__3d_fullres/
+            ├── plans.json
+            ├── dataset.json
+            ├── fold_0/
+            │   └── checkpoint_final.pth
+            ├── fold_1/
+            │   └── checkpoint_final.pth
+            └── ...
+
+Usage:
+    config = ModelConfig(
+        model_id="nnunet-brain-lesion",
+        local_path="/path/to/nnUNet_results/Dataset001_BrainLesion/nnUNetTrainer__nnUNetPlans__3d_fullres",
+    )
+    model = nnUNetWrapper(config)
+    model.load()
+    mask = model(volume, spacing=(1.0, 1.0, 1.0))
+"""
+
+import logging
+import os
+import tempfile
+from pathlib import Path
+from typing import Any, Dict, List, Optional, Tuple, Union
+
+import numpy as np
+import torch
+
+from seg_app.models.base import BaseModel, ModelConfig
+
+logger = logging.getLogger(__name__)
+
+
+class nnUNetWrapper(BaseModel):
+    """nnUNet v2 model wrapper implementing the BaseModel interface.
+    
+    This wrapper integrates nnUNet v2's inference API with the seg_app
+    orchestrator pattern. It supports:
+    
+    - Loading from local checkpoint directory
+    - Single-fold or ensemble inference
+    - Automatic preprocessing (handled by nnUNet predictor)
+    - Configurable postprocessing
+    
+    Note:
+        nnUNet handles its own preprocessing (resampling, normalization)
+        based on the plans.json, so preprocess() passes through the volume
+        and postprocess() handles the output conversion.
+    
+    Attributes:
+        predictor: The nnUNet predictor instance (lazy-loaded)
+        use_folds: Which folds to use for inference (default: all available)
+        use_gaussian: Whether to use Gaussian weighting for patch aggregation
+        use_mirroring: Whether to use test-time augmentation with mirroring
+    """
+    
+    def __init__(self, config: ModelConfig):
+        """Initialize nnUNet wrapper.
+        
+        Args:
+            config: Model configuration with local_path pointing to the
+                   trained nnUNet model folder (e.g., nnUNetTrainer__nnUNetPlans__3d_fullres)
+        """
+        super().__init__(config)
+        
+        self.predictor = None
+        
+        # Inference settings (can be overridden via config.preprocessing)
+        preprocessing = config.preprocessing or {}
+        self.use_folds: Union[str, List[int]] = preprocessing.get("use_folds", "all")
+        self.use_gaussian: bool = preprocessing.get("use_gaussian", True)
+        self.use_mirroring: bool = preprocessing.get("use_mirroring", True)
+        self.save_probabilities: bool = preprocessing.get("save_probabilities", False)
+        
+        # Postprocessing settings
+        postprocessing = config.postprocessing or {}
+        self.threshold: float = postprocessing.get("threshold", 0.5)
+        
+        # Cache for input metadata (needed if nnUNet changes spacing)
+        self._original_spacing: Optional[Tuple[float, float, float]] = None
+        self._original_shape: Optional[Tuple[int, int, int]] = None
+        
+    def load(self) -> None:
+        """Load nnUNet model from local checkpoint directory.
+        
+        This initializes the nnUNetPredictor and loads model weights.
+        The predictor handles all internal setup (network architecture,
+        preprocessing pipeline, etc.) based on plans.json.
+        
+        Raises:
+            FileNotFoundError: If local_path doesn't exist
+            ImportError: If nnunetv2 is not installed
+            RuntimeError: If model loading fails
+        """
+        if self._is_loaded:
+            logger.info(f"Model {self.config.model_id} already loaded")
+            return
+        
+        if self.config.local_path is None:
+            raise RuntimeError(
+                f"nnUNet requires a local path to the trained model folder. "
+                f"Set local_path in ModelConfig to the nnUNetTrainer__nnUNetPlans__3d_fullres directory."
+            )
+        
+        model_folder = Path(self.config.local_path)
+        if not model_folder.exists():
+            raise FileNotFoundError(
+                f"nnUNet model folder not found: {model_folder}\n"
+                f"Expected structure: nnUNet_results/DatasetXXX_Name/nnUNetTrainer__nnUNetPlans__3d_fullres/"
+            )
+        
+        # Check for required files
+        plans_file = model_folder / "plans.json"
+        if not plans_file.exists():
+            # Try alternative location
+            plans_file = model_folder / "nnUNetPlans.json"
+        if not plans_file.exists():
+            raise FileNotFoundError(
+                f"plans.json not found in {model_folder}. "
+                f"Ensure this is a valid nnUNet training output folder."
+            )
+        
+        try:
+            from nnunetv2.inference.predict_from_raw_data import nnUNetPredictor
+        except ImportError:
+            raise ImportError(
+                "nnunetv2 is not installed. Install it with:\n"
+                "pip install nnunetv2\n"
+                "Or see: https://github.com/MIC-DKFZ/nnUNet"
+            )
+        
+        logger.info(f"Loading nnUNet model from: {model_folder}")
+        
+        # Initialize predictor
+        self.predictor = nnUNetPredictor(
+            tile_step_size=0.5,
+            use_gaussian=self.use_gaussian,
+            use_mirroring=self.use_mirroring,
+            perform_everything_on_device=True,
+            device=torch.device(self.device),
+            verbose=False,
+            verbose_preprocessing=False,
+            allow_tqdm=False,
+        )
+        
+        # Determine which folds to use
+        if self.use_folds == "all":
+            folds = self._find_available_folds(model_folder)
+        else:
+            folds = self.use_folds
+        
+        if not folds:
+            # Default to fold 0 if no specific folds found
+            folds = [0]
+            logger.warning(f"No fold directories found, defaulting to fold 0")
+        
+        logger.info(f"Using folds: {folds}")
+        
+        # Initialize from trained model folder
+        # This loads plans.json, network architecture, and weights
+        self.predictor.initialize_from_trained_model_folder(
+            model_training_output_dir=str(model_folder),
+            use_folds=folds,
+            checkpoint_name="checkpoint_final.pth",  # or "checkpoint_best.pth"
+        )
+        
+        self._is_loaded = True
+        logger.info(f"nnUNet model loaded successfully on {self.device}")
+    
+    def _find_available_folds(self, model_folder: Path) -> List[int]:
+        """Find available fold directories in the model folder.
+        
+        Args:
+            model_folder: Path to nnUNet training output
+            
+        Returns:
+            List of fold numbers (e.g., [0, 1, 2, 3, 4])
+        """
+        folds = []
+        for item in model_folder.iterdir():
+            if item.is_dir() and item.name.startswith("fold_"):
+                try:
+                    fold_num = int(item.name.split("_")[1])
+                    # Check if checkpoint exists
+                    if (item / "checkpoint_final.pth").exists():
+                        folds.append(fold_num)
+                    elif (item / "checkpoint_best.pth").exists():
+                        folds.append(fold_num)
+                except (ValueError, IndexError):
+                    continue
+        return sorted(folds)
+    
+    def preprocess(
+        self,
+        volume: np.ndarray,
+        spacing: Optional[Tuple[float, float, float]] = None,
+    ) -> torch.Tensor:
+        """Prepare volume for nnUNet inference.
+        
+        Note: nnUNet's predictor handles its own preprocessing internally,
+        so this method mainly stores metadata and prepares the volume format.
+        
+        Args:
+            volume: 3D numpy array with shape (D, H, W)
+            spacing: Voxel spacing in mm as (depth, height, width)
+            
+        Returns:
+            Volume as tensor (nnUNet expects numpy, but we follow interface)
+        """
+        # Store original metadata for postprocessing
+        self._original_shape = volume.shape
+        self._original_spacing = spacing
+        
+        # nnUNet expects (C, D, H, W) where C is modality/channel
+        # For single-modality MRI, add channel dimension
+        if volume.ndim == 3:
+            volume = volume[np.newaxis, ...]  # (1, D, H, W)
+        
+        # Return as tensor to match interface (but nnUNet will work with numpy)
+        tensor = torch.from_numpy(volume.astype(np.float32))
+        return tensor.to(self.device)
+    
+    def predict(
+        self,
+        tensor: torch.Tensor,
+        prompts: Optional[Any] = None,
+    ) -> torch.Tensor:
+        """Run nnUNet inference.
+        
+        Args:
+            tensor: Preprocessed volume tensor with shape (1, D, H, W)
+            prompts: Not used for nnUNet (ignored with warning)
+            
+        Returns:
+            Segmentation output tensor
+            
+        Raises:
+            RuntimeError: If model not loaded
+        """
+        if not self._is_loaded or self.predictor is None:
+            raise RuntimeError("Model not loaded. Call load() first.")
+        
+        if prompts is not None:
+            logger.warning(
+                "nnUNet does not support interactive prompts. Ignoring provided prompts. "
+                "Use Medical SAM 3D for prompt-based refinement."
+            )
+        
+        # Convert back to numpy for nnUNet (it works with numpy internally)
+        volume_np = tensor.cpu().numpy()  # (1, D, H, W)
+        
+        # Prepare properties dict for nnUNet
+        # nnUNet expects spacing in (x, y, z) = (W, H, D) order
+        if self._original_spacing is not None:
+            # Input spacing is (D, H, W), nnUNet wants (W, H, D)
+            spacing_xyz = self._original_spacing[::-1]  # Reverse order
+        else:
+            # Default to 1mm isotropic if not provided
+            spacing_xyz = (1.0, 1.0, 1.0)
+            logger.warning("No spacing provided, using 1mm isotropic")
+        
+        properties = {
+            "spacing": list(spacing_xyz),
+        }
+        
+        # Run prediction using nnUNet's predict_single_npy_array
+        # This handles all internal preprocessing, sliding window, and postprocessing
+        with torch.inference_mode():
+            segmentation = self.predictor.predict_single_npy_array(
+                input_image=volume_np,
+                image_properties=properties,
+                segmentation_previous_stage=None,
+                output_file_truncated=None,
+                save_or_return_probabilities=self.save_probabilities,
+            )
+        
+        # Convert result to tensor
+        if isinstance(segmentation, tuple):
+            # If save_probabilities=True, returns (segmentation, probabilities)
+            segmentation = segmentation[0]
+        
+        return torch.from_numpy(segmentation.astype(np.float32))
+    
+    def postprocess(
+        self,
+        tensor: torch.Tensor,
+        original_shape: Tuple[int, int, int],
+    ) -> np.ndarray:
+        """Postprocess nnUNet output.
+        
+        nnUNet typically outputs integer labels, so minimal postprocessing
+        is needed. This method ensures the output is a binary mask and
+        optionally resamples to the original shape if nnUNet changed it.
+        
+        Args:
+            tensor: Model output tensor
+            original_shape: Original volume shape (D, H, W)
+            
+        Returns:
+            Binary segmentation mask as numpy array
+        """
+        mask = tensor.cpu().numpy()
+        
+        # nnUNet outputs integer labels (0 = background, 1+ = foreground classes)
+        # For binary segmentation, threshold at 0.5 if probabilities,
+        # or take any non-zero value as foreground
+        if mask.dtype == np.float32 or mask.dtype == np.float64:
+            # Probability output
+            mask = (mask > self.threshold).astype(np.uint8)
+        else:
+            # Integer label output - binarize (any label > 0 is foreground)
+            mask = (mask > 0).astype(np.uint8)
+        
+        # Ensure output matches original shape
+        if mask.shape != original_shape:
+            # nnUNet may change shape due to resampling
+            # Use scipy to resample back
+            from scipy.ndimage import zoom
+            
+            zoom_factors = tuple(
+                o / m for o, m in zip(original_shape, mask.shape)
+            )
+            mask = zoom(mask.astype(np.float32), zoom_factors, order=0) > 0.5
+            mask = mask.astype(np.uint8)
+        
+        return mask
+
+
+def register_nnunet() -> None:
+    """Register nnUNet model in the model registry.
+    
+    This function is called by the model registry during lazy initialization.
+    It registers the nnUNet wrapper with the configured checkpoint path.
+    """
+    from seg_app.inference.model_registry import register_model
+    from seg_app.config.settings import NNUNET_CONFIG
+    
+    # Only register if nnUNet checkpoint path is configured
+    if NNUNET_CONFIG.checkpoint_path is None:
+        logger.warning(
+            "nnUNet checkpoint path not configured. "
+            "Set NNUNET_CONFIG.checkpoint_path in settings.py to enable nnUNet."
+        )
+        return
+    
+    config = ModelConfig(
+        model_id="nnunet-brain-lesion",
+        local_path=NNUNET_CONFIG.checkpoint_path,
+        device="cuda" if torch.cuda.is_available() else "cpu",
+        preprocessing={
+            "use_folds": NNUNET_CONFIG.use_folds,
+            "use_gaussian": True,
+            "use_mirroring": NNUNET_CONFIG.use_mirroring,
+        },
+        postprocessing={
+            "threshold": 0.5,
+        },
+    )
+    
+    register_model("nnunet-brain-lesion", nnUNetWrapper, config)
+    logger.info(f"Registered nnUNet model: nnunet-brain-lesion")
+
+
+# Convenience function for direct testing
+def create_nnunet_model(checkpoint_path: str, device: str = "cuda") -> nnUNetWrapper:
+    """Create an nnUNet model instance for testing.
+    
+    Args:
+        checkpoint_path: Path to nnUNet training output folder
+        device: Device to load model on
+        
+    Returns:
+        Loaded nnUNet model ready for inference
+        
+    Example:
+        >>> model = create_nnunet_model("/path/to/nnUNet_results/Dataset001/nnUNetTrainer__nnUNetPlans__3d_fullres")
+        >>> model.load()
+        >>> mask = model(volume, spacing=(1.0, 1.0, 1.0))
+    """
+    config = ModelConfig(
+        model_id="nnunet-test",
+        local_path=checkpoint_path,
+        device=device,
+    )
+    model = nnUNetWrapper(config)
+    model.load()
+    return model

seg_app/ui_slicer/api-client.js

@@ -192,6 +192,64 @@ class ApiClient {
         }
         return await response.json();
     }
+
+    /**
+     * Upload ground truth mask for Dice score computation
+     * @param {string} volumeId - The volume ID
+     * @param {File} file - The ground truth NIfTI file
+     * @returns {Promise<{volume_id: string, gt_shape: number[], message: string}>}
+     */
+    async uploadGroundTruth(volumeId, file) {
+        const formData = new FormData();
+        formData.append('file', file);
+
+        const response = await fetch(`${this.baseUrl}/ground-truth/${volumeId}`, {
+            method: 'POST',
+            body: formData
+        });
+
+        if (!response.ok) {
+            const error = await response.json();
+            throw new Error(error.detail || `Ground truth upload failed: ${response.status}`);
+        }
+
+        return await response.json();
+    }
+
+    /**
+     * Get segmentation metrics including Dice score
+     * @param {string} volumeId - The volume ID
+     * @returns {Promise<{volume_id: string, has_ground_truth: boolean, voxel_count: number, volume_mm3: number, dice_score?: number, iou_score?: number, sensitivity?: number, precision?: number}>}
+     */
+    async getMetrics(volumeId) {
+        const response = await fetch(`${this.baseUrl}/metrics/${volumeId}`);
+        
+        if (!response.ok) {
+            const error = await response.json();
+            throw new Error(error.detail || `Failed to get metrics: ${response.status}`);
+        }
+
+        return await response.json();
+    }
+
+    /**
+     * Get ground truth mask data as Uint8Array (raw bytes)
+     * @param {string} volumeId - The volume ID
+     * @returns {Promise<ArrayBuffer|null>}
+     */
+    async getGroundTruthData(volumeId) {
+        const response = await fetch(`${this.baseUrl}/ground-truth/${volumeId}/data`);
+        
+        if (!response.ok) {
+            if (response.status === 404) {
+                return null; // No GT available
+            }
+            const error = await response.json();
+            throw new Error(error.detail || `Failed to get ground truth: ${response.status}`);
+        }
+
+        return await response.arrayBuffer();
+    }
 }
 
 // Singleton instance

seg_app/ui_slicer/app.js

@@ -64,7 +64,11 @@ async function loadModels() {
         const select = document.getElementById('model-select');
         select.innerHTML = '';
         
-        models.forEach((model, index) => {
+        // Find the 3D U-Net baseline model to set as default
+        const defaultModelId = 'unet3d-brain-tumor';
+        let defaultFound = false;
+        
+        models.forEach((model) => {
             const option = document.createElement('option');
             // Handle both 'id' and 'model_id' from API
             const modelId = model.id || model.model_id;
@@ -72,12 +76,20 @@ async function loadModels() {
             option.textContent = model.display_name;
             select.appendChild(option);
             
-            // Select first model by default
-            if (index === 0) {
+            // Select 3D U-Net (Baseline) as default
+            if (modelId === defaultModelId) {
                 appState.set('selectedModel', modelId);
+                select.value = modelId;
+                defaultFound = true;
             }
         });
         
+        // Fallback to first model if default not found
+        if (!defaultFound && models.length > 0) {
+            const firstModelId = models[0].id || models[0].model_id;
+            appState.set('selectedModel', firstModelId);
+        }
+        
         select.disabled = false;
         updateModelInfo();
     } catch (error) {
@@ -104,6 +116,9 @@ async function handleVolumeUpload(file) {
     showLoading('Uploading volume...');
     
     try {
+        // Reset previous state (GT, metrics, overlap viewer)
+        resetMaskAndMetrics();
+        
         // Upload to backend
         const response = await apiClient.uploadVolume(file);
         
@@ -194,11 +209,17 @@ async function runSegmentation() {
             const shape = appState.get('volumeShape');
             const spacing = appState.get('volumeSpacing');
             mprViewer.loadMask(maskData, shape, spacing);
+            
+            // Update overlap visualization
+            renderOverlapCanvas();
         }
         
         hideLoading();
         showToast('Success', `Segmentation complete (${response.model_id})`, 'success');
         
+        // Fetch and display metrics
+        await updateMetricsDisplay();
+        
     } catch (error) {
         hideLoading();
         console.error('Segmentation failed:', error);
@@ -236,11 +257,17 @@ async function runRefinement() {
             const shape = appState.get('volumeShape');
             const spacing = appState.get('volumeSpacing');
             mprViewer.loadMask(maskData, shape, spacing);
+            
+            // Update overlap visualization
+            renderOverlapCanvas();
         }
         
         hideLoading();
         showToast('Success', `Refinement complete (${response.model_id})`, 'success');
         
+        // Fetch and display metrics
+        await updateMetricsDisplay();
+        
     } catch (error) {
         hideLoading();
         console.error('Refinement failed:', error);
@@ -248,6 +275,324 @@ async function runRefinement() {
     }
 }
 
+// ============ Ground Truth & Metrics ============
+
+async function handleGroundTruthUpload(file) {
+    const volumeId = appState.get('volumeId');
+    if (!volumeId) {
+        showToast('Warning', 'Please upload a volume first', 'info');
+        return;
+    }
+    
+    showLoading('Uploading ground truth...');
+    
+    try {
+        const response = await apiClient.uploadGroundTruth(volumeId, file);
+        
+        // Update GT status
+        document.getElementById('gt-status').textContent = 'Loaded ✓';
+        document.getElementById('gt-status').style.color = 'var(--success-color)';
+        
+        // Fetch the GT mask data for overlap visualization
+        const gtArrayBuffer = await apiClient.getGroundTruthData(volumeId);
+        const gtMaskData = new Uint8Array(gtArrayBuffer);
+        appState.setGroundTruth(gtMaskData);
+        
+        // Render overlap canvas
+        renderOverlapCanvas();
+        
+        hideLoading();
+        showToast('Success', `Ground truth loaded: ${response.gt_shape.join('×')}`, 'success');
+        
+        // If we have a mask, update metrics to show Dice
+        if (appState.get('maskData')) {
+            await updateMetricsDisplay();
+        }
+        
+    } catch (error) {
+        hideLoading();
+        console.error('Ground truth upload failed:', error);
+        showToast('Error', error.message, 'error');
+    }
+}
+
+async function updateMetricsDisplay() {
+    const volumeId = appState.get('volumeId');
+    if (!volumeId) return;
+    
+    try {
+        const metrics = await apiClient.getMetrics(volumeId);
+        
+        // Update volume display
+        const volumeEl = document.getElementById('mask-volume');
+        if (volumeEl) {
+            volumeEl.textContent = `${metrics.volume_ml.toFixed(2)} mL`;
+        }
+        
+        // Update Dice metrics if ground truth is available
+        if (metrics.has_ground_truth) {
+            document.getElementById('gt-status').textContent = 'Loaded ✓';
+            document.getElementById('gt-status').style.color = 'var(--success-color)';
+            
+            // Dice score with color coding
+            const diceEl = document.getElementById('dice-score');
+            if (diceEl && metrics.dice_score !== null) {
+                const dice = metrics.dice_score;
+                diceEl.textContent = dice.toFixed(4);
+                // Color code: green > 0.7, yellow 0.5-0.7, red < 0.5
+                if (dice >= 0.7) {
+                    diceEl.style.color = 'var(--success-color)';
+                } else if (dice >= 0.5) {
+                    diceEl.style.color = 'var(--warning-color)';
+                } else {
+                    diceEl.style.color = 'var(--error-color)';
+                }
+            }
+            
+            const iouEl = document.getElementById('iou-score');
+            if (iouEl && metrics.iou_score !== null) {
+                iouEl.textContent = metrics.iou_score.toFixed(4);
+            }
+            
+            const sensEl = document.getElementById('sensitivity');
+            if (sensEl && metrics.sensitivity !== null) {
+                sensEl.textContent = metrics.sensitivity.toFixed(4);
+            }
+            
+            const precEl = document.getElementById('precision-score');
+            if (precEl && metrics.precision !== null) {
+                precEl.textContent = metrics.precision.toFixed(4);
+            }
+        } else {
+            // No ground truth
+            document.getElementById('dice-score').textContent = '-';
+            document.getElementById('iou-score').textContent = '-';
+            document.getElementById('sensitivity').textContent = '-';
+            document.getElementById('precision-score').textContent = '-';
+        }
+        
+    } catch (error) {
+        console.error('Failed to fetch metrics:', error);
+    }
+}
+
+/**
+ * Reset mask, ground truth, metrics display, and overlap viewer
+ * Called when uploading a new volume
+ */
+function resetMaskAndMetrics() {
+    // Clear state
+    appState.clearMask();
+    appState.clearGroundTruth();
+    
+    // Reset GT status indicator
+    const gtStatus = document.getElementById('gt-status');
+    if (gtStatus) {
+        gtStatus.textContent = 'Not loaded';
+        gtStatus.style.color = '';
+    }
+    
+    // Reset metrics display
+    const volumeEl = document.getElementById('mask-volume');
+    if (volumeEl) volumeEl.textContent = '-';
+    
+    const diceEl = document.getElementById('dice-score');
+    if (diceEl) {
+        diceEl.textContent = '-';
+        diceEl.style.color = '';
+    }
+    
+    const iouEl = document.getElementById('iou-score');
+    if (iouEl) iouEl.textContent = '-';
+    
+    const sensEl = document.getElementById('sensitivity');
+    if (sensEl) sensEl.textContent = '-';
+    
+    const precEl = document.getElementById('precision-score');
+    if (precEl) precEl.textContent = '-';
+    
+    // Reset overlap viewer
+    const placeholder = document.getElementById('overlap-placeholder');
+    if (placeholder) placeholder.style.display = '';
+    
+    const sliceIndicator = document.getElementById('overlap-slice-indicator');
+    if (sliceIndicator) sliceIndicator.style.display = 'none';
+    
+    const sliceLabel = document.getElementById('overlap-slice-num');
+    if (sliceLabel) sliceLabel.textContent = '-';
+    
+    // Clear overlap canvas
+    const canvas = document.getElementById('overlap-canvas');
+    if (canvas) {
+        const ctx = canvas.getContext('2d');
+        ctx.fillStyle = '#1a1a2e';
+        ctx.fillRect(0, 0, canvas.width, canvas.height);
+    }
+    
+    // Clear mask from viewer
+    mprViewer.clearMask();
+}
+
+// ============ Overlap Visualization ============
+
+/**
+ * Render overlap canvas showing TP/FP/FN comparison between prediction and ground truth
+ * Colors: TP=green, FP=red, FN=blue, Pred-only (no GT)=orange
+ */
+function renderOverlapCanvas() {
+    const canvas = document.getElementById('overlap-canvas');
+    const container = document.getElementById('overlap-canvas-container');
+    if (!canvas || !container) return;
+    
+    const ctx = canvas.getContext('2d');
+    const maskData = appState.get('maskData');
+    const gtMaskData = appState.get('gtMaskData');
+    const volumeShape = appState.get('volumeShape');
+    
+    // Get container size and set canvas to match
+    const rect = container.getBoundingClientRect();
+    const width = Math.floor(rect.width);
+    const height = Math.floor(rect.height);
+    
+    if (width === 0 || height === 0) return;
+    
+    canvas.width = width;
+    canvas.height = height;
+    
+    // Clear canvas
+    ctx.fillStyle = '#1a1a2e';
+    ctx.fillRect(0, 0, width, height);
+    
+    // Check if we have any data to display
+    if (!volumeShape || !maskData) {
+        ctx.fillStyle = '#666';
+        ctx.font = '12px sans-serif';
+        ctx.textAlign = 'center';
+        ctx.fillText('No segmentation loaded', width / 2, height / 2);
+        return;
+    }
+    
+    const [D, H, W] = volumeShape;  // D=depth, H=height, W=width
+    const sliceIndex = appState.get('overlapSliceIndex');
+    
+    // Create image data at native resolution
+    const imageData = ctx.createImageData(D, H);
+    const pixels = imageData.data;
+    
+    // Color definitions (RGBA)
+    const colors = {
+        TP: [76, 175, 80, 220],    // Green - True Positive
+        FP: [244, 67, 54, 220],    // Red - False Positive
+        FN: [33, 150, 243, 220],   // Blue - False Negative
+        PRED_ONLY: [255, 152, 0, 220],  // Orange - Prediction only (no GT available)
+        BG: [26, 26, 46, 255]     // Dark background
+    };
+    
+    // Iterate through slice pixels
+    for (let d = 0; d < D; d++) {
+        for (let h = 0; h < H; h++) {
+            // Volume index: (d, h, w) where w is the slice index
+            const volIdx = d * H * W + h * W + sliceIndex;
+            
+            const pred = maskData[volIdx] > 0;
+            const gt = gtMaskData ? gtMaskData[volIdx] > 0 : null;
+            
+            // Canvas pixel index: transposed for correct orientation
+            const canvasIdx = (h * D + d) * 4;
+            
+            let color;
+            if (gt === null) {
+                // No ground truth available
+                color = pred ? colors.PRED_ONLY : colors.BG;
+            } else {
+                // Ground truth available - show TP/FP/FN
+                if (pred && gt) {
+                    color = colors.TP;  // True Positive
+                } else if (pred && !gt) {
+                    color = colors.FP;  // False Positive
+                } else if (!pred && gt) {
+                    color = colors.FN;  // False Negative
+                } else {
+                    color = colors.BG;  // True Negative (background)
+                }
+            }
+            
+            pixels[canvasIdx] = color[0];     // R
+            pixels[canvasIdx + 1] = color[1]; // G
+            pixels[canvasIdx + 2] = color[2]; // B
+            pixels[canvasIdx + 3] = color[3]; // A
+        }
+    }
+    
+    // Create temp canvas for scaling
+    const tempCanvas = document.createElement('canvas');
+    tempCanvas.width = D;
+    tempCanvas.height = H;
+    tempCanvas.getContext('2d').putImageData(imageData, 0, 0);
+    
+    // Scale to fit canvas while maintaining aspect ratio
+    const aspect = D / H;
+    const canvasAspect = width / height;
+    
+    let displayW, displayH, offsetX, offsetY;
+    if (canvasAspect > aspect) {
+        displayH = height;
+        displayW = displayH * aspect;
+        offsetX = (width - displayW) / 2;
+        offsetY = 0;
+    } else {
+        displayW = width;
+        displayH = displayW / aspect;
+        offsetX = 0;
+        offsetY = (height - displayH) / 2;
+    }
+    
+    ctx.imageSmoothingEnabled = false;  // Nearest neighbor for mask
+    ctx.drawImage(tempCanvas, offsetX, offsetY, displayW, displayH);
+    
+    // Update slice indicator
+    const sliceIndicator = document.getElementById('overlap-slice-indicator');
+    const sliceLabel = document.getElementById('overlap-slice-num');
+    if (sliceLabel) {
+        sliceLabel.textContent = `${sliceIndex + 1} / ${W}`;
+    }
+    if (sliceIndicator) {
+        sliceIndicator.style.display = 'block';
+    }
+    
+    // Hide placeholder
+    const placeholder = document.getElementById('overlap-placeholder');
+    if (placeholder) placeholder.style.display = 'none';
+}
+
+/**
+ * Initialize overlap viewer with scroll support
+ */
+function initOverlapViewer() {
+    const container = document.getElementById('overlap-canvas-container');
+    if (!container) return;
+    
+    // Mouse wheel scrolling
+    container.addEventListener('wheel', (e) => {
+        e.preventDefault();
+        const maskData = appState.get('maskData');
+        if (!maskData) return;
+        
+        const delta = e.deltaY > 0 ? 1 : -1;
+        const currentSlice = appState.get('overlapSliceIndex');
+        appState.setOverlapSlice(currentSlice + delta);
+        renderOverlapCanvas();
+    }, { passive: false });
+    
+    // Resize observer for responsive canvas
+    const resizeObserver = new ResizeObserver(() => {
+        if (appState.get('maskData')) {
+            renderOverlapCanvas();
+        }
+    });
+    resizeObserver.observe(container);
+}
+
 // ============ Tool Management ============
 
 function enableTools(enabled) {
@@ -256,6 +601,10 @@ function enableTools(enabled) {
     document.getElementById('tool-clear').disabled = !enabled;
     document.getElementById('run-segment').disabled = !enabled;
     document.getElementById('run-refine').disabled = !enabled;
+    
+    // Enable ground truth upload when volume is loaded
+    const gtBtn = document.getElementById('upload-gt-btn');
+    if (gtBtn) gtBtn.disabled = !enabled;
 }
 
 function setActiveTool(tool) {
@@ -420,6 +769,25 @@ function setupEventListeners() {
     document.getElementById('run-segment').addEventListener('click', runSegmentation);
     document.getElementById('run-refine').addEventListener('click', runRefinement);
     
+    // Ground truth upload
+    const gtUploadBtn = document.getElementById('upload-gt-btn');
+    const gtFileInput = document.getElementById('gt-upload-input');
+    
+    if (gtUploadBtn && gtFileInput) {
+        gtUploadBtn.addEventListener('click', () => {
+            gtFileInput.click();
+        });
+        
+        gtFileInput.addEventListener('change', (e) => {
+            const file = e.target.files[0];
+            if (file) {
+                handleGroundTruthUpload(file);
+            }
+            // Reset input so same file can be selected again
+            e.target.value = '';
+        });
+    }
+    
     // Display sliders
     document.getElementById('window-slider').addEventListener('input', updateWindowValue);
     document.getElementById('level-slider').addEventListener('input', updateLevelValue);
@@ -447,6 +815,10 @@ async function initialize() {
         mprViewer.initialize();
         console.log('MPR viewer initialized');
         
+        // Initialize overlap viewer (scroll support)
+        initOverlapViewer();
+        console.log('Overlap viewer initialized');
+        
         // Check backend connection
         const connected = await checkConnection();
         console.log('Backend connection:', connected);

seg_app/ui_slicer/index.html

@@ -137,27 +137,77 @@
                         <div class="viewer-header">
                             <span class="view-label info">INFO</span>
                         </div>
-                        <div class="info-panel" id="info-view">
-                            <div class="crosshair-info">
-                                <h4>📍 Crosshair Position</h4>
-                                <p>X: <span id="pos-x">-</span></p>
-                                <p>Y: <span id="pos-y">-</span></p>
-                                <p>Z: <span id="pos-z">-</span></p>
-                                <p>Value: <span id="pos-value">-</span></p>
+                        <div class="info-panel-split" id="info-view">
+                            <!-- Left Column: Metrics & Info -->
+                            <div class="info-left">
+                                <div class="crosshair-info">
+                                    <h4>📍 Crosshair Position</h4>
+                                    <p>X: <span id="pos-x">-</span></p>
+                                    <p>Y: <span id="pos-y">-</span></p>
+                                    <p>Z: <span id="pos-z">-</span></p>
+                                    <p>Value: <span id="pos-value">-</span></p>
+                                </div>
+                                <div class="seg-info">
+                                    <h4>📊 Segmentation</h4>
+                                    <p>Mask loaded: <span id="mask-status">No</span></p>
+                                    <p>Voxels: <span id="mask-voxels">-</span></p>
+                                    <p>Volume: <span id="mask-volume">-</span></p>
+                                </div>
+                                <div class="dice-info">
+                                    <h4>🎯 Dice Metrics</h4>
+                                    <p>Ground Truth: <span id="gt-status">Not loaded</span></p>
+                                    <p>Dice Score: <span id="dice-score">-</span></p>
+                                    <p>IoU Score: <span id="iou-score">-</span></p>
+                                    <p>Sensitivity: <span id="sensitivity">-</span></p>
+                                    <p>Precision: <span id="precision-score">-</span></p>
+                                    <input type="file" id="gt-upload-input" accept=".nii,.nii.gz" style="display: none;">
+                                    <button id="upload-gt-btn" class="btn btn-secondary btn-small" disabled>
+                                        📤 Upload Ground Truth
+                                    </button>
+                                </div>
+                                <div class="keyboard-shortcuts">
+                                    <h4>⌨️ Shortcuts</h4>
+                                    <p><kbd>Scroll</kbd> Change slice</p>
+                                    <p><kbd>Click</kbd> Add prompt</p>
+                                    <p><kbd>P</kbd> Positive mode</p>
+                                    <p><kbd>N</kbd> Negative mode</p>
+                                    <p><kbd>C</kbd> Clear prompts</p>
+                                    <p><kbd>R</kbd> Run segmentation</p>
+                                </div>
                             </div>
-                            <div class="seg-info">
-                                <h4>📊 Segmentation</h4>
-                                <p>Mask loaded: <span id="mask-status">No</span></p>
-                                <p>Voxels: <span id="mask-voxels">-</span></p>
-                            </div>
-                            <div class="keyboard-shortcuts">
-                                <h4>⌨️ Shortcuts</h4>
-                                <p><kbd>Scroll</kbd> Change slice</p>
-                                <p><kbd>Click</kbd> Add prompt</p>
-                                <p><kbd>P</kbd> Positive mode</p>
-                                <p><kbd>N</kbd> Negative mode</p>
-                                <p><kbd>C</kbd> Clear prompts</p>
-                                <p><kbd>R</kbd> Run segmentation</p>
+                            <!-- Right Column: Overlap Viewer -->
+                            <div class="info-right">
+                                <div class="overlap-viewer">
+                                    <h4>🔍 Mask Comparison</h4>
+                                    <div class="overlap-canvas-container" id="overlap-canvas-container">
+                                        <canvas id="overlap-canvas"></canvas>
+                                        <div class="slice-indicator" id="overlap-slice-indicator">
+                                            <span id="overlap-slice-num">-</span>
+                                        </div>
+                                        <p class="overlap-placeholder" id="overlap-placeholder">
+                                            Run segmentation to view mask<br>
+                                            <small>Scroll to change slice</small>
+                                        </p>
+                                    </div>
+                                    <div class="overlap-legend">
+                                        <div class="legend-item">
+                                            <span class="legend-color tp"></span>
+                                            <span>TP (Both agree)</span>
+                                        </div>
+                                        <div class="legend-item">
+                                            <span class="legend-color fp"></span>
+                                            <span>FP (Pred only)</span>
+                                        </div>
+                                        <div class="legend-item">
+                                            <span class="legend-color fn"></span>
+                                            <span>FN (GT only)</span>
+                                        </div>
+                                        <div class="legend-item">
+                                            <span class="legend-color pred-only"></span>
+                                            <span>Prediction</span>
+                                        </div>
+                                    </div>
+                                </div>
                             </div>
                         </div>
                     </div>

seg_app/ui_slicer/state.js

@@ -65,6 +65,11 @@ class AppState {
             maskLoaded: false,
             maskData: null, // Uint8Array
 
+            // Ground Truth (for Dice comparison)
+            gtLoaded: false,
+            gtMaskData: null, // Uint8Array
+            overlapSliceIndex: 0, // Slice index for overlap viewer
+
             // Display settings
             windowWidth: 400,
             windowLevel: 40,
@@ -215,6 +220,9 @@ class AppState {
             volumeData: null,
             maskLoaded: false,
             maskData: null,
+            gtLoaded: false,
+            gtMaskData: null,
+            overlapSliceIndex: 0,
             prompts: []
         });
     }
@@ -330,6 +338,47 @@ class AppState {
         });
     }
 
+    // ============ Ground Truth Methods ============
+
+    /**
+     * Set ground truth mask data
+     * @param {Uint8Array} data 
+     */
+    setGroundTruth(data) {
+        // Set overlap slice to center initially
+        const shape = this.get('volumeShape');
+        const centerSlice = shape ? Math.floor(shape[2] / 2) : 0;
+        
+        this.update({
+            gtLoaded: true,
+            gtMaskData: data,
+            overlapSliceIndex: centerSlice
+        });
+    }
+
+    /**
+     * Clear ground truth data
+     */
+    clearGroundTruth() {
+        this.update({
+            gtLoaded: false,
+            gtMaskData: null,
+            overlapSliceIndex: 0
+        });
+    }
+
+    /**
+     * Set overlap viewer slice index
+     * @param {number} index 
+     */
+    setOverlapSlice(index) {
+        const shape = this.get('volumeShape');
+        if (!shape) return;
+        const maxIndex = shape[2] - 1; // W dimension (axial slices through Z)
+        const clampedIndex = Math.max(0, Math.min(index, maxIndex));
+        this.set('overlapSliceIndex', clampedIndex);
+    }
+
     // ============ Loading State ============
 
     /**

seg_app/ui_slicer/styles.css

@@ -17,6 +17,11 @@
     --border-color: #2a2a4a;
     --shadow-color: rgba(0, 0, 0, 0.3);
     
+    /* Semantic colors for metrics */
+    --success-color: #4caf50;
+    --warning-color: #ff9800;
+    --error-color: #f44336;
+    
     /* View colors */
     --axial-color: #4caf50;
     --sagittal-color: #2196f3;
@@ -484,46 +489,178 @@ body {
     cursor: crosshair;
 }
 
-/* Info Panel (4th quadrant) */
-.info-panel {
+/* Info Panel (4th quadrant) - Split Layout */
+.info-panel-split {
     flex: 1;
-    padding: var(--spacing-md);
+    display: flex;
+    gap: var(--spacing-sm);
+    padding: var(--spacing-sm);
+    overflow: hidden;
+}
+
+.info-left {
+    flex: 1;
+    min-width: 0;
     overflow-y: auto;
+    padding-right: var(--spacing-sm);
+    border-right: 1px solid var(--border-color);
 }
 
-.info-panel h4 {
-    font-size: 0.8rem;
-    margin-bottom: var(--spacing-sm);
-    color: var(--text-primary);
+.info-right {
+    flex: 1;
+    min-width: 0;
+    display: flex;
+    flex-direction: column;
+    overflow-y: auto;
 }
 
-.info-panel p {
+.info-left h4,
+.info-right h4 {
     font-size: 0.75rem;
-    color: var(--text-secondary);
     margin-bottom: var(--spacing-xs);
+    color: var(--text-primary);
+}
+
+.info-left p {
+    font-size: 0.7rem;
+    color: var(--text-secondary);
+    margin-bottom: 2px;
+}
+
+/* Overlap Viewer */
+.overlap-viewer {
+    display: flex;
+    flex-direction: column;
+    height: 100%;
+}
+
+.overlap-canvas-container {
+    position: relative;
+    flex: 1;
+    min-height: 160px;
+    background: var(--bg-primary);
+    border: 1px solid var(--border-color);
+    border-radius: var(--radius-sm);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    overflow: hidden;
+    cursor: ns-resize;
+}
+
+#overlap-canvas {
+    width: 100%;
+    height: 100%;
+    display: block;
+}
+
+.overlap-canvas-container .slice-indicator {
+    position: absolute;
+    bottom: 4px;
+    left: 50%;
+    transform: translateX(-50%);
+    background: rgba(0, 0, 0, 0.7);
+    color: var(--text-primary);
+    padding: 2px 8px;
+    border-radius: var(--radius-sm);
+    font-size: 0.65rem;
+    font-family: var(--font-mono);
+    pointer-events: none;
+    z-index: 10;
+}
+
+.overlap-placeholder {
+    position: absolute;
+    font-size: 0.7rem;
+    color: var(--text-secondary);
+    text-align: center;
+    padding: var(--spacing-sm);
+}
+
+.overlap-placeholder small {
+    font-size: 0.6rem;
+    opacity: 0.7;
+}
+
+.overlap-placeholder.hidden {
+    display: none;
+}
+
+/* Overlap Legend */
+.overlap-legend {
+    margin-top: var(--spacing-xs);
+    display: grid;
+    grid-template-columns: 1fr 1fr;
+    gap: 2px;
+    font-size: 0.6rem;
+}
+
+.legend-item {
+    display: flex;
+    align-items: center;
+    gap: 4px;
+    color: var(--text-secondary);
+}
+
+.legend-color {
+    width: 10px;
+    height: 10px;
+    border-radius: 2px;
+    flex-shrink: 0;
+}
+
+.legend-color.tp {
+    background: #4caf50; /* Green - True Positive */
+}
+
+.legend-color.fp {
+    background: #f44336; /* Red - False Positive */
+}
+
+.legend-color.fn {
+    background: #2196f3; /* Blue - False Negative */
+}
+
+.legend-color.pred-only {
+    background: #ff9800; /* Orange - Prediction only (no GT) */
 }
 
 .crosshair-info,
 .seg-info,
+.dice-info,
 .keyboard-shortcuts {
-    margin-bottom: var(--spacing-md);
-    padding-bottom: var(--spacing-md);
+    margin-bottom: var(--spacing-sm);
+    padding-bottom: var(--spacing-sm);
     border-bottom: 1px solid var(--border-color);
 }
 
+.dice-info #gt-status {
+    font-weight: 500;
+}
+
+.dice-info .btn-small {
+    margin-top: var(--spacing-xs);
+    padding: 3px 6px;
+    font-size: 0.6rem;
+}
+
 .keyboard-shortcuts:last-child {
     border-bottom: none;
 }
 
+.keyboard-shortcuts p {
+    font-size: 0.6rem;
+}
+
 kbd {
     display: inline-block;
-    padding: 2px 6px;
-    font-size: 0.7rem;
+    padding: 1px 4px;
+    font-size: 0.6rem;
     font-family: monospace;
     background: var(--bg-tertiary);
     border: 1px solid var(--border-color);
     border-radius: 3px;
-    min-width: 50px;
+    min-width: 40px;
     text-align: center;
 }