:root {
  --blx-bg: #f5f7fb;
  --blx-surface: #ffffff;
  --blx-surface-2: #f3f6fb;
  --blx-border: #e4eaf4;
  --blx-text: #0f172a;
  --blx-muted: #64748b;
  --blx-accent: #6d5efc;
  --blx-accent-2: #3b82f6;
  --blx-elite: linear-gradient(135deg, #8b5cf6, #6366f1);
  --blx-green: #059669;
  --blx-orange: #d97706;
  --blx-red: #dc2626;
  --blx-shadow: 0 24px 70px rgba(15, 23, 42, .10);
  --blx-shadow-soft: 0 14px 36px rgba(15, 23, 42, .08);
  --blx-radius: 24px;
  --blx-radius-lg: 30px;
  --blx-radius-sm: 18px;
}

@media (prefers-color-scheme: dark) {
  :root {
    --blx-bg: #0b1220;
    --blx-surface: rgba(255, 255, 255, .06);
    --blx-surface-2: rgba(255, 255, 255, .08);
    --blx-border: rgba(255, 255, 255, .12);
    --blx-text: #f8fafc;
    --blx-muted: #94a3b8;
    --blx-shadow: 0 24px 70px rgba(2, 6, 23, .55);
    --blx-shadow-soft: 0 14px 36px rgba(2, 6, 23, .42);
  }
}

.blx-inline-cta,
.blx-hub,
.blx-op-card,
.blx-card,
.blx-stat-card,
.blx-pane,
.blx-target-card-modern,
.blx-seller-card-modern,
.blx-match-user,
.blx-match-target,
.blx-empty-state,
.blx-sell-gate,
.blx-admin-panel {
  background: var(--blx-surface);
  border: 1px solid var(--blx-border);
  color: var(--blx-text);
  box-shadow: var(--blx-shadow-soft);
  border-radius: var(--blx-radius);
  backdrop-filter: blur(18px);
}

.blx-inline-cta,
.blx-hub,
.blx-browser,
.blx-dashboard-wrap,
.blx-modal,
.blx-modern-shell,
.blx-swipe-wrap,
.blx-empty-state,
.blx-sell-gate {
  font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.blx-kicker {
  display: inline-block;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: .12em;
  font-weight: 800;
  color: var(--blx-accent);
  margin-bottom: 8px;
}

.blx-title,
.blx-inline-cta h3,
.blx-hub h2,
.blx-swipe-head h3 {
  margin: 0;
  color: var(--blx-text);
  font-size: clamp(26px, 4vw, 36px);
  line-height: 1.04;
}

.blx-sub,
.blx-inline-cta p,
.blx-hub__head p,
.blx-match-hero p,
.blx-empty-state p {
  margin: 10px 0 0;
  color: var(--blx-muted);
  font-size: 15px;
  line-height: 1.5;
}

.blx-inline-cta {
  margin-top: 14px;
  padding: 22px;
  overflow: hidden;
  background:
    radial-gradient(circle at top right, rgba(109, 94, 252, .16), transparent 34%),
    var(--blx-surface);
}

.blx-inline-cta--desktop-only {
  display: block;
}

.blx-mobile-swap-launcher,
.blx-mobile-swap-launcher-spacer {
  display: none;
}

.blx-mobile-swap-launcher__button {
  width: 100%;
  border: 0;
  border-radius: 22px;
  padding: 14px 18px;
  text-align: left;
  color: #fff;
  background: linear-gradient(135deg, var(--blx-accent), var(--blx-accent-2));
  box-shadow: 0 20px 42px rgba(59, 130, 246, .28);
}

.blx-mobile-swap-launcher__button strong,
.blx-mobile-swap-launcher__button small,
.blx-mobile-swap-launcher__button span {
  display: block;
}

.blx-mobile-swap-launcher__eyebrow {
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .14em;
  opacity: .84;
  margin-bottom: 6px;
}

.blx-mobile-swap-launcher__button strong {
  font-size: 18px;
  line-height: 1.1;
}

.blx-mobile-swap-launcher__button small {
  margin-top: 6px;
  font-size: 13px;
  line-height: 1.35;
  opacity: .92;
}

.blx-mobile-swipe-shell {
  min-height: 100vh;
  padding: calc(64px + env(safe-area-inset-top)) 12px calc(14px + env(safe-area-inset-bottom));
}

.blx-mobile-swipe-shell__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 14px;
}

.blx-mobile-swipe-shell__body {
  min-height: calc(100vh - 150px);
}

.blx-swipe-auto {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 8px 12px;
  border-radius: 999px;
  border: 1px solid rgba(109, 94, 252, .18);
  background: rgba(109, 94, 252, .08);
  color: var(--blx-accent);
  font-size: 12px;
  font-weight: 800;
}

.blx-swipe-card.is-preview-out {
  opacity: 0;
  transform: translateX(-20px) scale(.96);
}


.blx-inline-explorer {
  margin-top: 16px;
  padding: 20px;
  border-radius: var(--blx-radius);
  border: 1px solid var(--blx-border);
  background: var(--blx-surface);
  box-shadow: var(--blx-shadow-soft);
  scroll-margin-top: 110px;
}

.blx-inline-explorer__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 14px;
}

