:root {
  --primary-h: 248;
  --primary-s: 57%;
  --primary-l: 60%;
}

.leaderboard {
  container-type: inline-size;
  container-name: leaderboard;
}
.leaderboard-heading {
  font-size: 22px;
  line-height: 109.091%;
}
.leaderboard-button {
  display: flex;
  align-items: center;
  gap: 20px;
  margin-block: 30px;
}
.leaderboard-button button {
  --pd: 6px 20px;
  --fw: 500;
  border-radius: 6px;
  font-size: 16px;
  line-height: 150%;
  background-color: #eff2f6;
  color: #1c1e22;
  transition: all 0.25s ease;
}
.leaderboard-button button:hover {
  color: #fff;
  background-color: #6c5dd3;
}
.leaderboard-table {
  overflow-x: auto;
  border: 1px solid #fff;
}
@container leaderboard (max-width: 920px) {
  .leaderboard-table td:first-child {
    position: sticky;
    left: 0;
    background-color: #fff;
  }
  .leaderboard-table td:nth-child(2) {
    position: sticky;
    left: 100px;
    background-color: #fff;
  }
  .leaderboard-table td {
    min-width: 100px;
  }
}
.leaderboard table {
  width: 100%;
  border-collapse: collapse;
}
.leaderboard table tbody tr {
  border-bottom: 1px solid #e3e3e3;
}
.leaderboard table td {
  text-align: left;
  vertical-align: middle;
  white-space: nowrap;
  color: #1c1e22;
  font-weight: 500;
  line-height: 146.667%;
  padding: 29px 20px 19px 0;
}
.leaderboard-user {
  display: flex;
  align-items: center;
  gap: 10px;
}
.leaderboard-user-image {
  width: 40px;
  height: 40px;
  flex-shrink: 0;
}
.leaderboard-user-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 100rem;
}
.leaderboard-user-info {
  display: flex;
  flex-direction: column;
  gap: 1px;
  flex: 1;
}
.leaderboard-user-name {
  font-size: 16px;
  font-weight: 500;
  line-height: 150%;
}
.leaderboard-user-bio {
  color: #5f6164;
  font-size: 14px;
  font-weight: 400;
  line-height: 142.857%;
}
.leaderboard-comment, .leaderboard-like, .leaderboard-view {
  display: flex;
  align-items: center;
  gap: 10px;
}
.leaderboard-follow {
  height: 26px;
  padding-inline: 16px;
  border-radius: 4px;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  color: #fff;
  background-color: #ff754c;
  cursor: pointer;
}
.leaderboard-link {
  cursor: pointer;
}

/*# sourceMappingURL=leaderboard.css.map */