.renaissanceCareer {
  border-color: #c084fc55;
  background:
    radial-gradient(circle at 88% 10%, #c084fc1d, transparent 22rem),
    linear-gradient(145deg, #211d38, #132238);
}

.renaissanceCareer .careerLineHead > .achievementBadge {
  width: 112px;
  height: 112px;
}

.renaissanceDepth strong {
  color: #ead7ff;
}

.renaissanceSummary {
  display: grid;
  gap: 8px;
  margin-top: 18px;
  color: #e7ddf8;
  font-size: 0.88rem;
}

.renaissanceCareer .renaissanceCategory {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
}

.renaissanceCategoryName {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

.renaissanceCareer .renaissanceCategory strong {
  color: #f2e8ff;
  font-variant-numeric: tabular-nums;
}

@media (max-width: 430px) {
  .renaissanceCareer .careerLineHead > .achievementBadge {
    width: 96px;
    height: 96px;
  }
}