/* The Auction House: the Marketplace's 🔨 Auctions tab (rpg/ui-auction.js). Navy tiles like the Bag's, gold for your lead
   and for a win to pay, orange for a Crystal Ball. */
.au-lots { display: grid; gap: 8px; margin: 6px 0 10px; }
.au-lot { display: grid; grid-template-columns: 76px minmax(0, 1fr); gap: 10px; padding: 8px; margin: 6px 0; border-radius: 10px; background: rgba(3, 10, 44, 0.6); border: 1px solid #2e3d74; text-align: left; }
.au-lot.ball { border-color: rgba(255, 154, 30, 0.6); }
.au-lot.lead { border-color: rgba(127, 208, 138, 0.7); }
.au-lot.win { border-color: var(--gold); box-shadow: 0 0 10px rgba(255, 210, 63, 0.25); }
.au-pic { display: grid; place-items: center; width: 76px; height: 76px; border-radius: 8px; background: rgba(0, 0, 0, 0.3); overflow: hidden; }
.au-img { max-width: 100%; max-height: 100%; object-fit: contain; }
.au-img.px { width: 64px; height: 64px; image-rendering: pixelated; }
.au-gift { font-size: 38px; }
.au-body { display: grid; gap: 3px; min-width: 0; }
.au-body h5 { margin: 0; font-size: 16px; font-weight: 400; color: #fff; line-height: 1.15; }
.au-by, .au-left, .au-min { margin: 0; font-size: 12px; color: var(--muted); }
.au-price { margin: 2px 0 0; display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px; }
.au-price b { font-weight: 400; font-size: 18px; color: var(--gold); }
.au-price small { font-size: 12px; color: var(--muted); }
.au-you { margin: 2px 0; font-size: 13px; }
.au-you.lead { color: #7fd08a; }
.au-you.out { color: #ffb34a; }
.au-bid { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 4px; }
.au-bid input, .au-sell input, .au-sell select { width: 9.5em; max-width: 100%; padding: 6px 8px; border-radius: 6px; border: 1px solid #2e3d74; background: rgba(0, 0, 0, 0.35); color: #fff; font: inherit; font-size: 15px; }
.au-bid span { font-size: 13px; color: var(--muted); }
.au-msg { margin: 4px 0 0; font-size: 13px; color: #c9d4ff; }
/* Why you can't bid (a team wallet, under the level, no wallet), in place of the bid box. */
.au-why { margin: 4px 0 0; padding: 6px 8px; border-radius: 6px; font-size: 13px; color: #ffcf8a; background: rgba(255, 154, 30, 0.1); border: 1px solid rgba(255, 154, 30, 0.35); }
.au-msg.ok { color: #7fd08a; }
.au-msg.err { color: #ff8a7a; }
.au-more summary { cursor: pointer; font-size: 12px; color: var(--muted); }
.au-hist { margin: 4px 0 0; padding-left: 18px; font-size: 13px; }
.au-hist b { font-weight: 400; color: #fff; }
.au-hist small { color: var(--muted); }
.au-ended { margin: 4px 0 10px; padding-left: 18px; font-size: 13px; line-height: 1.5; }
.au-ended b { font-weight: 400; color: #fff; }
.au-ended small { color: var(--muted); }
.au-sell { display: grid; gap: 8px; padding: 8px; margin: 6px 0 10px; border-radius: 10px; background: rgba(3, 10, 44, 0.6); border: 1px solid rgba(255, 154, 30, 0.6); }
.au-sell label { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; font-size: 14px; color: #c9d4ff; }
.au-balls { display: flex; flex-wrap: wrap; gap: 4px; }
.au-balls .cb-slot { width: 52px; }
.au-balls .cb-slot.on { border-color: var(--gold); box-shadow: 0 0 8px rgba(255, 210, 63, 0.4); }
@media (max-width: 420px) {
  .au-lot { grid-template-columns: 56px minmax(0, 1fr); gap: 8px; }
  .au-pic { width: 56px; height: 56px; }
  .au-img.px { width: 48px; height: 48px; }
}