.challenges-list {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.challenge-card {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 1rem;
  display: flex;
  align-items: center;
  gap: 1rem;
  transition: all 0.2s ease;
}
.challenge-card:hover { border-color: var(--border-light); }

.challenge-card.completed {
  border-color: var(--accent-green);
  background: var(--accent-green-dim);
}

.challenge-icon { font-size: 1.5rem; }
.challenge-info { flex: 1; }
.challenge-title { font-weight: 600; font-size: 0.9rem; }
.challenge-progress {
  margin-top: 0.3rem;
  height: 6px;
  background: var(--bg-input);
  border-radius: var(--radius-full);
  overflow: hidden;
}
.challenge-progress-fill {
  height: 100%;
  background: var(--accent);
  border-radius: var(--radius-full);
  transition: width 0.5s ease;
}
.challenge-progress-fill.complete {
  background: var(--accent-green);
}
.challenge-xp {
  font-size: 0.7rem;
  color: var(--accent-yellow);
  font-weight: 600;
}