.blx-inline-explorer__head h4 {
  margin: 0;
  font-size: clamp(20px, 2.8vw, 28px);
  line-height: 1.08;
  color: var(--blx-text);
}

.blx-inline-explorer__head p {
  margin: 8px 0 0;
  color: var(--blx-muted);
  font-size: 14px;
}

.blx-inline-explorer__meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
}

.blx-inline-explorer__mobile,
.blx-inline-explorer__desktop {
  min-height: 120px;
}

.blx-inline-explorer__desktop {
  display: block;
}

.blx-inline-explorer__mobile {
  display: none;
}

.blx-inline-cta__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 12px;
}

.blx-inline-cta__head-right {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.blx-inline-cta__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 14px;
  color: var(--blx-muted);
  font-size: 14px;
  margin-bottom: 14px;
}

.blx-inline-cta__suggestion,
.blx-card__hint,
.blx-op-card__hint,
.blx-match-summary {
  border-radius: 18px;
  padding: 14px 16px;
  border: 1px solid rgba(109, 94, 252, .18);
  background: linear-gradient(135deg, rgba(109, 94, 252, .12), rgba(59, 130, 246, .08));
  color: var(--blx-text);
  margin-bottom: 14px;
}

.blx-inline-cta__notice,
.blx-hub__head-note,
.blx-warning,
.blx-message,
.blx-empty-inline {
  padding: 14px 16px;
  border-radius: 18px;
  background: var(--blx-surface-2);
  border: 1px solid var(--blx-border);
  color: var(--blx-muted);
}

.blx-inline-cta__notice.is-warn,
.blx-warning {
  border-color: rgba(217, 119, 6, .22);
  background: rgba(245, 158, 11, .10);
  color: var(--blx-orange);
}

.blx-inline-cta__actions,
.blx-card__actions,
.blx-builder-actions,
.blx-op-card__actions,
.blx-actions,
.blx-actions-row {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.blx-builder-actions {
  position: sticky;
  bottom: 0;
  padding-top: 10px;
  background: linear-gradient(180deg, rgba(245,247,251,0), var(--blx-bg) 38%);
}

@media (prefers-color-scheme: dark) {
  .blx-builder-actions {
    background: linear-gradient(180deg, rgba(11,18,32,0), var(--blx-bg) 38%);
  }
}

.blx-btn,
.blx-inline-cta .btn,
.blx-card .btn,
.blx-op-card .btn,
.blx-swipe-card .btn,
.blx-builder-actions .btn,
.blx-actions .btn {
  border: 0;
  border-radius: 16px;
  padding: 12px 16px;
  font-weight: 800;
  line-height: 1;
  cursor: pointer;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: transform .18s ease, box-shadow .18s ease, opacity .18s ease;
}

.blx-btn:hover,
.blx-inline-cta .btn:hover,
.blx-card .btn:hover,
.blx-op-card .btn:hover,
.blx-swipe-card .btn:hover,
.blx-builder-actions .btn:hover,
.blx-actions .btn:hover {
  transform: translateY(-1px);
}

.blx-btn--primary,
.blx-inline-cta .btn-primary,
.blx-card .btn-primary,
.blx-op-card .btn-primary,
.blx-swipe-card .btn-primary,
.blx-builder-actions .btn-primary,
.blx-actions .btn-primary {
  background: linear-gradient(135deg, var(--blx-accent), var(--blx-accent-2));
  color: #fff;
  box-shadow: 0 16px 34px rgba(59, 130, 246, .24);
}

.blx-inline-cta .btn-outline,
.blx-card .btn-outline,
.blx-op-card .btn-outline,
.blx-swipe-card .btn-outline,
.blx-builder-actions .btn-outline,
.blx-actions .btn-outline,
.blx-btn:not(.blx-btn--primary) {
  background: var(--blx-surface-2);
  border: 1px solid var(--blx-border);
  color: var(--blx-text);
}

.blx-pill,
.blx-status,
.blx-eval,
.blx-score-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  border-radius: 999px;
  padding: 7px 11px;
  font-size: 12px;
  font-weight: 800;
  line-height: 1;
}

