/* Narrow browse cards: keep the seller identity readable before status badges. */
.ath-swap-listing-card--browse {
  container-type: inline-size;
}

@container (max-width: 280px) {
  .ath-swap-listing-card--browse .ath-swap-listing-card__owner-pill {
    grid-template-columns: auto minmax(0, 1fr);
    grid-template-rows: auto auto;
    row-gap: 6px;
    align-items: center;
  }

  .ath-swap-listing-card--browse .ath-swap-listing-card__owner-copy {
    min-width: 0;
  }

  .ath-swap-listing-card--browse .ath-swap-listing-card__owner-copy strong {
    overflow: visible;
    text-overflow: clip;
    white-space: normal;
    overflow-wrap: anywhere;
  }

  .ath-swap-listing-card--browse .ath-swap-listing-card__owner-badges {
    grid-column: 1 / -1;
    width: 100%;
    justify-content: flex-end;
  }
}

/* Map controls are browse-surface behavior, not global header styling. */
.ath-swap-browse-map {
  position: relative;
}

.ath-swap-browse-map__tools {
  position: absolute !important;
  top: 12px !important;
  right: 12px !important;
  left: auto !important;
  bottom: auto !important;
  z-index: 20;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0 !important;
  width: fit-content !important;
  min-width: 0 !important;
  max-width: max-content !important;
  height: auto !important;
  min-height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  overflow: visible !important;
}

.ath-swap-browse-map__tools .ath-swap-muted {
  display: none !important;
}

.ath-swap-browse-map__recenter {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 40px !important;
  height: 40px !important;
  min-width: 40px !important;
  min-height: 40px !important;
  max-width: 40px !important;
  max-height: 40px !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: color-mix(in oklab, var(--surface-1, #131921) 88%, transparent) !important;
  color: var(--text-high, rgba(255, 255, 255, .96)) !important;
  box-shadow:
    0 10px 24px color-mix(in oklab, var(--surface-1, #111827) 35%, transparent),
    inset 0 1px 0 color-mix(in oklab, var(--text-high, rgba(255, 255, 255, .96)) 12%, transparent) !important;
  font-size: 0 !important;
  line-height: 0 !important;
  overflow: hidden;
}

.ath-swap-browse-map__recenter::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 21px;
  height: 21px;
  border: 2px solid currentColor;
  border-radius: 999px;
  transform: translate(-50%, -50%);
  opacity: .95;
}

.ath-swap-browse-map__recenter::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 28px;
  height: 28px;
  transform: translate(-50%, -50%);
  background:
    linear-gradient(currentColor, currentColor) center / 2px 28px no-repeat,
    linear-gradient(currentColor, currentColor) center / 28px 2px no-repeat;
  opacity: .95;
}

.ath-swap-browse-map__recenter:hover,
.ath-swap-browse-map__recenter:focus-visible {
  background: color-mix(in oklab, var(--ctl-c1, #febd69) 18%, var(--surface-1, #131921)) !important;
  color: var(--text-high, rgba(255, 255, 255, .98)) !important;
  outline: 2px solid color-mix(in oklab, var(--ctl-c1, #febd69) 54%, transparent);
  outline-offset: 2px;
}

@media (max-width: 640px) {
  .ath-swap-browse-map__tools {
    top: 10px;
    right: 10px;
  }

  .ath-swap-browse-map__recenter {
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    min-height: 38px !important;
    max-width: 38px !important;
    max-height: 38px !important;
  }

  .ath-swap-browse-map__recenter::before {
    width: 20px;
    height: 20px;
  }

  .ath-swap-browse-map__recenter::after {
    width: 26px;
    height: 26px;
    background:
      linear-gradient(currentColor, currentColor) center / 2px 26px no-repeat,
      linear-gradient(currentColor, currentColor) center / 26px 2px no-repeat;
  }
}

.ath-swap-market-view-list .ath-swap-browse-map__tools,
.ath-swap-market-view-split .ath-swap-browse-map__tools,
[data-ath-swap-browse-active-view="list"] .ath-swap-browse-map__tools,
[data-ath-swap-browse-active-view="split"] .ath-swap-browse-map__tools,
.ath-swap-shell[data-ath-swap-browse-active-view="list"] .ath-swap-browse-map__tools,
.ath-swap-shell[data-ath-swap-browse-active-view="split"] .ath-swap-browse-map__tools,
.ath-swap-browse[data-ath-swap-view="list"] .ath-swap-browse-map__tools,
.ath-swap-browse[data-ath-swap-view="split"] .ath-swap-browse-map__tools,
.ath-swap-browse.is-list-view .ath-swap-browse-map__tools,
.ath-swap-browse.is-split-view .ath-swap-browse-map__tools,
.ath-swap-browse--list .ath-swap-browse-map__tools,
.ath-swap-browse--split .ath-swap-browse-map__tools,
.ath-swap-shell--browse-list .ath-swap-browse-map__tools,
.ath-swap-shell--browse-split .ath-swap-browse-map__tools {
  display: none !important;
}