/* V2.30.34.3.8.39 — true 3x3 image calculator + removed feature cleanup */

/* Keep every functional page on the same near-black visual system as Home. */
body:not([data-theme="light"]) {
  --sw-bg: #030304;
  --sw-panel: #07080a;
  --sw-panel-raised: #0a0b0e;
  --sw-panel-soft: #0d0e12;
  --sw-line: rgba(255, 255, 255, 0.075);
  --sw-line-strong: rgba(185, 160, 255, 0.19);
  background: #030304 !important;
}

body:not([data-theme="light"]) .app {
  background: #030304 !important;
}

body:not([data-theme="light"]) .app > .page:not(#page-home) :is(
  .card,
  .tool-card,
  .trade-main,
  .trade-side,
  .verdict-card,
  .engine-panel,
  .engine-metric,
  .engine-hero,
  .feedback-form,
  .feedback-status-card,
  .history-card,
  .shop-card,
  .goal-card,
  .insight-panel,
  .heat-stat,
  .heat-row,
  .leaderboard-hero,
  .leaderboard-board,
  .leaderboard-row,
  .planner-banner,
  .planner-controls,
  .target-output-card,
  .upgrade-summary-card,
  .upgrade-stage,
  .compare-card,
  .compare-panel,
  .inventory-card,
  .inventory-summary,
  .inventory-row,
  .tracker-overview,
  .tracker-overview-metric,
  .tracker-full-panel,
  .tracker-side,
  .tracker-history-item,
  .tracker-empty,
  .bv2-panel,
  .stat-card
) {
  background-color: #07080a !important;
  background-image: none !important;
  border-color: rgba(255, 255, 255, 0.075) !important;
  box-shadow: 0 12px 34px rgba(0, 0, 0, 0.22) !important;
}

body:not([data-theme="light"]) .app > .page:not(#page-home) :is(
  .mini-stat,
  .engine-signal-strip > div,
  .advanced-verdict > div,
  .verdict-note,
  .verdict-callout,
  .trade-explain-card,
  .fair-adds-card,
  .inventory-mode-btn,
  .inventory-trade-tray,
  .inventory-trade-card,
  .planner-tabs,
  .planner-tabs button,
  .target-result,
  .insight-row,
  .goal-row,
  .history-row,
  .tracker-result-strip,
  .tracker-meta-panel,
  .tracker-item-row,
  .tracker-view-tabs,
  .tracker-view-tabs button,
  .settings-section,
  .toggle-row,
  .admin-card
) {
  background-color: #0a0b0e !important;
  background-image: none !important;
  border-color: rgba(255, 255, 255, 0.075) !important;
}

body:not([data-theme="light"]) .app > .page:not(#page-home) :is(
  .btn,
  .field,
  .big-input,
  select,
  input,
  textarea
) {
  background-color: #0a0b0e !important;
  background-image: none !important;
  border-color: rgba(255, 255, 255, 0.09) !important;
}

/* Compact calculator header so the whole working area begins immediately. */
#page-trade > .section-head {
  min-height: 76px !important;
  margin-bottom: 10px !important;
  padding: 2px 0 12px !important;
}

#page-trade > .section-head h2 {
  margin: 3px 0 3px !important;
  font-size: clamp(31px, 2.6vw, 40px) !important;
}

#page-trade > .section-head p {
  font-size: 11px !important;
}

#page-trade .bv2-head-signal {
  min-height: 34px;
  padding: 0 11px;
  background: #070b08 !important;
}

/* Main calculator fits in one desktop viewport at normal zoom. */
#page-trade .trade-shell {
  grid-template-columns: minmax(0, 1fr) minmax(280px, 318px) !important;
  gap: 12px !important;
  align-items: start;
}

#page-trade .trade-main {
  padding: 12px !important;
  overflow: visible !important;
  background: #07080a !important;
}

#page-trade .trade-head {
  min-height: 40px !important;
  margin-bottom: 6px !important;
  padding-bottom: 7px !important;
}

#page-trade .trade-head strong {
  font-size: 13px !important;
}

#page-trade .trade-head .small {
  margin-top: 1px !important;
  font-size: 9px !important;
}

#page-trade .trade-actions,
#page-trade .engine-toolbar-actions {
  gap: 5px !important;
}

#page-trade .trade-actions .btn,
#page-trade .engine-toolbar-actions .btn {
  min-height: 31px !important;
  padding: 5px 8px !important;
  font-size: 9px !important;
}

#page-trade .engine-toolbar {
  grid-template-columns: minmax(205px, 1fr) auto !important;
  min-height: 48px !important;
  gap: 8px !important;
  padding: 6px 0 !important;
}

#page-trade .inventory-mode-btn {
  min-height: 38px !important;
  padding: 5px 8px !important;
  background: #0a0b0e !important;
}

#page-trade .inventory-mode-btn b {
  font-size: 9px !important;
}

