/* ─── Vote Bar ───────────────────────────────────────────────────────────────── */
.vote-bar {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  padding: var(--space-4) 0;
  flex-wrap: wrap;
}

.vote-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.4rem 0.9rem;
  border-radius: var(--radius-sm);
  font-family: var(--font-sans);
  font-size: 0.875rem;
  font-weight: 600;
  cursor: pointer;
  border: 2px solid transparent;
  background: var(--surface);
  color: var(--ink-muted);
  text-decoration: none;
  transition:
    border-color 0.15s,
    color 0.15s,
    background 0.15s;
}
.vote-btn--up {
  border-color: #d1fae5;
  color: #065f46;
}
.vote-btn--down {
  border-color: #fee2e2;
  color: #991b1b;
}
.vote-btn--up:hover,
.vote-btn--up.vote-btn--active {
  background: #d1fae5;
  color: #065f46;
}
.vote-btn--down:hover,
.vote-btn--down.vote-btn--active {
  background: #fee2e2;
  color: #991b1b;
}
.vote-btn__count {
  font-size: 0.8rem;
}

.vote-bar__track {
  flex: 1;
  min-width: 80px;
  height: 6px;
  background: #fee2e2;
  border-radius: 99px;
  overflow: hidden;
}
.vote-bar__fill {
  height: 100%;
  background: #34d399;
  border-radius: 99px;
  transition: width 0.3s ease;
}
.vote-bar__label {
  font-size: 0.8rem;
  color: var(--ink-muted);
  white-space: nowrap;
}