/* V105 — stable card style, CSS only. */
.item-card-body,
.beequip-copy{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) max-content!important;
  grid-template-areas:
    "title title"
    "value status"
    "value demand"!important;
  column-gap:14px!important;
  row-gap:5px!important;
  align-items:center!important;
}

.item-card-body > .item-title,
.beequip-copy > b,
.beequip-copy > strong{
  grid-area:title!important;
  margin:0 0 5px!important;
}

.item-card-body > .item-tags,
.beequip-copy > .beequip-status-row{
  grid-area:status!important;
  justify-self:end!important;
  align-self:end!important;
  margin:0!important;
  min-width:0!important;
}

.item-card-body > .item-sub,
.beequip-copy > .beequip-card-meta{
  display:contents!important;
}

.item-card-body .value-display,
.beequip-copy .value-display{
  grid-area:value!important;
  justify-self:start!important;
  align-self:center!important;
  min-width:0!important;
  display:inline-flex!important;
  align-items:center!important;
  gap:5px!important;
  white-space:nowrap!important;
  font-weight:800!important;
}

.item-card-body .demand-badge,
.beequip-copy .demand-badge{
  grid-area:demand!important;
  justify-self:end!important;
  align-self:start!important;
  margin:0!important;
  position:static!important;
  inset:auto!important;
}

.item-card-body .status,
.beequip-copy .status{
  position:static!important;
  inset:auto!important;
  margin:0!important;
  white-space:nowrap!important;
}

@media(max-width:560px){
  .item-card-body,
  .beequip-copy{
    grid-template-columns:minmax(0,1fr) 94px!important;
    column-gap:8px!important;
  }
  .item-card-body .value-display,
  .beequip-copy .value-display{
    white-space:normal!important;
    flex-wrap:wrap!important;
  }
}