/**
 * Closo Wholesale Marketplace — buyer rails (S3): signed-in chrome cluster,
 * search typeahead, saved-lots page (boards, move popover). Tokens match
 * wholesale-market.css: #452B90 accent · #1A202C ink · #556070 muted ·
 * #E4E2EE lines · #FAFAFC card bg. Linked by _chrome.php on every
 * marketplace page.
 */

/* ── signed-in icon cluster ─────────────────────────────────────────── */
/* ⛔ POSITIONED, because the confirmation panel anchors to it. Without this
   there is no positioned ancestor at all and the panel resolves against the
   initial containing block — measured on prod: it opened at y=912 on a 900px
   screen, i.e. below the fold, and the buyer never saw the thing that had
   just been built for them. */
.wmb-cluster { position: relative; display: flex; align-items: center; gap: 10px; }
.wmb-icon {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  border: 1px solid #E4E2EE;
  background: #fff;
  color: #1A202C;
  text-decoration: none;
  transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}
a.wmb-icon:hover { background: #FAFAFC; color: #452B90; border-color: #452B90; }
.wmb-icon-static { cursor: default; }
.wmb-bag-count {
  position: absolute;
  top: -4px;
  right: -4px;
  min-width: 17px;
  height: 17px;
  padding: 0 4px;
  border-radius: 9px;
  background: #452B90;
  color: #fff;
  font-family: "JetBrains Mono", monospace;
  font-size: 10.5px;
  font-weight: 600;
  line-height: 17px;
  text-align: center;
}

/* ── search typeahead ───────────────────────────────────────────────── */
.wm-search { position: relative; }
.wmb-suggest {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  z-index: 60;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 10px;
  border: 1px solid #E4E2EE;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(26, 32, 44, 0.10);
}
.wmb-suggest-pill {
  display: inline-block;
  padding: 5px 12px;
  border: 1px solid #E4E2EE;
  border-radius: 999px;
  background: #FAFAFC;
  color: #1A202C;
  font-size: 12.5px;
  text-decoration: none;
}
.wmb-suggest-pill:hover { border-color: #452B90; color: #452B90; }
.wmb-suggest-search {
  display: block;
  width: 100%;
  padding: 7px 10px;
  border: 0;
  border-top: 1px solid #E4E2EE;
  margin-top: 4px;
  background: none;
  color: #452B90;
  font-size: 13px;
  font-weight: 600;
  text-align: left;
  cursor: pointer;
}

/* ── saved page ─────────────────────────────────────────────────────── */
.wmb-saved-head {
  display: flex;
  align-items: baseline;
  gap: 12px;
  padding: 26px 48px 4px;
}
.wmb-saved-head h1 {
  margin: 0;
  font-family: "Poppins", "Inter", sans-serif;
  font-size: 24px;
  font-weight: 600;
  color: #1A202C;
}
.wmb-saved-count { font-size: 13px; color: #556070; }

.wmb-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 14px 48px 4px;
}
.wmb-tab {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 14px;
  border: 1px solid #E4E2EE;
  border-radius: 999px;
  background: #fff;
  color: #1A202C;
  font-size: 13px;
  text-decoration: none;
}
.wmb-tab:hover { border-color: #452B90; color: #452B90; }
.wmb-tab.is-active { background: #452B90; border-color: #452B90; color: #fff; }
.wmb-tab-count { font-family: "JetBrains Mono", monospace; font-size: 11px; opacity: 0.75; }

.wmb-empty { margin: 40px 48px; }

.wmb-card-photo { display: block; position: relative; }
.wmb-status {
  position: absolute;
  left: 10px;
  bottom: 10px;
  padding: 3px 9px;
  border-radius: 999px;
  background: rgba(26, 32, 44, 0.82);
  color: #fff;
  font-size: 11.5px;
  font-weight: 600;
}
.wmb-card-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-top: 10px;
}

/* board move popover (the Faire "Change" pattern) */
.wmb-move { position: relative; }
.wmb-move summary { list-style: none; }
.wmb-move summary::-webkit-details-marker { display: none; }
.wmb-move-btn {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 5px 11px;
  border: 1px solid #E4E2EE;
  border-radius: 999px;
  background: #FAFAFC;
  color: #1A202C;
  font-size: 12px;
  cursor: pointer;
}
.wmb-move-change { color: #452B90; font-weight: 600; }
.wmb-pop {
  position: absolute;
  left: 0;
  bottom: calc(100% + 6px);
  z-index: 50;
  min-width: 190px;
  padding: 6px;
  border: 1px solid #E4E2EE;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(26, 32, 44, 0.12);
}
.wmb-pop-opt {
  display: block;
  width: 100%;
  padding: 7px 10px;
  border: 0;
  border-radius: 8px;
  background: none;
  color: #1A202C;
  font-size: 13px;
  text-align: left;
  cursor: pointer;
}
.wmb-pop-opt:hover { background: #FAFAFC; color: #452B90; }
.wmb-pop-opt.is-current { color: #452B90; font-weight: 600; }
.wmb-pop-new {
  display: flex;
  gap: 6px;
  padding: 8px 6px 4px;
  border-top: 1px solid #E4E2EE;
  margin-top: 4px;
}
.wmb-pop-new input {
  flex: 1;
  min-width: 0;
  padding: 6px 9px;
  border: 1px solid #E4E2EE;
  border-radius: 8px;
  font-size: 12.5px;
}
.wmb-pop-new button {
  padding: 6px 11px;
  border: 0;
  border-radius: 8px;
  background: #452B90;
  color: #fff;
  font-size: 12.5px;
  font-weight: 600;
  cursor: pointer;
}
.wmb-pop-new button:hover { background: #321F69; }

.wmb-unsave {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 11px;
  border: 1px solid #E4E2EE;
  border-radius: 999px;
  background: #fff;
  color: #556070;
  font-size: 12px;
  cursor: pointer;
}
.wmb-unsave:hover { border-color: #B4232C; color: #B4232C; }

@media (max-width: 640px) {
  .wmb-saved-head, .wmb-tabs { padding-left: 16px; padding-right: 16px; }
  .wmb-empty { margin: 28px 16px; }
}

/* [hidden] must WIN over the explicit display above — display:flex/block on
 * the class beats the attribute's UA default (display:none), which kept the
 * panel and the empty "Search" row permanently visible (operator 2026-08-19:
 * the dropdown never went away). */
.wmb-suggest[hidden],
.wmb-suggest-search[hidden],
.wmb-suggest-pill[hidden] { display: none; }

/* ── quick-nav strip under the header (Faire pattern, 2026-08-19) ─────── */
.wm-quicknav {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  padding: 8px 48px;
  border-bottom: 1px solid #E4E2EE;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.wm-quicknav::-webkit-scrollbar { display: none; }
.wm-quicknav a {
  font-size: 12.5px;
  font-weight: 500;
  color: #556070;
  padding: 6px 11px;
  border-radius: 999px;
  white-space: nowrap;
  text-decoration: none;
}
.wm-quicknav a:hover { color: #452B90; background: #F4F2FA; }
@media (max-width: 640px) {
  /* Centering a SCROLL strip hides its start: when the pills are wider than
     the phone, `justify-content: center` spills them off BOTH edges and the
     first pill lands at -50px, unreachable by scrolling (measured 390px,
     2026-08-20). Packed to the start, the strip scrolls from its first pill. */
  .wm-quicknav { padding: 6px 16px; justify-content: flex-start; }
}

/* ── setup guide: header pill + modal + page (I3, 2026-08-19) ─────────── */
/* Its own class next to .wm-btn-ghost so the .wm-btn-supply mobile hide
 * never applies — the guide stays reachable on phones. */
.wm-btn-guide { white-space: nowrap; }
@media (max-width: 640px) { .wm-btn-guide { padding: 10px 6px; font-size: 12.5px; } }

.wm-guide-overlay {
  position: fixed;
  inset: 0;
  z-index: 200;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  background: rgba(26, 32, 44, 0.5);
}
.wm-guide-modal {
  position: relative;
  width: 100%;
  max-width: 560px;
  max-height: min(84vh, 720px);
  overflow-y: auto;
  padding: 28px 28px 26px;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 24px 64px rgba(26, 32, 44, 0.25);
}
.wm-guide-close {
  position: absolute;
  top: 14px;
  right: 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border: 1px solid #E4E2EE;
  border-radius: 50%;
  background: #fff;
  color: #556070;
  cursor: pointer;
}
.wm-guide-close:hover { border-color: #452B90; color: #452B90; }

.wm-guide-title {
  margin: 0;
  font-family: "Poppins", "Inter", sans-serif;
  font-size: 21px;
  font-weight: 600;
  color: #1A202C;
}
.wm-guide-sub { margin: 4px 0 0; font-size: 13px; color: #556070; }
.wm-guide-steps {
  list-style: none;
  margin: 20px 0 0;
  padding: 0;
  display: grid;
  gap: 16px;
}
.wm-guide-step { display: flex; gap: 12px; }
.wm-guide-ico {
  flex: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border: 1px solid #E4E2EE;
  border-radius: 10px;
  background: #FAFAFC;
  color: #452B90;
}
.wm-guide-body h3 {
  margin: 0 0 3px;
  font-size: 14px;
  font-weight: 600;
  color: #1A202C;
}
.wm-guide-n {
  font-family: "JetBrains Mono", monospace;
  font-size: 11.5px;
  font-weight: 600;
  color: #452B90;
}
.wm-guide-body p { margin: 0; font-size: 13px; line-height: 1.5; color: #556070; }
.wm-guide-cta { margin-top: 22px; display: flex; align-items: center; gap: 10px; }

/* [hidden] must WIN over the display:flex above — the same
 * display-beats-hidden defect class the .wmb-suggest guard exists for
 * (attribute default display:none loses to any explicit display). Without
 * this rule the guide overlay would sit permanently over every page. */
.wm-guide-overlay[hidden] { display: none; }

/* ── "Go deeper" cards (L1, 2026-08-19) — rich links under the steps to the
 * feature landings (/wholesale/insider, /wholesale/protection, live lots).
 * Rev-4 tile look: hairline #E4E2EE, 14px radius, #FAFAFC ground, accent on
 * hover, stroke icons. Lives in the modal AND the /wholesale/guide page. */
.wm-guide-deep-h {
  margin: 22px 0 10px;
  font-size: 11.5px;
  font-weight: 600;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  color: #556070;
}
.wm-guide-deep {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 10px;
}
.wm-guide-deep-card {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  border: 1px solid #E4E2EE;
  border-radius: 14px;
  background: #FAFAFC;
  padding: 13px 14px;
  text-decoration: none;
  color: #1A202C;
  transition: border-color 0.15s ease, background 0.15s ease;
}
.wm-guide-deep-card:hover { border-color: #452B90; background: #fff; color: #1A202C; }
.wm-guide-deep-ico { color: #452B90; flex: none; margin-top: 1px; }
.wm-guide-deep-body { min-width: 0; }
.wm-guide-deep-body b { display: block; font-size: 13.5px; font-weight: 600; }
.wm-guide-deep-body span { display: block; margin-top: 2px; font-size: 12.5px; line-height: 1.45; color: #556070; }
.wm-guide-deep-arrow { margin-left: auto; flex: none; color: #556070; align-self: center; }
.wm-guide-deep-card:hover .wm-guide-deep-arrow { color: #452B90; }

/* /wholesale/guide page band (no-JS fallback of the header button) */
.wm-guide-page { max-width: 620px; margin: 0 auto; padding: 36px 20px 64px; }
.wm-guide-page .wm-guide-title { font-size: 26px; }

@media (max-width: 640px) {
  .wm-guide-modal { padding: 22px 16px 20px; }
  .wm-guide-page { padding: 26px 16px 48px; }
}

/* ── /wholesale/bag — the marketplace's own bag (operator 2026-08-20) ──────
   Grouped by supplier because each liquidator ships and settles separately;
   the page states a subtotal but never charges — buying is the per-lot rail
   on the lot page. Palette + radii are this sheet's existing vocabulary. */
/* ⛔ NO CONTAINER OF ITS OWN. The grid inside is the marketplace's `.wm-grid`,
   which carries the page gutter itself — nesting it in a 1200px padded box
   made the bag's cards narrower than the saved page's (measured 260 against
   276 at 1280px). The group now only groups; the head and foot carry the
   gutter so they still line up with the cards. */
.wmb-bag-group {
  max-width: none;
  margin: 0 0 18px;
  padding: 0;
}
.wmb-bag-group-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  padding: 0 48px 8px;   /* the same gutter .wm-grid uses */
  border-bottom: 1px solid #E4E2EE;
}
.wmb-bag-supplier {
  font-size: 15px;
  font-weight: 650;
  color: #1A202C;
  text-decoration: none;
}
a.wmb-bag-supplier:hover { color: #452B90; text-decoration: underline; }
.wmb-bag-subtotal { font-size: 14px; font-weight: 600; color: #1A202C; font-variant-numeric: tabular-nums; }

.wmb-bag-lines { list-style: none; margin: 0; padding: 0; }
.wmb-bag-line {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 14px 2px;
  border-bottom: 1px solid #F0EEF6;
}
.wmb-bag-line:last-child { border-bottom: 0; }
.wmb-bag-line.is-gone { opacity: 0.62; }

.wmb-bag-thumb {
  flex: none;
  width: 84px;
  height: 64px;
  border-radius: 10px;
  overflow: hidden;
  background: #FAFAFC;
  border: 1px solid #E4E2EE;
  display: block;
}
.wmb-bag-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.wmb-bag-thumb.is-placeholder { background: #F4F2FA; }

.wmb-bag-line-body { min-width: 0; flex: 1 1 auto; }
.wmb-bag-title {
  display: block;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.35;
  color: #1A202C;
  text-decoration: none;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.wmb-bag-title:hover { color: #452B90; }
.wmb-bag-line-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 4px;
  font-size: 12.5px;
  color: #556070;
}
.wmb-bag-gone { color: #B4232C; font-weight: 600; }

.wmb-bag-line-end {
  flex: none;
  display: flex;
  align-items: center;
  gap: 12px;
}
.wmb-bag-price { font-size: 15px; font-weight: 650; color: #1A202C; font-variant-numeric: tabular-nums; }
.wmb-bag-buy { padding: 7px 14px; font-size: 13px; }
.wmb-bag-remove {
  font-size: 12.5px;
  color: #556070;
  text-decoration: none;
  border-bottom: 1px solid transparent;
}
.wmb-bag-remove:hover { color: #B4232C; border-bottom-color: #B4232C; }

.wmb-bag-foot {
  max-width: none;
  margin: 6px 0 64px;
  padding: 18px 48px 0;
  border-top: 1px solid #E4E2EE;
}
.wmb-bag-foot-row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  font-size: 15px;
  color: #1A202C;
}
.wmb-bag-foot-row strong { font-size: 19px; font-variant-numeric: tabular-nums; }
.wmb-bag-note {
  margin: 8px 0 16px;
  font-size: 12.5px;
  line-height: 1.55;
  color: #556070;
  max-width: 62ch;
}

@media (max-width: 640px) {
  .wmb-bag-group-head, .wmb-bag-foot { padding-left: 16px; padding-right: 16px; }
  .wmb-bag-line { flex-wrap: wrap; gap: 10px; }
  .wmb-bag-thumb { width: 64px; height: 50px; }
  .wmb-bag-line-end { width: 100%; justify-content: space-between; }
}

/* ── Confirmation panel — Direction 01 "Receipt" (operator 2026-08-20) ─────
   ⛔ THE PREFIX IS `wsmfly-`, NOT `wsmf-`. The FOOTER owns `wsmf-` in its own
      inline <style> (_footer.php: .wsmf, .wsmf-in, .wsmf-top, …). The first
      cut of this panel used `wsmf-` and collided twice: the footer's top
      border landed on the panel (measured `solid 1px #E4E2EE` on prod against
      a rule that declares none), and this panel's `.wsmf-top { display:flex }`
      landed on the FOOTER's two-column section. Both directions, live.
   The lot IS the confirmation, so the photo is large and the panel is paper
   under it: NO border, depth from shadow, one accent, one voice. The four
   habits the first draft broke, corrected: photo 84px (was 62), borderless
   (was a 1px box), one quiet meta line (was three tinted rows), and NO
   countdown — a draining progress bar is a dashboard habit, not a
   marketplace one. It leaves on the next click or after a pause.
   Rollback: FlagStore::set('wsm_flyout_enabled', false). */
.wsmfly {
  /* FIXED, and portalled to <body> by the script: the header is sticky and
     transforms when it tucks, which would otherwise make it this panel's
     containing block and carry the panel off-screen with it. The script sets
     top/right from the icon's real position. */
  position: fixed;
  top: 74px;
  right: 24px;
  width: 300px;
  /* With five lines the panel runs to ~510px. A ceiling means it can never
     grow past the screen on a short phone or a laptop with a small window;
     the list scrolls inside instead of the page scrolling under it. */
  max-height: calc(100vh - 96px);
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  background: #fff;
  /* ⛔ BORDERLESS, STATED OUT LOUD. Depth is the shadow; a 1px grey outline is
     the SaaS tell the operator rejected. Measured on prod that the panel came
     out `solid 1px #E4E2EE` anyway, so this says zero rather than relying on
     no rule saying otherwise — an absent declaration is not a decision. */
  border: 0;
  border-radius: 18px;
  padding: 18px;
  box-shadow: 0 26px 50px -18px rgba(52, 33, 110, 0.38), 0 3px 10px rgba(26, 32, 44, 0.07);
  z-index: 60;
  opacity: 0;
  transform: translateY(-6px) scale(0.985);
  pointer-events: none;
  transform-origin: 88% 0;
  transition: opacity 0.16s ease, transform 0.16s ease;
}
.wsmfly.is-open { opacity: 1; transform: none; pointer-events: auto; }
.wsmfly[hidden] { display: none; }

.wsmfly-top { display: flex; align-items: center; gap: 7px; margin-bottom: 14px; }
.wsmfly-tick {
  width: 16px; height: 16px; border-radius: 50%; flex: none;
  background: #452B90; color: #fff;
  display: inline-flex; align-items: center; justify-content: center;
}
.wsmfly-top b {
  font-size: 12px; font-weight: 600; letter-spacing: 0.09em;
  text-transform: uppercase; color: #556070;
}
.wsmfly-x {
  margin-left: auto; border: 0; background: none; padding: 3px; cursor: pointer;
  color: #8B93A3; line-height: 0; border-radius: 6px;
}
.wsmfly-x:hover { color: #1A202C; background: #FAFAFC; }

.wsmfly-item { display: flex; gap: 13px; align-items: flex-start; }
.wsmfly-photo {
  width: 84px; height: 84px; flex: none; border-radius: 13px; overflow: hidden;
  background: #F1EDFA; display: block;
}
.wsmfly-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.wsmfly-copy { min-width: 0; padding-top: 2px; }
.wsmfly-title {
  font-family: Poppins, Inter, sans-serif; font-size: 14px; font-weight: 600;
  line-height: 1.32; color: #1A202C; margin: 0 0 5px; text-decoration: none;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
a.wsmfly-title:hover { color: #452B90; }
.wsmfly-sup {
  font-size: 11px; letter-spacing: 0.06em; text-transform: uppercase;
  color: #556070; margin: 0 0 7px;
}
.wsmfly-price {
  font-family: "JetBrains Mono", ui-monospace, monospace;
  font-size: 14px; font-weight: 600; color: #1A202C;
}

.wsmfly-hair { height: 1px; background: #E4E2EE; margin: 16px 0 12px; }
.wsmfly-meta {
  display: flex; justify-content: space-between; align-items: baseline;
  font-size: 12.5px; color: #556070; margin-bottom: 15px;
}
.wsmfly-meta strong {
  font-family: "JetBrains Mono", ui-monospace, monospace;
  font-size: 15px; color: #1A202C;
}

.wsmfly-cta {
  display: block; text-align: center; background: #452B90; color: #fff;
  border-radius: 999px; padding: 11px; font-size: 13.5px; font-weight: 600;
  text-decoration: none;
}
.wsmfly-cta:hover { background: #321F69; color: #fff; }
.wsmfly-back {
  display: block; width: 100%; text-align: center; margin-top: 10px;
  font-size: 12.5px; color: #556070; background: none; border: 0;
  cursor: pointer; font-family: inherit;
}
.wsmfly-back:hover { color: #1A202C; text-decoration: underline; }

/* Boards: one row of quiet pills, not a second visual language. */
.wsmfly-boards { margin-bottom: 14px; }
.wsmfly-boards-l { font-size: 11px; letter-spacing: 0.06em; text-transform: uppercase; color: #556070; margin: 0 0 7px; }
.wsmfly-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.wsmfly-chip {
  font-size: 12.5px; font-weight: 550; padding: 5px 11px; border-radius: 999px;
  border: 1px solid #E4E2EE; background: #fff; color: #1A202C; cursor: pointer;
  font-family: inherit;
}
.wsmfly-chip:hover { border-color: #452B90; color: #452B90; }
.wsmfly-chip.is-on { background: #EDE8F8; border-color: #452B90; color: #452B90; }

/* The phone has no room for an anchored panel, and the top-right corner is
   the hardest place for a thumb: it becomes a sheet, inside the same 16px
   gutter every band on the marketplace uses. */
@media (max-width: 640px) {
  .wsmfly {
    position: fixed;
    top: auto;
    left: 16px;
    right: 16px;
    bottom: 16px;
    width: auto;
    transform: translateY(10px);
    transform-origin: 50% 100%;
    max-height: calc(100vh - 32px);
    box-shadow: 0 -14px 40px -12px rgba(52, 33, 110, 0.34), 0 2px 8px rgba(26, 32, 44, 0.08);
  }
  .wsmfly.is-open { transform: none; }
}
@media (prefers-reduced-motion: reduce) {
  .wsmfly { transition: none; }
}

/* The rest of the bag / saved list inside the panel — up to five lines
   (operator 2026-08-20: "показывать до 5 добавленных, а то сейчас только
   последний"). Compact by design: the lot just touched keeps the big photo
   above, these are the running list under it, not five more headlines. */
.wsmfly-list { list-style: none; margin: 0 0 12px; padding: 0; }
.wsmfly-li {
  display: flex; align-items: center; gap: 10px;
  padding: 7px 0; border-bottom: 1px solid #F0EEF6;
}
.wsmfly-li:last-child { border-bottom: 0; }
.wsmfly-lith {
  width: 34px; height: 28px; flex: none; border-radius: 6px; overflow: hidden;
  background: #F1EDFA; display: block;
}
.wsmfly-lith img { width: 100%; height: 100%; object-fit: cover; display: block; }
.wsmfly-lit {
  font-size: 12.5px; line-height: 1.3; color: #1A202C; text-decoration: none;
  overflow: hidden; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical;
  flex: 1 1 auto; min-width: 0;
}
.wsmfly-lit:hover { color: #452B90; }
.wsmfly-lip {
  font-family: "JetBrains Mono", ui-monospace, monospace;
  font-size: 11.5px; color: #556070; white-space: nowrap; flex: none;
}
.wsmfly-more {
  margin: 0 0 12px; font-size: 12px; color: #556070;
}

/* Saved + bag now render the MARKETPLACE card (operator 2026-08-20: the same
   lot must look the same everywhere). The page-specific control sits under
   the card rather than replacing part of it, so the card itself stays
   byte-identical to the catalogue's. */
.wmb-cardwrap { display: flex; flex-direction: column; }
.wmb-cardwrap.is-gone { opacity: 0.6; }
.wmb-cardwrap .wmb-card-actions {
  display: flex; align-items: center; justify-content: space-between;
  gap: 10px; padding: 8px 2px 0;
}
.wmb-gone {
  border: 1px dashed #E4E2EE; border-radius: 14px; padding: 22px 16px;
  background: #FAFAFC; min-height: 150px; display: flex; align-items: center;
}