@layer pages {
  .where__top { background: var(--color-bg-subtle); border-block-end: var(--border-width) solid var(--color-border); }
  .where__top-inner { display: grid; gap: var(--space-4); }
  .where__filters { display: grid; gap: var(--space-3); grid-template-columns: minmax(0, 1fr); align-items: end; }
  .where__body { display: grid; gap: var(--space-4); padding-block: var(--space-6) var(--space-12); grid-template-columns: minmax(0, 1fr); }
  .where__bar { display: flex; flex-wrap: wrap; gap: var(--space-3); align-items: center; justify-content: space-between; }
  .where__count { font: var(--text-small); color: var(--color-text-muted); }
  .where__switch { display: inline-flex; gap: var(--space-1); }
  .where__layout { display: grid; gap: var(--space-4); grid-template-columns: minmax(0, 1fr); align-items: start; }
  .where__list { display: grid; gap: var(--space-3); align-content: start; min-inline-size: 0; }
  .where__item { display: grid; gap: var(--space-2); padding: var(--space-1); border-radius: var(--radius-card); }
  .where__item[aria-current="true"] { outline: var(--border-width-2) solid var(--color-neutral-900); }
  .where__item-actions { display: flex; flex-wrap: wrap; gap: var(--space-2); padding: 0 var(--space-3) var(--space-3); }
  .where__empty { display: grid; gap: var(--space-4); }
  .where__empty-actions { display: flex; flex-wrap: wrap; gap: var(--space-2); }
  .where__become { display: grid; gap: var(--space-5); align-items: center; }

  /* Узкие экраны: показываем либо список, либо карту */
  @media not all and (min-width: 80rem) {
    .where__layout[data-view="list"] .where__map { display: none; }
    .where__layout[data-view="map"] .where__list { display: none; }
    .where__layout[data-view="map"] .ds-dealer-map { aspect-ratio: 1; }
  }

  @media (min-width: 48rem) {
    .where__filters { grid-template-columns: repeat(3, minmax(0, 1fr)) auto; }
  }

  @media (min-width: 80rem) {
    .where__switch { display: none; }
    .where__layout { grid-template-columns: var(--size-120) minmax(0, 1fr); gap: var(--space-6); }
    .where__list { max-block-size: calc(100vh - var(--size-60)); overflow-y: auto; padding-inline-end: var(--space-2); }
    .where__map { position: sticky; inset-block-start: var(--sticky-top); }
    .where__become { grid-template-columns: minmax(0, 1fr) auto; gap: var(--space-12); }
  }
}