.map-page-body .site-footer { display: none; }
.map-page { display: flex; flex-direction: column; height: calc(100dvh - 73px); min-height: 560px; overflow: hidden; background: var(--color-surface); }
.map-toolbar { position: relative; z-index: 2; flex: 0 0 auto; border-bottom: 1px solid var(--color-border); background: var(--color-bg); }
.map-toolbar__inner { padding-top: var(--space-4); padding-bottom: var(--space-3); }
.map-toolbar__heading { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); }
.map-toolbar__heading h1 { font-size: var(--fs-h3); letter-spacing: -0.02em; }
.map-toolbar__heading p { margin-top: 2px; color: var(--color-text-muted); font-size: var(--fs-body-sm); }
.map-districts { display: flex; gap: var(--space-2); margin-top: var(--space-3); padding-bottom: 2px; overflow-x: auto; scrollbar-width: thin; }
.map-districts .chip { flex: 0 0 auto; min-height: 38px; }
.map-workspace { display: flex; flex: 1 1 auto; min-height: 0; }
.map-canvas { position: relative; flex: 1 1 auto; min-width: 0; min-height: 300px; background: var(--color-surface-alt); }
.map-status { position: absolute; inset: 50% auto auto 50%; z-index: 1; display: flex; flex-direction: column; align-items: center; width: min(320px, calc(100% - 32px)); padding: var(--space-5); border: 1px solid var(--color-border); border-radius: var(--radius-lg); background: var(--color-bg); text-align: center; transform: translate(-50%, -50%); }
.map-status[hidden] { display: none; }
.map-status > span { color: var(--color-primary); }
.map-status strong { margin-top: var(--space-3); }
.map-status p { margin: var(--space-1) 0 var(--space-4); color: var(--color-text-muted); font-size: var(--fs-body-sm); }
.map-sidebar { display: none; flex: 0 0 340px; min-height: 0; border-left: 1px solid var(--color-border); background: var(--color-bg); overflow-y: auto; }
.map-sidebar__header { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); padding: var(--space-4) var(--space-4) 0; }
.map-sidebar__hint { padding: var(--space-1) var(--space-4) var(--space-3); color: var(--color-text-muted); font-size: var(--fs-caption); }
.map-list { border-top: 1px solid var(--color-border); }
.map-list-item { display: flex; flex-direction: column; width: 100%; padding: var(--space-4); border: 0; border-bottom: 1px solid var(--color-border); background: var(--color-bg); color: var(--color-text); text-align: left; transition: background var(--transition); }
.map-list-item:hover, .map-list-item.is-active { background: var(--color-primary-soft); }
.map-list-item__title { font-family: var(--font-heading); font-size: var(--fs-body-sm); font-weight: 600; }
.map-list-item__meta { margin: 3px 0 var(--space-2); color: var(--color-text-muted); font-size: var(--fs-caption); }
.map-list-item strong { font-size: var(--fs-body-sm); }
.map-list__empty { padding: var(--space-5) var(--space-4); color: var(--color-text-muted); font-size: var(--fs-body-sm); }
/* Кластер карты: зелёный букв SPB из логотипа. Заливка светлая,
   поэтому число тёмное — контраст 9.5:1. */
.map-cluster {
  display: flex;
  width: 44px;
  height: 44px;
  align-items: center;
  justify-content: center;
  margin: -22px 0 0 -22px;
  border: 2px solid var(--color-bg);
  border-radius: var(--radius-pill);
  background: var(--color-logo-green);
  box-shadow: var(--shadow-md);
  color: var(--color-logo-ink);
  font-family: var(--font-body);
  font-size: 15px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  line-height: 1;
}
.map-preview { width: 280px; overflow: hidden; border-radius: var(--radius-lg); background: var(--color-bg); box-shadow: var(--shadow-lg); font-family: var(--font-body); }
.map-preview__photo { display: flex; align-items: center; justify-content: center; height: 140px; background: var(--color-surface-alt) center / cover; color: var(--color-border-strong); }
.map-preview__body { padding: var(--space-3); }
.map-preview__title { display: block; margin-bottom: var(--space-1); font-weight: 600; }
.map-preview__title--link { display: flex; min-height: 44px; align-items: center; color: var(--color-text); text-decoration: underline; text-underline-offset: 3px; }
.map-preview__title--link:hover { color: var(--color-primary); }
.map-preview__title--link:focus-visible { outline: 2px solid var(--color-primary); outline-offset: 2px; border-radius: var(--radius-sm); }
.map-preview__meta { margin-bottom: var(--space-2); color: var(--color-text-muted); font-size: var(--fs-caption); }
.map-preview__price { margin-bottom: var(--space-2); color: var(--color-text); font-weight: 700; }
.map-preview .btn { min-height: 44px; }

@media (min-width: 1024px) {
  .map-sidebar { display: block; }
}

@media (max-width: 639px) {
  .map-districts .chip { min-height: 44px; }
  .map-toolbar__heading p { display: none; }
  .map-toolbar__heading .btn { padding-inline: var(--space-3); }
  .map-page { height: calc(100dvh - 73px); }
}