.md-header__button.md-logo img {
  height: 2rem;
  width: auto;
}

/* Weapon widgets */
.weapon-widget {
  border: 1px solid var(--md-default-fg-color--lightest);
  border-radius: 0.4rem;
  padding: 1rem;
  margin: 1rem 0;
}

.widget-controls {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1rem;
  margin-bottom: 1rem;
}

.widget-controls select {
  padding: 0.3rem 0.5rem;
  border: 1px solid var(--md-default-fg-color--lightest);
  border-radius: 0.2rem;
  background: var(--md-default-bg-color);
  color: var(--md-default-fg-color);
  font-size: 0.85rem;
}

/* Damage falloff chart */
.damage-chart {
  width: 100%;
  display: block;
}

/* Damage pool visualizer */
.pool-rows {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.pool-viz {
  display: flex;
  flex-direction: column;
}

.pool-label-row,
.pool-sprite-row,
.pool-hp-row {
  display: flex;
}

.pool-sprite-row {
  position: relative;
}

.pool-cell {
  width: 32px;
  flex-shrink: 0;
  text-align: center;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.pool-label-row .pool-cell {
  font-size: 0.7rem;
}

.pool-hp-row .pool-cell {
  font-size: 0.55rem;
  color: #e53935;
}

.pool-sprite {
  width: 32px;
  height: 32px;
  flex-shrink: 0;
  image-rendering: pixelated;
  transform: rotate(180deg);
}

.pool-trail {
  position: absolute;
  top: 50%;
  left: -1rem;
  height: 3px;
  transform: translateY(-50%);
  pointer-events: none;
  border-radius: 1px;
}