/*!***************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../../../node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!../../../node_modules/resolve-url-loader/index.js!../../../node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[1].use[3]!./scss/pages/_battle-pass-new.scss ***!
  \***************************************************************************************************************************************************************************************************************************************************/
@import url(https://fonts.googleapis.com/css2?family=Sriracha&display=swap);
/*!*******************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../../../node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!../../../node_modules/resolve-url-loader/index.js!../../../node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[1].use[3]!./scss/pages/_battle-pass-new.scss (1) ***!
  \*******************************************************************************************************************************************************************************************************************************************************/
@keyframes spin {
  100% {
    transform: rotate(360deg);
  }
}
@keyframes spinCenter {
  0% {
    transform: translate(-50%, -50%) rotate(0deg);
  }
  100% {
    transform: translate(-50%, -50%) rotate(360deg);
  }
}
.battle-pass-text-block-item:after, .battle-pass-text-block-item:before, .battle-pass-quest-list-block-item-progress-item.done:after, .battle-pass-quest-list-block-item-progress-item:before, .battle-pass-quest-list-block-item:after, .battle-pass-quest-list-block-item:before, .battle-pass-quest-list-block-title:after, .battle-pass-quest-list-block-title:before, .battle-pass-progress-item.current:not(.done):after, .battle-pass-progress-item.current .battle-pass-progress-item-line-wrap span:before, .battle-pass-progress-item.active:not(.done):hover:before, .battle-pass-progress-item-pos:before, .battle-pass-progress-item-content-border-bottom:before, .battle-pass-progress-item-content-border-bottom:after, .battle-pass-progress-item-content-border-top:before, .battle-pass-progress-item-content-border-top:after, .battle-pass-progress-item:after, .battle-pass-progress-items:after, .battle-pass-progress-items:before, .battle-pass-progress-wrap.disabled:before, .page-battle-pass .battle-pass-user-info:before, .battle-pass-header-center:before, .main[data-pathname*="/battle_pass/"] .cases-battle-pass .case-row:before, .case-recomented .case-row:before, .open-case.old-sale:after, .open-case.old-sale:before, .in-case-item.empty:after, .cases .case-item.light .case-item-img:before, .page-timer-day:before, .page-timer:before {
  content: "";
  display: block;
  position: absolute;
}

/**
 *  This mixin will crop text in block for needed amount of lines and put ellipsis at the end
 *
 *  @param $font-size font-size property
 *  @param $line-height line-height property
 *  @param $lines-to-show amount of lines to show
 */
.battle-pass-text-block-item:after, .battle-pass-text-block-item:before, .battle-pass-quest-list-block-item-progress-item.done:after, .battle-pass-quest-list-block-item-progress-item:before, .battle-pass-quest-list-block-item:after, .battle-pass-quest-list-block-item:before, .battle-pass-quest-list-block-title:after, .battle-pass-quest-list-block-title:before, .battle-pass-progress-item.current:not(.done):after, .battle-pass-progress-item.current .battle-pass-progress-item-line-wrap span:before, .battle-pass-progress-item.active:not(.done):hover:before, .battle-pass-progress-item-pos:before, .battle-pass-progress-item-content-border-bottom:before, .battle-pass-progress-item-content-border-bottom:after, .battle-pass-progress-item-content-border-top:before, .battle-pass-progress-item-content-border-top:after, .battle-pass-progress-item:after, .battle-pass-progress-items:after, .battle-pass-progress-items:before, .battle-pass-progress-wrap.disabled:before, .page-battle-pass .battle-pass-user-info:before, .battle-pass-header-center:before, .main[data-pathname*="/battle_pass/"] .cases-battle-pass .case-row:before, .case-recomented .case-row:before, .open-case.old-sale:after, .open-case.old-sale:before, .in-case-item.empty:after, .cases .case-item.light .case-item-img:before, .page-timer-day:before, .page-timer:before {
  content: "";
  display: block;
  position: absolute;
}

.page-timer {
  width: 557px;
  height: 42px;
  margin: 0 auto 44px auto;
  position: relative;
}
.page-timer-wrap {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  font-weight: 900;
  font-size: 24px;
  line-height: 28px;
  color: #d32ce6;
  text-shadow: 0px 2px 0px #3a004e;
  padding-left: 8px;
}
.page-timer:before {
  background: url(/files/images/9289a795aed32f5d87ed.svg) no-repeat 0 0;
  width: 100%;
  height: 111px;
  pointer-events: none;
  top: 50%;
  transform: translateY(-50%);
}
.page-timer-day {
  position: relative;
  min-width: 44px;
  height: 32px;
  border-radius: 12px;
  padding: 2px 8px;
  text-align: center;
  font-weight: 900;
  font-size: 24px;
  line-height: 28px;
  display: flex;
  align-items: center;
  color: #ffffff;
  text-shadow: 0px 2px 0px #3a004e, 0px 0px 40px #c131e4, 0px 0px 12px rgba(193, 49, 228, 0.64);
  margin-right: 30px;
}
.page-timer-day span {
  position: relative;
}
.page-timer-day:before {
  width: 70px;
  height: 42px;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) skew(-20deg, 0deg);
  background: linear-gradient(180deg, rgba(76, 0, 85, 0) 0%, rgba(211, 44, 230, 0.2) 100%);
  margin-left: -1px;
}
.page-timer-separator {
  opacity: 0.4;
  margin: 0 8px;
}
.page-timer-seconds {
  color: #ffc600;
}
.page-timer-close-text {
  font-weight: 900;
  font-size: 24px;
  line-height: 28px;
  color: #d32ce6;
  text-shadow: 0px 2px 0px #3a004e;
  display: flex;
  align-items: center;
}
.page-timer-close-text .timer-title {
  margin: 0 16px;
  white-space: nowrap;
}
.page-timer-close-text .emoji {
  font-size: 32px;
}

.case-item .case-cost {
  min-width: 58px;
  padding: 0 8px 0 10px;
  margin-bottom: 10px;
  line-height: 32px;
  border-radius: 21px;
  position: relative;
}
.case-item .case-cost .btn-free-case-count {
  width: 20px;
  height: 20px;
  font-weight: 700;
  font-size: 12px;
  line-height: 14px;
  color: #3B1674;
  position: absolute;
  top: -10px;
  right: 0;
}

.case-item[data-rar=b0c3d9] .case-cost {
  box-shadow: 0px 0px 3px #b0c3d9, 0px 0px 16px rgba(176, 195, 217, 0.28), 0px 0px 24px rgba(176, 195, 217, 0.28), inset 0px 0px 3px #b0c3d9, inset 0px 0px 16px rgba(176, 195, 217, 0.28), inset 0px 0px 24px rgba(176, 195, 217, 0.28);
  border: solid 2px #fff;
  background-color: rgba(254, 242, 200, 0);
  color: #b0c3d9;
}

.case-item[data-rar="5e98d9"] .case-cost {
  box-shadow: 0px 0px 3px #5e98d9, 0px 0px 16px rgba(94, 152, 217, 0.28), 0px 0px 24px rgba(94, 152, 217, 0.28), inset 0px 0px 3px #5e98d9, inset 0px 0px 16px rgba(94, 152, 217, 0.28), inset 0px 0px 24px rgba(94, 152, 217, 0.28);
  border: solid 2px #d6ddff;
  background-color: rgba(254, 242, 200, 0);
  color: #5e98d9;
}

.case-item[data-rar="4b69ff"] .case-cost {
  box-shadow: 0px 0px 3px #4b69ff, 0px 0px 16px rgba(75, 105, 255, 0.28), 0px 0px 24px rgba(75, 105, 255, 0.28), inset 0px 0px 3px #4b69ff, inset 0px 0px 16px rgba(75, 105, 255, 0.28), inset 0px 0px 24px rgba(75, 105, 255, 0.28);
  border: solid 2px #d6ddff;
  background-color: rgba(254, 242, 200, 0);
  color: #4b69ff;
}

.case-item[data-rar=e4ae39] .case-cost {
  box-shadow: 0px 0px 3px #e4ae39, 0px 0px 16px rgba(228, 174, 57, 0.28), 0px 0px 24px rgba(228, 174, 57, 0.28), inset 0px 0px 3px #e4ae39, inset 0px 0px 16px rgba(228, 174, 57, 0.28), inset 0px 0px 24px rgba(228, 174, 57, 0.28);
  border: solid 2px #d8c2ff;
  background-color: rgba(254, 242, 200, 0);
  color: #8847ff;
}

.case-item[data-rar="8847ff"] .case-cost {
  box-shadow: 0px 0px 3px #8847ff, 0px 0px 16px rgba(136, 71, 255, 0.28), 0px 0px 24px rgba(136, 71, 255, 0.28), inset 0px 0px 3px #8847ff, inset 0px 0px 16px rgba(136, 71, 255, 0.28), inset 0px 0px 24px rgba(136, 71, 255, 0.28);
  border: solid 2px #d8c2ff;
  background-color: rgba(254, 242, 200, 0);
  color: #8847ff;
}

.case-item[data-rar=d32ce6] .case-cost {
  border: 2px solid #D8C2FF;
  box-shadow: 0px 0px 3px #d32ce6, 0px 0px 16px rgba(211, 44, 230, 0.28), 0px 0px 24px rgba(211, 44, 230, 0.28), inset 0px 0px 3px #d32ce6, inset 0px 0px 16px rgba(211, 44, 230, 0.28), inset 0px 0px 24px rgba(211, 44, 230, 0.28);
  color: #d32ce6;
}

.case-item[data-rar=eb4b4b] .case-cost {
  box-shadow: 0 0 16px 0 #eb4b4b, 0 0 3px 0 #eb4b4b, inset 0 0 3px 0 #eb4b4b, inset 0 0 24px 0 #eb4b4b;
  border: solid 2px #ffcaca;
  background-color: rgba(254, 242, 200, 0);
  color: #eb4b4b;
}

.case-item[data-rar=dea937] .case-cost {
  box-shadow: 0px 0px 3px #dea937, 0px 0px 16px rgba(222, 169, 55, 0.28), 0px 0px 24px rgba(222, 169, 55, 0.28), inset 0px 0px 3px #dea937, inset 0px 0px 16px rgba(222, 169, 55, 0.28), inset 0px 0px 24px rgba(222, 169, 55, 0.28);
  border: solid 2px #fef0c7;
  background-color: rgba(254, 242, 200, 0);
  color: #ffc600;
}

.case-item[data-rar=e4ae39] .case-cost {
  border: 2px solid #FFF3CE;
  box-shadow: 0px 0px 3px #FFC600, 0px 0px 16px rgba(255, 198, 0, 0.28), 0px 0px 24px rgba(255, 198, 0, 0.28), inset 0px 0px 3px #FFC600, inset 0px 0px 16px rgba(255, 198, 0, 0.28), inset 0px 0px 24px rgba(255, 198, 0, 0.28);
  color: #ffc600;
}

.case-item[data-rar="06c50c"] .case-cost {
  border: 2px solid #fff;
  box-shadow: 0px 0px 3px #06c50c, 0px 0px 16px rgba(6, 197, 12, 0.28), 0px 0px 24px rgba(6, 197, 12, 0.28), inset 0px 0px 3px #06c50c, inset 0px 0px 16px rgba(6, 197, 12, 0.28), inset 0px 0px 24px rgba(6, 197, 12, 0.28);
  color: #06c50c;
}

@keyframes spin {
  100% {
    transform: rotate(360deg);
  }
}
@keyframes spinCenter {
  0% {
    transform: translate(-50%, -50%) rotate(0deg);
  }
  100% {
    transform: translate(-50%, -50%) rotate(360deg);
  }
}
/**
 *  This mixin will crop text in block for needed amount of lines and put ellipsis at the end
 *
 *  @param $font-size font-size property
 *  @param $line-height line-height property
 *  @param $lines-to-show amount of lines to show
 */
.case-item-name span::after,
.case-item-name span:before {
  position: absolute;
  display: block;
  width: 30px;
  height: 31px;
  content: "";
  top: 0;
}

.case-item-name span:before {
  left: -30px;
  background: url(/files/images/ecfa605f5a05866eb085.png) no-repeat;
  z-index: -1;
}
@media (max-width: 540px) {
  .case-item-name span:before {
    left: -15px;
  }
}

.case-item-name span::after {
  right: -30px;
  top: 3px;
  background: url(/files/images/29b66e06fcb4d9604cc1.png) no-repeat;
  z-index: -1;
}
@media (max-width: 540px) {
  .case-item-name span::after {
    right: -15px;
  }
}

.case-item[data-rar="06c50c"] .case-item-name span::after,
.case-item[data-rar="06c50c"] .case-item-name span:before {
  position: absolute;
  display: block;
  width: 30px;
  height: 34px;
  content: "";
  top: 0;
}

.case-item-name span {
  min-height: 31px;
  display: inline-flex;
  align-items: center;
  position: relative;
  line-height: 33px;
  background: url(/files/images/4b98751ce6f7ca8149e6.png) repeat-x;
}
.case-item-name span .text-cut {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  margin: 0;
  width: 100%;
  min-width: 100%;
  line-height: 15px;
  padding-top: 2px;
  height: auto;
  min-height: auto;
}
.case-item-name i {
  font-style: normal;
  font-weight: 900;
  font-size: 16px;
  line-height: 19px;
  color: rgba(213, 185, 255, 0.5);
  margin-left: 10px;
}

.case-row-small .case-item-name span {
  font-size: 12px;
  min-height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  max-width: calc(100% - 60px);
  margin: 0 auto;
  line-height: 14px;
}
.case-row-small .case-item-name i {
  margin-left: 2px;
}
.case-row-small .case-cost {
  min-width: auto;
  padding: 0 8px;
  margin: 6px 0;
}
@media (max-width: 420px) {
  .case-row-small .case-cost {
    margin-top: 0;
  }
}
@media (max-width: 359px) {
  .case-row-small .case-cost {
    font-size: 16px;
  }
}
.case-row-small .case-cost .rub {
  margin-left: 0;
}
.case-row-small .case-cost-battle-pass {
  padding: 0 4px;
  margin: 0 4px;
}

.case-item[data-rar="06c50c"] .case-item-name i {
  color: rgba(255, 255, 255, 0.8);
}

.case-item[data-rar="06c50c"] .case-item-name span:before {
  left: -30px;
  background: url(/files/images/bfda7fe0e85823678c5e.png) no-repeat;
}
@media (max-width: 359px) {
  .case-item[data-rar="06c50c"] .case-item-name span:before {
    left: -15px;
  }
}

.case-item[data-rar="06c50c"] .case-item-name span::after {
  right: -30px;
  top: 0;
  background: url(/files/images/7f954533b2e72dd0d187.png) no-repeat;
}
@media (max-width: 359px) {
  .case-item[data-rar="06c50c"] .case-item-name span::after {
    right: -15px;
  }
}

.case-item[data-rar="06c50c"] .case-item-name span {
  color: rgba(255, 255, 255, 0.8);
  background: url(/files/images/e3e38f2efabdf7b8a0d6.png) repeat-x;
}

.cases .case-item {
  width: calc(16.6% - 10px);
  max-width: 304px;
  vertical-align: top;
  top: 0;
  margin: 0 14px 40px;
  transition: all 0.5s;
  text-decoration: unset;
  z-index: 4;
}
@media (max-width: 1366px) {
  .cases .case-item {
    width: calc(16.6% - 10px);
  }
}
@media only screen and (max-width: 1024px) {
  .cases .case-item {
    width: calc(20% - 10px);
  }
}
@media (max-width: 992px) {
  .cases .case-item {
    width: calc(25% - 28px);
  }
}
@media (max-width: 768px) {
  .cases .case-item {
    width: calc(33.3% - 28px);
  }
}
@media (max-width: 540px) {
  .cases .case-item {
    width: calc(50% - 28px);
    margin: 0 10px 65px;
    height: 212px;
  }
}
.cases .case-item.bounce {
  animation: bounce 0.3s ease infinite alternate;
}
@keyframes bounce {
  100% {
    top: -10px;
  }
}
.cases .case-item.light .case-item-img:before {
  width: 312px;
  height: 312px;
  top: 50%;
  left: 50%;
  background: url(/files/images/31a6ef79750199d65a38.png) no-repeat 0 0;
  animation: spinCenter 8s linear infinite;
  z-index: -1;
}
.cases .case-item .drop-chance {
  bottom: auto;
  top: 152px;
  right: 0;
  left: auto;
  background: #3f0047;
  height: 24px;
  min-width: 62px;
  font-size: 16px;
}

.cases .case-row-small .case-item {
  width: calc(14.2% - 20px);
  max-width: initial;
  margin: 0 10px 50px 10px;
}
@media (max-width: 1366px) {
  .cases .case-row-small .case-item {
    width: calc(16.6% - 20px);
  }
}
@media (max-width: 1024px) {
  .cases .case-row-small .case-item {
    width: calc(25% - 20px);
  }
}
@media (max-width: 768px) {
  .cases .case-row-small .case-item {
    width: calc(33.3% - 20px);
  }
}
@media (max-width: 540px) {
  .cases .case-row-small .case-item {
    width: calc(50% - 20px);
    height: 212px;
    margin-bottom: 40px;
  }
}
.cases .case-row-small .case-item-img {
  height: 165px;
  margin-bottom: 10px;
}
@media (max-width: 540px) {
  .cases .case-row-small .case-item-img {
    height: 154px;
  }
}

.case-item-wrap {
  font-size: 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  max-width: 1840px;
  margin: 0 auto;
}
@media (max-width: 560px) {
  .case-item-wrap {
    padding: 0 6px;
  }
}

.case-item,
.case-item-img,
.case-item-nums,
.footer {
  position: relative;
}

.case-item-nums {
  font-weight: 500;
  color: #ccc;
  font-size: 16px;
  margin-bottom: 5px;
  min-height: 33px;
  line-height: 33px;
}

.case-item-nums .fa {
  margin-right: 11px;
  text-shadow: 0px 0px 1px #ff2c3b, 0 0 8px #ff2f2f;
  color: #fef2c8;
}

.case-item-nums .fa-bolt {
  width: 7px;
  height: 14px;
  position: relative;
  width: 16px;
  height: 16px;
  margin-right: 4px;
}
.case-item-nums .fa-bolt:before {
  background: url(/files/images/3737846240511aa8fa69.svg) no-repeat 0 0;
  content: "";
  width: 55px;
  font-size: 0;
  height: 62px;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: block;
  position: absolute;
}

.case-item-nums-wrap {
  position: relative;
  display: flex;
  align-items: center;
  line-height: 24px;
}

.case-item-nums .red {
  color: #f5412e;
}

.case-item-img {
  height: 304px;
  position: relative;
  margin-bottom: -70px;
}
@media (max-width: 1366px) {
  .case-item-img {
    height: 125px;
    margin-bottom: 0px;
  }
}
.case-item-img .lazy-load-image-background {
  transform: translate(-50%, -50%);
  position: absolute;
  top: 50%;
  left: 50%;
  height: 360px;
  width: 360px;
}
.case-item-img .lazy-load-image-background svg {
  transform: scale(1.2);
  top: 8%;
  position: absolute;
  left: 8%;
}
.case-item-img img {
  max-width: 304px;
}

.cases-all .case-row-small .case-item-img {
  height: 212px;
  margin-bottom: -20px;
}
@media (max-width: 1366px) {
  .cases-all .case-row-small .case-item-img {
    height: 154px;
    margin-bottom: 0px;
  }
}

.case-item-img .not-hover,
.case-item-img .hover,
.case-item-img img {
  position: absolute;
  top: 50%;
  left: 50%;
  max-width: 304px;
  min-width: 256px;
}

.case-row-small .case-item-img .not-hover,
.case-row-small .case-item-img .hover,
.case-row-small .case-item-img img {
  max-width: 154px;
  min-width: 154px;
}

.case-row-small .case-item-img svg {
  transform: translate(-50%, 0%) scale(0.5);
  display: block;
  position: absolute;
  top: -40px;
  left: 50%;
}

.case-item-name {
  color: rgba(213, 185, 255, 0.5) !important;
  font-size: 16px;
  font-weight: 400;
  margin-bottom: 6px;
  position: relative;
  z-index: 2;
}
@media (max-width: 420px) {
  .case-item-name {
    font-size: 12px;
  }
}
.case-item-name .text-overflow {
  max-width: 280px;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}
.case-item-name i.case-before-free {
  display: none;
}

.case-item[data-rar=b0c3d9] .case-item-name,
.case-item[data-rar=b0c3d9] .case-item-nums .red,
.case-item[data-rar=b0c3d9] .open-case span {
  color: #b0c3d9;
}

.case-item[data-rar="5e98d9"] .case-cost,
.case-item[data-rar="5e98d9"] .case-item-name,
.case-item[data-rar="5e98d9"] .case-item-nums .red,
.case-item[data-rar="5e98d9"] .open-case span {
  color: #5e98d9;
}

.case-item[data-rar="4b69ff"] .case-cost,
.case-item[data-rar="4b69ff"] .case-item-name,
.case-item[data-rar="4b69ff"] .case-item-nums .red,
.case-item[data-rar="4b69ff"] .open-case span {
  color: #4b69ff;
}

.case-item[data-rar="8847ff"] .case-cost,
.case-item[data-rar="8847ff"] .case-item-name,
.case-item[data-rar="8847ff"] .case-item-nums .red,
.case-item[data-rar="8847ff"] .open-case span {
  color: #8847ff;
}

.case-item[data-rar=d32ce6] .case-cost,
.case-item[data-rar=d32ce6] .case-item-name,
.case-item[data-rar=d32ce6] .case-item-nums .red,
.case-item[data-rar=d32ce6] .open-case span {
  color: #bd28cf;
}

.case-item[data-rar=eb4b4b] .case-cost,
.case-item[data-rar=eb4b4b] .case-item-name,
.case-item[data-rar=eb4b4b] .case-item-nums .red,
.case-item[data-rar=eb4b4b] .open-case span {
  color: #eb4b4b;
}

.case-item[data-rar=dea937] .case-cost,
.case-item[data-rar=dea937] .case-item-name,
.case-item[data-rar=dea937] .case-item-nums .red,
.case-item[data-rar=dea937] .open-case span {
  color: #dea937;
}

.case-item[data-rar=e4ae39] .case-cost,
.case-item[data-rar=e4ae39] .case-item-name,
.case-item[data-rar=e4ae39] .case-item-nums .red,
.case-item[data-rar=e4ae39] .open-case span {
  color: #e4ae39;
}

.case-item[data-rar="56d30d"] .case-item-name,
.case-item[data-rar="56d30d"] .case-item-nums .red,
.case-item[data-rar="56d30d"] .open-case span {
  color: #56d30d;
}

.case-item-tooltipes {
  position: absolute;
  bottom: 145px;
  left: -20px;
  z-index: 2;
}
@media (max-width: 1366px) {
  .case-item-tooltipes {
    bottom: auto;
    top: 105px;
    height: 50px;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
  }
}

.case-row-small {
  padding-bottom: 60px;
}
.case-row-small .case-item-tooltipes {
  bottom: 61px;
}
.case-row-small .case-hit,
.case-row-small .case-latest,
.case-row-small .case-free {
  width: 67px;
  height: 43px;
}

.case-hit,
.case-latest,
.case-free {
  height: 53px;
  width: 99px;
  z-index: 3;
  margin-top: -20px;
  margin-bottom: 2px;
}
@media (max-width: 1366px) {
  .case-hit,
  .case-latest,
  .case-free {
    width: 67px;
    height: 43px;
  }
}

.case-hit {
  background: url(/files/images/913ba460c4758b864f27.svg) no-repeat 0 0;
  background-size: contain;
}

.en .case-hit,
.de .case-hit {
  background: url(/files/images/913ba460c4758b864f27.svg) no-repeat 0 0;
  background-size: contain;
}

.case-latest {
  background: url(/files/images/312139877ea1b182daa8.svg) no-repeat 0 0;
  background-size: contain;
}

.case-free {
  background: url(/files/images/3bcb2a608c936853e991.svg) no-repeat 0 0;
  background-size: contain;
}

.en .case-latest,
.de .case-latest {
  background: url(/files/images/312139877ea1b182daa8.svg) no-repeat 0 0;
  background-size: contain;
}

.case-item-img .not-hover,
.case-item-img .hover,
.case-item-img img,
.top-drop-item > img {
  transform: translate(-50%, -50%);
}

.add-money,
.authorization-social a,
.case-item-nums,
.case-play,
.case-play .case-item,
.case-play-name,
.case-row,
.footer-bot,
.in-case-item,
.in-case-title,
.stats,
.top-drop-item-hover {
  text-align: center;
  user-select: none;
}

