/* The current section has its own pill, including both icon and label. */
.hotbar .actions > [role="tab"] {
  position: relative;
  isolation: isolate;
  min-height: 0;
  padding-bottom: 4px;
}
.hotbar .actions > [role="tab"]::before {
  content: '';
  position: absolute;
  inset: 0 2px 4px;
  z-index: -1;
  pointer-events: none;
  border: 1px solid #ffc576b3;
  border-radius: 19px;
  background: linear-gradient(160deg, #b4572ac9, #71301be6 58%, #482015ed);
  box-shadow: inset 0 1px 2px #ffe3a65c, inset 0 -2px 8px #3511085c;
  opacity: 0;
  transform: scale(.94);
  transition: opacity 180ms ease, transform 180ms ease;
}
.hotbar .actions > [role="tab"][aria-selected="true"]::before {
  opacity: 1;
  transform: scale(1);
}
.hotbar .actions > [role="tab"][aria-selected="true"] > span {
  color: #fff0c9;
  text-shadow: 0 1px 3px #3b120c;
  font-weight: 700;
}
@media (prefers-reduced-motion: reduce) {
  .hotbar .actions > [role="tab"]::before { transition: none; }
}