html, body {
   height: 100%;
}

body.fullscreen-map #map {
   height: calc(100vh - 60px);
   width: 100%;
   border-radius: 0;
}

.config-buttons {
   position: fixed;
   display: flex;
   gap: 6px;
   top: 70px;
   right: 20px;
   padding: 10px;
   z-index: 500;
   background: white;
   border-radius: 8px;
   box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
}

.config-buttons button {
   padding: 8px 10px;
   border: 1px solid #ced4da;
   border-radius: 6px;
   background: white;
   cursor: pointer;
   display: inline-flex;
   align-items: center;
   justify-content: center;
}

.config-buttons button:hover {
   background: #f1f5f9;
}

.config-buttons select {
   border: 1px solid #ced4da;
   border-radius: 6px;
   padding: 0 10px;
}

.leaflet-marker-icon {
   position: relative;
   z-index: 1;
}

.leaflet-marker-icon::after {
   content: "";
   position: absolute;
   top: 50%;
   left: 50%;
   width: 60px;
   height: 60px;
   transform: translate(-50%, -50%);
   background: rgba(255, 0, 0, 0.3);
   border-radius: 50%;
   pointer-events: none;
   z-index: -1;
}

.leaflet-marker-icon.pokemon-missing {
   filter: drop-shadow(0 0 8px #fbbf24) drop-shadow(0 0 4px #fbbf24);
   z-index: 1000 !important;
}

.leaflet-marker-icon.pokemon-missing::after {
   background: rgba(255, 215, 0, 0.45);
   border: 5px solid #fbbf24;
   box-shadow: 0 0 24px 8px rgba(255, 215, 0, 0.85),
               inset 0 0 0 2px rgba(255, 255, 255, 0.7);
   width: 88px;
   height: 88px;
}