img {
  display: inline-block;
  vertical-align: text-bottom;
  max-height: 1.1em;
  max-width: 1.1em;
  min-height: 1.1em;
  min-width: 1.1em;
}

.table-wrap {
  max-height: 80vh;
}

th,
.points,
.rectangle-cell {
  border-left: 10px solid var(--table-border);
}

.points {
  min-width: 3rem;
  width: 3rem;
  text-align: right;
}

.heal_total,
.damage {
  display: none;
}
.swap {
  position: absolute;
  right: 0;
  padding-inline: .2em;
  font-weight: 600;
}
.sortable {
  position: relative;
}

.rectangle-cell {
  width: 12rem;
}
.percent-bar {
  width: var(--width);
  height: 1em;
  border-radius: 0.1em;
}
.useful .percent-bar,
.damage .percent-bar,
.taken .percent-bar {
  background-color: hsl(0, 100%, 30%);
  box-shadow: .1em .1em 1em darkred;
}
.heal .percent-bar,
.heal_total .percent-bar {
  background-color: hsl(120, 100%, 25%);
  box-shadow: .1em .1em 1em forestgreen;
}