.cases .case-item {
  height: 325px;
  margin-bottom: 16px;
}
@media (max-width: 1366px) {
  .cases .case-item {
    height: auto;
    margin-bottom: 66px;
  }
}
@media (max-width: 540px) {
  .cases .case-item {
    margin-bottom: 40px;
  }
}
.cases .case-item a {
  text-decoration: none;
}
.cases .case-item.disable {
  opacity: 0.49;
  pointer-events: none;
}
.cases .case-item .timer {
  display: flex;
  align-items: center;
  padding: 0px 8px 0px 4px;
  height: 24px;
  background: linear-gradient(270deg, #3C0124 -25%, #340855 125%);
  border: 2px solid rgba(63, 9, 101, 0.42);
  border-radius: 12px;
  position: absolute;
  top: -25px;
  right: 0;
  font-size: 14px;
  z-index: 2;
  color: rgba(230, 155, 255, 0.4);
}
@media (max-width: 1366px) {
  .cases .case-item .timer {
    top: -25px;
    right: 50%;
    transform: translateX(50%);
    white-space: nowrap;
  }
}
.cases .case-item .timer .day {
  margin-right: 4px;
  text-shadow: -1px -1px 0 rgba(235, 75, 75, 0.48), 1px -1px 0 rgba(235, 75, 75, 0.48), -1px 1px 0 rgba(235, 75, 75, 0.48), 1px 1px 0 rgba(235, 75, 75, 0.48), 0 0 24px rgba(235, 75, 75, 0.48), 0 0 13px rgba(235, 75, 75, 0.48);
  color: #fef2c8;
}
.cases .case-item .timer .icon {
  color: #FF2C3B;
  box-shadow: 0 0 12px 1px #ff2c3b;
  background: #FEF2C8;
  border-radius: 50%;
  font-size: 17px;
  margin: 0 6px 0 -1px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  font-size: 20px;
}
.cases .case-row-small .case-item {
  height: 265px;
}
@media (max-width: 540px) {
  .cases .case-row-small .case-item {
    height: 212px;
  }
}
.cases .case-row-small .timer {
  top: 29px;
}

.cases .case-row-small .case-item a {
  max-width: 212px;
  height: 100%;
  display: block;
  margin: 0 auto;
  position: relative;
}
.cases .case-row-small .case-item a .case-item-tooltipes {
  bottom: 61px;
}

.cases .case-item a .case-item-img .img-default,
.cases .case-item a .case-item-img .hover,
.cases .case-item a .case-item-img .not-hover {
  opacity: 1;
  top: 0;
  left: 50%;
  width: auto;
  height: auto;
  position: absolute;
  transform: translate(-50%, 0%);
  max-width: 304px;
}
@media (max-width: 1440px) {
  .cases .case-item a .case-item-img .img-default,
  .cases .case-item a .case-item-img .hover,
  .cases .case-item a .case-item-img .not-hover {
    max-width: 100%;
  }
}
@media (max-width: 1366px) {
  .cases .case-item a .case-item-img .img-default,
  .cases .case-item a .case-item-img .hover,
  .cases .case-item a .case-item-img .not-hover {
    min-width: auto;
    width: 100%;
    height: auto;
  }
  .cases .case-item a .case-item-img .img-default svg,
  .cases .case-item a .case-item-img .hover svg,
  .cases .case-item a .case-item-img .not-hover svg {
    position: absolute;
    top: -40px;
    left: 50%;
    transform: translate(-50%, 0%) scale(0.7);
  }
}

.cases .case-row-small .case-item a .case-item-img .img-default,
.cases .case-row-small .case-item a .case-item-img .hover,
.cases .case-row-small .case-item a .case-item-img .not-hover {
  max-width: 212px;
}
@media (max-width: 1366px) {
  .cases .case-row-small .case-item a .case-item-img .img-default svg,
  .cases .case-row-small .case-item a .case-item-img .hover svg,
  .cases .case-row-small .case-item a .case-item-img .not-hover svg {
    transform: translate(-50%, 0%) scale(0.5);
  }
}
@media (max-width: 480px) {
  .cases .case-row-small .case-item a .case-item-img .img-default,
  .cases .case-row-small .case-item a .case-item-img .hover,
  .cases .case-row-small .case-item a .case-item-img .not-hover {
    max-width: 154px;
  }
}

.cases .case-row-small .case-item .case-item-nums {
  top: -15px;
  right: 50%;
  transform: translateX(50%);
}

.cases .case-item a .case-item-img .hover {
  opacity: 0;
  transform: translate(-50%, 0%) scale(1.053);
  margin-top: -4px;
}

.cases .case-row-small .case-item a .case-item-img .hover {
  transform: translate(-50%, 0%) scale(1.076);
  margin-top: -2px;
}

.cases .case-item:not(.disable):hover {
  cursor: pointer;
}
.cases .case-item:not(.disable):hover .case-item-name {
  color: rgba(230, 155, 255, 0.64) !important;
}
.cases .case-item:not(.disable):hover .case-item-img .hover {
  opacity: 1;
}
.cases .case-item:not(.disable).case-item-static:not(.disable):hover .not-hover {
  opacity: 1;
}
.cases .case-item:not(.disable).case-item-static:not(.disable):hover .hover {
  opacity: 0;
}
.cases .case-item:not(.disable).case-item-hover:not(.disable) .not-hover {
  opacity: 0;
}
.cases .case-item:not(.disable).case-item-hover:not(.disable) .hover {
  opacity: 1;
}

.btn,
.open-case {
  min-width: 202px;
  line-height: 35px;
  border-radius: 25px;
  border: 2px solid #fff;
}

.btn-open-case {
  font-size: 18px;
  font-weight: 700;
  letter-spacing: 0.05em;
  line-height: 24px;
  color: #fff;
  border: 1px solid rgba(211, 44, 230, 0);
  text-shadow: 0px 0px 6px #f7c0fe;
  text-transform: uppercase;
  height: 48px;
  border-radius: 24px;
  padding: 0 16px;
  width: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: #fff;
  letter-spacing: 1px;
  z-index: 2;
  opacity: 0;
  transition: all 0.5s;
  transition-delay: 1s;
}

.case-item:hover:not(.disable) .btn-open-case {
  opacity: 1;
}

.case-item[data-rar=b0c3d9] .btn-open-case {
  background: rgba(176, 195, 217, 0.4);
  border: 4px solid #b7cde5;
  box-shadow: 0px 0px 16px #b0c3d9, 0px 0px 32px #b0c3d9, inset 0px 0px 64px #b0c3d9;
}

.cases .case-item[data-rar=b0c3d9]:not(.disable):hover .case-cost {
  background: rgba(176, 195, 217, 0.08);
}

.case-item[data-rar="5e98d9"] .btn-open-case {
  background: rgba(94, 152, 217, 0.4);
  border: 4px solid #64a1e5;
  box-shadow: 0px 0px 16px #5e98d9, 0px 0px 32px #5e98d9, inset 0px 0px 64px #5e98d9;
}

.cases .case-item[data-rar="5e98d9"]:not(.disable):hover .case-cost {
  background: rgba(94, 152, 217, 0.08);
}

.case-item[data-rar="4b69ff"] .btn-open-case {
  background: rgba(75, 105, 255, 0.4);
  border: 4px solid #5671f8;
  box-shadow: 0px 0px 16px #4b69ff, 0px 0px 32px #4b69ff, inset 0px 0px 64px #4b69ff;
}

.cases .case-item[data-rar="4b69ff"]:not(.disable):hover .case-cost {
  background: rgba(75, 105, 255, 0.08);
}

.case-item[data-rar="8847ff"] .btn-open-case {
  background: rgba(136, 71, 255, 0.4);
  border: 4px solid #9259fc;
  box-shadow: 0px 0px 16px #8847ff, 0px 0px 32px #8847ff, inset 0px 0px 64px #8847ff;
}

.cases .case-item[data-rar="8847ff"]:not(.disable):hover .case-cost {
  background: rgba(211, 44, 230, 0.08);
}

.case-item[data-rar=d32ce6] .btn-open-case {
  background: rgba(211, 44, 230, 0.4);
  border: 4px solid #ea32ff;
  box-shadow: 0px 0px 16px #d32ce6, 0px 0px 32px #d32ce6, inset 0px 0px 64px #d32ce6;
}

.cases .case-item[data-rar=d32ce6]:not(.disable):hover .case-cost {
  background: rgba(211, 44, 230, 0.08);
}

.case-item[data-rar=eb4b4b] .btn-open-case {
  background: rgba(235, 75, 75, 0.4);
  border: 4px solid #ff7a7a;
  box-shadow: 0px 0px 16px #eb4b4b, 0px 0px 32px #eb4b4b, inset 0px 0px 64px #eb4b4b;
}

.cases .case-item[data-rar=eb4b4b]:not(.disable):hover .case-cost {
  background: rgba(235, 75, 75, 0.08);
}

.case-item[data-rar=e4ae39] .btn-open-case {
  background: rgba(228, 174, 57, 0.4);
  border: 4px solid #f8c556;
  box-shadow: 0px 0px 16px #e4ae39, 0px 0px 32px #e4ae39, inset 0px 0px 64px #e4ae39;
}

.cases .case-item[data-rar=e4ae39]:not(.disable):hover .case-cost {
  background: rgba(255, 198, 0, 0.08);
}

.case-item[data-rar="06c50c"] .btn-open-case {
  background: rgba(6, 197, 12, 0.4);
  border: 4px solid #06c50c;
  box-shadow: 0px 0px 16px #06c50c, 0px 0px 32px #06c50c, inset 0px 0px 64px #06c50c;
}

.case-item-nums {
  position: absolute;
  top: 29px;
  right: 0;
  white-space: nowrap;
  z-index: 2;
  height: 24px;
  min-height: 24px;
  border-radius: 12px;
  font-weight: 500;
  font-size: 14px;
  line-height: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 4px 5px 4px 4px;
  background: linear-gradient(270deg, #3c0124 -25%, #340855 125%);
  border: 2px solid rgba(63, 9, 101, 0.42);
  color: rgba(230, 155, 255, 0.4);
}
@media (max-width: 1366px) {
  .case-item-nums {
    top: -25px;
    right: 50%;
    transform: translateX(50%);
  }
}
.case-item-nums .red {
  text-shadow: -1px -1px 0 rgba(235, 75, 75, 0.48), 1px -1px 0 rgba(235, 75, 75, 0.48), -1px 1px 0 rgba(235, 75, 75, 0.48), 1px 1px 0 rgba(235, 75, 75, 0.48), 0 0 24px rgba(235, 75, 75, 0.48), 0 0 13px rgba(235, 75, 75, 0.48);
  color: #fef2c8 !important;
}

.in-case-item .btn-sale-cost {
  right: auto;
  z-index: 3;
  top: -7px;
  left: 30px;
  height: 24px;
  border-radius: 24px;
  padding: 1px 10px;
  opacity: 0;
  transition: all 0.3s;
}
.in-case-item.active .btn-sale-cost {
  top: -2px;
}
.in-case-item.empty .img {
  border: 8px solid transparent;
  background: linear-gradient(180deg, rgba(139, 81, 146, 0.2), rgba(75, 51, 118, 0.2)) border-box;
  -webkit-mask: linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
}
.in-case-item.empty .img:before, .in-case-item.empty .img:after {
  display: none;
}
.in-case-item.empty:after {
  background: url(/files/images/c9ddf1c10230bd8994f2.svg) no-repeat 0 0;
  width: 238px;
  height: 212px;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  margin-top: -40px;
}
.in-case-item.active .btn-sale-cost {
  opacity: 1;
}

.battle-pass-text-block-item:after, .battle-pass-text-block-item:before, .battle-pass-quest-list-block-item-progress-item.done:after, .battle-pass-quest-list-block-item-progress-item:before, .battle-pass-quest-list-block-item:after, .battle-pass-quest-list-block-item:before, .battle-pass-quest-list-block-title:after, .battle-pass-quest-list-block-title:before, .battle-pass-progress-item.current:not(.done):after, .battle-pass-progress-item.current .battle-pass-progress-item-line-wrap span:before, .battle-pass-progress-item.active:not(.done):hover:before, .battle-pass-progress-item-pos:before, .battle-pass-progress-item-content-border-bottom:before, .battle-pass-progress-item-content-border-bottom:after, .battle-pass-progress-item-content-border-top:before, .battle-pass-progress-item-content-border-top:after, .battle-pass-progress-item:after, .battle-pass-progress-items:after, .battle-pass-progress-items:before, .battle-pass-progress-wrap.disabled:before, .page-battle-pass .battle-pass-user-info:before, .battle-pass-header-center:before, .main[data-pathname*="/battle_pass/"] .cases-battle-pass .case-row:before, .case-recomented .case-row:before, .open-case.old-sale:after, .open-case.old-sale:before, .page-timer:before, .page-timer-day:before, .cases .case-item.light .case-item-img:before, .in-case-item.empty:after {
  content: "";
  display: block;
  position: absolute;
}

.cases-all .case-row {
  margin-bottom: 5px;
  margin-top: -5px;
}

.cases-all .case-row-title {
  padding: 0 30px 5px;
  text-align: center;
  margin-bottom: 16px;
  position: relative;
  top: 2px;
}
@media (max-width: 1366px) {
  .cases-all .case-row-title {
    margin-bottom: 16px;
  }
}
@media (max-width: 480px) {
  .cases-all .case-row-title {
    margin-bottom: 25px;
  }
}
.cases-all .case-row-small .case-row-title {
  padding: 0 30px 0px;
  margin-bottom: 20px;
}

.cases-all {
  position: relative;
  z-index: 4;
}
@media (max-width: 1280px) {
  .cases-all {
    overflow: hidden;
  }
}

.cases-all .case-row-title-name {
  position: relative;
  line-height: 50px;
  margin-top: -5px;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 30px;
  font-weight: 900;
}
@media (max-width: 1024px) {
  .cases-all .case-row-title-name {
    font-size: 20px;
    line-height: 20px;
    height: 50px;
  }
}
.cases-all .case-row-title-name img {
  margin-right: 15px;
  display: none;
}

.case-item-name,
.case-row-title {
  line-height: 24px;
  text-transform: uppercase;
}

.case-item-name {
  min-height: 35px;
}

.cases {
  margin: 0 auto;
}
@media (max-width: 1440px) {
  .cases {
    overflow: hidden;
  }
}
.cases.cases-all {
  margin-top: 16px;
  overflow: hidden;
}

.case-row-title {
  color: #fff;
  font-size: 24px;
  letter-spacing: 1px;
  margin-bottom: 30px;
}

.cases-all .case-row-title-name:after {
  left: auto;
  right: -46px;
}

.cases-all .case-row-title:before {
  content: " ";
  width: 570px;
  height: 191px;
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  margin-top: -5px;
  transform: translate(-50%, -50%);
  z-index: 2;
  pointer-events: none;
}

.cases-all .case-row-title-name {
  color: rgba(17, 0, 49, 0.72);
}
.cases-all .case-row-title-name .mask {
  position: absolute;
  background: #fff;
  -webkit-mask: url(/files/images/66a8fc6dcda411d2c548.svg) repeat-x 50% 50%;
  width: 100%;
  height: 100%;
  display: block;
}
.cases-all .case-row-title-name .name {
  position: relative;
}
.cases-all .case-row-title-name:before, .cases-all .case-row-title-name:after {
  content: "";
  position: absolute;
  top: 0;
  left: -46px;
  display: block;
  z-index: 1;
  width: 47px;
  height: 50px;
  background: #fff;
  -webkit-mask: url(/files/images/bce03cf027b798238a2b.svg) no-repeat 100% 50%;
}
.cases-all .case-row-title-name:after {
  left: auto;
  right: -46px;
  -webkit-mask: url(/files/images/dcae1cbfa4be4e948f9b.svg) no-repeat 0% 50%;
}

.cases-all .case-row[data-rar=b0c3d9] {
  background: rgba(176, 195, 217, 0.12);
  box-shadow: inset 0px 2px 0px rgba(176, 195, 217, 0.2);
}
.cases-all .case-row[data-rar=b0c3d9] .case-row-title-name .mask, .cases-all .case-row[data-rar=b0c3d9] .case-row-title-name:before, .cases-all .case-row[data-rar=b0c3d9] .case-row-title-name:after {
  background-color: #b0c3d9;
}
.cases-all .case-row[data-rar="5e98d9"] {
  background: rgba(94, 152, 217, 0.12);
  box-shadow: inset 0px 2px 0px rgba(94, 152, 217, 0.2);
}
.cases-all .case-row[data-rar="5e98d9"] .case-row-title-name .mask, .cases-all .case-row[data-rar="5e98d9"] .case-row-title-name:before, .cases-all .case-row[data-rar="5e98d9"] .case-row-title-name:after {
  background-color: #5e98d9;
}
.cases-all .case-row[data-rar="4b69ff"] {
  background: rgba(75, 105, 255, 0.12);
  box-shadow: inset 0px 2px 0px rgba(75, 105, 255, 0.2);
}
.cases-all .case-row[data-rar="4b69ff"] .case-row-title-name .mask, .cases-all .case-row[data-rar="4b69ff"] .case-row-title-name:before, .cases-all .case-row[data-rar="4b69ff"] .case-row-title-name:after {
  background-color: #4b69ff;
}
.cases-all .case-row[data-rar="8847ff"] {
  background: rgba(136, 71, 255, 0.12);
  box-shadow: inset 0px 2px 0px rgba(136, 71, 255, 0.2);
}
.cases-all .case-row[data-rar="8847ff"] .case-row-title-name .mask, .cases-all .case-row[data-rar="8847ff"] .case-row-title-name:before, .cases-all .case-row[data-rar="8847ff"] .case-row-title-name:after {
  background-color: #8847ff;
}
.cases-all .case-row[data-rar=d32ce6] {
  background: rgba(211, 44, 230, 0.12);
  box-shadow: inset 0px 2px 0px rgba(211, 44, 230, 0.2);
}
.cases-all .case-row[data-rar=d32ce6] .case-row-title-name .mask, .cases-all .case-row[data-rar=d32ce6] .case-row-title-name:before, .cases-all .case-row[data-rar=d32ce6] .case-row-title-name:after {
  background-color: #d32ce6;
}
.cases-all .case-row[data-rar=eb4b4b] {
  background: rgba(235, 75, 75, 0.12);
  box-shadow: inset 0px 2px 0px rgba(235, 75, 75, 0.2);
}
.cases-all .case-row[data-rar=eb4b4b] .case-row-title-name .mask, .cases-all .case-row[data-rar=eb4b4b] .case-row-title-name:before, .cases-all .case-row[data-rar=eb4b4b] .case-row-title-name:after {
  background-color: #eb4b4b;
}
.cases-all .case-row[data-rar=e4ae39] {
  background: rgba(228, 174, 57, 0.12);
  box-shadow: inset 0px 2px 0px rgba(228, 174, 57, 0.2);
}
.cases-all .case-row[data-rar=e4ae39] .case-row-title-name .mask, .cases-all .case-row[data-rar=e4ae39] .case-row-title-name:before, .cases-all .case-row[data-rar=e4ae39] .case-row-title-name:after {
  background-color: #e4ae39;
}
.cases-all .case-row.pattern {
  background-image: url(/files/images/cbc668d74b61604e0f57.png);
}

.case-row-title-sec {
  font-weight: 400;
  font-size: 16px;
  line-height: 24px;
  color: rgba(213, 185, 255, 0.5);
  text-transform: none;
  margin-top: 20px;
}

.open-case.old-sale {
  background-image: linear-gradient(to right, #330351, #1d0457);
  border: none;
  box-shadow: none !important;
  min-width: 70px !important;
  margin-right: 5px;
  position: relative;
  overflow: visible;
  line-height: 28px;
  height: 28px;
  vertical-align: top;
  margin-top: 5px;
  font-size: 18px;
  font-style: normal;
  font-weight: 700;
  letter-spacing: 1.8px;
  text-align: center;
  color: rgba(213, 185, 255, 0.5);
  padding: 0 12px;
}
@media (max-width: 992px) {
  .open-case.old-sale {
    margin-bottom: 10px;
  }
}
@media (max-width: 768px) {
  .open-case.old-sale {
    margin-right: 12px;
    font-size: 16px;
  }
}
@media (max-width: 359px) {
  .open-case.old-sale {
    margin-right: 4px;
    padding: 0 9px;
    min-width: auto !important;
  }
}

.cases-all .open-case.old-sale .fa {
  color: rgba(255, 255, 255, 0.5);
}

.open-case.old-sale:before {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  height: 2px;
  background-image: linear-gradient(to right, #330351, #1d0457);
  display: block;
  width: calc(100% - 24px);
  z-index: 2;
  margin-top: 2px;
}
.open-case.old-sale:after {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  height: 2px;
  box-shadow: 0 0 3px 0 #ff6262;
  background-color: #ffc2c3;
  display: block;
  width: calc(100% - 24px);
  z-index: 2;
}

.case-cost .fa {
  margin-left: 5px;
}

.case-row {
  position: relative;
}

.case-item .load {
  text-decoration: none;
}
.case-item .load .img-default {
  opacity: 0;
}

.case-cost-battle-pass {
  background: linear-gradient(90deg, #26003e 0%, #230170 100%);
  box-shadow: 0 0 0 4px rgba(40, 4, 161, 0.24);
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  font-weight: 500;
  font-size: 16px;
  line-height: 19px;
  color: rgba(213, 185, 255, 0.68);
  padding: 0 4px 0 8px;
  margin: 0 12px;
}
.case-cost-battle-pass svg {
  margin-left: 4px;
}

.case-recomented .case-row-title-name {
  color: #FFFFFF !important;
  -webkit-text-stroke: 1px #D32CE6;
  text-shadow: 0px 0px 24px #D32CE6;
}
.case-recomented .case-row {
  background: rgba(211, 44, 230, 0.12);
  box-shadow: inset 0px 2px 0px rgba(211, 44, 230, 0.2);
}
.case-recomented .case-row:before {
  pointer-events: none;
  width: 100%;
  height: 100%;
  top: 0;
  background: url(/files/images/af48e779943060fda431.png) repeat 0 0;
  opacity: 0.6;
}
.case-recomented.case-recomented-battle-pass .case-row:before {
  background: url(/files/images/b0e3b8ff549b4ac9876d.png) repeat 0 0;
}

.battle-pass-quest-list-desclaimer {
  position: relative;
  background: linear-gradient(270deg, rgba(27, 25, 95, 0) 0%, rgba(30, 18, 88, 0.8) 26.58%, #200e54 100%);
  border-radius: 8px;
  padding: 16px 16px 8px 16px;
  margin: -20px 0 52px 0;
  overflow: hidden;
}
.battle-pass-quest-list-desclaimer .icon[data-icon=campaign],
.battle-pass-quest-list-desclaimer .icon[data-icon=feedback] {
  font-weight: 400;
  font-size: 96px;
  line-height: 96px;
  background: linear-gradient(0deg, #5119b8 0%, #8847ff 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  text-fill-color: transparent;
  opacity: 0.32;
  position: absolute;
  top: -15px;
  left: -17px;
}
.battle-pass-quest-list-desclaimer .icon[data-icon=close] {
  position: absolute;
  top: 4px;
  right: 4px;
  background: linear-gradient(90deg, #1c1132 0%, #120929 100%);
  box-shadow: inset 0 0 0 2px rgba(136, 71, 255, 0.4), 0px 0px 28px rgba(136, 71, 255, 0.4);
  border-radius: 24px;
  width: 24px;
  height: 24px;
  font-size: 16px;
  line-height: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: rgba(136, 71, 255, 0.4);
  cursor: pointer;
  transition: all 0.3s;
}
.battle-pass-quest-list-desclaimer .icon[data-icon=close]:hover {
  box-shadow: inset 0 0 0 4px #8847ff, 0px 0px 28px rgba(136, 71, 255, 0.4);
  transform: rotate(90deg);
}
.battle-pass-quest-list-desclaimer-title {
  font-weight: 700;
  font-size: 14px;
  line-height: 16px;
  color: #ffc600;
  margin-bottom: 8px;
  position: relative;
}
.battle-pass-quest-list-desclaimer-title span {
  color: #eb4b4b;
}
.battle-pass-quest-list-desclaimer-text {
  font-size: 14px;
  line-height: 16px;
  color: rgba(213, 185, 255, 0.5);
  position: relative;
}
.battle-pass-quest-list-desclaimer-text p {
  margin-bottom: 8px;
}

.main[data-pathname*="/battle_pass/"] .wrap {
  overflow: hidden;
  user-select: none;
}
.main[data-pathname*="/battle_pass/"] .header-left .logo:before {
  display: none;
}
.main[data-pathname*="/battle_pass/"] .cases-battle-pass .case-row-title-name {
  -webkit-text-stroke: 0;
}
.main[data-pathname*="/battle_pass/"] .cases-battle-pass .case-row {
  background: rgba(211, 44, 230, 0.12);
  box-shadow: inset 0px 2px 0px rgba(211, 44, 230, 0.2);
}
.main[data-pathname*="/battle_pass/"] .cases-battle-pass .case-row:before {
  pointer-events: none;
  width: 100%;
  height: 100%;
  top: 0;
  background: url(/files/images/b0e3b8ff549b4ac9876d.png) repeat 0 0;
  opacity: 0.6;
}

.page-battle-pass-video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 407px;
}
@media (max-width: 992px) {
  .page-battle-pass-video {
    top: 220px;
  }
}
@media (max-width: 480px) {
  .page-battle-pass-video {
    top: 250px;
  }
}
.page-battle-pass-video img,
.page-battle-pass-video video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  -webkit-mask-image: url(/files/images/c594c2b75ae352891329.svg);
  -webkit-mask-position: 50% 50%;
  -webkit-mask-size: cover;
}
@media (max-width: 480px) {
  .page-battle-pass-video img,
  .page-battle-pass-video video {
    min-width: 541px;
  }
}
.page-battle-pass-video img {
  display: block;
}

.battle-pass-header {
  display: flex;
}
@media (max-width: 992px) {
  .battle-pass-header {
    flex-direction: column;
    position: relative;
  }
}
.battle-pass-header-center {
  width: 416px;
  min-height: 385px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}
@media (max-width: 992px) {
  .battle-pass-header-center {
    order: 2;
    position: absolute;
    bottom: 0;
    right: 0;
    min-height: 250px;
    width: 250px;
    height: 250px;
  }
}
@media (max-width: 768px) {
  .battle-pass-header-center {
    min-height: 180px;
    width: 180px;
    height: 180px;
    bottom: 90px;
  }
}
@media (max-width: 480px) {
  .battle-pass-header-center {
    right: -20px;
  }
}
.battle-pass-header-center:before {
  background: url(/files/images/31a6ef79750199d65a38.png) no-repeat 0 0;
  background-size: 100%;
  width: 416px;
  height: 416px;
  animation: spin 8s linear infinite;
  z-index: -1;
}
.battle-pass-header-center img {
  width: 360px;
  max-width: 360px;
  height: auto;
  display: block;
  padding-top: 25px;
}
@media (max-width: 992px) {
  .battle-pass-header-center img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
}
.battle-pass-header-center .battle-pass-text-block {
  top: 50%;
  transform: translateY(-50%);
}
@media (max-width: 768px) {
  .battle-pass-header-center .battle-pass-text-block {
    padding: 0;
  }
}
.battle-pass-header-center .battle-pass-text-block-item {
  font-size: 96px;
}
@media (max-width: 480px) {
  .battle-pass-header-center .battle-pass-text-block-item {
    font-size: 56px;
  }
}
.battle-pass-header-center .battle-pass-text-block-sec, .battle-pass-header-center .battle-pass-text-block-sec-shadow {
  bottom: 0px;
  font-size: 34px;
}
@media (max-width: 480px) {
  .battle-pass-header-center .battle-pass-text-block-sec, .battle-pass-header-center .battle-pass-text-block-sec-shadow {
    font-size: 18px;
  }
}
.battle-pass-header-left {
  padding-top: 60px;
}
@media (max-width: 992px) {
  .battle-pass-header-left {
    padding-top: 24px;
  }
}
.battle-pass-header-right, .battle-pass-header-left {
  width: calc(50% - 208px);
}
@media (max-width: 992px) {
  .battle-pass-header-right, .battle-pass-header-left {
    width: 100%;
  }
}
.battle-pass-header-right {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  padding-top: 95px;
}
@media (max-width: 992px) {
  .battle-pass-header-right {
    padding-top: 28px;
    align-items: flex-start;
  }
}
@media (max-width: 768px) {
  .battle-pass-header-right {
    padding-top: 45px;
  }
}
@media (max-width: 768px) {
  .battle-pass-header .btn-open {
    margin: 0 auto;
  }
}
@media (max-width: 768px) {
  .battle-pass-header .btn-get {
    margin: 0 auto;
  }
}
.battle-pass-header .btn-get[data-rar="5e98d9"] {
  background: rgba(94, 152, 217, 0.2);
  box-shadow: inset 0 0 0 4px #5e98d9, 0px 0px 16px rgba(94, 152, 217, 0.64);
}
.battle-pass-header .btn-get[data-rar="5e98d9"]:hover {
  background: rgba(94, 152, 217, 0.48);
  box-shadow: inset 0 0 0 6px #5e98d9, 0px 0px 16px rgba(94, 152, 217, 0.64);
}
.battle-pass-header .btn-get[data-rar="4b69ff"] {
  background: rgba(75, 105, 255, 0.2);
  box-shadow: inset 0 0 0 4px #4b69ff, 0px 0px 16px rgba(75, 105, 255, 0.64);
}
.battle-pass-header .btn-get[data-rar="4b69ff"]:hover {
  background: rgba(75, 105, 255, 0.48);
  box-shadow: inset 0 0 0 6px #4b69ff, 0px 0px 16px rgba(75, 105, 255, 0.64);
}
.battle-pass-header .btn-get[data-rar="8847ff"] {
  background: rgba(136, 71, 255, 0.2);
  box-shadow: inset 0 0 0 4px #8847ff, 0px 0px 16px rgba(136, 71, 255, 0.64);
}
.battle-pass-header .btn-get[data-rar="8847ff"]:hover {
  background: rgba(136, 71, 255, 0.48);
  box-shadow: inset 0 0 0 6px #8847ff, 0px 0px 16px rgba(136, 71, 255, 0.64);
}
.battle-pass-header .btn-get[data-rar=d32ce6] {
  background: rgba(211, 44, 230, 0.2);
  box-shadow: inset 0 0 0 4px #d32ce6, 0px 0px 16px rgba(211, 44, 230, 0.64);
}
.battle-pass-header .btn-get[data-rar=d32ce6]:hover {
  background: rgba(211, 44, 230, 0.48);
  box-shadow: inset 0 0 0 6px #d32ce6, 0px 0px 16px rgba(211, 44, 230, 0.64);
}
.battle-pass-header .btn-get[data-rar=eb4b4b] {
  background: rgba(235, 75, 75, 0.2);
  box-shadow: inset 0 0 0 4px #eb4b4b, 0px 0px 16px rgba(235, 75, 75, 0.64);
}
.battle-pass-header .btn-get[data-rar=eb4b4b]:hover {
  background: rgba(235, 75, 75, 0.48);
  box-shadow: inset 0 0 0 6px #eb4b4b, 0px 0px 16px rgba(235, 75, 75, 0.64);
}
.battle-pass-header .btn-get[data-rar=ffc600], .battle-pass-header .btn-get[data-rar=ffd700], .battle-pass-header .btn-get[data-rar=e4ae39] {
  background: rgba(255, 198, 0, 0.2);
  box-shadow: inset 0 0 0 4px #ffd700, 0px 0px 16px rgba(255, 198, 0, 0.64);
}
.battle-pass-header .btn-get[data-rar=ffc600]:hover, .battle-pass-header .btn-get[data-rar=ffd700]:hover, .battle-pass-header .btn-get[data-rar=e4ae39]:hover {
  background: rgba(255, 198, 0, 0.48);
  box-shadow: inset 0 0 0 6px #ffd700, 0px 0px 16px rgba(255, 198, 0, 0.64);
}
.battle-pass-header .btn-get[disabled] {
  background: rgba(136, 71, 255, 0.2);
  box-shadow: inset 0 0 0 4px rgba(136, 71, 255, 0.2);
  opacity: 1;
}
.battle-pass-header .btn-get[disabled] .text {
  color: rgba(255, 255, 255, 0.32);
  text-shadow: none;
}
.battle-pass-header .btn-get[disabled] .cost {
  background: rgba(136, 71, 255, 0.2);
}
.battle-pass-header .btn-get[disabled] .cost svg {
  opacity: 0.5;
}
.battle-pass-header .btn-get[disabled][data-rar="5e98d9"] {
  background: rgba(94, 152, 217, 0.2);
  box-shadow: inset 0 0 0 4px rgba(94, 152, 217, 0.2);
}
.battle-pass-header .btn-get[disabled][data-rar="5e98d9"] .cost {
  background: rgba(94, 152, 217, 0.2);
}
.battle-pass-header .btn-get[disabled][data-rar="4b69ff"] {
  background: rgba(75, 105, 255, 0.2);
  box-shadow: inset 0 0 0 4px rgba(75, 105, 255, 0.2);
}
.battle-pass-header .btn-get[disabled][data-rar="4b69ff"] .cost {
  background: rgba(75, 105, 255, 0.2);
}
.battle-pass-header .btn-get[disabled][data-rar="8847ff"] {
  background: rgba(136, 71, 255, 0.2);
  box-shadow: inset 0 0 0 4px rgba(136, 71, 255, 0.2);
}
.battle-pass-header .btn-get[disabled][data-rar="8847ff"] .cost {
  background: rgba(136, 71, 255, 0.2);
}
.battle-pass-header .btn-get[disabled][data-rar=d32ce6] {
  background: rgba(211, 44, 230, 0.2);
  box-shadow: inset 0 0 0 4px rgba(211, 44, 230, 0.2);
}
.battle-pass-header .btn-get[disabled][data-rar=d32ce6] .cost {
  background: rgba(211, 44, 230, 0.2);
}
.battle-pass-header .btn-get[disabled][data-rar=eb4b4b] {
  background: rgba(235, 75, 75, 0.2);
  box-shadow: inset 0 0 0 4px rgba(235, 75, 75, 0.2);
}
.battle-pass-header .btn-get[disabled][data-rar=eb4b4b] .cost {
  background: rgba(235, 75, 75, 0.2);
}
.battle-pass-header .btn-get[disabled][data-rar=ffc600], .battle-pass-header .btn-get[disabled][data-rar=ffd700], .battle-pass-header .btn-get[disabled][data-rar=e4ae39] {
  background: rgba(228, 174, 57, 0.2);
  box-shadow: inset 0 0 0 4px rgba(228, 174, 57, 0.2);
}
.battle-pass-header .btn-get[disabled][data-rar=ffc600] .cost, .battle-pass-header .btn-get[disabled][data-rar=ffd700] .cost, .battle-pass-header .btn-get[disabled][data-rar=e4ae39] .cost {
  background: rgba(228, 174, 57, 0.2);
}
.battle-pass-header .btn-get.btn-get-lock[disabled] {
  background: rgba(136, 71, 255, 0.2);
  box-shadow: inset 0 0 0 4px rgba(136, 71, 255, 0.2);
}
.battle-pass-header .btn-get.btn-get-lock[disabled] .cost {
  background: rgba(136, 71, 255, 0.2);
  color: rgba(255, 255, 255, 0.32);
}
.battle-pass-header .btn-get.btn-get-lock[disabled] .cost svg {
  opacity: 0.32;
}
.battle-pass-header[data-rar="4b69ff"] .battle-pass-text-block-item {
  filter: drop-shadow(2px 3px 0px #4b69ff);
}
.battle-pass-header[data-rar="4b69ff"] .battle-pass-text-block-item:after {
  text-shadow: 0px 8px 12px #4b69ff;
}
.battle-pass-header[data-rar="5e98d9"] .battle-pass-text-block-item {
  filter: drop-shadow(2px 3px 0px #5e98d9);
}
.battle-pass-header[data-rar="5e98d9"] .battle-pass-text-block-item:after {
  text-shadow: 0px 8px 12px #5e98d9;
}
.battle-pass-header[data-rar="8847ff"] .battle-pass-text-block-item {
  filter: drop-shadow(2px 3px 0px #8847ff);
}
.battle-pass-header[data-rar="8847ff"] .battle-pass-text-block-item:after {
  text-shadow: 0px 8px 12px #8847ff;
}
.battle-pass-header[data-rar=d32ce6] .battle-pass-text-block-item {
  filter: drop-shadow(2px 3px 0px #d32ce6);
}
.battle-pass-header[data-rar=d32ce6] .battle-pass-text-block-item:after {
  text-shadow: 0px 8px 12px #d32ce6;
}
.battle-pass-header[data-rar=eb4b4b] .battle-pass-text-block-item {
  filter: drop-shadow(2px 3px 0px #eb4b4b);
}
.battle-pass-header[data-rar=ffd600] .battle-pass-text-block-item, .battle-pass-header[data-rar=ffd700] .battle-pass-text-block-item, .battle-pass-header[data-rar=e4ae39] .battle-pass-text-block-item {
  filter: drop-shadow(2px 3px 0px #ffd700);
}
.battle-pass-header[data-rar=ffd600] .battle-pass-text-block-item:after, .battle-pass-header[data-rar=ffd700] .battle-pass-text-block-item:after, .battle-pass-header[data-rar=e4ae39] .battle-pass-text-block-item:after {
  text-shadow: 0px 8px 12px #ffd700;
}

.page-battle-pass {
  max-width: 1170px;
  margin: 0 auto;
  position: relative;
}
@media (max-width: 1200px) {
  .page-battle-pass {
    padding: 0 20px;
  }
}
.page-battle-pass .battle-pass-title {
  font-weight: 900;
  font-size: 30px;
  line-height: 30px;
  text-transform: uppercase;
  color: #5d0068;
  -webkit-text-stroke: 2px #c131e4;
  text-shadow: 0px 0px 24px rgba(193, 49, 228, 0.64);
  margin-bottom: 8px;
}
.page-battle-pass .battle-pass-count {
  font-weight: 900;
  font-size: 40px;
  line-height: 40px;
  text-transform: uppercase;
  color: #fff;
  -webkit-text-stroke: 1px #c131e4;
  text-shadow: 0px 0px 80px #c131e4, 0px 0px 24px rgba(193, 49, 228, 0.64);
  margin-bottom: 25px;
}
.page-battle-pass .battle-pass-text {
  font-size: 16px;
  line-height: 24px;
  color: rgba(230, 155, 255, 0.8);
}
@media (max-width: 992px) {
  .page-battle-pass .battle-pass-text {
    color: rgba(213, 185, 255, 0.8);
  }
}
.page-battle-pass .battle-pass-user-info {
  padding-left: 8px;
  margin-bottom: 24px;
  display: flex;
  align-items: center;
  position: relative;
}
.page-battle-pass .battle-pass-user-info:before {
  width: 56px;
  height: 8px;
  background: linear-gradient(180deg, #3f03b9 0%, #150041 100%);
  border-radius: 2px;
  left: 4px;
  top: 8px;
}
.page-battle-pass .battle-pass-user-info-lvl {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 57px;
  background: url(/files/images/439a3d0e7a4bd760add7.svg) no-repeat 0 0;
  padding-bottom: 10px;
  margin-right: 28px;
  position: relative;
  filter: drop-shadow(0px 16px 16px rgba(14, 0, 44, 0.4));
}
.page-battle-pass .battle-pass-user-info-lvl-num, .page-battle-pass .battle-pass-user-info-lvl-text {
  background: linear-gradient(0deg, #9e7bff 0%, #faebff 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  text-fill-color: transparent;
}
.page-battle-pass .battle-pass-user-info-lvl-num {
  font-weight: 800;
  font-size: 24px;
  line-height: 24px;
  filter: drop-shadow(0px 3px 0px #330090);
}
.page-battle-pass .battle-pass-user-info-lvl-text {
  font-weight: 800;
  font-size: 12px;
  line-height: 12px;
  filter: drop-shadow(0px 2px 0px #330090);
  text-transform: uppercase;
}
.page-battle-pass .battle-pass-user-info-cost {
  margin-top: -6px;
}
.page-battle-pass .battle-pass-user-info-cost-case {
  display: flex;
  align-items: center;
  font-weight: 900;
  font-size: 30px;
  line-height: 30px;
  color: #ffffff;
  margin-bottom: 2px;
}
.page-battle-pass .battle-pass-user-info-cost-case svg {
  margin-left: 4px;
}
.page-battle-pass .battle-pass-user-info-cost-user {
  display: flex;
  align-items: center;
  font-size: 16px;
  line-height: 16px;
  color: rgba(230, 155, 255, 0.8);
}
.page-battle-pass .battle-pass-user-info-cost-user svg {
  margin: 0 8px 0 2px;
}
.page-battle-pass .battle-pass-user-info-cost-user > :first-child {
  font-weight: 700;
}
.page-battle-pass .battle-pass-type {
  font-weight: 700;
  font-size: 20px;
  line-height: 20px;
  color: #d32ce6;
  margin-bottom: 8px;
}
.page-battle-pass .battle-pass-name {
  font-weight: 900;
  font-size: 30px;
  line-height: 30px;
  text-transform: uppercase;
  color: #f7dbff;
  -webkit-text-stroke: 1px #c131e4;
  text-shadow: 0px 0px 80px #c131e4, 0px 0px 24px rgba(193, 49, 228, 0.64);
  margin-bottom: 16px;
  text-align: end;
}
.page-battle-pass .battle-pass-descr {
  font-size: 16px;
  line-height: 24px;
  text-align: right;
  color: rgba(230, 155, 255, 0.8);
  max-width: 260px;
  margin-bottom: 32px;
}
@media (max-width: 992px) {
  .page-battle-pass .battle-pass-descr {
    text-align: left;
  }
}
@media (max-width: 640px) {
  .page-battle-pass .battle-pass-descr {
    max-width: 180px;
  }
}
@media (max-width: 359px) {
  .page-battle-pass .battle-pass-descr {
    max-width: 140px;
  }
}
.page-battle-pass .page-timer {
  width: 100%;
  height: 36px;
  margin-bottom: 22px;
}
@media (max-width: 992px) {
  .page-battle-pass .page-timer {
    margin-bottom: 20px;
  }
}
.page-battle-pass .page-timer:before {
  width: 411px;
  height: 103px;
  background: url(/files/images/2390e70901f152449c2c.svg) no-repeat 0 0;
  left: -30px;
  margin-top: -1px;
}
.page-battle-pass .page-timer-wrap {
  justify-content: flex-start;
  font-weight: 500;
  font-size: 16px;
  line-height: 19px;
  color: #d32ce6;
  text-shadow: 0px 2px 0px #3a004e;
  padding-left: 0;
}
.page-battle-pass .page-timer-day {
  font-weight: 500;
  font-size: 16px;
  line-height: 19px;
  color: #ffc600;
  margin-right: 15px;
}
.page-battle-pass .page-timer-day:before {
  background: linear-gradient(255.3deg, #d32ce6 0%, rgba(76, 0, 85, 0.12) 54.75%);
  opacity: 0.2;
  margin-left: -10px;
  height: 38px;
  margin-top: -1px;
}
.page-battle-pass .page-timer-separator {
  margin: 0 5px;
}

.battle-pass-progress-wrap {
  background: radial-gradient(50% 79.2% at 50% 100%, #29003d 0%, #120130 100%);
  margin-top: 24px;
  margin-bottom: 30px;
  position: relative;
}
@media (max-width: 1200px) {
  .battle-pass-progress-wrap {
    padding-left: 15px;
  }
}
.battle-pass-progress-wrap .login-btns,
.battle-pass-progress-wrap .open-cases-btns {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 2;
}
@media (max-width: 992px) {
  .battle-pass-progress-wrap .login-btns,
  .battle-pass-progress-wrap .open-cases-btns {
    display: none;
  }
}
.battle-pass-progress-wrap .login-btns .advantages-sign-in-vk,
.battle-pass-progress-wrap .open-cases-btns .advantages-sign-in-vk {
  margin-right: 35px;
}
.battle-pass-progress-wrap .login-btns {
  display: none;
}
@media (max-width: 992px) {
  .battle-pass-progress-wrap .login-btns {
    display: flex;
  }
}
.battle-pass-progress-wrap.disabled:before {
  background: rgba(19, 7, 44, 0.8);
  height: calc(100% - 4px);
  width: 100%;
  top: 2px;
  z-index: 2;
}
.battle-pass-progress-wrap.disabled .battle-pass-progress-items {
  pointer-events: none;
  cursor: none;
}
.battle-pass-progress-items {
  width: 1170px;
  min-height: 344px;
  position: relative;
  padding: 20px 0 51px 0;
  margin: 0 auto;
  display: flex;
  padding-left: 5px;
  overflow: initial;
}
@media (max-width: 768px) {
  .battle-pass-progress-items {
    min-height: 304px;
    width: auto;
    padding-right: 20px;
  }
}
.battle-pass-progress-items:after, .battle-pass-progress-items:before {
  width: 100%;
  height: 2px;
  background: linear-gradient(90deg, rgba(32, 8, 66, 0.0001) 0%, #860b95 50%, #870b95 50%, rgba(32, 8, 66, 0.0001) 100%);
  opacity: 0.4;
  top: 0;
  left: 0;
}
.battle-pass-progress-items:after {
  top: auto;
  bottom: 0;
}
.battle-pass-progress-items .swiper-scrollbar {
  width: 1170px;
  bottom: 21px;
  left: 7px;
  background: rgba(0, 0, 0, 0.3);
  border: 2px solid rgba(211, 44, 230, 0.2);
  border-radius: 5px;
  padding: 3px;
  overflow: hidden;
}
@media (max-width: 768px) {
  .battle-pass-progress-items .swiper-scrollbar {
    width: calc(100% - 24px);
  }
}
.battle-pass-progress-items .swiper-scrollbar-drag {
  top: -1px;
  background: #d635bb;
  opacity: 0.64;
  border-radius: 4px;
  height: 2px;
}
.battle-pass-progress-items .swiper-wrapper > :last-child {
  margin-right: 0;
}
.battle-pass-progress-item {
  margin-right: 20px;
  max-width: 200px;
  position: relative;
}
@media (max-width: 768px) {
  .battle-pass-progress-item {
    width: 152px;
    margin-right: 8px;
  }
}
.battle-pass-progress-item:after {
  width: 100%;
  height: 100%;
  position: absolute;
  border-radius: 8px;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.battle-pass-progress-item-line {
  padding: 2px;
  height: 16px;
  width: 100%;
  border-radius: 20px;
  margin-bottom: 20px;
  background: linear-gradient(to bottom, rgba(136, 71, 255, 0.17), rgba(136, 71, 255, 0.31));
}
.battle-pass-progress-item-line-wrap {
  width: 100%;
  height: 100%;
  background: #120130;
  border-radius: 20px;
  position: relative;
  padding: 0 2px;
  display: flex;
  align-items: center;
}
.battle-pass-progress-item-line-wrap span {
  height: 8px;
  display: block;
}
.battle-pass-progress-item-line.empty {
  background: linear-gradient(to bottom, rgba(136, 71, 255, 0.14), rgba(136, 71, 255, 0.31));
}
.battle-pass-progress-item-line.empty .battle-pass-progress-item-line-wrap {
  background: linear-gradient(to bottom, rgba(59, 22, 116, 0) 0%, rgb(38, 16, 78) 100%);
}
.battle-pass-progress-item-line.progress .battle-pass-progress-item-line-wrap {
  background: linear-gradient(to bottom, rgba(59, 22, 116, 0) 0%, #26104e 100%);
}
.battle-pass-progress-item-line.progress span {
  background: #d32ce6;
  box-shadow: inset 0px 2px 2px rgba(255, 255, 255, 0.64), inset 0px -2px 2px rgba(46, 12, 107, 0.48);
  border-radius: 16px;
  position: relative;
}
.battle-pass-progress-item-line.done .battle-pass-progress-item-line-wrap {
  background: linear-gradient(to bottom, rgba(59, 22, 116, 0) 0%, #26104e 100%);
}
.battle-pass-progress-item-line.done span {
  background: #8847ff;
  box-shadow: inset 0px 2px 2px rgba(255, 255, 255, 0.64), inset 0px -2px 2px rgba(46, 12, 107, 0.48);
  border-radius: 16px;
  position: relative;
}
.battle-pass-progress-item-content-honey {
  overflow: hidden;
  position: absolute;
  height: calc(100% - 4px);
  width: calc(100% - 4px);
  top: 2px;
  left: 2px;
}
.battle-pass-progress-item-content-honey svg {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.battle-pass-progress-item-content-honey svg path {
  transition: all 0.3s;
}
.battle-pass-progress-item-content {
  width: 200px;
  height: 240px;
  position: relative;
  z-index: 2;
  cursor: pointer;
  border-radius: 8px;
}
@media (max-width: 768px) {
  .battle-pass-progress-item-content {
    width: 152px;
    height: 200px;
  }
}
.battle-pass-progress-item-content-border-top {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  pointer-events: none;
  opacity: 0.4;
  transition: all 0.3s;
}
.battle-pass-progress-item-content-border-top:before, .battle-pass-progress-item-content-border-top:after {
  height: 32px;
  width: 32px;
  border-radius: 8px 0 0 0;
  border-top: 2px solid #06c50c;
  border-left: 2px solid #06c50c;
  transition: all 0.3s;
  box-sizing: border-box;
}
.battle-pass-progress-item-content-border-top:after {
  border: 0;
  border-top: 2px solid #06c50c;
  border-right: 2px solid #06c50c;
  border-radius: 0 8px 0 0;
  left: auto;
  right: 0;
}
.battle-pass-progress-item-content-border-bottom {
  position: absolute;
  top: auto;
  bottom: 0;
  left: 0;
  width: 100%;
  pointer-events: none;
  height: 32px;
  opacity: 0.4;
  transition: all 0.3s;
}
.battle-pass-progress-item-content-border-bottom:before, .battle-pass-progress-item-content-border-bottom:after {
  height: 32px;
  width: 32px;
  border-radius: 0 0 0 8px;
  border-bottom: 2px solid #06c50c;
  border-left: 2px solid #06c50c;
  transition: all 0.3s;
  box-sizing: border-box;
}
.battle-pass-progress-item-content-border-bottom:after {
  border: 0;
  border-bottom: 2px solid #06c50c;
  border-right: 2px solid #06c50c;
  border-radius: 0 0 8px 0;
  left: auto;
  right: 0;
}
.battle-pass-progress-item-content-border-outside {
  position: absolute;
  top: 50%;
  left: 50%;
  width: calc(100% + 12px);
  height: calc(100% + 12px);
  pointer-events: none;
  transform: translate(-50%, -50%);
  border-radius: 12px;
  transition: all 0.3s;
  opacity: 0;
}
.battle-pass-progress-item-content .case-cost-battle-pass {
  position: absolute;
  top: 10px;
  right: 10px;
  margin: 0;
  background: linear-gradient(90deg, #490475 0%, #380b9d 100%);
  box-shadow: 0 0 0 2px #6804a1;
  z-index: 2;
}
.battle-pass-progress-item-content img {
  width: 190px;
  height: 190px;
  position: absolute;
  top: 0;
  left: 50%;
  object-fit: contain;
  transform: translate(-50%, 0);
}
@media (max-width: 768px) {
  .battle-pass-progress-item-content img {
    width: 100%;
    height: 160px;
  }
}
.battle-pass-progress-item-content span svg {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 140px;
  height: 140px;
}
.battle-pass-progress-item-content .in-case-status-default {
  left: auto;
  right: 10px;
  top: 10px;
}
.battle-pass-progress-item-content .in-case-status-default img {
  width: 100%;
  height: 100%;
  max-width: 16px;
}
.battle-pass-progress-item-content .in-case-status-default .battle-pass-progress-item-check-label {
  background: linear-gradient(#26003e 0%, #230170 100%);
  white-space: nowrap;
}
.battle-pass-progress-item-check {
  position: absolute;
  top: 8px;
  right: 8px;
  color: #ffffff;
  cursor: pointer;
}
.battle-pass-progress-item-check-wrap {
  background: linear-gradient(90deg, #005700 0%, #089408 100%);
  box-shadow: inset 0 0 0 2px #06c50c;
  width: 24px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-shadow: 0px 0px 12px #ff2f2f;
  border-radius: 50%;
  transition: all 0.3s;
  position: relative;
  z-index: 2;
}
.battle-pass-progress-item-check .icon {
  font-size: 16px;
  line-height: 16px;
}
.battle-pass-progress-item-check:hover .battle-pass-progress-item-check-wrap {
  box-shadow: inset 0 0 0 3px #06c50c;
}
.battle-pass-progress-item-check:hover .battle-pass-progress-item-check-label {
  opacity: 1;
}
.battle-pass-progress-item-check-label {
  opacity: 0;
  pointer-events: none;
  padding: 2px 8px;
  background: linear-gradient(90deg, #00bc00 0%, #039803 100%);
  border-radius: 4px;
  font-size: 14px;
  line-height: 16px;
  color: #ffffff;
  position: absolute;
  top: calc(100% - 8px);
  right: calc(100% - 8px);
  z-index: 1;
  transition: all 0.3s;
}
.battle-pass-progress-item-pos {
  position: absolute;
  left: -16px;
  top: 5px;
  width: 93px;
  height: 40px;
  display: flex;
  justify-content: center;
  padding-top: 4px;
  font-weight: 700;
  font-size: 24px;
  line-height: 24px;
  color: #ffffff;
  text-shadow: -1px -1px 0 #b0c3d9, 1px -1px 0 #b0c3d9, -1px 1px 0 #b0c3d9, 1px 1px 0 #b0c3d9, 0 0 24px #b0c3d9;
  z-index: 2;
}
.battle-pass-progress-item-pos:before {
  background: url(/files/images/6e51cb5e609e14b14c06.svg) no-repeat 0 0;
  width: 100%;
  height: 100%;
  z-index: -1;
  top: 50%;
  transform: translateY(-50%);
  margin-top: 1px;
  opacity: 0.32;
}
.battle-pass-progress-item-name {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 16px;
  display: block;
  justify-content: center;
  align-items: center;
  white-space: nowrap;
  font-size: 14px;
  line-height: 16px;
  color: #f7dbff;
  width: 100%;
  max-width: 180px;
  overflow: hidden;
  text-overflow: ellipsis;
  text-align: center;
  text-shadow: 0px 1px 2px rgba(0, 0, 0, 0.64);
}
.battle-pass-progress-item-name span {
  color: rgba(247, 219, 255, 0.5);
  margin-right: 5px;
}
.battle-pass-progress-item[data-rar="4b69ff"] .battle-pass-progress-item-pos {
  text-shadow: -1px -1px 0 #4b69ff, 1px -1px 0 #4b69ff, -1px 1px 0 #4b69ff, 1px 1px 0 #4b69ff, 0 0 24px #4b69ff;
}
.battle-pass-progress-item[data-rar="4b69ff"] .battle-pass-progress-item-pos:before {
  background: url(/files/images/3b27da27b378b15fe015.svg) no-repeat 0 0;
}
.battle-pass-progress-item[data-rar="4b69ff"] .battle-pass-text-block-item {
  filter: drop-shadow(2px 3px 0px #4b69ff);
}
.battle-pass-progress-item[data-rar="4b69ff"] .battle-pass-text-block-item:after {
  text-shadow: 0px 8px 12px #4b69ff;
}
.battle-pass-progress-item[data-rar="5e98d9"] .battle-pass-progress-item-pos {
  text-shadow: -1px -1px 0 #5e98d9, 1px -1px 0 #5e98d9, -1px 1px 0 #5e98d9, 1px 1px 0 #5e98d9, 0 0 24px #5e98d9;
}
.battle-pass-progress-item[data-rar="5e98d9"] .battle-pass-progress-item-pos:before {
  background: url(/files/images/901225a9dde2cc9b2496.svg) no-repeat 0 0;
}
.battle-pass-progress-item[data-rar="5e98d9"] .battle-pass-text-block-item {
  filter: drop-shadow(2px 3px 0px #5e98d9);
}
.battle-pass-progress-item[data-rar="5e98d9"] .battle-pass-text-block-item:after {
  text-shadow: 0px 8px 12px #5e98d9;
}
.battle-pass-progress-item[data-rar="8847ff"] .battle-pass-progress-item-pos {
  text-shadow: -1px -1px 0 #8847ff, 1px -1px 0 #8847ff, -1px 1px 0 #8847ff, 1px 1px 0 #8847ff, 0 0 24px #8847ff;
}
.battle-pass-progress-item[data-rar="8847ff"] .battle-pass-progress-item-pos:before {
  background: url(/files/images/75b8afb2bdf0d838763f.svg) no-repeat 0 0;
}
.battle-pass-progress-item[data-rar="8847ff"] .battle-pass-text-block-item {
  filter: drop-shadow(2px 3px 0px #8847ff);
}
.battle-pass-progress-item[data-rar="8847ff"] .battle-pass-text-block-item:after {
  text-shadow: 0px 8px 12px #8847ff;
}
.battle-pass-progress-item[data-rar=d32ce6] .battle-pass-progress-item-pos {
  text-shadow: -1px -1px 0 #d32ce6, 1px -1px 0 #d32ce6, -1px 1px 0 #d32ce6, 1px 1px 0 #d32ce6, 0 0 24px #d32ce6;
}
.battle-pass-progress-item[data-rar=d32ce6] .battle-pass-progress-item-pos:before {
  background: url(/files/images/f66eb95b4d6ee96e2179.svg) no-repeat 0 0;
}
.battle-pass-progress-item[data-rar=d32ce6] .battle-pass-text-block-item {
  filter: drop-shadow(2px 3px 0px #d32ce6);
}
.battle-pass-progress-item[data-rar=d32ce6] .battle-pass-text-block-item:after {
  text-shadow: 0px 8px 12px #d32ce6;
}
.battle-pass-progress-item[data-rar=eb4b4b] .battle-pass-progress-item-pos {
  text-shadow: -1px -1px 0 #eb4b4b, 1px -1px 0 #eb4b4b, -1px 1px 0 #eb4b4b, 1px 1px 0 #eb4b4b, 0 0 24px #eb4b4b;
}
.battle-pass-progress-item[data-rar=eb4b4b] .battle-pass-progress-item-pos:before {
  background: url(/files/images/0df57f1c084879ae19b1.svg) no-repeat 0 0;
}
.battle-pass-progress-item[data-rar=eb4b4b] .battle-pass-text-block-item {
  filter: drop-shadow(2px 3px 0px #eb4b4b);
}
.battle-pass-progress-item[data-rar=eb4b4b] .battle-pass-text-block-item:after {
  text-shadow: 0px 8px 12px #eb4b4b;
}
.battle-pass-progress-item[data-rar=ffd600] .battle-pass-progress-item-pos, .battle-pass-progress-item[data-rar=ffd700] .battle-pass-progress-item-pos, .battle-pass-progress-item[data-rar=e4ae39] .battle-pass-progress-item-pos {
  text-shadow: -1px -1px 0 #ffd600, 1px -1px 0 #ffd600, -1px 1px 0 #ffd600, 1px 1px 0 #ffd600, 0 0 24px #ffd600;
}
.battle-pass-progress-item[data-rar=ffd600] .battle-pass-progress-item-pos:before, .battle-pass-progress-item[data-rar=ffd700] .battle-pass-progress-item-pos:before, .battle-pass-progress-item[data-rar=e4ae39] .battle-pass-progress-item-pos:before {
  background: url(/files/images/c31c7aece12ddec4f40e.svg) no-repeat 0 0;
}
.battle-pass-progress-item[data-rar=ffd600] .battle-pass-text-block-item, .battle-pass-progress-item[data-rar=ffd700] .battle-pass-text-block-item, .battle-pass-progress-item[data-rar=e4ae39] .battle-pass-text-block-item {
  filter: drop-shadow(2px 3px 0px #ffd700);
}
.battle-pass-progress-item[data-rar=ffd600] .battle-pass-text-block-item:after, .battle-pass-progress-item[data-rar=ffd700] .battle-pass-text-block-item:after, .battle-pass-progress-item[data-rar=e4ae39] .battle-pass-text-block-item:after {
  text-shadow: 0px 8px 12px #ffd700;
}
.battle-pass-progress-item.done .battle-pass-progress-item-content:before {
  transition: background-image 0.3s ease-in-out;
}
.battle-pass-progress-item.done .battle-pass-progress-item-content img {
  opacity: 0.8;
}
.battle-pass-progress-item.done.active .battle-pass-progress-item-content:before, .battle-pass-progress-item.done:hover .battle-pass-progress-item-content:before {
  transition: background-image 0.3s ease-in-out;
}
.battle-pass-progress-item.done.active .battle-pass-progress-item-content img, .battle-pass-progress-item.done:hover .battle-pass-progress-item-content img {
  opacity: 1;
}
.battle-pass-progress-item.done[data-rar=b0c3d9] .battle-pass-progress-item-content {
  background: rgba(176, 195, 217, 0.08);
  box-shadow: inset 0 0 0 2px rgba(176, 195, 217, 0.12);
}
.battle-pass-progress-item.done[data-rar=b0c3d9] .battle-pass-progress-item-content-honey svg path {
  fill: #b0c3d9;
  fill-opacity: 0.03;
}
.battle-pass-progress-item.done[data-rar=b0c3d9]:hover .battle-pass-progress-item-content {
  box-shadow: inset 0 0 0 4px rgba(176, 195, 217, 0.32);
}
.battle-pass-progress-item.done[data-rar=b0c3d9]:hover .battle-pass-progress-item-content:after {
  background: radial-gradient(104.82% 50% at 50% 100%, rgba(255, 255, 255, 0.4608) 0%, rgba(255, 255, 255, 0.1728) 100%);
  opacity: 0.32;
}
.battle-pass-progress-item.done[data-rar=b0c3d9]:hover .battle-pass-progress-item-content-border-top, .battle-pass-progress-item.done[data-rar=b0c3d9]:hover .battle-pass-progress-item-content-border-bottom {
  opacity: 1;
}
.battle-pass-progress-item.done[data-rar=b0c3d9]:hover .battle-pass-progress-item-content-border-top:before, .battle-pass-progress-item.done[data-rar=b0c3d9]:hover .battle-pass-progress-item-content-border-top:after, .battle-pass-progress-item.done[data-rar=b0c3d9]:hover .battle-pass-progress-item-content-border-bottom:before, .battle-pass-progress-item.done[data-rar=b0c3d9]:hover .battle-pass-progress-item-content-border-bottom:after {
  border-width: 4px;
}
.battle-pass-progress-item.done[data-rar=b0c3d9]:hover .battle-pass-progress-item-content-honey svg path {
  fill-opacity: 0.06;
}
.battle-pass-progress-item.done[data-rar=b0c3d9].active .battle-pass-progress-item-content {
  box-shadow: inset 0 0 0 4px rgba(176, 195, 217, 0.32);
}
.battle-pass-progress-item.done[data-rar=b0c3d9].active .battle-pass-progress-item-content:after {
  background: radial-gradient(104.82% 50% at 50% 100%, rgba(255, 255, 255, 0.4608) 0%, rgba(255, 255, 255, 0.1728) 100%);
}
.battle-pass-progress-item.done[data-rar=b0c3d9].active .battle-pass-progress-item-content-border-top, .battle-pass-progress-item.done[data-rar=b0c3d9].active .battle-pass-progress-item-content-border-bottom {
  opacity: 1;
}
.battle-pass-progress-item.done[data-rar=b0c3d9].active .battle-pass-progress-item-content-border-top:before, .battle-pass-progress-item.done[data-rar=b0c3d9].active .battle-pass-progress-item-content-border-top:after, .battle-pass-progress-item.done[data-rar=b0c3d9].active .battle-pass-progress-item-content-border-bottom:before, .battle-pass-progress-item.done[data-rar=b0c3d9].active .battle-pass-progress-item-content-border-bottom:after {
  border-width: 4px;
}
.battle-pass-progress-item.done[data-rar=b0c3d9].active .battle-pass-progress-item-content-honey svg path {
  fill-opacity: 0.04;
}
.battle-pass-progress-item.done[data-rar=b0c3d9].active .battle-pass-progress-item-content-border-outside {
  border: 4px solid rgba(176, 195, 217, 0.16);
  opacity: 1;
}
.battle-pass-progress-item.done[data-rar="4b69ff"] .battle-pass-progress-item-content {
  background: rgba(75, 105, 255, 0.08);
  box-shadow: inset 0 0 0 2px rgba(75, 105, 255, 0.12);
}
.battle-pass-progress-item.done[data-rar="4b69ff"] .battle-pass-progress-item-content-honey svg path {
  fill: #4b69ff;
  fill-opacity: 0.03;
}
.battle-pass-progress-item.done[data-rar="4b69ff"]:hover .battle-pass-progress-item-content {
  box-shadow: inset 0 0 0 2px rgba(75, 105, 255, 0.32);
}
.battle-pass-progress-item.done[data-rar="4b69ff"]:hover .battle-pass-progress-item-content:after {
  background: radial-gradient(104.82% 50% at 50% 100%, rgba(75, 105, 255, 0.46) 0%, rgba(75, 105, 255, 0.17) 100%);
  opacity: 0.32;
}
.battle-pass-progress-item.done[data-rar="4b69ff"]:hover .battle-pass-progress-item-content-border-top, .battle-pass-progress-item.done[data-rar="4b69ff"]:hover .battle-pass-progress-item-content-border-bottom {
  opacity: 1;
}
.battle-pass-progress-item.done[data-rar="4b69ff"]:hover .battle-pass-progress-item-content-border-top:before, .battle-pass-progress-item.done[data-rar="4b69ff"]:hover .battle-pass-progress-item-content-border-top:after, .battle-pass-progress-item.done[data-rar="4b69ff"]:hover .battle-pass-progress-item-content-border-bottom:before, .battle-pass-progress-item.done[data-rar="4b69ff"]:hover .battle-pass-progress-item-content-border-bottom:after {
  border-width: 4px;
}
.battle-pass-progress-item.done[data-rar="4b69ff"]:hover .battle-pass-progress-item-content-honey svg path {
  fill-opacity: 0.06;
}
.battle-pass-progress-item.done[data-rar="4b69ff"].active .battle-pass-progress-item-content {
  box-shadow: inset 0 0 0 2px rgba(75, 105, 255, 0.32);
}
.battle-pass-progress-item.done[data-rar="4b69ff"].active .battle-pass-progress-item-content:after {
  background: radial-gradient(104.82% 50% at 50% 100%, rgba(75, 105, 255, 0.46) 0%, rgba(75, 105, 255, 0.17) 100%);
}
.battle-pass-progress-item.done[data-rar="4b69ff"].active .battle-pass-progress-item-content-border-top, .battle-pass-progress-item.done[data-rar="4b69ff"].active .battle-pass-progress-item-content-border-bottom {
  opacity: 1;
}
.battle-pass-progress-item.done[data-rar="4b69ff"].active .battle-pass-progress-item-content-border-top:before, .battle-pass-progress-item.done[data-rar="4b69ff"].active .battle-pass-progress-item-content-border-top:after, .battle-pass-progress-item.done[data-rar="4b69ff"].active .battle-pass-progress-item-content-border-bottom:before, .battle-pass-progress-item.done[data-rar="4b69ff"].active .battle-pass-progress-item-content-border-bottom:after {
  border-width: 4px;
}
.battle-pass-progress-item.done[data-rar="4b69ff"].active .battle-pass-progress-item-content-border-outside {
  border: 4px solid rgba(75, 105, 255, 0.16);
  opacity: 1;
}
.battle-pass-progress-item.done[data-rar="4b69ff"].active .battle-pass-progress-item-content-honey svg path {
  fill-opacity: 0.04;
}
.battle-pass-progress-item.done[data-rar="5e98d9"] .battle-pass-progress-item-content {
  background: rgba(94, 152, 217, 0.08);
  box-shadow: inset 0 0 0 2px rgba(94, 152, 217, 0.12);
}
.battle-pass-progress-item.done[data-rar="5e98d9"] .battle-pass-progress-item-content-honey svg path {
  fill: #5e98d9;
  fill-opacity: 0.03;
}
.battle-pass-progress-item.done[data-rar="5e98d9"]:hover .battle-pass-progress-item-content {
  box-shadow: inset 0 0 0 2px rgba(94, 152, 217, 0.32);
}
.battle-pass-progress-item.done[data-rar="5e98d9"]:hover .battle-pass-progress-item-content:after {
  background: radial-gradient(104.82% 50% at 50% 100%, rgba(94, 152, 217, 0.46) 0%, rgba(94, 152, 217, 0.17) 100%);
  opacity: 0.32;
}
.battle-pass-progress-item.done[data-rar="5e98d9"]:hover .battle-pass-progress-item-content-border-top, .battle-pass-progress-item.done[data-rar="5e98d9"]:hover .battle-pass-progress-item-content-border-bottom {
  opacity: 1;
}
.battle-pass-progress-item.done[data-rar="5e98d9"]:hover .battle-pass-progress-item-content-border-top:before, .battle-pass-progress-item.done[data-rar="5e98d9"]:hover .battle-pass-progress-item-content-border-top:after, .battle-pass-progress-item.done[data-rar="5e98d9"]:hover .battle-pass-progress-item-content-border-bottom:before, .battle-pass-progress-item.done[data-rar="5e98d9"]:hover .battle-pass-progress-item-content-border-bottom:after {
  border-width: 4px;
}
.battle-pass-progress-item.done[data-rar="5e98d9"]:hover .battle-pass-progress-item-content-honey svg path {
  fill-opacity: 0.06;
}
.battle-pass-progress-item.done[data-rar="5e98d9"].active .battle-pass-progress-item-content {
  box-shadow: inset 0 0 0 4px rgba(94, 152, 217, 0.32);
}
.battle-pass-progress-item.done[data-rar="5e98d9"].active .battle-pass-progress-item-content:after {
  background: radial-gradient(104.82% 50% at 50% 100%, rgba(94, 152, 217, 0.46) 0%, rgba(94, 152, 217, 0.17) 100%);
}
.battle-pass-progress-item.done[data-rar="5e98d9"].active .battle-pass-progress-item-content-border-top, .battle-pass-progress-item.done[data-rar="5e98d9"].active .battle-pass-progress-item-content-border-bottom {
  opacity: 1;
}
.battle-pass-progress-item.done[data-rar="5e98d9"].active .battle-pass-progress-item-content-border-top:before, .battle-pass-progress-item.done[data-rar="5e98d9"].active .battle-pass-progress-item-content-border-top:after, .battle-pass-progress-item.done[data-rar="5e98d9"].active .battle-pass-progress-item-content-border-bottom:before, .battle-pass-progress-item.done[data-rar="5e98d9"].active .battle-pass-progress-item-content-border-bottom:after {
  border-width: 4px;
}
.battle-pass-progress-item.done[data-rar="5e98d9"].active .battle-pass-progress-item-content-border-outside {
  border: 4px solid rgba(94, 152, 217, 0.16);
  opacity: 1;
}
.battle-pass-progress-item.done[data-rar="5e98d9"].active .battle-pass-progress-item-content-honey svg path {
  fill-opacity: 0.04;
}
.battle-pass-progress-item.done[data-rar="8847ff"] .battle-pass-progress-item-content {
  background: rgba(136, 71, 255, 0.08);
  box-shadow: inset 0 0 0 2px rgba(136, 71, 255, 0.12);
}
.battle-pass-progress-item.done[data-rar="8847ff"] .battle-pass-progress-item-content-honey svg path {
  fill: #8847ff;
  fill-opacity: 0.03;
}
.battle-pass-progress-item.done[data-rar="8847ff"]:hover .battle-pass-progress-item-content {
  box-shadow: inset 0 0 0 2px rgba(136, 71, 255, 0.32);
}
.battle-pass-progress-item.done[data-rar="8847ff"]:hover .battle-pass-progress-item-content:after {
  background: radial-gradient(104.82% 50% at 50% 100%, rgba(136, 71, 255, 0.46) 0%, rgba(136, 71, 255, 0.17) 100%);
  opacity: 0.32;
}
.battle-pass-progress-item.done[data-rar="8847ff"]:hover .battle-pass-progress-item-content-border-top, .battle-pass-progress-item.done[data-rar="8847ff"]:hover .battle-pass-progress-item-content-border-bottom {
  opacity: 1;
}
.battle-pass-progress-item.done[data-rar="8847ff"]:hover .battle-pass-progress-item-content-border-top:before, .battle-pass-progress-item.done[data-rar="8847ff"]:hover .battle-pass-progress-item-content-border-top:after, .battle-pass-progress-item.done[data-rar="8847ff"]:hover .battle-pass-progress-item-content-border-bottom:before, .battle-pass-progress-item.done[data-rar="8847ff"]:hover .battle-pass-progress-item-content-border-bottom:after {
  border-width: 4px;
}
.battle-pass-progress-item.done[data-rar="8847ff"]:hover .battle-pass-progress-item-content-honey svg path {
  fill-opacity: 0.06;
}
.battle-pass-progress-item.done[data-rar="8847ff"].active .battle-pass-progress-item-content {
  box-shadow: inset 0 0 0 4px rgba(136, 71, 255, 0.32);
}
.battle-pass-progress-item.done[data-rar="8847ff"].active .battle-pass-progress-item-content:after {
  background: radial-gradient(104.82% 50% at 50% 100%, rgba(136, 71, 255, 0.46) 0%, rgba(136, 71, 255, 0.17) 100%);
}
.battle-pass-progress-item.done[data-rar="8847ff"].active .battle-pass-progress-item-content-border-top, .battle-pass-progress-item.done[data-rar="8847ff"].active .battle-pass-progress-item-content-border-bottom {
  opacity: 1;
}
.battle-pass-progress-item.done[data-rar="8847ff"].active .battle-pass-progress-item-content-border-top:before, .battle-pass-progress-item.done[data-rar="8847ff"].active .battle-pass-progress-item-content-border-top:after, .battle-pass-progress-item.done[data-rar="8847ff"].active .battle-pass-progress-item-content-border-bottom:before, .battle-pass-progress-item.done[data-rar="8847ff"].active .battle-pass-progress-item-content-border-bottom:after {
  border-width: 4px;
}
.battle-pass-progress-item.done[data-rar="8847ff"].active .battle-pass-progress-item-content-border-outside {
  border: 4px solid rgba(136, 71, 255, 0.16);
  opacity: 1;
}
.battle-pass-progress-item.done[data-rar="8847ff"].active .battle-pass-progress-item-content-honey svg path {
  fill-opacity: 0.04;
}
.battle-pass-progress-item.done[data-rar=d32ce6] .battle-pass-progress-item-content {
  background: rgba(211, 44, 230, 0.08);
  box-shadow: inset 0 0 0 2px rgba(211, 44, 230, 0.12);
}
.battle-pass-progress-item.done[data-rar=d32ce6] .battle-pass-progress-item-content-honey svg path {
  fill: #d32ce6;
  fill-opacity: 0.03;
}
.battle-pass-progress-item.done[data-rar=d32ce6]:hover .battle-pass-progress-item-content {
  box-shadow: inset 0 0 0 2px rgba(211, 44, 230, 0.32);
}
.battle-pass-progress-item.done[data-rar=d32ce6]:hover .battle-pass-progress-item-content:after {
  background: radial-gradient(104.82% 50% at 50% 100%, rgba(211, 44, 230, 0.46) 0%, rgba(211, 44, 230, 0.17) 100%);
  opacity: 0.32;
}
.battle-pass-progress-item.done[data-rar=d32ce6]:hover .battle-pass-progress-item-content-border-top, .battle-pass-progress-item.done[data-rar=d32ce6]:hover .battle-pass-progress-item-content-border-bottom {
  opacity: 1;
}
.battle-pass-progress-item.done[data-rar=d32ce6]:hover .battle-pass-progress-item-content-border-top:before, .battle-pass-progress-item.done[data-rar=d32ce6]:hover .battle-pass-progress-item-content-border-top:after, .battle-pass-progress-item.done[data-rar=d32ce6]:hover .battle-pass-progress-item-content-border-bottom:before, .battle-pass-progress-item.done[data-rar=d32ce6]:hover .battle-pass-progress-item-content-border-bottom:after {
  border-width: 4px;
}
.battle-pass-progress-item.done[data-rar=d32ce6]:hover .battle-pass-progress-item-content-honey svg path {
  fill-opacity: 0.06;
}
.battle-pass-progress-item.done[data-rar=d32ce6].active .battle-pass-progress-item-content {
  box-shadow: inset 0 0 0 2px rgba(211, 44, 230, 0.32);
}
.battle-pass-progress-item.done[data-rar=d32ce6].active .battle-pass-progress-item-content:after {
  background: radial-gradient(104.82% 50% at 50% 100%, rgba(211, 44, 230, 0.46) 0%, rgba(211, 44, 230, 0.17) 100%);
}
.battle-pass-progress-item.done[data-rar=d32ce6].active .battle-pass-progress-item-content-border-top, .battle-pass-progress-item.done[data-rar=d32ce6].active .battle-pass-progress-item-content-border-bottom {
  opacity: 1;
}
.battle-pass-progress-item.done[data-rar=d32ce6].active .battle-pass-progress-item-content-border-top:before, .battle-pass-progress-item.done[data-rar=d32ce6].active .battle-pass-progress-item-content-border-top:after, .battle-pass-progress-item.done[data-rar=d32ce6].active .battle-pass-progress-item-content-border-bottom:before, .battle-pass-progress-item.done[data-rar=d32ce6].active .battle-pass-progress-item-content-border-bottom:after {
  border-width: 4px;
}
.battle-pass-progress-item.done[data-rar=d32ce6].active .battle-pass-progress-item-content-border-outside {
  border: 4px solid rgba(211, 44, 230, 0.16);
  opacity: 1;
}
.battle-pass-progress-item.done[data-rar=d32ce6].active .battle-pass-progress-item-content-honey svg path {
  fill-opacity: 0.04;
}
.battle-pass-progress-item.done[data-rar=eb4b4b] .battle-pass-progress-item-content {
  background: rgba(235, 75, 75, 0.08);
  box-shadow: inset 0 0 0 2px rgba(235, 75, 75, 0.12);
}
.battle-pass-progress-item.done[data-rar=eb4b4b] .battle-pass-progress-item-content-honey svg path {
  fill: #eb4b4b;
  fill-opacity: 0.03;
}
.battle-pass-progress-item.done[data-rar=eb4b4b]:hover .battle-pass-progress-item-content {
  box-shadow: inset 0 0 0 2px rgba(235, 75, 75, 0.32);
}
.battle-pass-progress-item.done[data-rar=eb4b4b]:hover .battle-pass-progress-item-content:after {
  background: radial-gradient(104.82% 50% at 50% 100%, rgba(235, 75, 75, 0.46) 0%, rgba(235, 75, 75, 0.17) 100%);
  opacity: 0.32;
}
.battle-pass-progress-item.done[data-rar=eb4b4b]:hover .battle-pass-progress-item-content-border-top, .battle-pass-progress-item.done[data-rar=eb4b4b]:hover .battle-pass-progress-item-content-border-bottom {
  opacity: 1;
}
.battle-pass-progress-item.done[data-rar=eb4b4b]:hover .battle-pass-progress-item-content-border-top:before, .battle-pass-progress-item.done[data-rar=eb4b4b]:hover .battle-pass-progress-item-content-border-top:after, .battle-pass-progress-item.done[data-rar=eb4b4b]:hover .battle-pass-progress-item-content-border-bottom:before, .battle-pass-progress-item.done[data-rar=eb4b4b]:hover .battle-pass-progress-item-content-border-bottom:after {
  border-width: 4px;
}
.battle-pass-progress-item.done[data-rar=eb4b4b]:hover .battle-pass-progress-item-content-honey svg path {
  fill-opacity: 0.06;
}
.battle-pass-progress-item.done[data-rar=eb4b4b].active .battle-pass-progress-item-content {
  box-shadow: inset 0 0 0 4px rgba(255, 255, 255, 0.32);
}
.battle-pass-progress-item.done[data-rar=eb4b4b].active .battle-pass-progress-item-content:after {
  background: radial-gradient(104.82% 50% at 50% 100%, rgba(235, 75, 75, 0.46) 0%, rgba(235, 75, 75, 0.17) 100%);
}
.battle-pass-progress-item.done[data-rar=eb4b4b].active .battle-pass-progress-item-content-border-top, .battle-pass-progress-item.done[data-rar=eb4b4b].active .battle-pass-progress-item-content-border-bottom {
  opacity: 1;
}
.battle-pass-progress-item.done[data-rar=eb4b4b].active .battle-pass-progress-item-content-border-top:before, .battle-pass-progress-item.done[data-rar=eb4b4b].active .battle-pass-progress-item-content-border-top:after, .battle-pass-progress-item.done[data-rar=eb4b4b].active .battle-pass-progress-item-content-border-bottom:before, .battle-pass-progress-item.done[data-rar=eb4b4b].active .battle-pass-progress-item-content-border-bottom:after {
  border-width: 4px;
}
.battle-pass-progress-item.done[data-rar=eb4b4b].active .battle-pass-progress-item-content-border-outside {
  border: 4px solid rgba(235, 75, 75, 0.16);
  opacity: 1;
}
.battle-pass-progress-item.done[data-rar=eb4b4b].active .battle-pass-progress-item-content-honey svg path {
  fill-opacity: 0.04;
}
.battle-pass-progress-item.done[data-rar=ffd600] .battle-pass-progress-item-content, .battle-pass-progress-item.done[data-rar=ffd700] .battle-pass-progress-item-content, .battle-pass-progress-item.done[data-rar=e4ae39] .battle-pass-progress-item-content {
  background: rgba(255, 214, 0, 0.08);
  box-shadow: inset 0 0 0 2px rgba(255, 214, 0, 0.12);
}
.battle-pass-progress-item.done[data-rar=ffd600] .battle-pass-progress-item-content-honey svg path, .battle-pass-progress-item.done[data-rar=ffd700] .battle-pass-progress-item-content-honey svg path, .battle-pass-progress-item.done[data-rar=e4ae39] .battle-pass-progress-item-content-honey svg path {
  fill: #ffd600;
  fill-opacity: 0.03;
}
.battle-pass-progress-item.done[data-rar=ffd600]:hover .battle-pass-progress-item-content, .battle-pass-progress-item.done[data-rar=ffd700]:hover .battle-pass-progress-item-content, .battle-pass-progress-item.done[data-rar=e4ae39]:hover .battle-pass-progress-item-content {
  box-shadow: inset 0 0 0 2px rgba(255, 214, 0, 0.32);
}
.battle-pass-progress-item.done[data-rar=ffd600]:hover .battle-pass-progress-item-content:after, .battle-pass-progress-item.done[data-rar=ffd700]:hover .battle-pass-progress-item-content:after, .battle-pass-progress-item.done[data-rar=e4ae39]:hover .battle-pass-progress-item-content:after {
  background: radial-gradient(104.82% 50% at 50% 100%, rgba(255, 214, 0, 0.46) 0%, rgba(255, 214, 0, 0.17) 100%);
  opacity: 0.32;
}
.battle-pass-progress-item.done[data-rar=ffd600]:hover .battle-pass-progress-item-content-border-top, .battle-pass-progress-item.done[data-rar=ffd600]:hover .battle-pass-progress-item-content-border-bottom, .battle-pass-progress-item.done[data-rar=ffd700]:hover .battle-pass-progress-item-content-border-top, .battle-pass-progress-item.done[data-rar=ffd700]:hover .battle-pass-progress-item-content-border-bottom, .battle-pass-progress-item.done[data-rar=e4ae39]:hover .battle-pass-progress-item-content-border-top, .battle-pass-progress-item.done[data-rar=e4ae39]:hover .battle-pass-progress-item-content-border-bottom {
  opacity: 1;
}
.battle-pass-progress-item.done[data-rar=ffd600]:hover .battle-pass-progress-item-content-border-top:before, .battle-pass-progress-item.done[data-rar=ffd600]:hover .battle-pass-progress-item-content-border-top:after, .battle-pass-progress-item.done[data-rar=ffd600]:hover .battle-pass-progress-item-content-border-bottom:before, .battle-pass-progress-item.done[data-rar=ffd600]:hover .battle-pass-progress-item-content-border-bottom:after, .battle-pass-progress-item.done[data-rar=ffd700]:hover .battle-pass-progress-item-content-border-top:before, .battle-pass-progress-item.done[data-rar=ffd700]:hover .battle-pass-progress-item-content-border-top:after, .battle-pass-progress-item.done[data-rar=ffd700]:hover .battle-pass-progress-item-content-border-bottom:before, .battle-pass-progress-item.done[data-rar=ffd700]:hover .battle-pass-progress-item-content-border-bottom:after, .battle-pass-progress-item.done[data-rar=e4ae39]:hover .battle-pass-progress-item-content-border-top:before, .battle-pass-progress-item.done[data-rar=e4ae39]:hover .battle-pass-progress-item-content-border-top:after, .battle-pass-progress-item.done[data-rar=e4ae39]:hover .battle-pass-progress-item-content-border-bottom:before, .battle-pass-progress-item.done[data-rar=e4ae39]:hover .battle-pass-progress-item-content-border-bottom:after {
  border-width: 4px;
}
.battle-pass-progress-item.done[data-rar=ffd600]:hover .battle-pass-progress-item-content-honey svg path, .battle-pass-progress-item.done[data-rar=ffd700]:hover .battle-pass-progress-item-content-honey svg path, .battle-pass-progress-item.done[data-rar=e4ae39]:hover .battle-pass-progress-item-content-honey svg path {
  fill-opacity: 0.06;
}
.battle-pass-progress-item.done[data-rar=ffd600].active .battle-pass-progress-item-content, .battle-pass-progress-item.done[data-rar=ffd700].active .battle-pass-progress-item-content, .battle-pass-progress-item.done[data-rar=e4ae39].active .battle-pass-progress-item-content {
  box-shadow: inset 0 0 0 4px rgba(255, 214, 0, 0.32);
}
.battle-pass-progress-item.done[data-rar=ffd600].active .battle-pass-progress-item-content:after, .battle-pass-progress-item.done[data-rar=ffd700].active .battle-pass-progress-item-content:after, .battle-pass-progress-item.done[data-rar=e4ae39].active .battle-pass-progress-item-content:after {
  background: radial-gradient(104.82% 50% at 50% 100%, rgba(255, 214, 0, 0.46) 0%, rgba(255, 214, 0, 0.17) 100%);
}
.battle-pass-progress-item.done[data-rar=ffd600].active .battle-pass-progress-item-content-border-top, .battle-pass-progress-item.done[data-rar=ffd600].active .battle-pass-progress-item-content-border-bottom, .battle-pass-progress-item.done[data-rar=ffd700].active .battle-pass-progress-item-content-border-top, .battle-pass-progress-item.done[data-rar=ffd700].active .battle-pass-progress-item-content-border-bottom, .battle-pass-progress-item.done[data-rar=e4ae39].active .battle-pass-progress-item-content-border-top, .battle-pass-progress-item.done[data-rar=e4ae39].active .battle-pass-progress-item-content-border-bottom {
  opacity: 1;
}
.battle-pass-progress-item.done[data-rar=ffd600].active .battle-pass-progress-item-content-border-top:before, .battle-pass-progress-item.done[data-rar=ffd600].active .battle-pass-progress-item-content-border-top:after, .battle-pass-progress-item.done[data-rar=ffd600].active .battle-pass-progress-item-content-border-bottom:before, .battle-pass-progress-item.done[data-rar=ffd600].active .battle-pass-progress-item-content-border-bottom:after, .battle-pass-progress-item.done[data-rar=ffd700].active .battle-pass-progress-item-content-border-top:before, .battle-pass-progress-item.done[data-rar=ffd700].active .battle-pass-progress-item-content-border-top:after, .battle-pass-progress-item.done[data-rar=ffd700].active .battle-pass-progress-item-content-border-bottom:before, .battle-pass-progress-item.done[data-rar=ffd700].active .battle-pass-progress-item-content-border-bottom:after, .battle-pass-progress-item.done[data-rar=e4ae39].active .battle-pass-progress-item-content-border-top:before, .battle-pass-progress-item.done[data-rar=e4ae39].active .battle-pass-progress-item-content-border-top:after, .battle-pass-progress-item.done[data-rar=e4ae39].active .battle-pass-progress-item-content-border-bottom:before, .battle-pass-progress-item.done[data-rar=e4ae39].active .battle-pass-progress-item-content-border-bottom:after {
  border-width: 4px;
}
.battle-pass-progress-item.done[data-rar=ffd600].active .battle-pass-progress-item-content-border-outside, .battle-pass-progress-item.done[data-rar=ffd700].active .battle-pass-progress-item-content-border-outside, .battle-pass-progress-item.done[data-rar=e4ae39].active .battle-pass-progress-item-content-border-outside {
  border: 4px solid rgba(255, 214, 0, 0.16);
  opacity: 1;
}
.battle-pass-progress-item.done[data-rar=ffd600].active .battle-pass-progress-item-content-honey svg path, .battle-pass-progress-item.done[data-rar=ffd700].active .battle-pass-progress-item-content-honey svg path, .battle-pass-progress-item.done[data-rar=e4ae39].active .battle-pass-progress-item-content-honey svg path {
  fill-opacity: 0.04;
}
.battle-pass-progress-item.active:not(.done) .battle-pass-progress-item-content:before {
  transition: background-image 0.3s ease-in-out;
}
.battle-pass-progress-item.active:not(.done)[data-rar=b0c3d9] .battle-pass-progress-item-content:after {
  background: #b0c3d9;
}
.battle-pass-progress-item.active:not(.done)[data-rar="4b69ff"] .battle-pass-progress-item-content:after {
  background: #4b69ff;
}
.battle-pass-progress-item.active:not(.done)[data-rar="5e98d9"] .battle-pass-progress-item-content:after {
  background: #5e98d9;
}
.battle-pass-progress-item.active:not(.done)[data-rar="8847ff"] .battle-pass-progress-item-content:after {
  background: #8847ff;
}
.battle-pass-progress-item.active:not(.done)[data-rar=d32ce6] .battle-pass-progress-item-content:after {
  background: #d32ce6;
}
.battle-pass-progress-item.active:not(.done)[data-rar=eb4b4b] .battle-pass-progress-item-content:after {
  background: #eb4b4b;
}
.battle-pass-progress-item.active:not(.done)[data-rar=ffd600] .battle-pass-progress-item-content:after, .battle-pass-progress-item.active:not(.done)[data-rar=ffd700] .battle-pass-progress-item-content:after, .battle-pass-progress-item.active:not(.done)[data-rar=e4ae39] .battle-pass-progress-item-content:after {
  background: #ffd700;
}
.battle-pass-progress-item.active:not(.done):hover:before {
  width: 200px;
  height: 240px;
}
.battle-pass-progress-item.current .battle-pass-progress-item-line-wrap span:before {
  width: 32px;
  height: 32px;
  right: -12px;
  top: calc(50% - 16px);
  background: radial-gradient(50% 50% at 50% 50%, #ffffff 0%, rgba(249, 194, 255, 0.889697) 10.94%, rgba(151, 38, 205, 0.28) 45.83%, rgba(170, 44, 230, 0) 100%);
}
.battle-pass-progress-item.current:not(.done):after {
  width: 152px;
  height: 304px;
  transform: translate(-50%, 0);
  top: auto;
  bottom: -32px;
  left: 50%;
  opacity: 0.4;
  filter: blur(32px);
  border-radius: 20px;
  z-index: -1;
  transition: all 0.3s;
}
@media (max-width: 480px) {
  .battle-pass-progress-item.current:not(.done):after {
    height: 240px;
  }
}
.battle-pass-progress-item.current:not(.done) .battle-pass-progress-item-content {
  transition: all 0.3s;
}
.battle-pass-progress-item.current:not(.done) .battle-pass-progress-item-content .battle-pass-progress-item-pos:before {
  opacity: 1;
}
.battle-pass-progress-item.current:not(.done) .battle-pass-progress-item-content-honey {
  height: calc(100% - 4px);
  width: calc(100% - 4px);
  top: 2px;
  left: 2px;
}
.battle-pass-progress-item.current:not(.done):hover .battle-pass-progress-item-content-border-top:before, .battle-pass-progress-item.current:not(.done):hover .battle-pass-progress-item-content-border-top:after, .battle-pass-progress-item.current:not(.done):hover .battle-pass-progress-item-content-border-bottom:before, .battle-pass-progress-item.current:not(.done):hover .battle-pass-progress-item-content-border-bottom:after {
  border-width: 4px;
}
.battle-pass-progress-item.current:not(.done)[data-rar=b0c3d9]:after {
  background: #b0c3d9;
  opacity: 0.32;
}
.battle-pass-progress-item.current:not(.done)[data-rar=b0c3d9] .battle-pass-progress-item-content {
  background: radial-gradient(104.82% 50% at 50% 100%, rgba(176, 195, 217, 0.4608) 0%, rgba(176, 195, 217, 0.1728) 100%);
  box-shadow: inset 0 0 0 2px #b0c3d9;
}
.battle-pass-progress-item.current:not(.done)[data-rar=b0c3d9] .battle-pass-progress-item-content-border-top, .battle-pass-progress-item.current:not(.done)[data-rar=b0c3d9] .battle-pass-progress-item-content-border-bottom {
  opacity: 1;
}
.battle-pass-progress-item.current:not(.done)[data-rar=b0c3d9] .battle-pass-progress-item-content-border-top:before, .battle-pass-progress-item.current:not(.done)[data-rar=b0c3d9] .battle-pass-progress-item-content-border-top:after, .battle-pass-progress-item.current:not(.done)[data-rar=b0c3d9] .battle-pass-progress-item-content-border-bottom:before, .battle-pass-progress-item.current:not(.done)[data-rar=b0c3d9] .battle-pass-progress-item-content-border-bottom:after {
  border-color: #f7dbff;
}
.battle-pass-progress-item.current:not(.done)[data-rar=b0c3d9] .battle-pass-progress-item-content-honey svg path {
  fill: #b0c3d9;
}
.battle-pass-progress-item.current:not(.done)[data-rar=b0c3d9]:hover:after {
  opacity: 0.4;
}
.battle-pass-progress-item.current:not(.done)[data-rar=b0c3d9]:hover .battle-pass-progress-item-content {
  box-shadow: inset 0 0 0 2px #b0c3d9;
}
.battle-pass-progress-item.current:not(.done)[data-rar=b0c3d9]:hover .battle-pass-progress-item-content:after {
  opacity: 0.4;
}
.battle-pass-progress-item.current:not(.done)[data-rar=b0c3d9]:hover .battle-pass-progress-item-content-honey svg path {
  fill-opacity: 0.2;
}
.battle-pass-progress-item.current:not(.done)[data-rar=b0c3d9].active:after {
  background: #b0c3d9;
  opacity: 0.4;
}
.battle-pass-progress-item.current:not(.done)[data-rar=b0c3d9].active .battle-pass-progress-item-content {
  background: radial-gradient(104.82% 50% at 50% 100%, rgba(176, 195, 217, 0.7608) 0%, rgba(176, 195, 217, 0.1728) 100%);
  box-shadow: inset 0 0 0 4px #b0c3d9;
}
.battle-pass-progress-item.current:not(.done)[data-rar=b0c3d9].active .battle-pass-progress-item-content:after {
  border: 4px solid rgba(176, 195, 217, 0.32);
  opacity: 1;
}
.battle-pass-progress-item.current:not(.done)[data-rar=b0c3d9].active .battle-pass-progress-item-content-border-outside {
  border: 4px solid rgba(176, 195, 217, 0.32);
  opacity: 1;
}
.battle-pass-progress-item.current:not(.done)[data-rar=b0c3d9].active .battle-pass-progress-item-content-border-top:before, .battle-pass-progress-item.current:not(.done)[data-rar=b0c3d9].active .battle-pass-progress-item-content-border-top:after, .battle-pass-progress-item.current:not(.done)[data-rar=b0c3d9].active .battle-pass-progress-item-content-border-bottom:before, .battle-pass-progress-item.current:not(.done)[data-rar=b0c3d9].active .battle-pass-progress-item-content-border-bottom:after {
  border-width: 4px;
  border-color: #fff;
}
.battle-pass-progress-item.current:not(.done)[data-rar=b0c3d9].active .battle-pass-progress-item-content-honey svg path {
  fill-opacity: 0.1;
}
.battle-pass-progress-item.current:not(.done)[data-rar="4b69ff"]:after {
  background: #4b69ff;
  opacity: 0.32;
}
.battle-pass-progress-item.current:not(.done)[data-rar="4b69ff"] .battle-pass-progress-item-content {
  background: radial-gradient(104.82% 50% at 50% 100%, rgba(75, 105, 255, 0.4608) 0%, rgba(75, 105, 255, 0.1728) 100%);
  box-shadow: inset 0 0 0 2px #4b69ff;
}
.battle-pass-progress-item.current:not(.done)[data-rar="4b69ff"] .battle-pass-progress-item-content-border-top, .battle-pass-progress-item.current:not(.done)[data-rar="4b69ff"] .battle-pass-progress-item-content-border-bottom {
  opacity: 1;
}
.battle-pass-progress-item.current:not(.done)[data-rar="4b69ff"] .battle-pass-progress-item-content-border-top:before, .battle-pass-progress-item.current:not(.done)[data-rar="4b69ff"] .battle-pass-progress-item-content-border-top:after, .battle-pass-progress-item.current:not(.done)[data-rar="4b69ff"] .battle-pass-progress-item-content-border-bottom:before, .battle-pass-progress-item.current:not(.done)[data-rar="4b69ff"] .battle-pass-progress-item-content-border-bottom:after {
  border-color: #f7dbff;
}
.battle-pass-progress-item.current:not(.done)[data-rar="4b69ff"] .battle-pass-progress-item-content-honey svg path {
  fill: #4b69ff;
}
.battle-pass-progress-item.current:not(.done)[data-rar="4b69ff"]:hover:after {
  opacity: 0.4;
}
.battle-pass-progress-item.current:not(.done)[data-rar="4b69ff"]:hover .battle-pass-progress-item-content {
  box-shadow: inset 0 0 0 2px #4b69ff;
}
.battle-pass-progress-item.current:not(.done)[data-rar="4b69ff"]:hover .battle-pass-progress-item-content:after {
  opacity: 0.4;
}
.battle-pass-progress-item.current:not(.done)[data-rar="4b69ff"]:hover .battle-pass-progress-item-content-honey svg path {
  fill-opacity: 0.2;
}
.battle-pass-progress-item.current:not(.done)[data-rar="4b69ff"].active:after {
  background: #4b69ff;
  opacity: 0.4;
}
.battle-pass-progress-item.current:not(.done)[data-rar="4b69ff"].active .battle-pass-progress-item-content {
  background: radial-gradient(104.82% 50% at 50% 100%, rgba(75, 105, 255, 0.7608) 0%, rgba(75, 105, 255, 0.1728) 100%);
  box-shadow: inset 0 0 0 4px #4b69ff;
}
.battle-pass-progress-item.current:not(.done)[data-rar="4b69ff"].active .battle-pass-progress-item-content:after {
  border: 4px solid rgba(75, 105, 255, 0.32);
  opacity: 1;
}
.battle-pass-progress-item.current:not(.done)[data-rar="4b69ff"].active .battle-pass-progress-item-content-border-outside {
  border: 4px solid rgba(75, 105, 255, 0.32);
  opacity: 1;
}
.battle-pass-progress-item.current:not(.done)[data-rar="4b69ff"].active .battle-pass-progress-item-content-border-top:before, .battle-pass-progress-item.current:not(.done)[data-rar="4b69ff"].active .battle-pass-progress-item-content-border-top:after, .battle-pass-progress-item.current:not(.done)[data-rar="4b69ff"].active .battle-pass-progress-item-content-border-bottom:before, .battle-pass-progress-item.current:not(.done)[data-rar="4b69ff"].active .battle-pass-progress-item-content-border-bottom:after {
  border-width: 4px;
  border-color: #fff;
}
.battle-pass-progress-item.current:not(.done)[data-rar="4b69ff"].active .battle-pass-progress-item-content-honey svg path {
  fill-opacity: 0.1;
}
.battle-pass-progress-item.current:not(.done)[data-rar="5e98d9"]:after {
  background: #5e98d9;
  opacity: 0.32;
}
.battle-pass-progress-item.current:not(.done)[data-rar="5e98d9"] .battle-pass-progress-item-content {
  background: radial-gradient(104.82% 50% at 50% 100%, rgba(94, 152, 217, 0.4608) 0%, rgba(94, 152, 217, 0.1728) 100%);
  box-shadow: inset 0 0 0 2px #5e98d9;
}
.battle-pass-progress-item.current:not(.done)[data-rar="5e98d9"] .battle-pass-progress-item-content-border-top, .battle-pass-progress-item.current:not(.done)[data-rar="5e98d9"] .battle-pass-progress-item-content-border-bottom {
  opacity: 1;
}
.battle-pass-progress-item.current:not(.done)[data-rar="5e98d9"] .battle-pass-progress-item-content-border-top:before, .battle-pass-progress-item.current:not(.done)[data-rar="5e98d9"] .battle-pass-progress-item-content-border-top:after, .battle-pass-progress-item.current:not(.done)[data-rar="5e98d9"] .battle-pass-progress-item-content-border-bottom:before, .battle-pass-progress-item.current:not(.done)[data-rar="5e98d9"] .battle-pass-progress-item-content-border-bottom:after {
  border-color: #f7dbff;
}
.battle-pass-progress-item.current:not(.done)[data-rar="5e98d9"] .battle-pass-progress-item-content-honey svg path {
  fill: #5e98d9;
}
.battle-pass-progress-item.current:not(.done)[data-rar="5e98d9"]:hover:after {
  opacity: 0.4;
}
.battle-pass-progress-item.current:not(.done)[data-rar="5e98d9"]:hover .battle-pass-progress-item-content {
  box-shadow: inset 0 0 0 2px #5e98d9;
}
.battle-pass-progress-item.current:not(.done)[data-rar="5e98d9"]:hover .battle-pass-progress-item-content:before {
  opacity: 0.3;
}
.battle-pass-progress-item.current:not(.done)[data-rar="5e98d9"]:hover .battle-pass-progress-item-content:after {
  opacity: 0.4;
}
.battle-pass-progress-item.current:not(.done)[data-rar="5e98d9"]:hover .battle-pass-progress-item-content-honey svg path {
  fill-opacity: 0.2;
}
.battle-pass-progress-item.current:not(.done)[data-rar="5e98d9"].active:after {
  background: #5e98d9;
  opacity: 0.4;
}
.battle-pass-progress-item.current:not(.done)[data-rar="5e98d9"].active .battle-pass-progress-item-content {
  background: radial-gradient(104.82% 50% at 50% 100%, rgba(94, 152, 217, 0.7608) 0%, rgba(94, 152, 217, 0.1728) 100%);
  box-shadow: inset 0 0 0 4px #5e98d9;
}
.battle-pass-progress-item.current:not(.done)[data-rar="5e98d9"].active .battle-pass-progress-item-content-border-outside {
  border: 4px solid rgba(94, 152, 217, 0.32);
  opacity: 1;
}
.battle-pass-progress-item.current:not(.done)[data-rar="5e98d9"].active .battle-pass-progress-item-content-border-top:before, .battle-pass-progress-item.current:not(.done)[data-rar="5e98d9"].active .battle-pass-progress-item-content-border-top:after, .battle-pass-progress-item.current:not(.done)[data-rar="5e98d9"].active .battle-pass-progress-item-content-border-bottom:before, .battle-pass-progress-item.current:not(.done)[data-rar="5e98d9"].active .battle-pass-progress-item-content-border-bottom:after {
  border-width: 4px;
  border-color: #fff;
}
.battle-pass-progress-item.current:not(.done)[data-rar="5e98d9"].active .battle-pass-progress-item-content-honey svg path {
  fill-opacity: 0.1;
}
.battle-pass-progress-item.current:not(.done)[data-rar="8847ff"]:after {
  background: #8847ff;
  opacity: 0.32;
}
.battle-pass-progress-item.current:not(.done)[data-rar="8847ff"] .battle-pass-progress-item-content {
  background: radial-gradient(104.82% 50% at 50% 100%, rgba(136, 71, 255, 0.4608) 0%, rgba(136, 71, 255, 0.1728) 100%);
  box-shadow: inset 0 0 0 2px #8847ff;
}
.battle-pass-progress-item.current:not(.done)[data-rar="8847ff"] .battle-pass-progress-item-content-border-top, .battle-pass-progress-item.current:not(.done)[data-rar="8847ff"] .battle-pass-progress-item-content-border-bottom {
  opacity: 1;
}
.battle-pass-progress-item.current:not(.done)[data-rar="8847ff"] .battle-pass-progress-item-content-border-top:before, .battle-pass-progress-item.current:not(.done)[data-rar="8847ff"] .battle-pass-progress-item-content-border-top:after, .battle-pass-progress-item.current:not(.done)[data-rar="8847ff"] .battle-pass-progress-item-content-border-bottom:before, .battle-pass-progress-item.current:not(.done)[data-rar="8847ff"] .battle-pass-progress-item-content-border-bottom:after {
  border-color: #f7dbff;
}
.battle-pass-progress-item.current:not(.done)[data-rar="8847ff"] .battle-pass-progress-item-content-honey svg path {
  fill: #8847ff;
}
.battle-pass-progress-item.current:not(.done)[data-rar="8847ff"]:hover:after {
  opacity: 0.4;
}
.battle-pass-progress-item.current:not(.done)[data-rar="8847ff"]:hover .battle-pass-progress-item-content {
  box-shadow: inset 0 0 0 2px #8847ff;
}
.battle-pass-progress-item.current:not(.done)[data-rar="8847ff"]:hover .battle-pass-progress-item-content:after {
  opacity: 0.4;
}
.battle-pass-progress-item.current:not(.done)[data-rar="8847ff"]:hover .battle-pass-progress-item-content-honey svg path {
  fill-opacity: 0.2;
}
.battle-pass-progress-item.current:not(.done)[data-rar="8847ff"].active:after {
  background: #8847ff;
  opacity: 0.4;
}
.battle-pass-progress-item.current:not(.done)[data-rar="8847ff"].active .battle-pass-progress-item-content {
  background: radial-gradient(104.82% 50% at 50% 100%, rgba(136, 71, 255, 0.7608) 0%, rgba(136, 71, 255, 0.1728) 100%);
  box-shadow: inset 0 0 0 4px #8847ff;
}
.battle-pass-progress-item.current:not(.done)[data-rar="8847ff"].active .battle-pass-progress-item-content:after {
  border: 4px solid rgba(136, 71, 255, 0.32);
  opacity: 1;
}
.battle-pass-progress-item.current:not(.done)[data-rar="8847ff"].active .battle-pass-progress-item-content-border-outside {
  border: 4px solid rgba(136, 71, 255, 0.32);
  opacity: 1;
}
.battle-pass-progress-item.current:not(.done)[data-rar="8847ff"].active .battle-pass-progress-item-content-border-top:before, .battle-pass-progress-item.current:not(.done)[data-rar="8847ff"].active .battle-pass-progress-item-content-border-top:after, .battle-pass-progress-item.current:not(.done)[data-rar="8847ff"].active .battle-pass-progress-item-content-border-bottom:before, .battle-pass-progress-item.current:not(.done)[data-rar="8847ff"].active .battle-pass-progress-item-content-border-bottom:after {
  border-width: 4px;
  border-color: #fff;
}
.battle-pass-progress-item.current:not(.done)[data-rar="8847ff"].active .battle-pass-progress-item-content-honey svg path {
  fill-opacity: 0.1;
}
.battle-pass-progress-item.current:not(.done)[data-rar=d32ce6]:after {
  background: #d32ce6;
  opacity: 0.32;
}
.battle-pass-progress-item.current:not(.done)[data-rar=d32ce6] .battle-pass-progress-item-content {
  background: radial-gradient(104.82% 50% at 50% 100%, rgba(211, 44, 230, 0.4608) 0%, rgba(211, 44, 230, 0.1728) 100%);
  box-shadow: inset 0 0 0 2px #d32ce6;
}
.battle-pass-progress-item.current:not(.done)[data-rar=d32ce6] .battle-pass-progress-item-content-border-top, .battle-pass-progress-item.current:not(.done)[data-rar=d32ce6] .battle-pass-progress-item-content-border-bottom {
  opacity: 1;
}
.battle-pass-progress-item.current:not(.done)[data-rar=d32ce6] .battle-pass-progress-item-content-border-top:before, .battle-pass-progress-item.current:not(.done)[data-rar=d32ce6] .battle-pass-progress-item-content-border-top:after, .battle-pass-progress-item.current:not(.done)[data-rar=d32ce6] .battle-pass-progress-item-content-border-bottom:before, .battle-pass-progress-item.current:not(.done)[data-rar=d32ce6] .battle-pass-progress-item-content-border-bottom:after {
  border-color: #f7dbff;
}
.battle-pass-progress-item.current:not(.done)[data-rar=d32ce6] .battle-pass-progress-item-content-honey svg path {
  fill: #d32ce6;
}
.battle-pass-progress-item.current:not(.done)[data-rar=d32ce6]:hover:after {
  opacity: 0.4;
}
.battle-pass-progress-item.current:not(.done)[data-rar=d32ce6]:hover .battle-pass-progress-item-content {
  box-shadow: inset 0 0 0 2px #d32ce6;
}
.battle-pass-progress-item.current:not(.done)[data-rar=d32ce6]:hover .battle-pass-progress-item-content:after {
  opacity: 0.4;
}
.battle-pass-progress-item.current:not(.done)[data-rar=d32ce6]:hover .battle-pass-progress-item-content-honey svg path {
  fill-opacity: 0.2;
}
.battle-pass-progress-item.current:not(.done)[data-rar=d32ce6].active:after {
  background: #d32ce6;
  opacity: 0.4;
}
.battle-pass-progress-item.current:not(.done)[data-rar=d32ce6].active .battle-pass-progress-item-content {
  background: radial-gradient(104.82% 50% at 50% 100%, rgba(211, 44, 230, 0.7608) 0%, rgba(211, 44, 230, 0.1728) 100%);
  box-shadow: inset 0 0 0 4px #d32ce6;
}
.battle-pass-progress-item.current:not(.done)[data-rar=d32ce6].active .battle-pass-progress-item-content:after {
  border: 4px solid rgba(211, 44, 230, 0.32);
  opacity: 1;
}
.battle-pass-progress-item.current:not(.done)[data-rar=d32ce6].active .battle-pass-progress-item-content-border-outside {
  border: 4px solid rgba(211, 44, 230, 0.32);
  opacity: 1;
}
.battle-pass-progress-item.current:not(.done)[data-rar=d32ce6].active .battle-pass-progress-item-content-border-top:before, .battle-pass-progress-item.current:not(.done)[data-rar=d32ce6].active .battle-pass-progress-item-content-border-top:after, .battle-pass-progress-item.current:not(.done)[data-rar=d32ce6].active .battle-pass-progress-item-content-border-bottom:before, .battle-pass-progress-item.current:not(.done)[data-rar=d32ce6].active .battle-pass-progress-item-content-border-bottom:after {
  border-width: 4px;
  border-color: #fff;
}
.battle-pass-progress-item.current:not(.done)[data-rar=d32ce6].active .battle-pass-progress-item-content-honey svg path {
  fill-opacity: 0.1;
}
.battle-pass-progress-item.current:not(.done)[data-rar=eb4b4b]:after {
  background: #eb4b4b;
  opacity: 0.32;
}
.battle-pass-progress-item.current:not(.done)[data-rar=eb4b4b] .battle-pass-progress-item-content {
  background: radial-gradient(104.82% 50% at 50% 100%, rgba(235, 75, 75, 0.4608) 0%, rgba(235, 75, 75, 0.1728) 100%);
  box-shadow: inset 0 0 0 2px #eb4b4b;
}
.battle-pass-progress-item.current:not(.done)[data-rar=eb4b4b] .battle-pass-progress-item-content-border-top, .battle-pass-progress-item.current:not(.done)[data-rar=eb4b4b] .battle-pass-progress-item-content-border-bottom {
  opacity: 1;
}
.battle-pass-progress-item.current:not(.done)[data-rar=eb4b4b] .battle-pass-progress-item-content-border-top:before, .battle-pass-progress-item.current:not(.done)[data-rar=eb4b4b] .battle-pass-progress-item-content-border-top:after, .battle-pass-progress-item.current:not(.done)[data-rar=eb4b4b] .battle-pass-progress-item-content-border-bottom:before, .battle-pass-progress-item.current:not(.done)[data-rar=eb4b4b] .battle-pass-progress-item-content-border-bottom:after {
  border-color: #f7dbff;
}
.battle-pass-progress-item.current:not(.done)[data-rar=eb4b4b] .battle-pass-progress-item-content-honey svg path {
  fill: #eb4b4b;
}
.battle-pass-progress-item.current:not(.done)[data-rar=eb4b4b]:hover:after {
  opacity: 0.4;
}
.battle-pass-progress-item.current:not(.done)[data-rar=eb4b4b]:hover .battle-pass-progress-item-content {
  box-shadow: inset 0 0 0 2px #eb4b4b;
}
.battle-pass-progress-item.current:not(.done)[data-rar=eb4b4b]:hover .battle-pass-progress-item-content:after {
  opacity: 0.4;
}
.battle-pass-progress-item.current:not(.done)[data-rar=eb4b4b]:hover .battle-pass-progress-item-content-honey svg path {
  fill-opacity: 0.2;
}
.battle-pass-progress-item.current:not(.done)[data-rar=eb4b4b].active:after {
  background: #eb4b4b;
  opacity: 0.4;
}
.battle-pass-progress-item.current:not(.done)[data-rar=eb4b4b].active .battle-pass-progress-item-content {
  background: radial-gradient(104.82% 50% at 50% 100%, rgba(235, 75, 75, 0.7608) 0%, rgba(235, 75, 75, 0.1728) 100%);
  box-shadow: inset 0 0 0 4px #eb4b4b;
}
.battle-pass-progress-item.current:not(.done)[data-rar=eb4b4b].active .battle-pass-progress-item-content:after {
  border: 4px solid rgba(235, 75, 75, 0.32);
  opacity: 1;
}
.battle-pass-progress-item.current:not(.done)[data-rar=eb4b4b].active .battle-pass-progress-item-content-border-outside {
  border: 4px solid rgba(235, 75, 75, 0.32);
  opacity: 1;
}
.battle-pass-progress-item.current:not(.done)[data-rar=eb4b4b].active .battle-pass-progress-item-content-border-top:before, .battle-pass-progress-item.current:not(.done)[data-rar=eb4b4b].active .battle-pass-progress-item-content-border-top:after, .battle-pass-progress-item.current:not(.done)[data-rar=eb4b4b].active .battle-pass-progress-item-content-border-bottom:before, .battle-pass-progress-item.current:not(.done)[data-rar=eb4b4b].active .battle-pass-progress-item-content-border-bottom:after {
  border-width: 4px;
  border-color: #fff;
}
.battle-pass-progress-item.current:not(.done)[data-rar=eb4b4b].active .battle-pass-progress-item-content-honey svg path {
  fill-opacity: 0.1;
}
.battle-pass-progress-item.current:not(.done)[data-rar=ffd600]:after, .battle-pass-progress-item.current:not(.done)[data-rar=ffd700]:after, .battle-pass-progress-item.current:not(.done)[data-rar=e4ae39]:after {
  background: #ffd600;
  opacity: 0.32;
}
.battle-pass-progress-item.current:not(.done)[data-rar=ffd600] .battle-pass-progress-item-content, .battle-pass-progress-item.current:not(.done)[data-rar=ffd700] .battle-pass-progress-item-content, .battle-pass-progress-item.current:not(.done)[data-rar=e4ae39] .battle-pass-progress-item-content {
  background: radial-gradient(104.82% 50% at 50% 100%, rgba(255, 214, 0, 0.4608) 0%, rgba(255, 214, 0, 0.1728) 100%);
  box-shadow: inset 0 0 0 2px #ffd600;
}
.battle-pass-progress-item.current:not(.done)[data-rar=ffd600] .battle-pass-progress-item-content-border-top, .battle-pass-progress-item.current:not(.done)[data-rar=ffd600] .battle-pass-progress-item-content-border-bottom, .battle-pass-progress-item.current:not(.done)[data-rar=ffd700] .battle-pass-progress-item-content-border-top, .battle-pass-progress-item.current:not(.done)[data-rar=ffd700] .battle-pass-progress-item-content-border-bottom, .battle-pass-progress-item.current:not(.done)[data-rar=e4ae39] .battle-pass-progress-item-content-border-top, .battle-pass-progress-item.current:not(.done)[data-rar=e4ae39] .battle-pass-progress-item-content-border-bottom {
  opacity: 1;
}
.battle-pass-progress-item.current:not(.done)[data-rar=ffd600] .battle-pass-progress-item-content-border-top:before, .battle-pass-progress-item.current:not(.done)[data-rar=ffd600] .battle-pass-progress-item-content-border-top:after, .battle-pass-progress-item.current:not(.done)[data-rar=ffd600] .battle-pass-progress-item-content-border-bottom:before, .battle-pass-progress-item.current:not(.done)[data-rar=ffd600] .battle-pass-progress-item-content-border-bottom:after, .battle-pass-progress-item.current:not(.done)[data-rar=ffd700] .battle-pass-progress-item-content-border-top:before, .battle-pass-progress-item.current:not(.done)[data-rar=ffd700] .battle-pass-progress-item-content-border-top:after, .battle-pass-progress-item.current:not(.done)[data-rar=ffd700] .battle-pass-progress-item-content-border-bottom:before, .battle-pass-progress-item.current:not(.done)[data-rar=ffd700] .battle-pass-progress-item-content-border-bottom:after, .battle-pass-progress-item.current:not(.done)[data-rar=e4ae39] .battle-pass-progress-item-content-border-top:before, .battle-pass-progress-item.current:not(.done)[data-rar=e4ae39] .battle-pass-progress-item-content-border-top:after, .battle-pass-progress-item.current:not(.done)[data-rar=e4ae39] .battle-pass-progress-item-content-border-bottom:before, .battle-pass-progress-item.current:not(.done)[data-rar=e4ae39] .battle-pass-progress-item-content-border-bottom:after {
  border-color: #f7dbff;
}
.battle-pass-progress-item.current:not(.done)[data-rar=ffd600] .battle-pass-progress-item-content-honey svg path, .battle-pass-progress-item.current:not(.done)[data-rar=ffd700] .battle-pass-progress-item-content-honey svg path, .battle-pass-progress-item.current:not(.done)[data-rar=e4ae39] .battle-pass-progress-item-content-honey svg path {
  fill: #ffd600;
}
.battle-pass-progress-item.current:not(.done)[data-rar=ffd600]:hover:after, .battle-pass-progress-item.current:not(.done)[data-rar=ffd700]:hover:after, .battle-pass-progress-item.current:not(.done)[data-rar=e4ae39]:hover:after {
  opacity: 0.4;
}
.battle-pass-progress-item.current:not(.done)[data-rar=ffd600]:hover .battle-pass-progress-item-content, .battle-pass-progress-item.current:not(.done)[data-rar=ffd700]:hover .battle-pass-progress-item-content, .battle-pass-progress-item.current:not(.done)[data-rar=e4ae39]:hover .battle-pass-progress-item-content {
  box-shadow: inset 0 0 0 2px #ffd600;
}
.battle-pass-progress-item.current:not(.done)[data-rar=ffd600]:hover .battle-pass-progress-item-content:after, .battle-pass-progress-item.current:not(.done)[data-rar=ffd700]:hover .battle-pass-progress-item-content:after, .battle-pass-progress-item.current:not(.done)[data-rar=e4ae39]:hover .battle-pass-progress-item-content:after {
  opacity: 0.4;
}
.battle-pass-progress-item.current:not(.done)[data-rar=ffd600]:hover .battle-pass-progress-item-content-honey svg path, .battle-pass-progress-item.current:not(.done)[data-rar=ffd700]:hover .battle-pass-progress-item-content-honey svg path, .battle-pass-progress-item.current:not(.done)[data-rar=e4ae39]:hover .battle-pass-progress-item-content-honey svg path {
  fill-opacity: 0.2;
}
.battle-pass-progress-item.current:not(.done)[data-rar=ffd600].active:after, .battle-pass-progress-item.current:not(.done)[data-rar=ffd700].active:after, .battle-pass-progress-item.current:not(.done)[data-rar=e4ae39].active:after {
  background: #ffd600;
  opacity: 0.4;
}
.battle-pass-progress-item.current:not(.done)[data-rar=ffd600].active .battle-pass-progress-item-content, .battle-pass-progress-item.current:not(.done)[data-rar=ffd700].active .battle-pass-progress-item-content, .battle-pass-progress-item.current:not(.done)[data-rar=e4ae39].active .battle-pass-progress-item-content {
  background: radial-gradient(104.82% 50% at 50% 100%, rgba(255, 214, 0, 0.7608) 0%, rgba(255, 214, 0, 0.1728) 100%);
  box-shadow: inset 0 0 0 4px #ffd600;
}
.battle-pass-progress-item.current:not(.done)[data-rar=ffd600].active .battle-pass-progress-item-content:after, .battle-pass-progress-item.current:not(.done)[data-rar=ffd700].active .battle-pass-progress-item-content:after, .battle-pass-progress-item.current:not(.done)[data-rar=e4ae39].active .battle-pass-progress-item-content:after {
  border: 4px solid rgba(255, 214, 0, 0.32);
  opacity: 1;
}
.battle-pass-progress-item.current:not(.done)[data-rar=ffd600].active .battle-pass-progress-item-content-border-outside, .battle-pass-progress-item.current:not(.done)[data-rar=ffd700].active .battle-pass-progress-item-content-border-outside, .battle-pass-progress-item.current:not(.done)[data-rar=e4ae39].active .battle-pass-progress-item-content-border-outside {
  border: 4px solid rgba(255, 214, 0, 0.32);
  opacity: 1;
}
.battle-pass-progress-item.current:not(.done)[data-rar=ffd600].active .battle-pass-progress-item-content-border-top:before, .battle-pass-progress-item.current:not(.done)[data-rar=ffd600].active .battle-pass-progress-item-content-border-top:after, .battle-pass-progress-item.current:not(.done)[data-rar=ffd600].active .battle-pass-progress-item-content-border-bottom:before, .battle-pass-progress-item.current:not(.done)[data-rar=ffd600].active .battle-pass-progress-item-content-border-bottom:after, .battle-pass-progress-item.current:not(.done)[data-rar=ffd700].active .battle-pass-progress-item-content-border-top:before, .battle-pass-progress-item.current:not(.done)[data-rar=ffd700].active .battle-pass-progress-item-content-border-top:after, .battle-pass-progress-item.current:not(.done)[data-rar=ffd700].active .battle-pass-progress-item-content-border-bottom:before, .battle-pass-progress-item.current:not(.done)[data-rar=ffd700].active .battle-pass-progress-item-content-border-bottom:after, .battle-pass-progress-item.current:not(.done)[data-rar=e4ae39].active .battle-pass-progress-item-content-border-top:before, .battle-pass-progress-item.current:not(.done)[data-rar=e4ae39].active .battle-pass-progress-item-content-border-top:after, .battle-pass-progress-item.current:not(.done)[data-rar=e4ae39].active .battle-pass-progress-item-content-border-bottom:before, .battle-pass-progress-item.current:not(.done)[data-rar=e4ae39].active .battle-pass-progress-item-content-border-bottom:after {
  border-width: 4px;
  border-color: #fff;
}
.battle-pass-progress-item.current:not(.done)[data-rar=ffd600].active .battle-pass-progress-item-content-honey svg path, .battle-pass-progress-item.current:not(.done)[data-rar=ffd700].active .battle-pass-progress-item-content-honey svg path, .battle-pass-progress-item.current:not(.done)[data-rar=e4ae39].active .battle-pass-progress-item-content-honey svg path {
  fill-opacity: 0.1;
}
.battle-pass-progress-item.wait:not(.done) .battle-pass-progress-item-content::before {
  transition: background-image 0.3s ease-in-out;
}
.battle-pass-progress-item.wait:not(.done) .battle-pass-progress-item-content-border-top, .battle-pass-progress-item.wait:not(.done) .battle-pass-progress-item-content-border-bottom {
  opacity: 1;
}
.battle-pass-progress-item.wait:not(.done) .battle-pass-progress-item-content-border-top:before, .battle-pass-progress-item.wait:not(.done) .battle-pass-progress-item-content-border-top:after, .battle-pass-progress-item.wait:not(.done) .battle-pass-progress-item-content-border-bottom:before, .battle-pass-progress-item.wait:not(.done) .battle-pass-progress-item-content-border-bottom:after {
  border-color: #06c50c;
}
.battle-pass-progress-item.wait:not(.done):hover .battle-pass-progress-item-content-border-top:before, .battle-pass-progress-item.wait:not(.done):hover .battle-pass-progress-item-content-border-top:after, .battle-pass-progress-item.wait:not(.done):hover .battle-pass-progress-item-content-border-bottom:before, .battle-pass-progress-item.wait:not(.done):hover .battle-pass-progress-item-content-border-bottom:after {
  border-width: 4px;
}
.battle-pass-progress-item.wait:not(.done):hover.active .battle-pass-progress-item-content-border-top:before, .battle-pass-progress-item.wait:not(.done):hover.active .battle-pass-progress-item-content-border-top:after, .battle-pass-progress-item.wait:not(.done):hover.active .battle-pass-progress-item-content-border-bottom:before, .battle-pass-progress-item.wait:not(.done):hover.active .battle-pass-progress-item-content-border-bottom:after {
  border-width: 4px;
}
.battle-pass-progress-item.wait:not(.done)[data-rar=b0c3d9] .battle-pass-progress-item-content {
  background: rgba(176, 195, 217, 0.15);
  box-shadow: inset 0 0 0 2px rgba(176, 195, 217, 0.32);
}
.battle-pass-progress-item.wait:not(.done)[data-rar=b0c3d9] .battle-pass-progress-item-content-honey svg path {
  fill: #b0c3d9;
  fill-opacity: 0.04;
}
.battle-pass-progress-item.wait:not(.done)[data-rar=b0c3d9]:hover .battle-pass-progress-item-content {
  background: radial-gradient(104.82% 50% at 50% 100%, rgba(176, 195, 217, 0.4608) 0%, rgba(176, 195, 217, 0.1728) 100%);
  box-shadow: inset 0 0 0 2px rgb(176, 195, 217);
}
.battle-pass-progress-item.wait:not(.done)[data-rar=b0c3d9]:hover .battle-pass-progress-item-content-honey svg path {
  fill-opacity: 0.2;
}
.battle-pass-progress-item.wait:not(.done)[data-rar=b0c3d9].active .battle-pass-progress-item-content {
  background: radial-gradient(104.82% 50% at 50% 100%, rgba(176, 195, 217, 0.6608) 0%, rgba(176, 195, 217, 0.1728) 100%);
  box-shadow: inset 0 0 0 4px rgb(176, 195, 217);
}
.battle-pass-progress-item.wait:not(.done)[data-rar=b0c3d9].active .battle-pass-progress-item-content:after {
  display: none;
}
.battle-pass-progress-item.wait:not(.done)[data-rar=b0c3d9].active .battle-pass-progress-item-content-honey svg path {
  fill-opacity: 0.1;
}
.battle-pass-progress-item.wait:not(.done)[data-rar=b0c3d9].active .battle-pass-progress-item-content-border-top:before, .battle-pass-progress-item.wait:not(.done)[data-rar=b0c3d9].active .battle-pass-progress-item-content-border-top:after, .battle-pass-progress-item.wait:not(.done)[data-rar=b0c3d9].active .battle-pass-progress-item-content-border-bottom:before, .battle-pass-progress-item.wait:not(.done)[data-rar=b0c3d9].active .battle-pass-progress-item-content-border-bottom:after {
  border-width: 4px;
}
.battle-pass-progress-item.wait:not(.done)[data-rar=b0c3d9].active .battle-pass-progress-item-content-border-outside {
  opacity: 1;
  border: 4px solid rgba(176, 195, 217, 0.32);
}
.battle-pass-progress-item.wait:not(.done)[data-rar="4b69ff"] .battle-pass-progress-item-content {
  background: rgba(75, 105, 255, 0.15);
  box-shadow: inset 0 0 0 2px rgba(75, 105, 255, 0.32);
}
.battle-pass-progress-item.wait:not(.done)[data-rar="4b69ff"] .battle-pass-progress-item-content-honey svg path {
  fill: #4b69ff;
  fill-opacity: 0.04;
}
.battle-pass-progress-item.wait:not(.done)[data-rar="4b69ff"]:hover .battle-pass-progress-item-content {
  background: radial-gradient(104.82% 50% at 50% 100%, rgba(75, 105, 255, 0.4608) 0%, rgba(75, 105, 255, 0.1728) 100%);
  box-shadow: inset 0 0 0 2px rgb(75, 105, 255);
}
.battle-pass-progress-item.wait:not(.done)[data-rar="4b69ff"]:hover .battle-pass-progress-item-content-honey svg path {
  fill-opacity: 0.2;
}
.battle-pass-progress-item.wait:not(.done)[data-rar="4b69ff"].active .battle-pass-progress-item-content {
  background: radial-gradient(104.82% 50% at 50% 100%, rgba(75, 105, 255, 0.6608) 0%, rgba(75, 105, 255, 0.1728) 100%);
  box-shadow: inset 0 0 0 4px rgb(75, 105, 255);
}
.battle-pass-progress-item.wait:not(.done)[data-rar="4b69ff"].active .battle-pass-progress-item-content:after {
  display: none;
}
.battle-pass-progress-item.wait:not(.done)[data-rar="4b69ff"].active .battle-pass-progress-item-content-honey svg path {
  fill-opacity: 0.1;
}
.battle-pass-progress-item.wait:not(.done)[data-rar="4b69ff"].active .battle-pass-progress-item-content-border-top:before, .battle-pass-progress-item.wait:not(.done)[data-rar="4b69ff"].active .battle-pass-progress-item-content-border-top:after, .battle-pass-progress-item.wait:not(.done)[data-rar="4b69ff"].active .battle-pass-progress-item-content-border-bottom:before, .battle-pass-progress-item.wait:not(.done)[data-rar="4b69ff"].active .battle-pass-progress-item-content-border-bottom:after {
  border-width: 4px;
}
.battle-pass-progress-item.wait:not(.done)[data-rar="4b69ff"].active .battle-pass-progress-item-content-border-outside {
  opacity: 1;
  border: 4px solid rgba(75, 105, 255, 0.32);
}
.battle-pass-progress-item.wait:not(.done)[data-rar="5e98d9"] .battle-pass-progress-item-content {
  background: rgba(94, 152, 217, 0.15);
  box-shadow: inset 0 0 0 2px rgba(94, 152, 217, 0.32);
}
.battle-pass-progress-item.wait:not(.done)[data-rar="5e98d9"] .battle-pass-progress-item-content-honey svg path {
  fill: #5e98d9;
  fill-opacity: 0.04;
}
.battle-pass-progress-item.wait:not(.done)[data-rar="5e98d9"]:hover .battle-pass-progress-item-content {
  background: radial-gradient(104.82% 50% at 50% 100%, rgba(94, 152, 217, 0.4608) 0%, rgba(94, 152, 217, 0.1728) 100%);
  box-shadow: inset 0 0 0 2px rgb(94, 152, 217);
}
.battle-pass-progress-item.wait:not(.done)[data-rar="5e98d9"]:hover .battle-pass-progress-item-content-honey svg path {
  fill-opacity: 0.2;
}
.battle-pass-progress-item.wait:not(.done)[data-rar="5e98d9"].active .battle-pass-progress-item-content {
  background: radial-gradient(104.82% 50% at 50% 100%, rgba(94, 152, 217, 0.6608) 0%, rgba(94, 152, 217, 0.1728) 100%);
  box-shadow: inset 0 0 0 4px rgb(94, 152, 217);
}
.battle-pass-progress-item.wait:not(.done)[data-rar="5e98d9"].active .battle-pass-progress-item-content:after {
  display: none;
}
.battle-pass-progress-item.wait:not(.done)[data-rar="5e98d9"].active .battle-pass-progress-item-content-honey svg path {
  fill-opacity: 0.1;
}
.battle-pass-progress-item.wait:not(.done)[data-rar="5e98d9"].active .battle-pass-progress-item-content-border-top:before, .battle-pass-progress-item.wait:not(.done)[data-rar="5e98d9"].active .battle-pass-progress-item-content-border-top:after, .battle-pass-progress-item.wait:not(.done)[data-rar="5e98d9"].active .battle-pass-progress-item-content-border-bottom:before, .battle-pass-progress-item.wait:not(.done)[data-rar="5e98d9"].active .battle-pass-progress-item-content-border-bottom:after {
  border-width: 4px;
}
.battle-pass-progress-item.wait:not(.done)[data-rar="5e98d9"].active .battle-pass-progress-item-content-border-outside {
  opacity: 1;
  border: 4px solid rgba(94, 152, 217, 0.32);
}
.battle-pass-progress-item.wait:not(.done)[data-rar="8847ff"] .battle-pass-progress-item-content {
  background: rgba(136, 71, 255, 0.15);
  box-shadow: inset 0 0 0 2px rgba(136, 71, 255, 0.32);
}
.battle-pass-progress-item.wait:not(.done)[data-rar="8847ff"] .battle-pass-progress-item-content-honey svg path {
  fill: #8847ff;
  fill-opacity: 0.04;
}
.battle-pass-progress-item.wait:not(.done)[data-rar="8847ff"]:hover .battle-pass-progress-item-content {
  background: radial-gradient(104.82% 50% at 50% 100%, rgba(136, 71, 255, 0.4608) 0%, rgba(136, 71, 255, 0.1728) 100%);
  box-shadow: inset 0 0 0 2px rgb(136, 71, 255);
}
.battle-pass-progress-item.wait:not(.done)[data-rar="8847ff"]:hover .battle-pass-progress-item-content-honey svg path {
  fill-opacity: 0.2;
}
.battle-pass-progress-item.wait:not(.done)[data-rar="8847ff"].active .battle-pass-progress-item-content {
  background: radial-gradient(104.82% 50% at 50% 100%, rgba(136, 71, 255, 0.6608) 0%, rgba(136, 71, 255, 0.1728) 100%);
  box-shadow: inset 0 0 0 4px rgb(136, 71, 255);
}
.battle-pass-progress-item.wait:not(.done)[data-rar="8847ff"].active .battle-pass-progress-item-content:after {
  display: none;
}
.battle-pass-progress-item.wait:not(.done)[data-rar="8847ff"].active .battle-pass-progress-item-content-honey svg path {
  fill-opacity: 0.1;
}
.battle-pass-progress-item.wait:not(.done)[data-rar="8847ff"].active .battle-pass-progress-item-content-border-top:before, .battle-pass-progress-item.wait:not(.done)[data-rar="8847ff"].active .battle-pass-progress-item-content-border-top:after, .battle-pass-progress-item.wait:not(.done)[data-rar="8847ff"].active .battle-pass-progress-item-content-border-bottom:before, .battle-pass-progress-item.wait:not(.done)[data-rar="8847ff"].active .battle-pass-progress-item-content-border-bottom:after {
  border-width: 4px;
}
.battle-pass-progress-item.wait:not(.done)[data-rar="8847ff"].active .battle-pass-progress-item-content-border-outside {
  opacity: 1;
  border: 4px solid rgba(136, 71, 255, 0.32);
}
.battle-pass-progress-item.wait:not(.done)[data-rar=d32ce6] .battle-pass-progress-item-content {
  background: rgba(211, 44, 230, 0.15);
  box-shadow: inset 0 0 0 2px rgba(211, 44, 230, 0.32);
}
.battle-pass-progress-item.wait:not(.done)[data-rar=d32ce6] .battle-pass-progress-item-content-honey svg path {
  fill: #d32ce6;
  fill-opacity: 0.04;
}
.battle-pass-progress-item.wait:not(.done)[data-rar=d32ce6]:hover .battle-pass-progress-item-content {
  background: radial-gradient(104.82% 50% at 50% 100%, rgba(211, 44, 230, 0.4608) 0%, rgba(211, 44, 230, 0.1728) 100%);
  box-shadow: inset 0 0 0 2px rgb(211, 44, 230);
}
.battle-pass-progress-item.wait:not(.done)[data-rar=d32ce6]:hover .battle-pass-progress-item-content-honey svg path {
  fill-opacity: 0.2;
}
.battle-pass-progress-item.wait:not(.done)[data-rar=d32ce6].active .battle-pass-progress-item-content {
  background: radial-gradient(104.82% 50% at 50% 100%, rgba(211, 44, 230, 0.6608) 0%, rgba(211, 44, 230, 0.1728) 100%);
  box-shadow: inset 0 0 0 4px rgb(211, 44, 230);
}
.battle-pass-progress-item.wait:not(.done)[data-rar=d32ce6].active .battle-pass-progress-item-content:after {
  display: none;
}
.battle-pass-progress-item.wait:not(.done)[data-rar=d32ce6].active .battle-pass-progress-item-content-honey svg path {
  fill-opacity: 0.1;
}
.battle-pass-progress-item.wait:not(.done)[data-rar=d32ce6].active .battle-pass-progress-item-content-border-top:before, .battle-pass-progress-item.wait:not(.done)[data-rar=d32ce6].active .battle-pass-progress-item-content-border-top:after, .battle-pass-progress-item.wait:not(.done)[data-rar=d32ce6].active .battle-pass-progress-item-content-border-bottom:before, .battle-pass-progress-item.wait:not(.done)[data-rar=d32ce6].active .battle-pass-progress-item-content-border-bottom:after {
  border-width: 4px;
}
.battle-pass-progress-item.wait:not(.done)[data-rar=d32ce6].active .battle-pass-progress-item-content-border-outside {
  opacity: 1;
  border: 4px solid rgba(211, 44, 230, 0.32);
}
.battle-pass-progress-item.wait:not(.done)[data-rar=eb4b4b] .battle-pass-progress-item-content {
  background: rgba(235, 75, 75, 0.15);
  box-shadow: inset 0 0 0 2px rgba(235, 75, 75, 0.32);
}
.battle-pass-progress-item.wait:not(.done)[data-rar=eb4b4b] .battle-pass-progress-item-content-honey svg path {
  fill: #eb4b4b;
  fill-opacity: 0.04;
}
.battle-pass-progress-item.wait:not(.done)[data-rar=eb4b4b]:hover .battle-pass-progress-item-content {
  background: radial-gradient(104.82% 50% at 50% 100%, rgba(235, 75, 75, 0.4608) 0%, rgba(235, 75, 75, 0.1728) 100%);
  box-shadow: inset 0 0 0 2px #eb4b4b;
}
.battle-pass-progress-item.wait:not(.done)[data-rar=eb4b4b]:hover .battle-pass-progress-item-content-honey svg path {
  fill-opacity: 0.2;
}
.battle-pass-progress-item.wait:not(.done)[data-rar=eb4b4b].active .battle-pass-progress-item-content {
  background: radial-gradient(104.82% 50% at 50% 100%, rgba(235, 75, 75, 0.6608) 0%, rgba(235, 75, 75, 0.1728) 100%);
  box-shadow: inset 0 0 0 4px rgb(235, 75, 75);
}
.battle-pass-progress-item.wait:not(.done)[data-rar=eb4b4b].active .battle-pass-progress-item-content:after {
  display: none;
}
.battle-pass-progress-item.wait:not(.done)[data-rar=eb4b4b].active .battle-pass-progress-item-content-honey svg path {
  fill-opacity: 0.1;
}
.battle-pass-progress-item.wait:not(.done)[data-rar=eb4b4b].active .battle-pass-progress-item-content-border-top:before, .battle-pass-progress-item.wait:not(.done)[data-rar=eb4b4b].active .battle-pass-progress-item-content-border-top:after, .battle-pass-progress-item.wait:not(.done)[data-rar=eb4b4b].active .battle-pass-progress-item-content-border-bottom:before, .battle-pass-progress-item.wait:not(.done)[data-rar=eb4b4b].active .battle-pass-progress-item-content-border-bottom:after {
  border-width: 4px;
}
.battle-pass-progress-item.wait:not(.done)[data-rar=eb4b4b].active .battle-pass-progress-item-content-border-outside {
  opacity: 1;
  border: 4px solid rgba(235, 75, 75, 0.32);
}
.battle-pass-progress-item.wait:not(.done)[data-rar=ffd600] .battle-pass-progress-item-content, .battle-pass-progress-item.wait:not(.done)[data-rar=ffd700] .battle-pass-progress-item-content, .battle-pass-progress-item.wait:not(.done)[data-rar=e4ae39] .battle-pass-progress-item-content {
  background: rgba(255, 214, 0, 0.15);
  box-shadow: inset 0 0 0 2px rgba(255, 214, 0, 0.3);
}
.battle-pass-progress-item.wait:not(.done)[data-rar=ffd600] .battle-pass-progress-item-content-honey svg path, .battle-pass-progress-item.wait:not(.done)[data-rar=ffd700] .battle-pass-progress-item-content-honey svg path, .battle-pass-progress-item.wait:not(.done)[data-rar=e4ae39] .battle-pass-progress-item-content-honey svg path {
  fill: #ffd600;
  fill-opacity: 0.04;
}
.battle-pass-progress-item.wait:not(.done)[data-rar=ffd600]:hover .battle-pass-progress-item-content, .battle-pass-progress-item.wait:not(.done)[data-rar=ffd700]:hover .battle-pass-progress-item-content, .battle-pass-progress-item.wait:not(.done)[data-rar=e4ae39]:hover .battle-pass-progress-item-content {
  background: radial-gradient(104.82% 50% at 50% 100%, rgba(255, 214, 0, 0.4608) 0%, rgba(255, 214, 0, 0.1728) 100%);
  box-shadow: inset 0 0 0 2px #ffd600;
}
.battle-pass-progress-item.wait:not(.done)[data-rar=ffd600]:hover .battle-pass-progress-item-content-honey svg path, .battle-pass-progress-item.wait:not(.done)[data-rar=ffd700]:hover .battle-pass-progress-item-content-honey svg path, .battle-pass-progress-item.wait:not(.done)[data-rar=e4ae39]:hover .battle-pass-progress-item-content-honey svg path {
  fill-opacity: 0.2;
}
.battle-pass-progress-item.wait:not(.done)[data-rar=ffd600].active .battle-pass-progress-item-content, .battle-pass-progress-item.wait:not(.done)[data-rar=ffd700].active .battle-pass-progress-item-content, .battle-pass-progress-item.wait:not(.done)[data-rar=e4ae39].active .battle-pass-progress-item-content {
  background: radial-gradient(104.82% 50% at 50% 100%, rgba(255, 214, 0, 0.6608) 0%, rgba(255, 214, 0, 0.1728) 100%);
  box-shadow: inset 0 0 0 4px rgb(255, 214, 0);
}
.battle-pass-progress-item.wait:not(.done)[data-rar=ffd600].active .battle-pass-progress-item-content:after, .battle-pass-progress-item.wait:not(.done)[data-rar=ffd700].active .battle-pass-progress-item-content:after, .battle-pass-progress-item.wait:not(.done)[data-rar=e4ae39].active .battle-pass-progress-item-content:after {
  display: none;
}
.battle-pass-progress-item.wait:not(.done)[data-rar=ffd600].active .battle-pass-progress-item-content-honey svg path, .battle-pass-progress-item.wait:not(.done)[data-rar=ffd700].active .battle-pass-progress-item-content-honey svg path, .battle-pass-progress-item.wait:not(.done)[data-rar=e4ae39].active .battle-pass-progress-item-content-honey svg path {
  fill-opacity: 0.1;
}
.battle-pass-progress-item.wait:not(.done)[data-rar=ffd600].active .battle-pass-progress-item-content-border-top:before, .battle-pass-progress-item.wait:not(.done)[data-rar=ffd600].active .battle-pass-progress-item-content-border-top:after, .battle-pass-progress-item.wait:not(.done)[data-rar=ffd600].active .battle-pass-progress-item-content-border-bottom:before, .battle-pass-progress-item.wait:not(.done)[data-rar=ffd600].active .battle-pass-progress-item-content-border-bottom:after, .battle-pass-progress-item.wait:not(.done)[data-rar=ffd700].active .battle-pass-progress-item-content-border-top:before, .battle-pass-progress-item.wait:not(.done)[data-rar=ffd700].active .battle-pass-progress-item-content-border-top:after, .battle-pass-progress-item.wait:not(.done)[data-rar=ffd700].active .battle-pass-progress-item-content-border-bottom:before, .battle-pass-progress-item.wait:not(.done)[data-rar=ffd700].active .battle-pass-progress-item-content-border-bottom:after, .battle-pass-progress-item.wait:not(.done)[data-rar=e4ae39].active .battle-pass-progress-item-content-border-top:before, .battle-pass-progress-item.wait:not(.done)[data-rar=e4ae39].active .battle-pass-progress-item-content-border-top:after, .battle-pass-progress-item.wait:not(.done)[data-rar=e4ae39].active .battle-pass-progress-item-content-border-bottom:before, .battle-pass-progress-item.wait:not(.done)[data-rar=e4ae39].active .battle-pass-progress-item-content-border-bottom:after {
  border-width: 4px;
}
.battle-pass-progress-item.wait:not(.done)[data-rar=ffd600].active .battle-pass-progress-item-content-border-outside, .battle-pass-progress-item.wait:not(.done)[data-rar=ffd700].active .battle-pass-progress-item-content-border-outside, .battle-pass-progress-item.wait:not(.done)[data-rar=e4ae39].active .battle-pass-progress-item-content-border-outside {
  opacity: 1;
  border: 4px solid rgba(255, 214, 0, 0.32);
}
.battle-pass-progress-item.other:not(.done) .battle-pass-progress-item-content-border-top, .battle-pass-progress-item.other:not(.done) .battle-pass-progress-item-content-border-bottom {
  opacity: 1;
}
.battle-pass-progress-item.other:not(.done) .battle-pass-progress-item-content-border-top:before, .battle-pass-progress-item.other:not(.done) .battle-pass-progress-item-content-border-top:after, .battle-pass-progress-item.other:not(.done) .battle-pass-progress-item-content-border-bottom:before, .battle-pass-progress-item.other:not(.done) .battle-pass-progress-item-content-border-bottom:after {
  border-color: #3b1674;
}
.battle-pass-progress-item.other:not(.done) .battle-pass-progress-item-content-border-top:before {
  border-radius: 6px 0 0 0;
  border-width: 3px;
}
.battle-pass-progress-item.other:not(.done) .battle-pass-progress-item-content-border-top:after {
  border-radius: 0 6px 0 0;
  border-width: 3px;
}
.battle-pass-progress-item.other:not(.done) .battle-pass-progress-item-content-border-bottom:before {
  border-radius: 0 0 0 6px;
  border-width: 3px;
}
.battle-pass-progress-item.other:not(.done) .battle-pass-progress-item-content-border-bottom:after {
  border-radius: 0 0 6px 0;
  border-width: 3px;
}
.battle-pass-progress-item.other:not(.done).active .battle-pass-progress-item-content-border-top:before, .battle-pass-progress-item.other:not(.done).active .battle-pass-progress-item-content-border-top:after, .battle-pass-progress-item.other:not(.done).active .battle-pass-progress-item-content-border-bottom:before, .battle-pass-progress-item.other:not(.done).active .battle-pass-progress-item-content-border-bottom:after, .battle-pass-progress-item.other:not(.done):hover .battle-pass-progress-item-content-border-top:before, .battle-pass-progress-item.other:not(.done):hover .battle-pass-progress-item-content-border-top:after, .battle-pass-progress-item.other:not(.done):hover .battle-pass-progress-item-content-border-bottom:before, .battle-pass-progress-item.other:not(.done):hover .battle-pass-progress-item-content-border-bottom:after {
  border-width: 5px;
}
.battle-pass-progress-item.other:not(.done)[data-rar=b0c3d9] .battle-pass-progress-item-content {
  background: radial-gradient(104.82% 50% at 50% 100%, rgba(176, 195, 217, 0.4608) 0%, rgba(176, 195, 217, 0.1728) 100%);
  box-shadow: inset 0 0 0 2px #b0c3d9;
}
.battle-pass-progress-item.other:not(.done)[data-rar=b0c3d9] .battle-pass-progress-item-content-honey svg path {
  fill: #b0c3d9;
}
.battle-pass-progress-item.other:not(.done)[data-rar=b0c3d9]:hover .battle-pass-progress-item-content-honey svg path {
  fill-opacity: 0.2;
}
.battle-pass-progress-item.other:not(.done)[data-rar=b0c3d9].active .battle-pass-progress-item-content {
  background: radial-gradient(104.82% 50% at 50% 100%, rgba(176, 195, 217, 0.6608) 0%, rgba(176, 195, 217, 0.1728) 100%);
}
.battle-pass-progress-item.other:not(.done)[data-rar=b0c3d9].active .battle-pass-progress-item-content:after {
  display: none;
}
.battle-pass-progress-item.other:not(.done)[data-rar=b0c3d9].active .battle-pass-progress-item-content-honey svg path {
  fill-opacity: 0.1;
}
.battle-pass-progress-item.other:not(.done)[data-rar=b0c3d9].active .battle-pass-progress-item-content-border-outside {
  border: 4px solid rgba(176, 195, 217, 0.32);
  opacity: 1;
}
.battle-pass-progress-item.other:not(.done)[data-rar="4b69ff"] .battle-pass-progress-item-content {
  background: radial-gradient(104.82% 50% at 50% 100%, rgba(75, 105, 255, 0.4608) 0%, rgba(75, 105, 255, 0.1728) 100%);
  box-shadow: inset 0 0 0 2px #4b69ff;
}
.battle-pass-progress-item.other:not(.done)[data-rar="4b69ff"] .battle-pass-progress-item-content-honey svg path {
  fill: #4b69ff;
}
.battle-pass-progress-item.other:not(.done)[data-rar="4b69ff"]:hover .battle-pass-progress-item-content-honey svg path {
  fill-opacity: 0.2;
}
.battle-pass-progress-item.other:not(.done)[data-rar="4b69ff"].active .battle-pass-progress-item-content {
  background: radial-gradient(104.82% 50% at 50% 100%, rgba(75, 105, 255, 0.6608) 0%, rgba(75, 105, 255, 0.1728) 100%);
  box-shadow: inset 0 0 0 4px #4b69ff;
}
.battle-pass-progress-item.other:not(.done)[data-rar="4b69ff"].active .battle-pass-progress-item-content:after {
  display: none;
}
.battle-pass-progress-item.other:not(.done)[data-rar="4b69ff"].active .battle-pass-progress-item-content-border-outside {
  border: 4px solid rgba(75, 105, 255, 0.32);
  opacity: 1;
}
.battle-pass-progress-item.other:not(.done)[data-rar="4b69ff"].active .battle-pass-progress-item-content-honey svg path {
  fill-opacity: 0.1;
}
.battle-pass-progress-item.other:not(.done)[data-rar="5e98d9"] .battle-pass-progress-item-content {
  background: radial-gradient(104.82% 50% at 50% 100%, rgba(94, 152, 217, 0.4608) 0%, rgba(94, 152, 217, 0.1728) 100%);
  box-shadow: inset 0 0 0 2px #5e98d9;
}
.battle-pass-progress-item.other:not(.done)[data-rar="5e98d9"] .battle-pass-progress-item-content-honey svg path {
  fill: #5e98d9;
}
.battle-pass-progress-item.other:not(.done)[data-rar="5e98d9"]:hover .battle-pass-progress-item-content-honey svg path {
  fill-opacity: 0.2;
}
.battle-pass-progress-item.other:not(.done)[data-rar="5e98d9"].active .battle-pass-progress-item-content {
  background: radial-gradient(104.82% 50% at 50% 100%, rgba(94, 152, 217, 0.6608) 0%, rgba(94, 152, 217, 0.1728) 100%);
  box-shadow: inset 0 0 0 4px #5e98d9;
}
.battle-pass-progress-item.other:not(.done)[data-rar="5e98d9"].active .battle-pass-progress-item-content:after {
  display: none;
}
.battle-pass-progress-item.other:not(.done)[data-rar="5e98d9"].active .battle-pass-progress-item-content-border-outside {
  border: 4px solid rgba(94, 152, 217, 0.32);
  opacity: 1;
}
.battle-pass-progress-item.other:not(.done)[data-rar="5e98d9"].active .battle-pass-progress-item-content-honey svg path {
  fill-opacity: 0.1;
}
.battle-pass-progress-item.other:not(.done)[data-rar="8847ff"] .battle-pass-progress-item-content {
  background: radial-gradient(104.82% 50% at 50% 100%, rgba(136, 71, 255, 0.4608) 0%, rgba(136, 71, 255, 0.1728) 100%);
  box-shadow: inset 0 0 0 2px #8847ff;
}
.battle-pass-progress-item.other:not(.done)[data-rar="8847ff"] .battle-pass-progress-item-content-honey svg path {
  fill: #8847ff;
}
.battle-pass-progress-item.other:not(.done)[data-rar="8847ff"]:hover .battle-pass-progress-item-content-honey svg path {
  fill-opacity: 0.2;
}
.battle-pass-progress-item.other:not(.done)[data-rar="8847ff"].active .battle-pass-progress-item-content {
  background: radial-gradient(104.82% 50% at 50% 100%, rgba(136, 71, 255, 0.6608) 0%, rgba(136, 71, 255, 0.1728) 100%);
  box-shadow: inset 0 0 0 4px #8847ff;
}
.battle-pass-progress-item.other:not(.done)[data-rar="8847ff"].active .battle-pass-progress-item-content:after {
  display: none;
}
.battle-pass-progress-item.other:not(.done)[data-rar="8847ff"].active .battle-pass-progress-item-content-border-outside {
  border: 4px solid rgba(136, 71, 255, 0.32);
  opacity: 1;
}
.battle-pass-progress-item.other:not(.done)[data-rar="8847ff"].active .battle-pass-progress-item-content-honey svg path {
  fill-opacity: 0.1;
}
.battle-pass-progress-item.other:not(.done)[data-rar=d32ce6] .battle-pass-progress-item-content {
  background: radial-gradient(104.82% 50% at 50% 100%, rgba(211, 44, 230, 0.4608) 0%, rgba(211, 44, 230, 0.1728) 100%);
  box-shadow: inset 0 0 0 2px #d32ce6;
}
.battle-pass-progress-item.other:not(.done)[data-rar=d32ce6] .battle-pass-progress-item-content-honey svg path {
  fill: #d32ce6;
}
.battle-pass-progress-item.other:not(.done)[data-rar=d32ce6]:hover .battle-pass-progress-item-content-honey svg path {
  fill-opacity: 0.2;
}
.battle-pass-progress-item.other:not(.done)[data-rar=d32ce6].active .battle-pass-progress-item-content {
  background: radial-gradient(104.82% 50% at 50% 100%, rgba(211, 44, 230, 0.6608) 0%, rgba(211, 44, 230, 0.1728) 100%);
  box-shadow: inset 0 0 0 4px #d32ce6;
}
.battle-pass-progress-item.other:not(.done)[data-rar=d32ce6].active .battle-pass-progress-item-content:after {
  display: none;
}
.battle-pass-progress-item.other:not(.done)[data-rar=d32ce6].active .battle-pass-progress-item-content-border-outside {
  border: 4px solid rgba(211, 44, 230, 0.32);
  opacity: 1;
}
.battle-pass-progress-item.other:not(.done)[data-rar=d32ce6].active .battle-pass-progress-item-content-honey svg path {
  fill-opacity: 0.1;
}
.battle-pass-progress-item.other:not(.done)[data-rar=eb4b4b] .battle-pass-progress-item-content {
  background: radial-gradient(104.82% 50% at 50% 100%, rgba(235, 75, 75, 0.4608) 0%, rgba(235, 75, 75, 0.1728) 100%);
  box-shadow: inset 0 0 0 2px #eb4b4b;
}
.battle-pass-progress-item.other:not(.done)[data-rar=eb4b4b] .battle-pass-progress-item-content-honey svg path {
  fill: #eb4b4b;
}
.battle-pass-progress-item.other:not(.done)[data-rar=eb4b4b]:hover .battle-pass-progress-item-content-honey svg path {
  fill-opacity: 0.2;
}
.battle-pass-progress-item.other:not(.done)[data-rar=eb4b4b].active .battle-pass-progress-item-content {
  background: radial-gradient(104.82% 50% at 50% 100%, rgba(235, 75, 75, 0.6608) 0%, rgba(235, 75, 75, 0.1728) 100%);
  box-shadow: inset 0 0 0 4px #eb4b4b;
}
.battle-pass-progress-item.other:not(.done)[data-rar=eb4b4b].active .battle-pass-progress-item-content:after {
  display: none;
}
.battle-pass-progress-item.other:not(.done)[data-rar=eb4b4b].active .battle-pass-progress-item-content-border-outside {
  border: 4px solid rgba(235, 75, 75, 0.32);
  opacity: 1;
}
.battle-pass-progress-item.other:not(.done)[data-rar=eb4b4b].active .battle-pass-progress-item-content-honey svg path {
  fill-opacity: 0.1;
}
.battle-pass-progress-item.other:not(.done)[data-rar=ffd600] .battle-pass-progress-item-content, .battle-pass-progress-item.other:not(.done)[data-rar=ffd700] .battle-pass-progress-item-content, .battle-pass-progress-item.other:not(.done)[data-rar=e4ae39] .battle-pass-progress-item-content {
  background: radial-gradient(104.82% 50% at 50% 100%, rgba(255, 214, 0, 0.4608) 0%, rgba(255, 214, 0, 0.1728) 100%);
  box-shadow: inset 0 0 0 2px #ffd600;
}
.battle-pass-progress-item.other:not(.done)[data-rar=ffd600] .battle-pass-progress-item-content-honey svg path, .battle-pass-progress-item.other:not(.done)[data-rar=ffd700] .battle-pass-progress-item-content-honey svg path, .battle-pass-progress-item.other:not(.done)[data-rar=e4ae39] .battle-pass-progress-item-content-honey svg path {
  fill: #ffd600;
}
.battle-pass-progress-item.other:not(.done)[data-rar=ffd600]:hover .battle-pass-progress-item-content-honey svg path, .battle-pass-progress-item.other:not(.done)[data-rar=ffd700]:hover .battle-pass-progress-item-content-honey svg path, .battle-pass-progress-item.other:not(.done)[data-rar=e4ae39]:hover .battle-pass-progress-item-content-honey svg path {
  fill-opacity: 0.2;
}
.battle-pass-progress-item.other:not(.done)[data-rar=ffd600].active .battle-pass-progress-item-content, .battle-pass-progress-item.other:not(.done)[data-rar=ffd700].active .battle-pass-progress-item-content, .battle-pass-progress-item.other:not(.done)[data-rar=e4ae39].active .battle-pass-progress-item-content {
  background: radial-gradient(104.82% 50% at 50% 100%, rgba(255, 214, 0, 0.6608) 0%, rgba(255, 214, 0, 0.1728) 100%);
  box-shadow: inset 0 0 0 4px #ffd600;
}
.battle-pass-progress-item.other:not(.done)[data-rar=ffd600].active .battle-pass-progress-item-content:after, .battle-pass-progress-item.other:not(.done)[data-rar=ffd700].active .battle-pass-progress-item-content:after, .battle-pass-progress-item.other:not(.done)[data-rar=e4ae39].active .battle-pass-progress-item-content:after {
  display: none;
}
.battle-pass-progress-item.other:not(.done)[data-rar=ffd600].active .battle-pass-progress-item-content-border-outside, .battle-pass-progress-item.other:not(.done)[data-rar=ffd700].active .battle-pass-progress-item-content-border-outside, .battle-pass-progress-item.other:not(.done)[data-rar=e4ae39].active .battle-pass-progress-item-content-border-outside {
  border: 4px solid rgba(255, 214, 0, 0.32);
  opacity: 1;
}
.battle-pass-progress-item.other:not(.done)[data-rar=ffd600].active .battle-pass-progress-item-content-honey svg path, .battle-pass-progress-item.other:not(.done)[data-rar=ffd700].active .battle-pass-progress-item-content-honey svg path, .battle-pass-progress-item.other:not(.done)[data-rar=e4ae39].active .battle-pass-progress-item-content-honey svg path {
  fill-opacity: 0.1;
}
.battle-pass-progress-item.active .battle-pass-progress-item-pos:before, .battle-pass-progress-item:hover .battle-pass-progress-item-pos:before {
  opacity: 0.64;
}

.battle-pass-quest-list {
  max-width: 720px;
  margin: 0 auto -20px auto;
  padding: 0 20px;
}
.battle-pass-quest-list-block {
  margin-bottom: 44px;
}
.battle-pass-quest-list-title {
  font-weight: 900;
  font-size: 30px;
  line-height: 30px;
  color: #ffffff;
  -webkit-text-stroke: 1px #c131e4;
  text-shadow: 0px 0px 80px #c131e4, 0px 0px 24px rgba(193, 49, 228, 0.64);
  margin-bottom: 53px;
  text-transform: uppercase;
  text-align: center;
}
.battle-pass-quest-list-block-title {
  font-size: 16px;
  line-height: 24px;
  color: rgba(230, 155, 255, 0.4);
  padding-bottom: 19px;
  position: relative;
  margin-bottom: 6px;
}
.battle-pass-quest-list-block-title:before {
  width: 100%;
  height: 2px;
  background: linear-gradient(90deg, rgba(32, 8, 66, 0.0001) 0%, #860b95 50%, rgba(32, 8, 66, 0.0001) 100%);
  top: 100%;
}
.battle-pass-quest-list-block-title:after {
  background: radial-gradient(50% 79.2% at 50% 100%, #e62cc7 0%, rgba(21, 5, 49, 0.0001) 100%);
  opacity: 0.12;
  height: 100%;
  width: 100%;
  top: 0;
}
.battle-pass-quest-list-block-title span {
  color: #f7dbff;
}
.battle-pass-quest-list-block-item {
  padding: 16px 0 16px 0;
  position: relative;
  cursor: pointer;
  margin-bottom: 5px;
}
.battle-pass-quest-list-block-item:before {
  background: radial-gradient(50% 8814.97% at 50% 50%, rgba(211, 44, 230, 0.04) 0%, rgba(211, 44, 230, 0) 100%);
  height: 100%;
  top: 0;
  left: 0;
  width: 100%;
  pointer-events: none;
}
.battle-pass-quest-list-block-item:after {
  background: linear-gradient(90deg, rgba(32, 8, 66, 0.0001) 0%, #860b95 50%, rgba(32, 8, 66, 0.0001) 100%);
  height: 1px;
  width: 100%;
  left: 0;
  top: 0;
  opacity: 0.8;
}
.battle-pass-quest-list-block-item-line {
  display: flex;
  align-items: center;
  padding-top: 2px;
  margin-bottom: 3px;
}
@media (max-width: 992px) {
  .battle-pass-quest-list-block-item-line {
    margin-bottom: 20px;
  }
  .battle-pass-quest-list-block-item-line .battle-pass-quest-list-block-item-line-cost,
  .battle-pass-quest-list-block-item-line .btn-loop {
    display: none;
  }
}
.battle-pass-quest-list-block-item-line-text {
  font-size: 16px;
  line-height: 16px;
  color: #d32ce6;
  margin-right: auto;
}
.battle-pass-quest-list-block-item-line-cost {
  display: flex;
  align-items: center;
  height: 24px;
  background: linear-gradient(90deg, #26003e 0%, #230170 100%);
  box-shadow: 0 0 0 4px rgba(40, 4, 161, 0.24);
  border-radius: 12px;
  padding: 0 2px 0 8px;
  font-weight: 500;
  font-size: 16px;
  line-height: 19px;
}
.battle-pass-quest-list-block-item-line-cost svg {
  margin-left: 3px;
  margin-right: 1px;
}
.battle-pass-quest-list-block-item .btn-loop {
  width: 46px;
  height: 46px;
  position: relative;
  margin-left: 40px;
  padding: 0;
  z-index: 2;
}
.battle-pass-quest-list-block-item .btn-loop-wrap {
  border-radius: 24px;
  box-shadow: inset 0 0 0 2px rgba(211, 44, 230, 0.08);
  transition: all 0.3s;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.battle-pass-quest-list-block-item .btn-loop-wrap .completed {
  box-shadow: inset 0 0 0 2px rgba(6, 197, 12, 0.08);
}
.battle-pass-quest-list-block-item .btn-loop-wrap .opacity-changed {
  box-shadow: inset 0 0 0 2px #d32ce6;
}
.battle-pass-quest-list-block-item .btn-loop-wrap .default {
  box-shadow: inset 0 0 0 2px rgba(211, 44, 230, 0.08);
}
.battle-pass-quest-list-block-item .btn-loop .icon {
  font-size: 32px;
  line-height: 32px;
  color: rgba(211, 44, 230, 0.4);
}
.battle-pass-quest-list-block-item .btn-loop .icon .completed {
  color: rgba(6, 197, 12, 0.08);
}
.battle-pass-quest-list-block-item .btn-loop .icon .opacity-changed {
  color: #d32ce6;
}
.battle-pass-quest-list-block-item .btn-loop .icon .default {
  color: rgba(211, 44, 230, 0.08);
}
.battle-pass-quest-list-block-item .btn-loop .tooltip-block {
  background: linear-gradient(270deg, #4f0857 0%, #b111c4 100%);
  white-space: nowrap;
  z-index: -1;
  transition: all 0.3s;
}
.battle-pass-quest-list-block-item .btn-loop:hover .btn-loop-wrap {
  background: linear-gradient(90deg, #1c1132 0%, #120929 100%);
  box-shadow: inset 0 0 0 4px rgba(211, 44, 230, 0.4);
}
.battle-pass-quest-list-block-item .btn-loop:hover .icon {
  color: #d32ce6;
}
.battle-pass-quest-list-block-item .btn-loop:hover .tooltip-block {
  opacity: 1;
  margin-top: -4px;
}
.battle-pass-quest-list-block-item .btn-loop[disabled] .btn-loop-wrap {
  background: rgba(211, 44, 230, 0.04);
  box-shadow: none;
}
.battle-pass-quest-list-block-item:hover:before {
  background: radial-gradient(50% 8814.97% at 50% 50%, rgba(211, 44, 230, 0.08) 0%, rgba(211, 44, 230, 0) 100%);
}
.battle-pass-quest-list-block-item:hover .battle-pass-quest-list-block-item-line-text {
  color: #f7dbff;
  text-shadow: 0px 0px 36px #c131e4, 0px 0px 3px #c131e4;
}
.battle-pass-quest-list-block-item.done:after {
  background: linear-gradient(90deg, rgba(136, 71, 255, 0) 0%, rgba(136, 71, 255, 0.4) 50%, rgba(136, 71, 255, 0) 100%);
}
.battle-pass-quest-list-block-item.done .battle-pass-quest-list-block-item-line-text,
.battle-pass-quest-list-block-item.done .battle-pass-quest-list-block-item-progress-count {
  color: #8847ff;
  text-shadow: none;
}
.battle-pass-quest-list-block-item.done .battle-pass-quest-list-block-item-line-cost {
  background: linear-gradient(90deg, rgba(0, 87, 0, 0.2) 0%, rgba(8, 148, 8, 0.2) 100%);
  border: 2px solid rgba(6, 197, 12, 0.4);
  box-shadow: none;
}
.battle-pass-quest-list-block-item.done .btn-loop-wrap {
  box-shadow: 0 0 0 2px rgba(6, 197, 12, 0.08);
}
.battle-pass-quest-list-block-item.done .btn-loop-wrap .icon {
  color: rgba(6, 197, 12, 0.4);
}
.battle-pass-quest-list-block-item.done .btn-loop .tooltip-block {
  background: linear-gradient(270deg, #005803 0%, #06c50c 100%);
}
.battle-pass-quest-list-block-item.done .btn-loop:hover .btn-loop-wrap {
  box-shadow: 0 0 0 4px rgba(6, 197, 12, 0.4);
}
.battle-pass-quest-list-block-item.done .btn-loop:hover .btn-loop-wrap .icon {
  color: #06c50c;
}
.battle-pass-quest-list-block-item.done .battle-pass-quest-list-block-item-progress-item.done:after {
  background: #8847ff;
  box-shadow: inset 0px 2px 2px rgba(255, 255, 255, 0.64), inset 0px -2px 2px rgba(46, 12, 107, 0.48);
}
.battle-pass-quest-list-block-item.done:hover .battle-pass-quest-list-block-item-line-text {
  color: #c2a1ff;
}
.battle-pass-quest-list-block-item.done:hover {
  background: radial-gradient(50% 8814.97% at 50% 50%, rgba(136, 71, 255, 0.08) 0%, rgba(136, 71, 255, 0) 100%);
}
.battle-pass-quest-list-block-item-mob {
  display: none;
  padding: 0 4px;
}
@media (max-width: 992px) {
  .battle-pass-quest-list-block-item-mob {
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
}
.battle-pass-quest-list-block-item-mob .btn-loop {
  width: auto;
  box-shadow: inset 0 0 0 2px rgba(211, 44, 230, 0.08);
  border-radius: 24px;
  margin-left: auto;
}
.battle-pass-quest-list-block-item-mob .btn-loop-wrap {
  padding: 4px 4px 4px 4px;
}
.battle-pass-quest-list-block-item-mob .btn-loop .icon {
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.battle-pass-quest-list-block-item-mob .btn-loop .text {
  margin-right: 12px;
  font-weight: 700;
  font-size: 16px;
  line-height: 19px;
  letter-spacing: 0.05em;
  color: #D32CE6;
  opacity: 0.4;
  margin-left: 24px;
}
@media (max-width: 359px) {
  .battle-pass-quest-list-block-item-mob .btn-loop .text {
    margin-left: 14px;
    margin-right: 6px;
  }
}
.battle-pass-quest-list-block-item-mob .btn-loop:hover .text {
  opacity: 1;
}
.battle-pass-quest-list-block-item-progress {
  display: flex;
  align-items: center;
  margin-bottom: 20px;
}
.battle-pass-quest-list-block-item-progress-count {
  min-width: 48px;
  margin-right: 8px;
  color: rgba(230, 155, 255, 0.4);
  font-size: 16px;
}
.battle-pass-quest-list-block-item-progress-items {
  display: flex;
  align-items: center;
  flex-grow: 1;
  margin-right: 160px;
  max-width: 436px;
}
@media (max-width: 992px) {
  .battle-pass-quest-list-block-item-progress-items {
    margin-right: 0;
  }
}
.battle-pass-quest-list-block-item-progress-items > :first-child {
  border-radius: 20px 12px 12px 20px;
}
.battle-pass-quest-list-block-item-progress-items > :first-child:before {
  border-radius: 20px 12px 12px 20px;
}
.battle-pass-quest-list-block-item-progress-items > :first-child.done:after {
  border-radius: 20px 6px 6px 20px;
}
.battle-pass-quest-list-block-item-progress-items > :last-child {
  border-radius: 12px 20px 20px 12px;
}
.battle-pass-quest-list-block-item-progress-items > :last-child:before {
  border-radius: 6px 20px 20px 6px;
}
.battle-pass-quest-list-block-item-progress-items > :last-child.done:after {
  border-radius: 6px 20px 20px 4px;
}
.battle-pass-quest-list-block-item-progress-items.three .battle-pass-quest-list-block-item-progress-item {
  width: 143px;
}
@media (max-width: 992px) {
  .battle-pass-quest-list-block-item-progress-items.three .battle-pass-quest-list-block-item-progress-item {
    width: 33.3%;
  }
}
.battle-pass-quest-list-block-item-progress-items .battle-pass-quest-list-block-item-progress-item.undefined {
  border-radius: 20px;
}
.battle-pass-quest-list-block-item-progress-items .battle-pass-quest-list-block-item-progress-item.undefined:before {
  border-radius: 20px;
}
.battle-pass-quest-list-block-item-progress-item {
  margin-right: 4px;
  height: 14px;
  border-radius: 4px 4px 4px 4px;
  padding: 3px 2px 2px 3px;
  position: relative;
  background: linear-gradient(0deg, rgba(136, 71, 255, 0.14) 0%, rgba(136, 71, 255, 0.31) 100%);
  flex-grow: 1;
}
.battle-pass-quest-list-block-item-progress-item:before {
  width: calc(100% - 2px);
  height: calc(100% - 2px);
  background: #1b0934;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  border-radius: 3px;
}
.battle-pass-quest-list-block-item-progress-item-line {
  position: inherit;
  background: #d32ce6;
  box-shadow: inset 0px 2px 2px rgba(255, 255, 255, 0.64), inset 0px -2px 2px rgba(46, 12, 107, 0.48);
  border-radius: 3px;
  height: 8px;
}
.battle-pass-quest-list-block-item-progress-item.done:after {
  background: #d32ce6;
  box-shadow: inset 0px 2px 2px rgba(255, 255, 255, 0.64), inset 0px -2px 2px rgba(46, 12, 107, 0.48);
  border-radius: 2px;
  height: 8px;
  width: calc(100% - 6px);
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}
.battle-pass-quest-list-block-item-progress-item.one {
  border-radius: 20px;
}
.battle-pass-quest-list-block-item-progress-item.one:before {
  border-radius: 20px;
}

.case-cost-battle-pass {
  background: linear-gradient(90deg, #26003e 0%, #230170 100%);
  box-shadow: 0 0 0 4px rgba(40, 4, 161, 0.24);
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  font-weight: 500;
  font-size: 16px;
  line-height: 19px;
  color: #ffffff;
  padding: 0 4px 0 8px;
  margin: 0 12px;
}
.case-cost-battle-pass svg {
  margin-left: 4px;
}

.battle-pass-text-block {
  position: absolute;
  top: 15px;
  width: 100%;
  padding: 0 32px;
  text-align: center;
}
@media (max-width: 768px) {
  .battle-pass-text-block {
    padding: 0 16px;
  }
}

.battle-pass-text-block-item {
  font-family: "Sriracha";
  font-weight: 400;
  font-size: 72px;
  line-height: 127px;
  text-transform: uppercase;
  -webkit-text-stroke: 6px #fff;
  color: #310f41;
  filter: drop-shadow(2px 3px 0px #b0c3d9);
  white-space: nowrap;
  position: relative;
}
@media (max-width: 768px) {
  .battle-pass-text-block-item {
    font-size: 52px;
    line-height: 107px;
  }
}
.battle-pass-text-block-item:before {
  content: attr(data-text);
  width: 100%;
  -webkit-text-stroke: 0;
}
.battle-pass-text-block-item:after {
  content: attr(data-text);
  width: 100%;
  -webkit-text-stroke: 0;
  z-index: -1;
  text-shadow: 0px 8px 12px #b0c3d9;
  top: 0;
}

.battle-pass-text-block-sec {
  font-weight: 900;
  font-size: 24px;
  line-height: 32px;
  letter-spacing: 1px;
  background: radial-gradient(50.43% 628.83% at 50% 50%, #ffff01 0%, #ffb101 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  text-fill-color: transparent;
  position: relative;
  bottom: 20px;
  z-index: 2;
}
@media (max-width: 768px) {
  .battle-pass-text-block-sec {
    font-size: 20px;
  }
}
.battle-pass-text-block-sec-shadow {
  font-weight: 900;
  font-size: 24px;
  line-height: 32px;
  letter-spacing: 1px;
  background: radial-gradient(50.43% 628.83% at 50% 50%, #ffff01 0%, #ffb101 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  text-fill-color: transparent;
  text-shadow: 2px 2px 0px #3a1902;
  position: absolute;
  bottom: 20px;
  width: 100%;
  left: 0;
}
@media (max-width: 768px) {
  .battle-pass-text-block-sec-shadow {
    font-size: 20px;
  }
}