/* Оформление кластеров в фирменных цветах: чем плотнее группа, тем темнее.
   Штатный Default.css грузить неоткуда — контур работает без внешних CDN. */
.marker-cluster {
  background-clip: padding-box;
  border-radius: 50%;
  background: rgba(91, 71, 245, .22);
}
.marker-cluster div {
  width: 32px; height: 32px; margin: 4px;
  text-align: center; border-radius: 50%;
  background: #5b47f5; color: #fff;
  font: 700 12px/32px "Manrope", ui-sans-serif, system-ui, sans-serif;
  box-shadow: 0 1px 5px rgba(23, 22, 28, .35);
}
.marker-cluster-medium { background: rgba(74, 55, 224, .25); }
.marker-cluster-medium div { background: #4a37e0; width: 38px; height: 38px; line-height: 38px; margin: 1px; }
.marker-cluster-large { background: rgba(23, 22, 28, .22); }
.marker-cluster-large div { background: #17161c; width: 44px; height: 44px; line-height: 44px; margin: -2px; }
.leaflet-cluster-anim .leaflet-marker-icon,
.leaflet-cluster-anim .leaflet-marker-shadow {
  transition: transform .25s ease-out, opacity .25s ease-in;
}
@media (prefers-reduced-motion: reduce) {
  .leaflet-cluster-anim .leaflet-marker-icon,
  .leaflet-cluster-anim .leaflet-marker-shadow { transition: none; }
}