/* === Responsive ===
   Breakpoint ≤960 px: stacked grid, collapsed sidebar height, and the
   mobile full-screen viewer toggle. */
@media (max-width: 960px) {
    .mobile-only-control {
        display: block;
    }

    .app-shell {
        grid-template-columns: 1fr;
        grid-template-rows: auto 1fr;
        gap: 12px;
        padding: 12px;
    }

    .control-panel {
        height: auto;
        max-height: 46vh;
        padding: 12px 14px 12px;
    }

    .viewer-stage {
        padding-left: 0;
        min-height: 48vh;
    }



    .map-ndvi-load-button {
        max-width: none;
    }

    .status-banner {
        order: 5;
    }

    .toggle-group {
        flex-wrap: wrap;
    }

    .adjustments-panel-controls {
        grid-template-columns: 1fr;
    }

    .adjustments-panel-controls #reset-lighting {
        justify-self: stretch;
    }

    .scale-mode-row {
        flex-wrap: wrap;
    }

    .viewer-mode-toggle {
        top: 12px;
        left: 12px;
    }

    .viewer-frame.is-map-mode .leaflet-top.leaflet-left {
        top: 52px;
    }

    body.mobile-viewer-full {
        overflow: hidden;
    }

    body.mobile-viewer-full .app-shell {
        grid-template-columns: 1fr;
        grid-template-rows: 1fr;
        gap: 0;
        padding: 0;
    }

    body.mobile-viewer-full .control-panel {
        display: none;
    }

    body.mobile-viewer-full .viewer-stage {
        min-height: 100vh;
        padding: 0;
    }

    body.mobile-viewer-full .viewer-frame {
        height: 100vh;
        border-radius: 0;
        box-shadow: none;
    }

    body.mobile-viewer-full .mobile-viewer-overlay-button {
        display: block;
        position: fixed;
        top: 12px;
        left: 12px;
        z-index: 20;
    }
}

@media (max-width: 759px) {
    .viewer-stage.is-map-split {
        gap: 12px;
    }

    .viewer-stage.is-map-split .viewer-frame {
        flex: 1 1 auto;
        min-height: 0;
    }

    .viewer-stage.is-map-split .map-split-handle {
        display: none;
    }

    .viewer-stage.is-map-split .map-parcel-details-wrap {
        display: block;
        min-height: 0;
        overflow: visible;
    }

    .viewer-stage.is-map-split .map-parcel-details {
        display: block;
    }

    .viewer-stage.is-map-split .map-parcel-details-body {
        min-height: auto;
        overflow: visible;
    }
}