
/* Four Color Comic v40.31.30 — clean Collection Card View */

/* Give cards enough room to breathe instead of forcing narrow two-column cards. */
#collectionCards.cards{
  grid-template-columns:repeat(auto-fit,minmax(min(100%,440px),1fr))!important;
  gap:12px!important;
  align-items:stretch!important;
}

#collectionCards .v403130-card{
  position:relative!important;
  grid-template-columns:124px minmax(0,1fr)!important;
  grid-template-rows:auto!important;
  column-gap:14px!important;
  row-gap:0!important;
  align-items:start!important;
  min-width:0!important;
  padding:12px!important;
  overflow:visible!important;
}

#collectionCards .v403130-card .v403120-card-left{
  position:relative!important;
  grid-column:1!important;
  grid-row:1!important;
  display:flex!important;
  flex-direction:column!important;
  gap:8px!important;
  min-width:0!important;
}

/* SELECT: upper-left corner of the comic image. */
#collectionCards .v403130-card .v403130-card-select{
  position:absolute!important;
  z-index:8!important;
  top:7px!important;
  left:7px!important;
  display:grid!important;
  place-items:center!important;
  width:30px!important;
  height:30px!important;
  min-width:30px!important;
  margin:0!important;
  padding:0!important;
  border:1px solid rgba(218,228,242,.44)!important;
  border-radius:7px!important;
  background:rgba(3,8,14,.84)!important;
  box-shadow:0 4px 14px rgba(0,0,0,.40)!important;
  backdrop-filter:blur(5px)!important;
  cursor:pointer!important;
}
#collectionCards .v403130-card .v403130-card-select:hover{
  border-color:rgba(138,122,255,.88)!important;
  background:rgba(18,20,42,.95)!important;
}
#collectionCards .v403130-card .v403130-card-select span{
  display:none!important;
}
#collectionCards .v403130-card .v403130-card-select input{
  width:17px!important;
  height:17px!important;
  margin:0!important;
  accent-color:#7d6cff!important;
}

/* Cover + Purchase Price form one clean left rail. */
#collectionCards .v403130-card .v43-cover-button.card,
#collectionCards .v403130-card .v43-cover-missing.card{
  width:124px!important;
  height:auto!important;
  aspect-ratio:124 / 178!important;
  margin:0!important;
  border-radius:8px!important;
}
#collectionCards .v403130-card .v43-cover-image{
  border-radius:7px!important;
}
#collectionCards .v403130-card .v403120-card-purchase{
  width:124px!important;
  box-sizing:border-box!important;
  padding:8px!important;
  border-radius:8px!important;
  background:rgba(7,15,28,.52)!important;
}
#collectionCards .v403130-card .v403120-card-purchase>span{
  margin-bottom:5px!important;
  font-size:7.5px!important;
}
#collectionCards .v403130-card .v403120-cost-shell{
  height:35px!important;
}
#collectionCards .v403130-card .v403120-card-purchase small{
  display:none!important;
}

/* Main content becomes one predictable vertical stack. */
#collectionCards .v403130-card .v42-card-main{
  grid-column:2!important;
  grid-row:1!important;
  display:flex!important;
  flex-direction:column!important;
  min-width:0!important;
  height:100%!important;
}
#collectionCards .v403130-card .v42-card-main>.split{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  gap:8px!important;
  align-items:start!important;
  min-height:58px!important;
}
#collectionCards .v403130-card .v42-card-main h3{
  margin:0 0 4px!important;
  font-size:15px!important;
  line-height:1.18!important;
  overflow-wrap:anywhere!important;
}
#collectionCards .v403130-card .bookmeta{
  font-size:10px!important;
  line-height:1.35!important;
  color:#8da0b9!important;
}
#collectionCards .v403130-card .badge{
  margin:0!important;
  align-self:start!important;
  white-space:nowrap!important;
}
#collectionCards .v403130-card .v39-key-icons{
  margin-top:5px!important;
}

/* My Value + EMV stay side-by-side and balanced. */
#collectionCards .v403130-card .v403120-card-values{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
  gap:8px!important;
  margin:10px 0 8px!important;
}
#collectionCards .v403130-card .v403120-value-box{
  min-width:0!important;
  min-height:82px!important;
  padding:9px!important;
  border-radius:9px!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:flex-start!important;
  background:rgba(8,18,33,.48)!important;
}
#collectionCards .v403130-card .v403120-value-box>span{
  min-height:19px!important;
  font-size:7.5px!important;
  line-height:1.25!important;
}
#collectionCards .v403130-card .v403120-my-value .v41-market-input{
  height:36px!important;
  margin-top:5px!important;
  font-size:13px!important;
}
#collectionCards .v403130-card .v403120-estimated .v41-ai{
  margin-top:5px!important;
  font-size:16px!important;
  line-height:1.1!important;
}
#collectionCards .v403130-card .v403129-emv-updated{
  margin-top:5px!important;
  font-size:7.5px!important;
  line-height:1.2!important;
}