#page-trade .inventory-mode-btn small,
#page-trade .inventory-mode-btn i {
  font-size: 7.5px !important;
}

#page-trade .inventory-mode-icon {
  width: 28px !important;
  height: 28px !important;
}

#page-trade .engine-signal-strip {
  gap: 5px !important;
  margin: 7px 0 !important;
}

#page-trade .engine-signal-strip > div {
  min-height: 48px !important;
  padding: 7px 8px !important;
  background: #0a0b0e !important;
}

#page-trade .engine-signal-strip span {
  font-size: 7px !important;
}

#page-trade .engine-signal-strip strong {
  margin-top: 2px !important;
  font-size: 13px !important;
}

#page-trade .engine-signal-strip small {
  display: none !important;
}

#page-trade .trade-columns {
  grid-template-columns: minmax(0, 1fr) 30px minmax(0, 1fr) !important;
  gap: 7px !important;
  align-items: center;
}

#page-trade .trade-side {
  padding: 8px !important;
  background: #08090b !important;
}

#page-trade .side-title {
  min-height: 24px !important;
  margin-bottom: 5px !important;
}

#page-trade .side-title h3 {
  font-size: 13px !important;
}

#page-trade .side-title .badge {
  padding: 3px 6px !important;
  font-size: 7px !important;
}

/* Nine square, image-only slots in a true three-by-three grid. */
#page-trade .slot-grid {
  display: grid !important;
  width: 100% !important;
  max-width: none !important;
  margin-inline: 0 !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  grid-auto-flow: row !important;
  gap: 7px !important;
}

#page-trade .slot {
  position: relative;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  aspect-ratio: 1 / 1 !important;
  overflow: hidden !important;
  border-radius: 8px !important;
  background: #050608 !important;
}

#page-trade .slot.filled {
  display: block !important;
}

#page-trade .slot-open {
  display: grid !important;
  width: 100% !important;
  height: 100% !important;
  padding: 5px !important;
  place-items: center !important;
  overflow: hidden !important;
}

#page-trade .slot img {
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  padding: 2px !important;
  object-fit: contain !important;
  background: transparent !important;
  filter: drop-shadow(0 5px 8px rgba(0, 0, 0, 0.5));
}

#page-trade .slot-copy,
#page-trade .slot-owned {
  display: none !important;
}

#page-trade .slot.empty {
  display: grid !important;
  place-items: center !important;
  padding: 0 !important;
  color: #9c7cff !important;
  font-size: 0 !important;
  border-style: dashed !important;
  background: #06070a !important;
}

#page-trade .slot.empty::before {
  content: "+";
  display: grid;
  width: 28px;
  height: 28px;
  place-items: center;
  border: 1px solid rgba(156, 124, 255, 0.24);
  border-radius: 8px;
  background: #0a0b10;
  color: #a78bff;
  font-size: 19px;
  line-height: 1;
}

#page-trade .slot.empty > span {
  display: none !important;
}

#page-trade .slot-remove {
  top: 4px !important;
  right: 4px !important;
  width: 20px !important;
  height: 20px !important;
  border-radius: 7px !important;
  background: rgba(3, 3, 5, 0.88) !important;
  font-size: 13px !important;
}

#page-trade .side-totals {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 4px !important;
  margin-top: 5px !important;
}

#page-trade .side-totals .mini-stat {
  min-height: 39px !important;
  padding: 5px 6px !important;
  background: #0a0b0e !important;
}

#page-trade .side-totals .mini-stat span {
  font-size: 6px !important;
}

#page-trade .side-totals .mini-stat strong {
  margin-top: 2px !important;
  font-size: 9px !important;
}

#page-trade .swap-col {
  padding-top: 20px !important;
}

#page-trade .swap-btn {
  width: 29px !important;
  height: 29px !important;
  border-radius: 8px !important;
  background: #0b0c10 !important;
  font-size: 15px !important;
}

#page-trade .trade-main > p.small.muted {
  margin: 5px 2px 0 !important;
  font-size: 8px !important;
}

/* The result summary is always visible; deeper analysis opens only when requested. */
#page-trade .verdict-card {
  top: calc(var(--top) + 10px) !important;
  background: #07080a !important;
}

#page-trade .verdict-top {
  padding: 14px 14px 11px !important;
  background: #07080a !important;
}

#page-trade .verdict-orb {
  width: 42px !important;
  height: 42px !important;
  border-radius: 12px !important;
  font-size: 21px !important;
}

#page-trade .verdict-top h2 {
  margin-top: 7px !important;
  font-size: 21px !important;
}

#page-trade .verdict-top p,
#page-trade #ratioText {
  font-size: 9px !important;
}

#page-trade .meter {
  margin-top: 10px !important;
}

