/* Force full screen height across all elements */
        html, body {
            height: 100%;
            margin: 0;
            padding: 0;
            overflow: hidden;
        }

        /* Set absolute positioning to cover entire viewport perfectly */
        #map {
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            width: 100%;
            height: 100%;
        }

        /* (Optional) Adjust zoom/rotate control positions so they don't get blocked by headers */
        .ol-zoom {
            top: 4rem;
            left: 1rem;
        }
        .ol-rotate {
            top: 3.5rem;
            left: 1rem;
        }
        .ol-overviewmap {
            bottom: 3.5rem;
            left: 1rem;
        }