/* 段位徽章与成就徽章样式（V2.8.0，CSS 实现不引图片） */

/* 段位盾徽 */
.kg-rank-main {
  display: flex;
  gap: 18px;
  align-items: center;
  flex-wrap: wrap;
}
.kg-rank-badge {
  width: 94px;
  height: 106px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  clip-path: polygon(50% 0, 100% 8%, 100% 62%, 50% 100%, 0 62%, 0 8%);
  color: #fff;
  font-weight: 700;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
}
.kg-rank-badge span {
  font-size: 36px;
  line-height: 1;
}
.kg-rank-badge b {
  font-size: 14px;
  letter-spacing: 0.5px;
}
.kg-rank-bronze   { background: linear-gradient(160deg, #8a5a2b, #cd7f32 55%, #6f451c); }
.kg-rank-silver   { background: linear-gradient(160deg, #7b7b7b, #c8c8c8 55%, #5f5f5f); }
.kg-rank-gold     { background: linear-gradient(160deg, #a67c00, #ffd700 55%, #8a6500); }
.kg-rank-platinum { background: linear-gradient(160deg, #3f7d78, #7fe7dc 55%, #2f5c58); }
.kg-rank-diamond  { background: linear-gradient(160deg, #0a7f8f, #09cbc8 55%, #075f6b); }
.kg-rank-master   { background: linear-gradient(160deg, #b23a00, #ff6b35 55%, #8c2c00); }
.kg-rank-champion { background: linear-gradient(160deg, #7f1d1d, #e84a4a 45%, #ffd700 82%); }

/* 段位信息与进度条 */
.kg-rank-info {
  flex: 1;
  min-width: 200px;
}
.kg-rank-score {
  font-size: 14px;
  color: #55606d;
  margin: 0;
}
.kg-rank-bar {
  height: 10px;
  background: #e6ebf2;
  border-radius: 999px;
  overflow: hidden;
  margin-top: 10px;
}
.kg-rank-bar i {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, #f0c75e, #ffd700);
  border-radius: 999px;
  transition: width 0.4s ease;
}
.kg-rank-next {
  font-size: 12px;
  color: #8a94a0;
  margin: 6px 0 0;
}

/* 成就徽章：全部可见，未解锁灰显 */
.kg-badge-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.kg-badge-item {
  flex: 1 1 calc(50% - 10px);
  min-width: 200px;
  border: 1px solid #e6ebf2;
  border-radius: 14px;
  padding: 12px 14px;
  display: flex;
  gap: 10px;
  align-items: center;
  background: #fff;
}
.kg-badge-item.locked {
  opacity: 0.55;
  filter: grayscale(0.75);
}
.kg-badge-icon {
  font-size: 30px;
  line-height: 1;
}
.kg-badge-name {
  font-size: 14px;
  font-weight: 600;
  color: #22303f;
}
.kg-badge-desc {
  font-size: 12px;
  color: #8a94a0;
}
.kg-badge-progress {
  font-size: 11px;
  color: #b0b8c4;
}