.blx-pill--elite {
  color: #fff;
  background: var(--blx-elite);
}

.blx-pill--strong,
.blx-eval--great,
.blx-eval--balanced,
.blx-status--accepted {
  color: var(--blx-green);
  background: rgba(5, 150, 105, .12);
}

.blx-pill--medium,
.blx-eval--review,
.blx-status--pending,
.blx-status--countered {
  color: var(--blx-orange);
  background: rgba(245, 158, 11, .12);
}

.blx-pill--weak,
.blx-eval--unusual,
.blx-status--refused,
.blx-status--cancelled,
.blx-status--expired,
.blx-status--superseded {
  color: var(--blx-red);
  background: rgba(239, 68, 68, .12);
}

.blx-score-badge {
  min-width: 54px;
  color: #fff;
  background: linear-gradient(135deg, rgba(109, 94, 252, .95), rgba(59, 130, 246, .95));
}

.blx-progress-wrap {
  display: grid;
  gap: 12px;
  margin-top: 16px;
}

.blx-progress-row {
  display: grid;
  gap: 8px;
}

.blx-progress-label {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  font-size: 14px;
}

.blx-progress {
  height: 10px;
  border-radius: 999px;
  background: var(--blx-surface-2);
  border: 1px solid var(--blx-border);
  overflow: hidden;
}

.blx-progress > span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(135deg, var(--blx-accent), var(--blx-accent-2));
}

.blx-hub {
  padding: 22px;
}

.blx-hub__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 18px;
}

.blx-stat-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 18px;
}

.blx-stat-card {
  padding: 16px;
}

.blx-stat-card span {
  display: block;
  color: var(--blx-muted);
  font-size: 13px;
  margin-bottom: 6px;
}

.blx-stat-card strong {
  font-size: 30px;
  line-height: 1;
}

.blx-tabbar {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 18px;
}

.blx-tab {
  border: 1px solid var(--blx-border);
  background: var(--blx-surface-2);
  color: var(--blx-text);
  border-radius: 14px;
  padding: 11px 14px;
  font-weight: 800;
  cursor: pointer;
}

.blx-tab.is-active {
  background: linear-gradient(135deg, rgba(109, 94, 252, .14), rgba(59, 130, 246, .10));
  border-color: rgba(109, 94, 252, .35);
}

.blx-tabpane {
  display: none;
}

.blx-tabpane.is-active {
  display: block;
}

.blx-list-stack {
  display: grid;
  gap: 14px;
}

.blx-card {
  padding: 18px;
}

.blx-card-head,
.blx-card__head,
.blx-card__top-right,
.blx-card__identity,
.blx-meta-row,
.blx-card__stats,
.blx-row-between {
  display: flex;
  gap: 12px;
}

.blx-card-head,
.blx-card__head,
.blx-meta-row,
.blx-row-between {
  align-items: flex-start;
  justify-content: space-between;
}

.blx-card__identity,
.blx-target,
.blx-target-card-modern,
.blx-seller-card-modern,
.blx-item-mini,
.blx-mini-item,
.blx-match-target {
  align-items: center;
}

.blx-target,
.blx-card__identity,
.blx-target-card-modern,
.blx-seller-card-modern,
.blx-item-mini,
.blx-mini-item,
.blx-match-target {
  display: flex;
  gap: 12px;
}

