/* Right column: black market cards and rig inventory. */

/* right: toolkit */
.toolkit {
  flex:1;
  overflow-y:auto;
  padding:10px;
  display:flex;
  flex-direction:column;
  gap:10px;
  scrollbar-width:thin;
  scrollbar-color:var(--screen-line) transparent;
}
.toolkit > * {
  position:relative;
  z-index:4;
}
.sec-h {
  display:flex;
  justify-content:space-between;
  align-items:center;
  font-family:var(--px);
  font-size:9px;
  color:var(--cyan);
  gap:6px;
  border-bottom:1px solid var(--screen-line);
  padding-bottom:6px;
  min-height:28px;
}
.sec-h span {
  color:var(--dim);
  font-size:8px;
}
.shop {
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(150px,1fr));
  gap:8px;
}
.card {
  border:2px solid var(--screen-line);
  background:var(--screen-2);
  padding:7px;
  display:flex;
  flex-direction:column;
  gap:5px;
  min-width:0;
}
.card .top {
  display:flex;
  gap:7px;
  align-items:center;
}
.card img {
  width:26px;
  height:26px;
  image-rendering:pixelated;
  flex:none;
}
.card .nm {
  font-family:var(--px);
  font-size:7px;
  line-height:1.4;
  color:var(--ink);
}
.card .kd {
  font-size:14px;
  color:var(--dim);
}
.card .ds {
  font-size:16px;
  color:#aab0d6;
  line-height:1;
  flex:1;
}
.card .buy {
  font-size:8px;
  padding:7px 6px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:5px;
}
.card.t2 { border-color:#3d3070; }
.card.t3 { border-color:#70305f; }
.card.sold { opacity:.3; }
.shop.locked .card {
  opacity:.35;
  filter:grayscale(1);
}
.empty-note {
  font-size:17px;
  color:var(--dim);
  line-height:1.05;
}
.inv {
  display:flex;
  flex-wrap:wrap;
  gap:6px;
}
.inv-die {
  display:flex;
  align-items:center;
  gap:5px;
  background:var(--screen-2);
  border:1px solid var(--screen-line);
  padding:3px 6px 3px 3px;
  font-size:16px;
  color:var(--ink);
}
.inv-die img {
  width:24px;
  height:24px;
  image-rendering:pixelated;
}
.x {
  background:none;
  border:1px solid var(--red);
  color:var(--red);
  font-family:var(--px);
  font-size:6px;
  cursor:pointer;
  padding:3px 4px;
  margin-left:3px;
  white-space:nowrap;
}
.x:hover {
  background:var(--red);
  color:#000;
}
.row-item {
  display:flex;
  align-items:center;
  gap:8px;
  background:var(--screen-2);
  border:1px solid var(--screen-line);
  padding:5px;
  color:var(--ink);
}
.row-item + .row-item { margin-top:6px; }
.row-item img {
  width:24px;
  height:24px;
  image-rendering:pixelated;
  flex:none;
}
.row-item .t {
  flex:1;
  min-width:0;
}
.row-item .t b {
  display:block;
  font-family:var(--px);
  font-size:7px;
  font-weight:normal;
  margin-bottom:3px;
  line-height:1.35;
}
.row-item .t small {
  font-size:15px;
  color:var(--dim);
  line-height:1;
  display:block;
}