.char-slot {
  border: 2px solid transparent;   /* baseline */
  box-sizing: border-box;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.char-slot.active-hero {
  border-color: #66ccff;
  box-shadow: 0 0 20px rgba(102, 204, 255, 0.6);
  border-width:3px;
}

.char-slot.active-enemy {
  border-color: #ff6666;
  box-shadow: 0 0 20px rgba(255, 102, 102, 0.6);
  border-width:3px;
}

.char-slot.active-target {
  border-color: #996600;
  box-shadow: 0 0 20px rgba(153, 102, 0, 0.6);
  border-width:3px;
}