.market-directory { margin: 28px 0 0; text-align: left; }
.market-heading { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 12px; }
.market-heading h2 { font-size: 1.3rem; margin: 6px 0; }
.top-sellers { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; margin: 14px 0 18px; }
.top-seller { display: flex; align-items: center; gap: 12px; padding: 16px; border: 1px solid var(--border); border-radius: 14px; background: var(--surface); color: var(--fg); text-decoration: none; min-width: 0; }
.seller-rank { font-weight: 700; color: var(--search-gold-text); }
.seller-name { min-width: 0; flex: 1; font-size: .9rem; font-weight: 600; overflow-wrap: anywhere; }
.seller-name small, .seller-stock small { display: block; color: var(--fg-muted); font-size: .75rem; font-weight: 400; margin-top: 5px; }
.seller-stock { font-weight: 700; text-align: right; font-variant-numeric: tabular-nums; }
.top-seller:hover, .top-seller[aria-current] { border-color: var(--search-gold); background: var(--search-glow); text-decoration: none; }
.market-map-panel { border: 1px solid var(--border); border-radius: 16px; padding: 18px; background: var(--surface); }
.market-map-panel > summary { cursor: pointer; font-weight: 600; min-height: 44px; }
.market-map-panel > summary span { margin-left: 10px; font-weight: 400; font-size: .8rem; }
.market-map-controls { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; margin: 10px 0; }
.map-mode { display: flex; gap: 4px; border: 1px solid var(--border); border-radius: 12px; padding: 4px; }
.map-mode button, .map-nearby button { border: 1px solid transparent; border-radius: 9px; color: var(--fg); background: transparent; padding: 10px 12px; min-height: 44px; font: inherit; font-size: .8rem; cursor: pointer; }
.map-mode [aria-pressed=true], .map-nearby [aria-pressed=true] { background: var(--search-glow); border-color: var(--search-gold); }
.map-region { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; font-size: .8rem; }
.map-region select { border: 1px solid var(--border); border-radius: 10px; min-height: 44px; padding: 8px; background: var(--bg); color: var(--fg); font-size: 16px; max-width: 100%; }
.market-map-layout { display: grid; grid-template-columns: minmax(0,1fr) minmax(250px,310px); gap: 16px; margin-top: 14px; align-items: start; }
.market-map-viewport { aspect-ratio: 860/580; position: relative; background: var(--bg); border: 1px solid var(--border); border-radius: 14px; overflow: hidden; touch-action: pan-y; }
.market-map-viewport.is-zoomed { cursor: grab; touch-action: none; }
.market-map-viewport svg { display: block; width: 100%; height: 100%; user-select: none; }
.ukraine-outline { fill: var(--muted-bg); stroke: var(--action); stroke-width: 1.5; vector-effect: non-scaling-stroke; }
.map-country-label { fill: var(--fg-muted); font-size: 24px; letter-spacing: 7px; opacity: .6; }
.map-water-label { fill: var(--fg-muted); font-size: 14px; }
.map-pins { position: absolute; inset: 0; pointer-events: none; }
.map-pin { position: absolute; transform: translate(-50%,-50%); min-width: 44px; height: 44px; border: 2px solid var(--surface); border-radius: 50%; background: var(--action); color: var(--action-fg); font: inherit; font-size: 16px; font-weight: 700; cursor: pointer; pointer-events: auto; }
.map-pin:hover, .map-pin:focus-visible { background: #f5c451; color: #17212b; outline: 2px solid #b77900; outline-offset: 2px; z-index: 2; }
.map-navigation { display: flex; flex-wrap: wrap; gap: 10px; justify-content: space-between; margin: 10px 0; }
.map-zoom, .map-pan { display: flex; flex-wrap: wrap; gap: 4px; }
.map-navigation button { min-width: 44px; min-height: 44px; border: 1px solid var(--control-border); border-radius: 10px; background: var(--surface); color: var(--fg); font-size: 24px; cursor: pointer; }
.map-navigation [data-map-reset] { font: inherit; font-size: .85rem; padding: 8px 12px; }
.map-navigation svg { display: block; width: 20px; height: 20px; margin: auto; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.map-pan [data-pan=up] svg { transform: rotate(90deg); }
.map-pan [data-pan=right] svg { transform: rotate(180deg); }
.map-pan [data-pan=down] svg { transform: rotate(270deg); }
.market-map-viewport:focus-visible { outline: 2px solid var(--search-gold); outline-offset: 3px; }
.map-preview h3:focus-visible { outline: 2px solid var(--search-gold); outline-offset: 4px; border-radius: 4px; }
.map-status { font-size: .8rem; color: var(--fg-muted); margin: 10px 0; }
.map-preview { padding: 18px; background: var(--bg); border: 1px solid var(--border); border-radius: 14px; overflow-wrap: anywhere; min-width: 0; max-height: 560px; overflow-y: auto; }
.map-preview h3 { font-size: 1.1rem; margin: 8px 0; }
.map-preview p, .map-preview dl { font-size: .8rem; line-height: 1.6; margin: 10px 0; }
.map-preview dt { color: var(--fg-muted); }
.map-preview dd { margin: 0 0 10px; }
.map-preview .btn-primary { width: 100%; font-size: .85rem; padding: 10px; }
.map-detail-link { display: block; font-size: .8rem; padding: 10px 0; min-height: 44px; }
.map-description { max-height: 120px; overflow-y: auto; white-space: pre-line; }
.map-nearby { display: grid; gap: 4px; }
.map-nearby button { text-align: left; border-color: var(--border); }
.map-source-list { margin-top: 14px; }
.map-source-list summary { min-height: 44px; cursor: pointer; }
.map-source-list ul { padding: 0; list-style: none; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.map-source-list li { display: flex; flex-direction: column; gap: 8px; padding: 12px; border: 1px solid var(--border); border-radius: 10px; overflow-wrap: anywhere; }
.map-source-list span { color: var(--fg-muted); font-size: .8rem; }
.market-directory :is(button,a,select):focus-visible { outline: 2px solid var(--search-gold); outline-offset: 3px; }
.card .favorite-action-form { display: contents; }
.card .listing-actions :is(.favorite-action, .contact-original) > span { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
@media (max-width: 1000px) { .top-sellers { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width: 700px) {
  .market-map-layout { grid-template-columns: minmax(0,1fr); }
  .map-preview { max-height: 430px; }
  .market-map-panel { padding: 12px; }
  .map-source-list ul { grid-template-columns: minmax(0,1fr); }
  .top-sellers { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 8px; }
  .top-seller { flex: 0 0 260px; scroll-snap-align: start; }
  .map-region { width: 100%; }
  .map-region select { flex: 1; min-width: 0; }
  .map-mode { width: 100%; }
  .map-mode button { flex: 1; }
}
/* Compact cards differ visibly from the full-width mobile stream. */
@media (min-width: 360px) and (max-width: 600px) {
  :root:not([data-catalog-view="stream"]) .results .grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
  :root:not([data-catalog-view="stream"]) .results .card-body { padding: 10px; }
  :root:not([data-catalog-view="stream"]) .results .card-title { font-size: 14px; }
  :root:not([data-catalog-view="stream"]) .results .card-price .price { font-size: 17px; }
  :root:not([data-catalog-view="stream"]) .results .card-specs { font-size: 12px; gap: 4px; flex-wrap: wrap; }
  :root:not([data-catalog-view="stream"]) .results .card-preview { -webkit-line-clamp: 2; font-size: 12px; }
  :root:not([data-catalog-view="stream"]) .results .card-foot { flex-direction: column; align-items: flex-start; gap: 6px; }
  :root:not([data-catalog-view="stream"]) .results .card .source { white-space: normal; overflow-wrap: anywhere; font-size: 12px; }
  :root:not([data-catalog-view="stream"]) .results .card .listing-actions { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 3px; }
  :root:not([data-catalog-view="stream"]) .results .card .listing-action { min-width: 44px; min-height: 44px; flex: 1 1 44px; }
  :root:not([data-catalog-view="stream"]) .results .card .inline-media-counter { font-size: 9px; left: 4px; padding: 4px; }
  :root:not([data-catalog-view="stream"]) .results .card .inline-media-nav { width: 44px; min-width: 44px; height: 44px; }
}
@media (max-width: 600px) {
  .results-head .view-switch { width: 100%; justify-content: center; }
  .results-head .view-switch button { flex: 1; min-height: 48px; }
  .results-head .view-switch button[aria-pressed="true"] { background: var(--search-glow); color: var(--fg); outline: 1px solid var(--search-gold); }
}

/* Shared controls use the same contrast token in both themes. */
:is(.search-box, .search-scope, .filters, .account-panel, .map-region, .results-head) :is(input:not([type=hidden]):not([type=checkbox]):not([type=radio]), select, textarea):not(:disabled) { border-color: var(--control-border); }
:is(.search-box, .search-scope, .filters, .account-panel, .map-region, .results-head) :is(input:not([type=hidden]):not([type=checkbox]):not([type=radio]), select, textarea):not(:disabled):is(:hover,:focus-visible) { border-color: var(--search-gold); }
.field-hint { font-size: .75rem; line-height: 1.5; }