.blx-target img,
.blx-card__identity img,
.blx-item-mini img,
.blx-mini-item img,
.blx-target-card-modern img,
.blx-seller-card-modern img,
.blx-match-target img,
.blx-op-card__image img,
.blx-swipe-card__image,
.blx-item-card img,
.blx-match-user img {
  width: 72px;
  height: 72px;
  border-radius: 18px;
  object-fit: cover;
  flex: 0 0 auto;
}

.blx-seller-card-modern img,
.blx-match-user img,
.blx-op-card__meta img {
  width: 52px;
  height: 52px;
  border-radius: 50%;
}

.blx-target-title,
.blx-card__title,
.blx-op-card__title {
  font-size: 20px;
  line-height: 1.2;
  font-weight: 800;
  color: var(--blx-text);
}

.blx-card__sub,
.blx-meta,
.blx-op-card__meta,
.blx-item-card__body span,
.blx-item-mini-price,
.blx-mini-item span,
.blx-match-user small,
.blx-seller-card-modern small {
  color: var(--blx-muted);
  font-size: 14px;
}

.blx-card__stats,
.blx-summary-grid,
.blx-offer-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-top: 14px;
}

.blx-card__stats > div,
.blx-summary-grid > div,
.blx-offer-summary > div {
  padding: 12px;
  border-radius: 16px;
  border: 1px solid var(--blx-border);
  background: var(--blx-surface-2);
}

.blx-card__stats span,
.blx-summary-grid span {
  display: block;
  font-size: 13px;
  color: var(--blx-muted);
  margin-bottom: 6px;
}

.blx-card__stats strong,
.blx-summary-grid strong {
  font-size: 18px;
}

.blx-builder-summary {
  display: grid;
  gap: 10px;
  margin-top: 14px;
}

.blx-deal-signal {
  padding: 12px 14px;
  border-radius: 16px;
  font-weight: 800;
}

.blx-deal-signal--strong {
  color: var(--blx-green);
  background: rgba(5, 150, 105, .12);
}

.blx-deal-signal--medium {
  color: var(--blx-orange);
  background: rgba(245, 158, 11, .12);
}

.blx-deal-signal--weak {
  color: var(--blx-red);
  background: rgba(239, 68, 68, .12);
}

.blx-summary-note,
.blx-summary-hint {
  color: var(--blx-muted);
  font-size: 14px;
}

.blx-probability {
  margin-top: 14px;
  display: grid;
  gap: 8px;
}

.blx-probability-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  font-size: 14px;
}

.blx-probability-bar {
  height: 10px;
  border-radius: 999px;
  background: var(--blx-surface-2);
  border: 1px solid var(--blx-border);
  overflow: hidden;
}

.blx-probability-bar span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(135deg, var(--blx-accent), var(--blx-accent-2));
}

.blx-modal {
  position: fixed;
  inset: 0;
  z-index: 999999;
  opacity: 0;
  pointer-events: none;
  transition: opacity .18s ease;
}

.blx-modal.is-open {
  opacity: 1;
  pointer-events: auto;
}

.blx-modal.is-mobile-swipe .blx-panel {
  width: 100vw;
  height: 100vh;
  max-height: 100vh;
  margin: 0;
  border-radius: 0;
  border: 0;
}

.blx-modal.is-mobile-swipe #blx-modal-body {
  padding: 0;
}

.blx-modal.is-mobile-swipe .blx-close {
  position: fixed;
  top: calc(12px + env(safe-area-inset-top));
  right: 12px;
  margin: 0;
  background: rgba(255,255,255,.88);
  backdrop-filter: blur(18px);
}

.blx-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(3, 7, 18, .64);
  backdrop-filter: blur(8px);
}

.blx-panel {
  position: relative;
  width: min(1140px, calc(100vw - 20px));
  margin: 10px auto;
  max-height: calc(100vh - 20px);
  overflow: auto;
  background: var(--blx-bg);
  border: 1px solid var(--blx-border);
  border-radius: var(--blx-radius-lg);
  box-shadow: var(--blx-shadow);
}

.blx-close {
  position: sticky;
  top: 10px;
  margin-left: auto;
  z-index: 5;
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border-radius: 16px;
  border: 1px solid var(--blx-border);
  background: var(--blx-surface-2);
  color: var(--blx-text);
  font-size: 24px;
  cursor: pointer;
  right: 10px;
}

#blx-modal-body {
  padding: 0 18px 18px;
}

