/* XP titles on a dark band, with live rank emblems drawn over the icons (js/rank-emblems.js) */

.ranks-band {
  color: #e9eef7;
  background:
    radial-gradient(ellipse 70% 40% at 50% 0%, rgba(0, 146, 164, 0.22) 0%, transparent 70%),
    linear-gradient(180deg, #06201c 0%, #041411 60%, #050c10 100%);
}

.ranks-band .section h2 {
  color: #fff;
}

.ranks-band .section-subtitle {
  color: rgba(233, 238, 247, 0.75);
}

.ranks-band .xp-chip {
  background: rgba(255, 255, 255, 0.06);
  border-color: rgba(255, 255, 255, 0.14);
  color: #ffe08a;
}

.ranks-band .title-row {
  background: rgba(255, 255, 255, 0.04);
  border-color: rgba(255, 255, 255, 0.08);
  box-shadow: none;
}

.ranks-band .title-row h3 {
  color: #ffe08a;
}

.ranks-band .title-row p {
  color: rgba(233, 238, 247, 0.75);
}

.ranks-band .title-xp {
  color: #fff;
}

.title-list[data-rank-emblems] {
  position: relative;
}

/* Reaches above and below the list for the auras of the first and last emblems */
.rank-emblems-canvas {
  position: absolute;
  top: -48px;
  left: 0;
  width: 100%;
  height: calc(100% + 96px);
  pointer-events: none;
  z-index: 1;
}

.title-list.is-live .title-row img {
  visibility: hidden;
}