#page-trade .verdict-details-toggle {
  display: flex !important;
  width: calc(100% - 20px) !important;
  min-height: 34px !important;
  margin: 0 10px 10px !important;
  align-items: center;
  justify-content: space-between;
  padding: 0 10px !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  border-radius: 9px !important;
  background: #0a0b0e !important;
  color: #d9d5e2 !important;
  font-size: 9px !important;
  font-weight: 800;
  cursor: pointer;
}

#page-trade .verdict-card:not(.details-open) .verdict-body {
  display: none !important;
}

#page-trade .verdict-card.details-open .verdict-body {
  display: block !important;
}

#page-trade .verdict-body {
  padding: 10px !important;
  background: #07080a !important;
}

#page-trade .verdict-stats,
#page-trade .advanced-verdict {
  gap: 5px !important;
}

#page-trade .verdict-body .mini-stat,
#page-trade .advanced-verdict > div {
  min-height: 44px !important;
  padding: 7px !important;
  background: #0a0b0e !important;
}

#page-trade .trade-explain-card,
#page-trade .fair-adds-card {
  padding: 10px !important;
  background: #090a0d !important;
}

@media (max-width: 1349px) and (min-width: 981px) {
  #page-trade .slot-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }

  #page-trade .trade-shell {
    grid-template-columns: minmax(0, 1fr) 280px !important;
  }
}

@media (max-width: 980px) {
  #page-trade > .section-head {
    min-height: 0 !important;
  }

  #page-trade .trade-shell {
    grid-template-columns: 1fr !important;
  }

  #page-trade .slot-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }

  #page-trade .verdict-card {
    position: static !important;
  }
}

@media (max-width: 620px) {
  #page-trade .trade-main {
    padding: 9px !important;
  }

  #page-trade .trade-head,
  #page-trade .engine-toolbar {
    gap: 7px !important;
  }

  #page-trade .trade-columns {
    display: flex !important;
    flex-direction: column !important;
    gap: 7px !important;
  }

  #page-trade .trade-side {
    width: 100% !important;
  }

  #page-trade .slot-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }

  #page-trade .swap-col {
    height: 30px !important;
    padding: 0 !important;
  }

  #page-trade .side-totals {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}


/* v2.30.34.3.8.39 — admin global refresh */
.admin-refresh-all-btn{border-color:rgba(255,106,122,.42)!important;background:linear-gradient(180deg,rgba(127,24,42,.32),rgba(72,10,22,.24))!important;color:#ffbdc5!important;box-shadow:inset 0 1px rgba(255,255,255,.04)}
.admin-refresh-all-btn:hover{border-color:rgba(255,120,136,.68)!important;background:linear-gradient(180deg,rgba(151,31,51,.42),rgba(88,14,27,.32))!important;color:#fff!important}
.admin-refresh-card{margin-bottom:12px;border-color:rgba(255,106,122,.2)!important;background:linear-gradient(145deg,rgba(28,8,13,.82),#0b0b0d 58%)!important}
.admin-refresh-card .admin-card-head{align-items:center}
.admin-refresh-status{display:flex;justify-content:space-between;gap:14px;padding:10px 12px;border:1px solid rgba(255,255,255,.075);border-radius:10px;background:#070708;margin-top:12px}
.admin-refresh-status span{color:var(--muted);font-size:10px}.admin-refresh-status strong{font-size:10px}
#globalRefreshOverlay{position:fixed;z-index:100000;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;background:rgba(0,0,0,.94);backdrop-filter:blur(12px);color:#fff;text-align:center}
#globalRefreshOverlay strong{font-size:18px}#globalRefreshOverlay span{color:#999;font-size:11px}
.global-refresh-spinner{width:34px;height:34px;border:3px solid rgba(255,255,255,.13);border-top-color:#a66cff;border-radius:50%;animation:global-refresh-spin .75s linear infinite}
@keyframes global-refresh-spin{to{transform:rotate(360deg)}}
@media(max-width:800px){.admin-toolbar-actions{display:flex!important}.admin-toolbar-actions #adminApplyAllBtn,.admin-toolbar-actions #adminRefreshBtn,.admin-toolbar-actions #adminSignOutBtn{display:none}.admin-refresh-card .admin-card-head{align-items:flex-start;flex-direction:column}.admin-refresh-card .admin-refresh-all-btn{width:100%}}


/* V2.30.34.3.8.39 cleanup */
#page-trade .trade-side { min-width: 0 !important; }
#page-trade .slot { max-width: none !important; }
.account-profile-stats-simple { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
.account-sync-panel { margin-top: 12px; }
#page-leaderboard .leaderboard-me-grid { grid-template-columns: 1fr !important; }
@media (max-width: 620px) {
  #page-trade .slot { max-width: none !important; }
  .account-profile-stats-simple { grid-template-columns: 1fr !important; }
}
/* V2.30.34.3.8.53 — public calculator only shows listed value and demand. */
#page-trade .side-totals {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}
@media (min-width: 721px) {
  #page-trade .verdict-stats {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}