.blx-modern-shell {
  padding: 8px 4px 10px;
}

.blx-builder-head,
.blx-pane__head,
.blx-match-hero,
.blx-swipe-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.blx-builder-head {
  margin-bottom: 16px;
}

.blx-builder-head__badges {
  display: flex;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
}

.blx-builder-grid {
  display: grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 18px;
}

.blx-pane {
  padding: 18px;
}

.blx-pane__head h4 {
  margin: 0;
  font-size: 18px;
}

.blx-selected-panel,
.blx-suggestion-row,
.blx-items-grid {
  display: grid;
  gap: 12px;
}

.blx-form-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 14px;
}

.blx-radio {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 12px;
  border-radius: 16px;
  border: 1px solid var(--blx-border);
  background: var(--blx-surface-2);
  font-size: 14px;
  color: var(--blx-text);
}

.blx-radio.is-disabled {
  opacity: .5;
}

.blx-money-row {
  margin-top: 10px;
}

.blx-money-row input,
.blx-counter-form input,
.blx-textarea,
.blx-counter-form textarea {
  width: 100%;
  box-sizing: border-box;
  border-radius: 16px;
  border: 1px solid var(--blx-border);
  background: var(--blx-surface-2);
  color: var(--blx-text);
  padding: 12px 14px;
  font: inherit;
}

.blx-label {
  display: block;
  font-weight: 800;
  margin: 16px 0 10px;
}

.blx-item-card {
  display: flex;
  gap: 12px;
  padding: 12px;
  border-radius: 18px;
  border: 1px solid var(--blx-border);
  background: var(--blx-surface-2);
  color: var(--blx-text);
  text-align: left;
  cursor: pointer;
}

.blx-item-card__body {
  min-width: 0;
  display: grid;
  gap: 4px;
}

.blx-item-card__body strong {
  font-size: 15px;
  line-height: 1.25;
}

.blx-item-card__body small,
.blx-item-card__body em {
  color: var(--blx-muted);
  font-size: 12px;
  font-style: normal;
}

.blx-item-card.is-selected,
.blx-suggestion-chip.is-selected {
  border-color: rgba(109, 94, 252, .48);
  box-shadow: 0 0 0 3px rgba(109, 94, 252, .12);
  background: linear-gradient(135deg, rgba(109, 94, 252, .10), rgba(59, 130, 246, .08));
}

.blx-item-card.is-disabled {
  cursor: not-allowed;
  opacity: .55;
}

.blx-mini-item {
  display: flex;
  gap: 12px;
  align-items: center;
  padding: 12px;
  border-radius: 18px;
  background: var(--blx-surface-2);
  border: 1px solid var(--blx-border);
}

.blx-mini-item strong {
  display: block;
  font-size: 15px;
}

.blx-suggestion-chip {
  width: 100%;
  text-align: left;
  padding: 14px;
  border-radius: 18px;
  border: 1px solid var(--blx-border);
  background: var(--blx-surface-2);
  color: var(--blx-text);
  display: grid;
  gap: 8px;
  cursor: pointer;
}

.blx-suggestion-chip strong {
  font-size: 15px;
  line-height: 1.25;
}

.blx-suggestion-chip small {
  color: var(--blx-muted);
  font-size: 12px;
}

.blx-op-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.blx-op-card {
  overflow: hidden;
}

.blx-op-card__image {
  position: relative;
  aspect-ratio: 4 / 3;
  background: var(--blx-surface-2);
}

.blx-op-card__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.blx-op-card__image .blx-score-badge {
  position: absolute;
  top: 12px;
  right: 12px;
}

.blx-op-card__body {
  padding: 16px;
}

.blx-op-card__price {
  font-size: 24px;
  font-weight: 900;
  margin: 8px 0 10px;
}

.blx-op-card__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
  margin-bottom: 12px;
}

.blx-swipe-wrap {
  min-height: 70vh;
}

.blx-swipe-stack {
  position: relative;
  min-height: 70vh;
}

.blx-swipe-card {
  position: absolute;
  inset: 0;
  border-radius: 28px;
  background: var(--blx-surface);
  border: 1px solid var(--blx-border);
  box-shadow: var(--blx-shadow);
  overflow: hidden;
  transform-origin: center center;
  transition: transform .22s ease, opacity .22s ease;
  user-select: none;
  touch-action: pan-y;
}