/* Hide routine "saved" chatter. Keep only actionable My Value states. */
#collectionCards .v403130-card .v403120-my-value .v43-market-state{
  display:none!important;
}
#collectionCards .v403130-card .v403120-my-value .v43-market-state.dirty,
#collectionCards .v403130-card .v403120-my-value .v43-market-state.saving,
#collectionCards .v403130-card .v403120-my-value .v43-market-state.error{
  display:block!important;
  margin-top:4px!important;
  font-size:7px!important;
  line-height:1.2!important;
}

/* P/L + ROI become one clean strip. */
#collectionCards .v403130-card .v403120-card-pl{
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:0!important;
  margin:0 0 8px!important;
  padding:0!important;
  overflow:hidden!important;
  border-radius:8px!important;
  background:rgba(6,13,24,.38)!important;
}
#collectionCards .v403130-card .v403120-card-pl span{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:7px!important;
  min-width:0!important;
  padding:7px 9px!important;
}
#collectionCards .v403130-card .v403120-card-pl span+span{
  border-left:1px solid rgba(117,140,179,.18)!important;
}
#collectionCards .v403130-card .v403120-card-pl b{
  margin-left:0!important;
  white-space:nowrap!important;
}

/* Equal-width footer actions. */
#collectionCards .v403130-card .v412-actions{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:6px!important;
  margin-top:auto!important;
  width:100%!important;
  white-space:normal!important;
}
#collectionCards .v403130-card .v412-actions .btn{
  width:100%!important;
  min-width:0!important;
  min-height:31px!important;
  height:31px!important;
  padding:5px!important;
  justify-content:center!important;
  font-size:9px!important;
  line-height:1!important;
}

/* Preserve v40.31.29: no pricing-engine language in normal Card View. */
#collectionCards .v403130-card .v42-price-date,
#collectionCards .v403130-card .v403121-emv-evidence,
#collectionCards .v403130-card .v403121-updated{
  display:none!important;
}

/* Tablets: one roomy card per row instead of two cramped cards. */
@media(max-width:900px){
  #collectionCards.cards{
    grid-template-columns:1fr!important;
  }
  #collectionCards .v403130-card{
    grid-template-columns:124px minmax(0,1fr)!important;
  }
}

/* Phones: same hierarchy, smaller cover rail. */
@media(max-width:520px){
  #collectionCards .v403130-card{
    grid-template-columns:104px minmax(0,1fr)!important;
    column-gap:10px!important;
    padding:10px!important;
  }
  #collectionCards .v403130-card .v43-cover-button.card,
  #collectionCards .v403130-card .v43-cover-missing.card{
    width:104px!important;
    aspect-ratio:104 / 150!important;
  }
  #collectionCards .v403130-card .v403120-card-purchase{
    width:104px!important;
    padding:7px!important;
  }
  #collectionCards .v403130-card .v403120-cost-shell{
    grid-template-columns:15px minmax(0,1fr)!important;
  }
  #collectionCards .v403130-card .v403120-cost-shell i{
    padding-left:5px!important;
  }
  #collectionCards .v403130-card .v403120-card-cost-input{
    font-size:11px!important;
  }
  #collectionCards .v403130-card .v42-card-main h3{
    font-size:13px!important;
  }
  #collectionCards .v403130-card .bookmeta{
    font-size:9px!important;
  }
  #collectionCards .v403130-card .v403120-card-values{
    gap:6px!important;
  }
  #collectionCards .v403130-card .v403120-value-box{
    min-height:78px!important;
    padding:7px!important;
  }
  #collectionCards .v403130-card .v403120-value-box>span{
    font-size:6.8px!important;
  }
  #collectionCards .v403130-card .v403120-card-pl span{
    padding:7px 6px!important;
    font-size:7px!important;
  }
  #collectionCards .v403130-card .v403120-card-pl b{
    font-size:9px!important;
  }
  #collectionCards .v403130-card .v412-actions{
    gap:4px!important;
  }
  #collectionCards .v403130-card .v412-actions .btn{
    font-size:8px!important;
    padding:4px 3px!important;
  }
}
