.shops-hero em,
.shops-mark {
  color: #f2a766;
}

.shops-hero .hero-numbers {
  background:
    radial-gradient(circle at 78% 18%, rgba(242, 167, 102, 0.16), transparent 38%),
    rgba(var(--surface-rgb), 0.82);
}

.market-pulse,
.player-market,
.source-coverage,
.market-trends {
  padding-top: clamp(4rem, 8vw, 7rem);
}

.market-stat-grid,
.availability-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1rem;
}

.market-stat-grid article,
.availability-card,
.category-panel,
.trend-panel,
.listing-panel,
.owner-panel {
  background: rgba(var(--surface-rgb), 0.58);
  border: 1px solid var(--line);
  border-radius: 8px;
}

.market-stat-grid article {
  min-height: 140px;
  padding: 1.25rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.market-stat-grid small,
.availability-card small,
.panel-heading span,
.trend-legend {
  color: var(--meta);
  font: 0.58rem "DM Mono", monospace;
  letter-spacing: 0.08em;
}

.market-stat-grid strong {
  margin: 0.4rem 0 0.25rem;
  color: var(--text);
  font-size: clamp(1.25rem, 2.5vw, 1.8rem);
}

.market-stat-grid span {
  color: var(--muted);
  font-size: 0.67rem;
  line-height: 1.5;
}

.player-market-stats article:first-child {
  background:
    radial-gradient(circle at 84% 18%, rgba(242, 167, 102, 0.13), transparent 42%),
    rgba(var(--surface-rgb), 0.72);
}

.listing-panel,
.owner-panel {
  margin-top: 1rem;
  padding: clamp(1.25rem, 3vw, 2rem);
}

.listing-toolbar {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 1.25rem;
}

.listing-toolbar h3 {
  margin: 0.35rem 0 0;
  color: var(--text);
  font-size: 1.35rem;
}

.listing-search {
  width: min(100%, 360px);
  min-height: 44px;
  padding: 0 0.8rem;
  display: flex;
  align-items: center;
  gap: 0.6rem;
  color: var(--meta);
  background: rgba(var(--background-rgb), 0.72);
  border: 1px solid var(--line);
  border-radius: 6px;
}

.listing-search input {
  width: 100%;
  padding: 0.7rem 0;
  color: var(--text);
  background: transparent;
  border: 0;
  outline: 0;
  font: 0.72rem Manrope, sans-serif;
}

.listing-search input::placeholder {
  color: var(--meta);
}

.listing-filters {
  margin-top: 1.25rem;
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.listing-filters button,
.listing-more {
  min-height: 36px;
  padding: 0.55rem 0.8rem;
  color: var(--muted);
  background: rgba(var(--background-rgb), 0.52);
  border: 1px solid var(--line);
  border-radius: 5px;
  font: 0.59rem "DM Mono", monospace;
  letter-spacing: 0.04em;
  cursor: pointer;
}

.listing-filters button:hover,
.listing-filters button:focus-visible,
.listing-filters button.active,
.listing-more:hover,
.listing-more:focus-visible {
  color: var(--background);
  background: #f2a766;
  border-color: #f2a766;
}

.listing-summary {
  margin: 1rem 0;
  color: var(--meta);
  font: 0.61rem "DM Mono", monospace;
  line-height: 1.55;
}

.listing-catalog {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.75rem;
}

.listing-card {
  min-width: 0;
  padding: 1rem;
  background: rgba(var(--background-rgb), 0.44);
  border: 1px solid var(--line);
  border-radius: 7px;
}

.listing-card > div:first-child {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 0.7rem;
}

.listing-card h4 {
  margin: 0;
  overflow-wrap: anywhere;
  color: var(--text);
  font-size: 0.88rem;
}

.listing-owner,
.owner-name {
  color: var(--text);
  font-size: 0.68rem;
  font-weight: 700;
  text-decoration: none;
}

.listing-owner:hover,
.listing-owner:focus-visible,
.owner-name:hover,
.owner-name:focus-visible {
  color: var(--blue);
}

.listing-badges {
  margin: 0.85rem 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
}

.listing-badges span {
  padding: 0.28rem 0.42rem;
  color: var(--meta);
  background: rgba(123, 184, 242, 0.07);
  border: 1px solid var(--line);
  border-radius: 4px;
  font: 0.5rem "DM Mono", monospace;
  letter-spacing: 0.04em;
}

.listing-badges .stock-in-stock,
.listing-badges .stock-accepting {
  color: var(--green);
  border-color: rgba(var(--green-rgb), 0.28);
}

.listing-badges .stock-out-of-stock,
.listing-badges .stock-full {
  color: #f2a766;
  border-color: rgba(242, 167, 102, 0.3);
}

.listing-card > strong {
  display: block;
  color: #f2a766;
  font-size: 0.7rem;
  line-height: 1.45;
}

.listing-card > p {
  margin: 0.45rem 0 0;
  color: var(--muted);
  font-size: 0.65rem;
  line-height: 1.55;
}

.listing-empty {
  grid-column: 1 / -1;
  margin: 0;
  padding: 2rem 1rem;
  color: var(--muted);
  border: 1px dashed var(--line);
  border-radius: 6px;
  text-align: center;
}

.listing-more {
  margin-top: 1rem;
}

.owner-directory {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.75rem;
}

.owner-directory article {
  padding: 0.9rem;
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
  background: rgba(var(--background-rgb), 0.38);
  border: 1px solid var(--line);
  border-radius: 6px;
}

.owner-directory strong {
  color: var(--text);
  font-size: 0.65rem;
}

.owner-directory span {
  color: var(--meta);
  font-size: 0.59rem;
  line-height: 1.5;
}

.category-panel {
  margin-top: 1rem;
  padding: clamp(1.25rem, 3vw, 2rem);
}

.panel-heading {
  margin-bottom: 1.4rem;
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 1rem;
}

.panel-heading h3 {
  margin: 0.35rem 0 0;
  color: var(--text);
  font-size: 1.35rem;
}

.category-mix {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem 1.5rem;
}

.category-row > div:first-child {
  margin-bottom: 0.4rem;
  display: flex;
  justify-content: space-between;
  gap: 1rem;
}

.category-row strong {
  color: var(--text);
  font-size: 0.75rem;
}

.category-row span {
  color: #f2a766;
  font: 0.62rem "DM Mono", monospace;
}

.category-track {
  height: 10px;
  overflow: hidden;
  background: rgba(242, 167, 102, 0.06);
  border: 1px solid var(--line);
  border-radius: 999px;
}

.category-track i {
  width: var(--category-size, 0%);
  height: 100%;
  display: block;
  background: linear-gradient(90deg, #f2a766, var(--blue));
  border-radius: inherit;
}

.availability-card {
  min-height: 185px;
  padding: 1.25rem;
  display: flex;
  flex-direction: column;
}

.availability-state {
  width: fit-content;
  margin-bottom: 1.1rem;
  padding: 0.32rem 0.55rem;
  color: #f2a766;
  background: rgba(242, 167, 102, 0.09);
  border: 1px solid rgba(242, 167, 102, 0.24);
  border-radius: 5px;
  font: 0.55rem "DM Mono", monospace;
  letter-spacing: 0.08em;
}

.availability-card.is-published .availability-state {
  color: var(--green);
  background: rgba(var(--green-rgb), 0.08);
  border-color: rgba(var(--green-rgb), 0.24);
}

.availability-card.is-partial .availability-state {
  color: #f2a766;
  background: rgba(242, 167, 102, 0.09);
  border-color: rgba(242, 167, 102, 0.3);
}

.availability-card h3 {
  margin: 0;
  color: var(--text);
  font-size: 1rem;
}

.availability-card p {
  margin: 0.5rem 0 0;
  color: var(--muted);
  font-size: 0.68rem;
  line-height: 1.6;
}

.availability-card small {
  margin-top: auto;
  padding-top: 1rem;
  line-height: 1.5;
}

.trend-panel {
  padding: clamp(1.25rem, 3vw, 2rem);
}

.trend-chart {
  min-height: 260px;
  display: grid;
  grid-template-columns: repeat(12, minmax(20px, 1fr));
  gap: clamp(0.3rem, 1vw, 0.8rem);
  align-items: end;
  border-bottom: 1px solid var(--line);
}

.trend-month {
  min-width: 0;
  height: 240px;
  display: grid;
  grid-template-rows: 1fr auto;
  gap: 0.55rem;
  align-items: end;
}

.trend-bar {
  width: 100%;
  min-height: 4px;
  height: var(--trend-size, 0%);
  background: linear-gradient(180deg, #f2a766, rgba(123, 184, 242, 0.6));
  border-radius: 4px 4px 0 0;
  transition: filter 160ms ease;
}

.trend-month:hover .trend-bar {
  filter: brightness(1.18);
}

.trend-month span {
  overflow: hidden;
  color: var(--meta);
  font: 0.51rem "DM Mono", monospace;
  text-align: center;
  text-overflow: clip;
  white-space: nowrap;
}

.trend-legend {
  padding-top: 1rem;
  display: flex;
  justify-content: space-between;
  gap: 1rem;
}

.trend-legend i {
  width: 0.65rem;
  height: 0.65rem;
  margin-right: 0.35rem;
  display: inline-block;
  background: #f2a766;
  border-radius: 2px;
  vertical-align: -0.1rem;
}

@media (max-width: 980px) {
  .market-stat-grid,
  .availability-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .listing-catalog,
  .owner-directory {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 680px) {
  .market-stat-grid,
  .availability-grid,
  .category-mix,
  .listing-catalog,
  .owner-directory {
    grid-template-columns: 1fr;
  }

  .panel-heading,
  .trend-legend,
  .listing-toolbar {
    align-items: start;
    flex-direction: column;
  }

  .listing-search {
    width: 100%;
  }

  .trend-chart {
    gap: 0.2rem;
  }

  .trend-month span {
    font-size: 0.43rem;
  }
}