/* Local font: price typography never waits on a third-party font service. */
@font-face {
  font-family: 'Orbitron';
  src: url('/assets/ui-fonts/orbitron-800-latin.woff2') format('woff2');
  font-style: normal;
  font-weight: 800;
  font-display: swap;
}
:root { --stock-price-font: 'Orbitron', var(--mono); }
.fw-market .fw-stock-equivalent { display: block; margin-top: 7px; font: 12px/1.4 var(--mono); color: var(--muted, #a4b19f); white-space: nowrap; }
.fw-market .fw-stock-art { position: relative; background: var(--panel, #26362b); }
.fw-market .fw-stock-art img[data-stock-art] { opacity: 0; transition: opacity 160ms ease; }
.fw-market .fw-stock-art.is-ready img[data-stock-art] { opacity: 1; }
.fw-market .fw-stock-art.is-error img[data-stock-art] { visibility: hidden; }
.fw-market .fw-art-state { position: absolute; inset: 0; display: grid; place-items: center; color: var(--muted, #a4b19f); font: 12px/1.4 var(--mono); }
.fw-market .fw-stock-art.is-ready .fw-art-state { display: none; }
@media (prefers-reduced-motion: reduce) {
  .fw-market .fw-stock-art img[data-stock-art] { transition: none; }
}
/* Contract-backed stock prices use the same typography and inseparable quote
   group as the main marketplace. Extreme exact values scroll as one group. */
.fw-market .fw-stock-price {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  flex-wrap: nowrap;
  min-width: 0;
  max-width: 100%;
  overflow-x: auto;
  white-space: nowrap;
  vertical-align: middle;
}
.fw-market .fw-stock-price .nft-price-amount {
  font: 800 var(--stock-price-size, 18px)/1.25 var(--stock-price-font);
  overflow-wrap: normal;
}
.fw-market .fw-stock-price .stock-denomination { display: inline-flex; }
.nft-price-amount {
  font: 800 var(--stock-price-size, 18px)/1.25 var(--stock-price-font);
  font-variant-numeric: tabular-nums;
  letter-spacing: 0;
  color: var(--paper);
  min-width: 0;
  white-space: nowrap;
  overflow-wrap: normal;
  flex-shrink: 0;
}
.nft-price-stock,
.ml .nft-price-stock,
.msc-screener .msc-card-quotes .nft-price-stock,
.msc-screener .msc-table .nft-price-stock,
.msc-screener .msc-sales-table .nft-price-stock,
#marketCollectionList .market-collection-quote .nft-price-stock {
  display: inline-flex;
  align-items: center;
  flex-wrap: nowrap;
  gap: 7px;
  min-width: max-content;
  flex-shrink: 0;
  white-space: nowrap;
  grid-template-columns: none;
}
/* The logo and ticker are an indivisible denomination everywhere. Only whole
   price/equivalent groups can wrap, never the number or its stock identity. */
.stock-denomination {
  display:inline-flex;
  align-items:center;
  flex-wrap:nowrap;
  flex-shrink:0;
  gap:5px;
  vertical-align:middle;
  white-space:nowrap;
}
.stock-denomination > img,
.stock-denomination > .stock-monogram { flex:none; }
.stock-denomination > span { white-space:nowrap; }
.nft-price-stock .stock-denomination > span {
  font: 800 11px/1 var(--stock-price-font);
  letter-spacing: 0;
  color: var(--paper);
}
/* Retire narrow numeric rails that would collide with the larger figures. */
.ml .nft-price-quote { grid-template-columns: max-content max-content; column-gap: 12px; }
.ml .nft-price-amount { padding: 0; text-align: left; }
.msc-screener .msc-card-quotes .nft-price-quote,
.msc-screener .msc-table .nft-price-quote { grid-template-columns: minmax(0, 1fr); }
.msc-screener .msc-sales-table .nft-price-quote {
  grid-template-columns:minmax(160px,max-content) max-content;
  column-gap:16px;
  align-items:center;
}
.msc-screener .msc-sales-table td:nth-child(2) { min-width:290px; }
.nft-price-quote > .nft-usd,
.nft-price-quote > .nft-usd-plain { flex-shrink:0;white-space:nowrap; }
.msc-card-quotes { --stock-price-size: 16px; }
.msc-card { container-type:inline-size; }
/* Narrow collection cards stack complete Floor/Top bid blocks together. */
@container (max-width:350px) {
  .msc-screener .msc-card-quotes { grid-template-columns:minmax(0,1fr); }
  .msc-screener .msc-card-quotes > div + div { border-left:0;border-top:1px solid var(--line);padding:10px 0 0; }
}
.msc-table { --stock-price-size: 15px; }
.msc-screener .msc-table td:nth-child(2),
.msc-screener .msc-table td:nth-child(3) { min-width: 150px; }

#marketCollectionList { --stock-price-size: 16px; }
#marketCollectionList .market-collection-item {
  flex-basis: 376px;
  width: 376px;
  min-width: 376px;
  min-height: 84px;
}
#marketCollectionList .market-collection-copy { grid-template-rows: 20px auto 14px; gap: 3px; }
#marketCollectionList .market-collection-quote .nft-price-quote {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px 12px;
  max-width: 100%;
}
#marketFloor, #marketTopBid { --stock-price-size: 22px; }
#marketItemPrice { --stock-price-size: clamp(28px, 3vw, 36px); }
#marketItemPrice .stock-denomination > span { font-size: 14px; }
#debugCollectionPrice { --stock-price-size: 26px; }
#debugMintTotal { --stock-price-size: 18px; }
#sweepTotal { --stock-price-size: 19px; }
#heroBid, #heroAsk { font: 800 clamp(24px, 2.4vw, 32px)/1.2 var(--stock-price-font); letter-spacing: 0; }
#marketListDialog .market-price-input input { font-family: var(--stock-price-font); font-weight: 800; }
@media (max-width: 540px) {
  #debugCollectionPrice { --stock-price-size: 22px; }
}