.blx-swipe-card[data-swipe-index="1"] {
  transform: scale(.97) translateY(12px);
  opacity: .78;
}

.blx-swipe-card[data-swipe-index="2"] {
  transform: scale(.94) translateY(24px);
  opacity: .56;
}

.blx-swipe-card.is-top {
  z-index: 5;
}

.blx-swipe-card.is-dragging {
  transition: none;
}

.blx-swipe-card__image {
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: 0;
}

.blx-swipe-card__body {
  padding: 18px;
}

.blx-swipe-badge {
  position: absolute;
  top: 18px;
  z-index: 10;
  padding: 9px 12px;
  border-radius: 999px;
  font-size: 12px;
  letter-spacing: .08em;
  font-weight: 900;
  opacity: 0;
  transition: opacity .14s ease;
  color: #fff;
}

.blx-swipe-badge--like {
  left: 18px;
  background: rgba(5, 150, 105, .96);
}

.blx-swipe-badge--pass {
  right: 18px;
  background: rgba(220, 38, 38, .96);
}

.blx-match-hero {
  margin-bottom: 16px;
}

.blx-match-users {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: 12px;
  align-items: center;
  margin-bottom: 16px;
}

.blx-match-user {
  padding: 18px;
  text-align: center;
}

.blx-match-user strong {
  display: block;
  margin-top: 10px;
  font-size: 18px;
}

.blx-match-vs {
  font-size: 28px;
  font-weight: 900;
  color: var(--blx-accent);
}

.blx-match-target {
  padding: 14px;
  margin-bottom: 14px;
}

.blx-match-target strong {
  display: block;
  font-size: 18px;
}

.blx-match-target span {
  color: var(--blx-muted);
}

.blx-match-target__label {
  display: block;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
  margin-bottom: 4px;
}

.blx-match-pair,
.blx-match-pair-modal {
  display: grid;
  gap: 12px;
  margin-bottom: 16px;
}

.blx-match-pair {
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
}

.blx-match-pair__item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px;
  border-radius: 18px;
  border: 1px solid var(--blx-border);
  background: var(--blx-surface-2);
}

.blx-match-pair__item img {
  width: 64px;
  height: 64px;
  border-radius: 16px;
  object-fit: cover;
  flex: 0 0 auto;
}

.blx-match-pair__item span {
  display: block;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--blx-muted);
  margin-bottom: 4px;
}

.blx-match-pair__item strong {
  display: block;
  font-size: 16px;
  line-height: 1.2;
}

.blx-match-pair__arrow {
  font-size: 24px;
  font-weight: 900;
  color: var(--blx-accent);
}

.blx-op-card__actions--swipe {
  justify-content: space-between;
}

.blx-op-card__actions--swipe .btn {
  flex: 1 1 calc(50% - 6px);
}

.blx-browser-loading,
.blx-empty-state {
  padding: 28px;
  text-align: center;
  color: var(--blx-muted);
}

.blx-empty-state--modal {
  min-height: 180px;
  display: grid;
  place-items: center;
}

.blx-empty-state.is-loading {
  color: var(--blx-muted);
}

.blx-dashboard-wrap {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
}

.blx-dashboard-col {
  display: grid;
  gap: 14px;
}

.blx-section-title {
  font-size: 14px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--blx-accent);
}

.blx-items-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.blx-item-mini {
  padding: 10px;
  border-radius: 16px;
  background: var(--blx-surface-2);
  border: 1px solid var(--blx-border);
}

.blx-item-mini-title {
  font-size: 14px;
  font-weight: 700;
  line-height: 1.25;
}

.blx-offer-summary {
  margin-top: 14px;
}

.blx-message,
.blx-meta-row,
.blx-counter-form {
  margin-top: 12px;
}

.blx-counter-form {
  display: grid;
  gap: 10px;
  padding: 14px;
  border-radius: 18px;
  background: var(--blx-surface-2);
  border: 1px solid var(--blx-border);
}

.blx-counter-form label {
  display: flex;
  gap: 8px;
  align-items: center;
  color: var(--blx-text);
  font-size: 14px;
}

.blx-countdown {
  font-size: 13px;
  font-weight: 700;
  color: var(--blx-accent);
}

