/* Marketplace (/marketplace) — store shelf grid. Fresh mkt- prefix; shared
   primitives (site-kicker, site-page-*, site-cover, site-badge) come from
   site.css. */

.mkt-page {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

/* ---- header: page-scoped bump to the design's 58px title ---- */

.mkt-head { margin-bottom: 0; }
.mkt-head .site-page-head-info { gap: 14px; }
.mkt-head .site-page-title { font-size: clamp(38px, 6vw, 58px); }
.mkt-head .site-page-sub { max-width: 52ch; }

/* ---- toolbar: filter chips + right-aligned counter ---- */

.mkt-toolbar {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 12px;
}

.mkt-filter-label {
  font-family: "Special Elite", "Courier New", monospace;
  text-transform: uppercase;
  letter-spacing: 2px;
  font-size: 11px;
  color: var(--ink-faint);
}

.mkt-chip {
  font-family: "JetBrains Mono", monospace;
  font-size: 12px;
  color: var(--ink);
  background: #fff;
  border: 2px solid var(--ink);
  box-shadow: 2px 2px 0 var(--ink);
  padding: 6px 11px;
  text-decoration: none;
  transition: transform 80ms ease, box-shadow 80ms ease;
}

.mkt-chip:hover { transform: translate(-1px, -1px); box-shadow: 3px 3px 0 var(--ink); }
.mkt-chip:active { transform: translate(2px, 2px); box-shadow: 0 0 0 var(--ink); }

.mkt-chip-active { background: var(--riso); }

.mkt-counter {
  margin-left: auto;
  font-size: 12px;
  color: var(--ink-faint);
}

/* ---- search results: stamped sections replacing the browse grid ---- */

.mkt-results {
  display: flex;
  flex-direction: column;
}

/* a little extra air between the shops and zines·issues sections */
.mkt-results + .mkt-results { margin-top: 28px; }

.mkt-results .site-stamp { align-self: flex-start; }

/* ---- store grid ---- */

.mkt-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 32px 28px;
}

@media (max-width: 900px) { .mkt-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) { .mkt-grid { grid-template-columns: 1fr; } }

/* ---- store card: a linked paper scrap that lifts on hover ---- */

.mkt-store {
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-width: 0; /* client-rendered covers must never widen the grid track */
  padding: 16px;
  background: #fff;
  color: var(--ink);
  text-decoration: none;
  border: 2px solid var(--ink);
  box-shadow: 6px 6px 0 rgba(22, 19, 15, 0.3);
  transition: transform 90ms ease, box-shadow 90ms ease;
}

.mkt-store:hover {
  transform: translate(-2px, -2px);
  box-shadow: 8px 8px 0 rgba(22, 19, 15, 0.35);
}

/* cover thumbnail strip: always three 3/4 tiles (site-cover), real covers
   crop inside them (page aspect ~0.709 is taller than 3/4) */
.mkt-covers { display: flex; gap: 6px; }

.mkt-cover { flex: 1; min-width: 0; }

.mkt-cover .st-cover {
  width: 100%;
  border: 0;
  background: transparent;
}

.mkt-cover .st-cover-blank { min-height: 0; }

.mkt-tagrow { display: flex; align-items: center; gap: 8px; }

.mkt-lock { font-size: 12px; }

.mkt-store-name {
  margin: 0;
  font-family: "Archivo Black", Impact, sans-serif;
  font-size: 26px;
  line-height: 0.95;
  letter-spacing: -0.5px;
}

.mkt-store-bio {
  margin: 0;
  font-size: 13px;
  color: var(--ink-soft);
  line-height: 1.5;
}

.mkt-store-foot {
  margin-top: auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: 10px;
  border-top: 2px solid var(--ink);
}

.mkt-store-count { font-size: 12px; color: var(--ink-faint); }

.mkt-visit {
  font-family: "Special Elite", "Courier New", monospace;
  text-transform: lowercase;
  font-size: 13px;
}

.mkt-empty { color: var(--ink-soft); }
.mkt-empty a { color: var(--ink); }