/* Compact Counter / Trade builder proportions. Loaded last to override older oversized panel/slot rules. */
#tradeView{max-width:980px;margin:0 auto}
#tradeView .section-heading{align-items:center;gap:16px}
#tradeView .section-heading h1{font-size:clamp(1.7rem,2.7vw,2.35rem)}
#tradeView .section-actions{gap:7px}
#tradeView .section-actions .quiet{padding:9px 13px;border-radius:999px}

#tradeView .trade-layout{grid-template-columns:minmax(0,1fr) 42px minmax(0,1fr);gap:12px;margin-top:18px;align-items:center}
#tradeView .offer-panel{min-height:0;padding:14px;border-radius:15px}
#tradeView .offer-title{font-size:.68rem}
#tradeView .offer-title strong{font-size:.86rem}
#tradeView .offer-slots{grid-template-columns:repeat(3,minmax(0,104px));gap:8px;margin:12px 0;justify-content:start}
#tradeView .slot{width:100%;aspect-ratio:1.22;min-width:0;min-height:0;border-radius:10px}
#tradeView .slot small{font-size:.56rem}
#tradeView .slot.filled{padding:5px}
#tradeView .slot.filled .slot-symbol{font-size:33px!important}
#tradeView .slot-remove{width:18px;height:18px;line-height:16px;font-size:.68rem}
#tradeView .swap-icon{width:38px;height:38px;font-size:1.05rem}
#tradeView .add-cash,#tradeView .add-condition{font-size:.84rem;padding:5px 6px 5px 0}
#tradeView .cash-label{font-size:.75rem}
#tradeView .condition{font-size:.66rem;padding:5px 7px}

#tradeView .trade-picker{margin:16px 0 12px;padding:13px;border-radius:14px}
#tradeView .trade-picker-head h2{font-size:1rem}
#tradeView .trade-search{height:42px;margin-top:10px}
#tradeView .trade-category-row{padding:10px 0 8px}
#tradeView .trade-asset-grid{grid-template-columns:repeat(7,minmax(0,1fr));gap:7px;max-height:250px}
#tradeView .trade-pick-visual{height:54px}
#tradeView .trade-pick-visual span{font-size:35px!important}
#tradeView .trade-pick-card strong{font-size:.64rem;margin-top:6px}
#tradeView .trade-pick-card small{font-size:.6rem;padding-bottom:7px}

#tradeView .value-strip{margin-top:12px;padding:11px 14px;border-radius:12px}
#tradeView .value-strip strong{font-size:.95rem}
#tradeView .trade-actions{margin-top:12px}
#tradeView .trade-actions .primary,#tradeView .trade-actions .quiet{padding:10px 15px}

@media(max-width:900px){
  #tradeView{max-width:760px}
  #tradeView .offer-slots{grid-template-columns:repeat(3,minmax(0,90px))}
  #tradeView .trade-asset-grid{grid-template-columns:repeat(6,minmax(0,1fr))}
}
@media(max-width:720px){
  #tradeView{max-width:none}
  #tradeView .section-heading{align-items:flex-start}
  #tradeView .section-heading h1{font-size:1.65rem}
  #tradeView .trade-layout{grid-template-columns:1fr;gap:8px;margin-top:14px}
  #tradeView .swap-icon{margin:0 auto;transform:rotate(90deg)}
  #tradeView .offer-panel{padding:12px}
  #tradeView .offer-slots{grid-template-columns:repeat(3,minmax(0,86px));justify-content:start}
  #tradeView .slot.filled .slot-symbol{font-size:31px!important}
  #tradeView .trade-asset-grid{grid-template-columns:repeat(4,minmax(0,1fr));max-height:290px}
}
@media(max-width:420px){
  #tradeView .offer-slots{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
  #tradeView .slot{aspect-ratio:1.08}
  #tradeView .slot.filled .slot-symbol{font-size:29px!important}
  #tradeView .trade-picker{padding:11px}
  #tradeView .trade-asset-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