.blx-countdown.is-expired,
.blx-card.is-expired .blx-countdown {
  color: var(--blx-red);
}

.blx-toast-stack {
  position: fixed;
  right: 14px;
  bottom: 14px;
  display: grid;
  gap: 10px;
  z-index: 1000000;
  pointer-events: none;
}

.blx-toast {
  min-width: 220px;
  max-width: 360px;
  padding: 12px 14px;
  border-radius: 16px;
  color: #fff;
  opacity: 0;
  transform: translateY(10px);
  transition: opacity .2s ease, transform .2s ease;
  box-shadow: var(--blx-shadow);
}

.blx-toast.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.blx-toast--info { background: linear-gradient(135deg, #475569, #334155); }
.blx-toast--success { background: linear-gradient(135deg, #10b981, #059669); }
.blx-toast--error { background: linear-gradient(135deg, #ef4444, #dc2626); }

@media (max-width: 1180px) {
  .blx-op-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 980px) {
  .blx-builder-grid,
  .blx-dashboard-wrap,
  .blx-hub__head,
  .blx-inline-cta__head,
  .blx-match-users,
  .blx-inline-explorer__head {
    grid-template-columns: 1fr;
    display: grid;
  }

  .blx-inline-cta--desktop-only {
    display: none;
  }

  .blx-mobile-swap-launcher {
    display: block;
    position: fixed;
    left: 12px;
    right: 12px;
    bottom: calc(12px + env(safe-area-inset-bottom));
    z-index: 99990;
    pointer-events: none;
  }

  .blx-mobile-swap-launcher__button {
    pointer-events: auto;
  }

  .blx-mobile-swap-launcher-spacer {
    display: block;
    height: 96px;
  }


  .blx-stat-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .blx-op-grid {
    grid-template-columns: 1fr;
  }

  .blx-match-vs,
  .blx-match-pair__arrow {
    display: none;
  }

  .blx-match-pair {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 760px) {
  .blx-panel {
    width: calc(100vw - 12px);
    margin: 6px auto;
    max-height: calc(100vh - 12px);
    border-radius: 24px;
  }

  .blx-modal.is-mobile-swipe .blx-panel {
    width: 100vw;
    height: 100vh;
    max-height: 100vh;
    margin: 0;
    border-radius: 0;
  }

  .blx-inline-explorer {
    padding: 16px;
    border-radius: 20px;
  }

  .blx-inline-explorer__desktop {
    display: none;
  }

  .blx-inline-explorer__mobile {
    display: block;
  }

  #blx-modal-body {
    padding: 0 10px 12px;
  }

  .blx-inline-cta,
  .blx-hub,
  .blx-pane,
  .blx-card,
  .blx-stat-card {
    padding: 16px;
    border-radius: 20px;
  }

  .blx-inline-cta--desktop-only {
    display: none;
  }

  .blx-mobile-swap-launcher {
    display: block;
    position: fixed;
    left: 12px;
    right: 12px;
    bottom: calc(12px + env(safe-area-inset-bottom));
    z-index: 99990;
    pointer-events: none;
  }

  .blx-mobile-swap-launcher__button {
    pointer-events: auto;
  }

  .blx-mobile-swap-launcher-spacer {
    display: block;
    height: 96px;
  }

  .blx-inline-cta__actions .btn,
  .blx-builder-actions .btn,
  .blx-op-card__actions .btn,
  .blx-actions .btn {
    width: 100%;
  }

  .blx-items-grid,
  .blx-card__stats,
  .blx-summary-grid,
  .blx-offer-summary,
  .blx-stat-grid {
    grid-template-columns: 1fr;
  }

  .blx-target img,
  .blx-card__identity img,
  .blx-item-mini img,
  .blx-mini-item img,
  .blx-target-card-modern img,
  .blx-seller-card-modern img,
  .blx-match-target img,
  .blx-item-card img {
    width: 62px;
    height: 62px;
  }

  .blx-swipe-wrap,
  .blx-swipe-stack {
    min-height: 74vh;
  }
}

@media (prefers-reduced-motion: reduce) {
  .blx-btn,
  .blx-inline-cta .btn,
  .blx-card .btn,
  .blx-op-card .btn,
  .blx-swipe-card,
  .blx-toast,
  .blx-modal {
    transition: none !important;
  }
}