/* market1 (Mortimer, 04-11-2026): /market, «Buy an ape». Every card is its own container; each rarity has its colour
   (--t, the same as /rarity: Mythic red, Legendary gold, Epic violet, Rare blue, Uncommon green, Common grey). The Buy
   buttons go to Orbis and so wear the Solana gradient (the rule of basc.css for every orbisonsol.io button). */
.mkt { --t: #9aa4b2; padding: 34px 0 0; }
.mkt-sec { position: relative; margin-top: 46px; }
.mkt-sec .section-head { margin-bottom: 20px; }
.mkt-sec .section-head .mkt-lead { margin: 8px 0 0; color: var(--muted); max-width: 760px; }
.mkt-sol { font-weight: 900; color: #fff; font-variant-numeric: tabular-nums; white-space: nowrap; }
.mkt-sol em { margin-left: 4px; font-style: normal; font-size: 0.72em; font-weight: 800; letter-spacing: 0.04em; color: var(--cyan); }

/* The collections */
.mkt-tabs { display: flex; flex-wrap: wrap; gap: 10px; }
.mkt-tab { display: inline-flex; align-items: center; gap: 10px; padding: 7px 16px 7px 7px; border-radius: 999px; min-width: 0;
    background: var(--panel); border: 1px solid var(--line); transition: border-color 0.2s, background 0.2s, transform 0.2s; }
.mkt-tab img { width: 36px; height: 36px; border-radius: 50%; object-fit: cover; border: 1px solid var(--line-strong); }
.mkt-tab span { display: grid; line-height: 1.2; min-width: 0; }
.mkt-tab b { font-size: 0.92rem; font-weight: 800; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mkt-tab small { font-size: 0.75rem; color: var(--muted); }
.mkt-tab:hover { border-color: var(--line-strong); background: var(--panel-strong); transform: translateY(-1px); }
.mkt-tab.is-on { border-color: rgba(249,115,22,0.6); background: linear-gradient(120deg, rgba(249,115,22,0.18), rgba(0,221,235,0.08)); box-shadow: 0 8px 24px -10px rgba(249,115,22,0.5); }
.mkt-tab.is-on small { color: #fdba74; }

/* The strip of figures */
.mkt-strip { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; margin: 18px 0 0; padding: 0; }
.mkt-strip > div { --s: #00ddeb; position: relative; display: grid; align-content: start; gap: 6px; padding: 16px 18px; border-radius: 16px; overflow: hidden;
    background: radial-gradient(120% 90% at 0% 0%, color-mix(in srgb, var(--s) 14%, transparent), transparent 70%), var(--panel);
    border: 1px solid color-mix(in srgb, var(--s) 26%, var(--line)); }
.mkt-strip > div::after { content: ''; position: absolute; left: 14px; right: 40%; top: 0; height: 2px; border-radius: 0 0 2px 2px; background: linear-gradient(90deg, var(--s), transparent); }
.mkt-strip > .mkt-s1 { --s: #19fb9b; } .mkt-strip > .mkt-s2 { --s: #00ddeb; } .mkt-strip > .mkt-s3 { --s: #f97316; }
.mkt-strip > .mkt-s4 { --s: #a78bfa; } .mkt-strip > .mkt-s5 { --s: #fbbf24; } .mkt-strip > .mkt-s6 { --s: #f472b6; }
.mkt-strip dt { font-size: 0.75rem; font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase; color: color-mix(in srgb, var(--s) 55%, var(--muted)); }
.mkt-strip dd { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; margin: 0; font-size: 1.45rem; font-weight: 900; line-height: 1.1; font-variant-numeric: tabular-nums; color: #fff; }
.mkt-strip dd > small { flex-basis: 100%; font-size: 0.75rem; font-weight: 600; color: var(--muted); }
.mkt-strip dd .mk-chg { font-size: 0.78rem; }

/* The cards */
.mkt-grid { --bal-cols: 6; --bal-gap: 14px; list-style: none; margin: 0; padding: 0; }
.mkt-grid--deals { --bal-cols: 4; --bal-gap: 16px; }
.mkt-card { position: relative; display: flex; flex-direction: column; border-radius: 18px; overflow: hidden; background: rgba(12,6,26,0.82);
    border: 1px solid color-mix(in srgb, var(--t, #9aa4b2) 30%, var(--line)); box-shadow: 0 10px 28px -16px rgba(0,0,0,0.7);
    transition: transform 0.25s, border-color 0.25s, box-shadow 0.25s; }
.mkt-card:hover { transform: translateY(-3px); border-color: color-mix(in srgb, var(--t, #9aa4b2) 70%, transparent);
    box-shadow: 0 18px 40px -16px color-mix(in srgb, var(--t, #9aa4b2) 55%, transparent); }
.mkt-pic { position: relative; display: block; aspect-ratio: 1; overflow: hidden; background: #120a24; }
.mkt-pic img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.5s; }
.mkt-card:hover .mkt-pic img { transform: scale(1.05); }
.mkt-pic::after { content: ''; position: absolute; inset: auto 0 0; height: 38%; background: linear-gradient(0deg, rgba(12,6,26,0.85), transparent); pointer-events: none; }
.mkt-body { display: grid; grid-template-columns: minmax(0, 1fr); gap: 8px; padding: 10px 12px 12px; }
.mkt-line { display: flex; align-items: center; justify-content: space-between; gap: 6px; min-width: 0; }
.mkt-num { min-width: 0; font-weight: 900; font-size: 0.95rem; color: #fff; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mkt-tier { flex: none; display: inline-flex; align-items: baseline; gap: 5px; padding: 2px 8px; border-radius: 999px; font-size: 0.75rem; font-weight: 800;
    color: var(--t); background: color-mix(in srgb, var(--t) 14%, transparent); border: 1px solid color-mix(in srgb, var(--t) 45%, transparent); }
.mkt-tier small { font-size: 0.75rem; font-weight: 700; color: color-mix(in srgb, var(--t) 60%, #fff); opacity: 0.85; }
.mkt-price { display: flex; align-items: baseline; justify-content: space-between; gap: 6px; }
.mkt-price .mkt-sol { font-size: 1.18rem; }
.mkt-over { flex: none; font-size: 0.75rem; font-weight: 800; padding: 1px 7px; border-radius: 6px; color: var(--muted); background: rgba(255,255,255,0.05); border: 1px solid var(--line); }
.mkt-over.is-near { color: #5ef0c4; border-color: rgba(94,240,196,0.4); background: rgba(94,240,196,0.08); }
.mkt-over.is-floor { color: #04121a; border-color: transparent; background: linear-gradient(135deg, #5ef0c4, #22d3ee); }
.mkt-foot { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-width: 0; }
.mkt-src { min-width: 0; font-size: 0.75rem; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* Buy: Orbis, so the Solana gradient (basc.css rule for every orbisonsol.io button) */
.mkt-buy { flex: none; display: inline-flex; align-items: center; gap: 5px; padding: 6px 12px; border-radius: 10px; border: 1px solid transparent;
    font-size: 0.82rem; font-weight: 900; color: #fff; text-shadow: 0 1px 2px rgba(0,0,0,0.35); }
.mkt-buy[href*="orbisonsol.io"] { background: linear-gradient(110deg, #9945ff 0%, #8752f3 28%, #5497d5 55%, #43b4ca 72%, #28e0b9 88%, #19fb9b 100%);
    background-size: 160% 100%; background-position: 0% 50%; background-origin: border-box; background-repeat: no-repeat;
    box-shadow: 0 6px 18px rgba(153,69,255,0.3); transition: background-position 0.4s ease, transform 0.2s, box-shadow 0.2s; }
.mkt-buy[href*="orbisonsol.io"]:hover { background-position: 100% 50%; box-shadow: 0 10px 26px rgba(25,251,155,0.3); transform: translateY(-1px); }
.mkt-buy:focus-visible { outline: 2px solid #19fb9b; outline-offset: 3px; }
.mkt-buy--sm { padding: 5px 10px; font-size: 0.78rem; }

/* Deals: a bigger card with a ribbon in its rarity colour */
.mkt-card--deal { border-color: color-mix(in srgb, var(--t) 55%, transparent);
    background: radial-gradient(120% 60% at 50% 100%, color-mix(in srgb, var(--t) 18%, transparent), transparent 70%), rgba(12,6,26,0.88); }
.mkt-card--deal::before { content: ''; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; z-index: 1;
    background: linear-gradient(120deg, transparent 30%, rgba(255,255,255,0.08) 45%, transparent 60%); background-size: 260% 100%; background-position: 120% 0;
    transition: background-position 0.9s ease; }
.mkt-card--deal:hover::before { background-position: -60% 0; }
.mkt-deal-tag { position: absolute; top: 12px; left: 12px; z-index: 2; padding: 4px 10px; border-radius: 8px; font-size: 0.75rem; font-weight: 900; letter-spacing: 0.1em;
    text-transform: uppercase; color: #160b2c; background: linear-gradient(135deg, #fde68a, #f97316); box-shadow: 0 6px 16px rgba(249,115,22,0.45); }
.mkt-grid--deals .mkt-body { padding: 12px 14px 14px; gap: 10px; }
.mkt-grid--deals .mkt-num { font-size: 1.05rem; }
.mkt-grid--deals .mkt-price .mkt-sol { font-size: 1.4rem; }
.mkt-empty { margin: 0; padding: 22px 24px; border-radius: 16px; color: var(--muted); background: var(--panel); border: 1px dashed var(--line-strong); }
.mkt-empty b { color: #fff; }
.mkt-empty a { color: var(--cyan); font-weight: 700; }

/* Floor by rarity */
.mkt-tier-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.mkt-tl { display: grid; grid-template-columns: 88px minmax(0, 1fr); gap: 14px; align-items: center; padding: 12px; border-radius: 18px; min-width: 0;
    background: linear-gradient(110deg, color-mix(in srgb, var(--t) 16%, transparent), transparent 65%), var(--panel);
    border: 1px solid color-mix(in srgb, var(--t) 34%, var(--line)); transition: border-color 0.25s, transform 0.25s; }
.mkt-tl:hover { border-color: color-mix(in srgb, var(--t) 70%, transparent); transform: translateY(-2px); }
.mkt-tl-pic { display: block; width: 88px; height: 88px; border-radius: 14px; overflow: hidden; background: #120a24; border: 1px solid color-mix(in srgb, var(--t) 45%, transparent); }
.mkt-tl-pic img { width: 100%; height: 100%; object-fit: cover; }
.mkt-tl-pic--none { background: repeating-linear-gradient(135deg, rgba(255,255,255,0.03) 0 8px, transparent 8px 16px), #120a24; border-style: dashed; }
.mkt-tl-body { display: grid; gap: 6px; min-width: 0; }
.mkt-tl-name { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; font-weight: 900; color: var(--t); }
.mkt-tl-name small { font-size: 0.75rem; font-weight: 700; color: var(--muted); }
.mkt-tl-price { font-size: 0.82rem; color: var(--muted); }
.mkt-tl-price .mkt-sol { font-size: 1.2rem; margin-left: 2px; }
.mkt-tl-foot { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-width: 0; }
.mkt-tl-none { font-size: 0.85rem; color: var(--muted); }
.mkt-tl.is-none { opacity: 0.75; }

/* Every listing + recent sales */
.mkt-main > * { min-width: 0; }
.mkt-main { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 28px; align-items: start; }
.mkt-main .mkt-sec { margin-top: 46px; }
.mkt-main .mkt-grid { --bal-cols: 4; }
.mkt-tools { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.mkt-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.mkt-chip { display: inline-flex; align-items: center; gap: 7px; padding: 6px 12px; border-radius: 999px; font-size: 0.85rem; font-weight: 800; color: var(--text);
    background: var(--panel); border: 1px solid var(--line); transition: border-color 0.2s, background 0.2s; }
.mkt-chip i { width: 9px; height: 9px; border-radius: 50%; background: var(--t); box-shadow: 0 0 8px color-mix(in srgb, var(--t) 70%, transparent); }
.mkt-chip small { font-size: 0.75rem; font-weight: 700; color: var(--muted); }
.mkt-chip:hover { border-color: color-mix(in srgb, var(--t, #00ddeb) 60%, transparent); }
.mkt-chip.is-on { border-color: color-mix(in srgb, var(--t, #f97316) 80%, transparent); background: color-mix(in srgb, var(--t, #f97316) 18%, transparent); color: #fff; }
.mkt-chip:not([style]).is-on { border-color: rgba(249,115,22,0.7); background: rgba(249,115,22,0.16); }
.mkt-chip.is-empty { opacity: 0.55; }
.mkt-sort { display: inline-flex; padding: 4px; gap: 4px; border-radius: 999px; background: rgba(0,0,0,0.3); border: 1px solid var(--line-strong); }
.mkt-sort-b { padding: 6px 14px; border-radius: 999px; font-size: 0.85rem; font-weight: 800; color: var(--muted); transition: color 0.2s, background 0.2s; }
.mkt-sort-b:hover { color: #fff; }
.mkt-sort-b.is-on { color: #04121a; background: linear-gradient(135deg, #fdba74, #f97316); }
.mkt-pager { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; margin: 0 0 14px; }
.mkt-pager--bottom { margin: 16px 0 0; }
.mkt-pg-range { font-size: 0.85rem; color: var(--muted); }
.mkt-pg-range b { color: #fff; }
.mkt-pg-nav { display: inline-flex; flex-wrap: wrap; gap: 6px; }
.mkt-pg { display: inline-grid; place-items: center; min-width: 36px; height: 36px; padding: 0 10px; border-radius: 10px; font-weight: 800; font-size: 0.88rem;
    background: var(--panel); border: 1px solid var(--line); transition: border-color 0.2s, background 0.2s; }
.mkt-pg:hover { border-color: var(--line-strong); background: var(--panel-strong); }
.mkt-pg.is-on { color: #04121a; border-color: transparent; background: linear-gradient(135deg, #fdba74, #f97316); }
.mkt-pg.is-off { opacity: 0.35; }
.mkt-pg-gap { align-self: center; color: var(--muted); }

.mkt-sales { padding: 20px; border-radius: 20px; background: var(--panel); border: 1px solid var(--line); }
.mkt-sales h2 { margin: 10px 0 14px; font-size: 1.5rem; font-weight: 900; }
.mkt-sales h2 .c { color: var(--cyan); }
.mkt-sales ol { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.mkt-sales li a { display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 14px;
    background: rgba(0,0,0,0.18); border: 1px solid var(--line); transition: border-color 0.2s, background 0.2s; }
.mkt-sales li a:hover { border-color: rgba(0,221,235,0.45); background: rgba(0,221,235,0.06); }
.mkt-sale-img img { width: 44px; height: 44px; border-radius: 10px; object-fit: cover; }
.mkt-sale-who { display: grid; min-width: 0; line-height: 1.25; }
.mkt-sale-who b { font-weight: 900; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mkt-sale-who small { font-size: 0.75rem; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mkt-more { display: block; margin-top: 14px; font-size: 0.85rem; font-weight: 700; color: var(--cyan); }
.mkt-more:hover { text-decoration: underline; }
.mkt-source { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 8px; margin: 34px 0 0; font-size: 0.8rem; color: var(--muted); text-align: center; }
.mkt-source a { color: var(--cyan); }

.mkt-wait { margin-top: 10px; padding: 46px 28px; border-radius: 22px; text-align: center; background: var(--panel); border: 1px solid var(--line); }
.mkt-wait h2 { margin: 14px 0 8px; font-size: 1.6rem; }
.mkt-wait p { margin: 0 auto; max-width: 520px; color: var(--muted); }
.mkt-wait-dot { display: inline-block; width: 14px; height: 14px; border-radius: 50%; background: #22c55e; box-shadow: 0 0 14px #22c55e; animation: mk-pulse 2s ease-in-out infinite; }

@media (max-width: 1250px) {
    .mkt-grid { --bal-cols: 5; }
    .mkt-main .mkt-grid { --bal-cols: 3; }
}
@media (max-width: 1100px) {
    .mkt-strip { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .mkt-main { grid-template-columns: minmax(0, 1fr); gap: 0; }
    .mkt-main .mkt-grid { --bal-cols: 4; }
    .mkt-grid--deals { --bal-cols: 4; }
    .mkt-tier-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 800px) {
    .mkt-main .mkt-grid, .mkt-grid { --bal-cols: 3; }
    .mkt-grid--deals { --bal-cols: 2; }
}
@media (max-width: 600px) {
    .mkt { padding-top: 22px; }
    .mkt-sec, .mkt-main .mkt-sec { margin-top: 34px; }
    .mkt-tabs { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; margin: 0 -16px; padding: 0 16px 4px; }
    .mkt-tabs::-webkit-scrollbar { display: none; }
    .mkt-tab { flex: none; }
    .mkt-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
    .mkt-strip > div { padding: 12px 14px; }
    .mkt-strip dd { font-size: 1.2rem; }
    .mkt-main .mkt-grid, .mkt-grid, .mkt-grid--deals { --bal-cols: 2; --bal-gap: 10px; }
    .mkt-tier-grid { grid-template-columns: 1fr; gap: 10px; }
    .mkt-tl { grid-template-columns: 72px minmax(0, 1fr); }
    .mkt-tl-pic { width: 72px; height: 72px; }
    .mkt-body { padding: 9px 10px 10px; }
    .mkt-foot { flex-wrap: wrap; }
    .mkt-src { flex-basis: 100%; order: 2; }
    .mkt-card .mkt-buy { order: 1; flex: 1 1 100%; justify-content: center; }
    .mkt-tl-foot .mkt-buy--sm { flex: none; }
    .mkt-price { flex-wrap: wrap; }
    .mkt-price .mkt-sol, .mkt-grid--deals .mkt-price .mkt-sol { font-size: 1.05rem; }
    .mkt-tools { flex-direction: column; align-items: stretch; }
    .mkt-chips { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; margin: 0 -16px; padding: 0 16px 4px; }
    .mkt-chips::-webkit-scrollbar { display: none; }
    .mkt-chip { flex: none; }
    .mkt-sort { align-self: flex-start; }
}
@media (prefers-reduced-motion: reduce) {
    .mkt-card, .mkt-pic img, .mkt-tab, .mkt-tl, .mkt-buy, .mkt-card--deal::before { transition: none; }
    .mkt-card:hover, .mkt-tl:hover, .mkt-tab:hover, .mkt-buy:hover { transform: none; }
    .mkt-card:hover .mkt-pic img { transform: none; }
    .mkt-wait-dot { animation: none; }
}