/* Four Color Comic v40.31.103 — Marketplace layout + visual stability */

/* Main tab switching should be immediate and visually stable. */
#tabs .tabbtn{transition:none!important;animation:none!important}
.tab,.tab.active{animation:none!important;transition:none!important}
.tab.active::before{animation:none!important}

/* v40.31.102 inherited an old six-column rule on the nav container. Once the
   buttons were wrapped, that squeezed the entire primary nav into one tiny
   grid cell. The nav wrapper itself must be one full-width column. */
#marketplace .fcc58-market-head{
  display:grid!important;
  grid-template-columns:minmax(360px,.72fr) minmax(0,1.28fr)!important;
  gap:24px!important;
  align-items:start!important;
}
#marketplace .fcc58-nav{
  display:grid!important;
  grid-template-columns:minmax(0,1fr)!important;
  width:100%!important;
  min-width:0!important;
  gap:10px!important;
  align-content:start!important;
}
#marketplace .fcc102-market-primary{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(130px,1fr))!important;
  width:100%!important;
  min-width:0!important;
  gap:8px!important;
}
#marketplace .fcc102-market-tools{
  display:flex!important;
  width:100%!important;
  gap:8px!important;
  flex-wrap:wrap!important;
  align-items:center!important;
  padding-top:2px!important;
}
#marketplace .fcc102-market-primary .fcc54-nav-btn{
  width:100%!important;
  min-width:0!important;
  min-height:76px!important;
  padding:11px 12px!important;
  display:grid!important;
  grid-template-columns:26px minmax(0,1fr)!important;
  grid-template-rows:auto auto!important;
  column-gap:8px!important;
  align-content:center!important;
  text-align:left!important;
}
#marketplace .fcc102-market-primary .fcc54-nav-btn>span{grid-row:1/3;font-size:18px!important;align-self:center}
#marketplace .fcc102-market-primary .fcc54-nav-btn>b{font-size:12px!important;line-height:1.2!important;white-space:normal!important}
#marketplace .fcc102-market-primary .fcc54-nav-btn>small{font-size:9px!important;line-height:1.25!important;margin:2px 0 0!important;color:#8fa0ae!important;white-space:normal!important}
#marketplace .fcc102-market-tools .fcc54-nav-btn{
  min-height:38px!important;
  width:auto!important;
  padding:8px 11px!important;
  display:flex!important;
  align-items:center!important;
  gap:7px!important;
  border-radius:9px!important;
}
#marketplace .fcc102-market-tools .fcc54-nav-btn>span{font-size:13px!important}
#marketplace .fcc102-market-tools .fcc54-nav-btn>b{font-size:10px!important;white-space:nowrap!important}
#marketplace .fcc102-market-tools .fcc54-nav-btn>small{display:none!important}

/* content-visibility on <img> caused intermittent blank/partial rendering in
   Chromium. Keep it off replaced elements; lazy loading still handles cost. */
#marketplace img{content-visibility:visible!important}
#marketplace img[data-fcc-img-state="failed"]{
  object-fit:contain!important;
  background:#0b111b!important;
}

.fcc102-market-sale-badge{display:inline-flex;margin-left:7px;padding:2px 6px;border:1px solid #3d7e65;border-radius:999px;background:#0d241b;color:#86e8b7;font-size:9px;font-weight:900;letter-spacing:.05em;text-transform:uppercase;vertical-align:middle}

@media(max-width:1280px){
  #marketplace .fcc58-market-head{grid-template-columns:1fr!important}
  #marketplace .fcc102-market-primary{grid-template-columns:repeat(4,minmax(0,1fr))!important}
}
@media(max-width:900px){
  #marketplace .fcc102-market-primary{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:520px){
  #marketplace .fcc102-market-primary{grid-template-columns:1fr!important}
}
