* {
  margin: 0;
  padding: 0;
  font-size: 0;
}

button {
  border: 0;
  padding: 0;
  background-color: transparent;
}

.trial-wrap {
  width: 7.5rem;
  height: 15rem;
  margin: 0 auto;
  position: relative;
}

.trial-page {
  display: none;
  position: relative;
  width: 7.5rem;
  height: 15rem;
  margin: 0 auto;
}

.trial-page.is-active {
  display: block;
}

.page-home {
  background: url("/custom/img/act/act260709/bg.jpg");
  background-size: 100% 100%;
}

.trial-logo {
  position: absolute;
  left: 0.26rem;
  top: 0.36rem;
  width: 1.28rem;
  height: 1.2rem;
}

.trial-account {
  position: absolute;
  left: 50%;
  top: 0.46rem;
  transform: translateX(-50%);
  display: flex;
  align-items: center;
  gap: 0.22rem;
  color: #ffffff;
  text-shadow: 0 0.04rem 0.12rem rgba(27, 92, 153, 0.45);
  white-space: nowrap;
}
.trial-account-inner{
  display: none;
}

.trial-account-name {
  max-width: 2.8rem;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 0.28rem;
  font-weight: bold;
  line-height: 0.38rem;
}

.trial-account-actions {
  display: flex;
  align-items: center;
  /*gap: 0.2rem;*/
}

.trial-account-link {
  color: #ffe16d;
  font-size: 0.28rem;
  line-height: 0.38rem;
  text-decoration: underline;
  margin-left: 0.2rem;
}

.trial-account-login {
  display: inline-block;
  box-sizing: border-box;
  border-bottom: 0.02rem solid rgba(255, 225, 109, 0.88);
  color: #ffe16d;
  font-size: 0.28rem;
  font-weight: bold;
  line-height: 0.4rem;
  text-align: center;
  text-decoration: none;
}

.trial-side-nav {
  position: absolute;
  right: 0.12rem;
  top: 0.42rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.08rem;
}

.trial-side-btn {
  width: 0.92rem;
  height: 0.92rem;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% 100%;
}

.trial-music,
.game-music-btn {
  width: 0.6rem;
  height: 0.6rem;
  background-image: url("/custom/img/act/act260709/btn-music.png");
}

.trial-rank {
  background-image: url("/custom/img/act/act260709/btn-chart.png");
}

.trial-reward {
  background-image: url("/custom/img/act/act260709/btn-gift.png");
}

.trial-rule-btn {
  position: absolute;
  right: 0.02rem;
  top: 3.46rem;
  width: 0.64rem;
  height: 2.8rem;
  background: url("/custom/img/act/act260709/btn-rule.png") no-repeat center;
  background-size: 100% 100%;
}

.trial-start-btn {
  position: absolute;
  left: 50%;
  bottom: 2.95rem;
  transform: translateX(-50%);
  width: 4.13rem;
  height: 1.29rem;
  background: url("/custom/img/act/act260709/btn-start.png") no-repeat center;
  background-size: 100% 100%;
  filter: drop-shadow(0 0.12rem 0.14rem rgba(233, 138, 39, 0.28));
}

.trial-music.is-playing,
.game-music-btn.is-playing {
  /*animation: musicSpin 4s linear infinite;*/
}

.trial-music:not(.is-playing),
.game-music-btn:not(.is-playing) {
  opacity: 1;
  background-image: url("/custom/img/act/act260709/btn-music-muted.png");
}

.page-game {
  min-height: 15rem;
  background: url("/custom/img/act/act260709/game-pg.jpg") no-repeat center top;
  background-size: 100% auto;
}

.game-side-nav {
  top: 0.24rem;
  right: 0.08rem;
}

.game-back-btn {
  position: absolute;
  left: 0.22rem;
  top: 0.24rem;
  width: 0.64rem;
  height: 0.64rem;
  background: url("/custom/img/act/act260709/btn-back.png") no-repeat center;
  background-size: 100% 100%;
}

.game-music-btn {
  position: absolute;
  right: 0.24rem;
  top: 0.24rem;
  width: 0.92rem;
  height: 0.92rem;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% 100%;
}

.game-title-badge {
  position: absolute;
  left: 50%;
  top: 1.4rem;
  transform: translateX(-50%);
}

.game-status {
  position: absolute;
  left: 60%;
  top: 2.75rem;
  transform: translateX(-50%);
  width: 3.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
}

.game-hp-number {
  margin-left: 0.12rem;
  color: #ffd86c;
  font-size: 0.34rem;
  font-weight: bold;
  line-height: 0.42rem;
}

.game-map-copy {
  position: absolute;
  left: 50%;
  top: 4.02rem;
  transform: translateX(-50%);
  color: #ff5f40;
  font-size: 0.32rem;
  font-weight: bold;
  line-height: 0.42rem;
  text-shadow: 0 0.02rem 0.08rem rgba(255, 255, 255, 0.42);
}

.game-level-btn {
  width: 3.04rem;
  height: 0.56rem;
  opacity: 1;
  margin-top: 0.4rem;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% 100%;
}

.game-level-btn[data-level="0"] {
  background-image: url("/custom/img/act/act260709/title-level-1.png");
}

.game-level-btn[data-level="1"] {
  background-image: url("/custom/img/act/act260709/title-level-2.png");
}

.game-level-btn[data-level="2"] {
  background-image: url("/custom/img/act/act260709/title-level-3.png");
}

.game-level-btn.is-active {
  opacity: 1;
}

.game-board-wrap {
  position: absolute;
  left: 1.05rem;
  top: 4rem;
  width: 5.4rem;
  height: 6.62rem;
  overflow: hidden;
}

#gameCanvas {
  width: 5.4rem;
  height: 6.5rem;
}

.game-board {
  position: relative;
  width: 100%;
  height: 100%;
  background: radial-gradient(
      circle at 50% 45%,
      rgba(27, 68, 122, 0.24) 0%,
      rgba(16, 50, 102, 0.8) 56%,
      rgba(12, 40, 84, 0.92) 100%
    ),
    linear-gradient(
      180deg,
      rgba(110, 164, 220, 0.08) 0%,
      rgba(27, 61, 113, 0.1) 100%
    );
}

.game-grid-line {
  position: absolute;
  background: rgba(170, 221, 255, 0.42);
}

.game-grid-line.is-v {
  top: 0;
  bottom: 0;
  width: 0.02rem;
}

.game-grid-line.is-h {
  left: 0;
  right: 0;
  height: 0.02rem;
}

.line-v-1 {
  left: 16.66%;
}
.line-v-2 {
  left: 33.33%;
}
.line-v-3 {
  left: 50%;
}
.line-v-4 {
  left: 66.66%;
}
.line-v-5 {
  left: 83.33%;
}
.line-h-1 {
  top: 14.28%;
}
.line-h-2 {
  top: 28.56%;
}
.line-h-3 {
  top: 42.84%;
}
.line-h-4 {
  top: 57.12%;
}
.line-h-5 {
  top: 71.4%;
}
.line-h-6 {
  top: 85.68%;
}

.game-path {
  position: absolute;
  width: 16.66%;
  height: 14.28%;
  background: radial-gradient(
      circle at 30% 22%,
      rgba(255, 255, 255, 0.34) 0 20%,
      rgba(255, 255, 255, 0) 21%
    ),
    linear-gradient(180deg, #dbe7ae 0%, #bfd284 100%);
}

.game-path::after {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(
      circle at 24% 72%,
      rgba(105, 145, 78, 0.54) 0 5%,
      rgba(105, 145, 78, 0) 6%
    ),
    radial-gradient(
      circle at 73% 38%,
      rgba(132, 161, 93, 0.44) 0 4%,
      rgba(132, 161, 93, 0) 5%
    );
}

.path-1 {
  left: 33.33%;
  top: 14.28%;
}
.path-2 {
  left: 33.33%;
  top: 28.56%;
}
.path-3 {
  left: 16.66%;
  top: 28.56%;
}
.path-4 {
  left: 50%;
  top: 28.56%;
}
.path-5 {
  left: 33.33%;
  top: 42.84%;
}
.path-6 {
  left: 50%;
  top: 42.84%;
}

.game-rock {
  position: absolute;
  left: 19%;
  top: 29.6%;
  width: 0.46rem;
  height: 0.58rem;
  background: linear-gradient(135deg, #6a876c 0%, #39524a 100%);
  clip-path: polygon(25% 0, 82% 6%, 100% 44%, 74% 100%, 2% 100%, 0 48%);
}

.game-ruins {
  position: absolute;
  left: 56%;
  top: 46.4%;
  width: 0.74rem;
  height: 0.48rem;
}

.game-ruins::before,
.game-ruins::after {
  content: "";
  position: absolute;
  background: linear-gradient(180deg, #617d6b 0%, #3e564d 100%);
}

.game-ruins::before {
  left: 0.02rem;
  bottom: 0.04rem;
  width: 0.5rem;
  height: 0.12rem;
  transform: skewX(-30deg);
}

.game-ruins::after {
  left: 0.18rem;
  bottom: 0.14rem;
  width: 0.18rem;
  height: 0.24rem;
  transform: skewY(16deg);
  box-shadow: 0.15rem 0.05rem 0 0 #496157;
}

.game-exit-arrow {
  position: absolute;
  left: 36.7%;
  top: 46.8%;
  width: 0.6rem;
  height: 0.6rem;
  border-radius: 50%;
  background: radial-gradient(
    circle,
    rgba(220, 255, 255, 0.82) 0%,
    rgba(170, 244, 255, 0.38) 40%,
    rgba(170, 244, 255, 0) 72%
  );
}

.game-exit-arrow::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 42%;
  width: 0.24rem;
  height: 0.24rem;
  border-right: 0.08rem solid rgba(237, 255, 255, 0.95);
  border-bottom: 0.08rem solid rgba(237, 255, 255, 0.95);
  transform: translate(-50%, -50%) rotate(45deg);
}

.game-player {
  position: absolute;
  left: 34.6%;
  top: 23.2%;
  width: 0.7rem;
  height: 1rem;
}

.game-player-shadow {
  position: absolute;
  left: 50%;
  bottom: 0.02rem;
  width: 0.48rem;
  height: 0.12rem;
  border-radius: 50%;
  background: rgba(41, 57, 96, 0.52);
  transform: translateX(-50%);
}

.player-head {
  position: absolute;
  left: 50%;
  top: 0.14rem;
  width: 0.18rem;
  height: 0.18rem;
  border-radius: 50%;
  background: #ffe4d6;
  transform: translateX(-50%);
  z-index: 3;
}

.player-hair {
  position: absolute;
  left: 50%;
  top: 0.03rem;
  width: 0.34rem;
  height: 0.34rem;
  border-radius: 46% 46% 40% 40%;
  background: linear-gradient(180deg, #f2f5ff 0%, #c6d4e7 100%);
  transform: translateX(-50%);
  box-shadow: -0.1rem 0.14rem 0 -0.1rem #dde6f2,
    0.1rem 0.14rem 0 -0.1rem #dde6f2;
}

.player-cloak {
  position: absolute;
  left: 50%;
  top: 0.28rem;
  width: 0.38rem;
  height: 0.46rem;
  background: linear-gradient(180deg, #90b8ed 0%, #5579c5 100%);
  clip-path: polygon(
    50% 0,
    92% 18%,
    100% 74%,
    74% 100%,
    50% 86%,
    26% 100%,
    0 74%,
    8% 18%
  );
  transform: translateX(-50%);
}

.player-sword {
  position: absolute;
  right: 0.02rem;
  top: 0.35rem;
  width: 0.12rem;
  height: 0.43rem;
  background: linear-gradient(180deg, #aef0ff 0%, #5d8de0 100%);
  clip-path: polygon(50% 0, 100% 20%, 74% 100%, 26% 100%, 0 20%);
  transform: rotate(28deg);
}

.game-progress-area {
  position: absolute;
  left: 2.25rem;
  bottom: 3.4rem;
  width: 4.4rem;
}

.game-progress-track {
  width: 75%;
  height: 0.16rem;
  border-radius: 0.08rem;
  background: rgba(11, 30, 86, 0.68);
  box-shadow: inset 0 0 0 0.02rem rgba(188, 233, 255, 0.52);
  overflow: hidden;
}

.game-progress-fill {
  width: 33.33%;
  height: 100%;
  background: url("/custom/img/act/act260709/progress-inner.png") repeat-x left
    center;
  background-size: auto 100%;
}

.game-progress-points {
  position: absolute;
  left: 0;
  top: -0.12rem;
  width: 100%;
  display: flex;
  justify-content: space-between;
}

.game-progress-point {
  width: 0.11rem;
  height: 0.18rem;
  background: url("/custom/img/act/act260709/progress-dot.png");
  background-size: 100% 100%;
}


.egg-box-btn {
  position: absolute;
  right: -0.32rem;
  top: -0.5rem;
  width: 1.14rem;
  height: 0.82rem;
  background: url("/custom/img/act/act260709/egg-box-btn.png") no-repeat
    center;
  background-size: 100% 100%;
}

.egg-box-btn.egg-box-btn-open {
  width: 1.08rem;
  height: 0.86rem;
  background-image: url("/custom/img/act/act260709/egg-box-btn-open.png");
}

.game-reward-list {
  position: absolute;
  left: 67%;
  bottom: 3.55rem;
  width: 3.7rem;
  transform: translateX(-50%);
  display: flex;
  justify-content: space-between;
}

.game-reward-item {
  width: 0.54rem;
  height: 0.54rem;
}

.game-reward-item:nth-child(1) {
  position: absolute;
  left: -0.15rem;
  top: -0.55rem;
}
.game-reward-item:nth-child(2) {
  position: absolute;
  left: 1.9rem;
  top: -0.55rem;
}

.game-reward-item img {
  width: 100%;
  height: 100%;
  display: block;
}
.game-treasure{
  width: 0.87rem;
  height: 0.77rem;
  background: url("/custom/img/act/act260709/icon-treasure.png");
  background-size: 100% 100%;
  position: absolute;
  left: 6rem;
  top: 11rem;
}

.pop {
  position: fixed;
  inset: 0;
  display: none;
  background: rgba(0, 14, 42, 0.72);
  z-index: 10020;
}

.pop.is-show {
  display: block;
}

.pop-inner {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

.pop-close {
  position: absolute;
  right: 0.12rem;
  top: 0.12rem;
  width: 0.72rem;
  height: 0.72rem;
  z-index: 2;
}

.pop-rule {
  width: 6.72rem;
  height: 11.34rem;
  position: relative;
  background: url("/custom/img/act/act260709/pop-rule.png") no-repeat center;
  background-size: 100% 100%;
}

.pop-panel {
  width: 6.2rem;
  padding: 0.54rem 0.38rem 0.46rem;
  border: 0.03rem solid #8fd2ff;
  border-radius: 0.26rem;
  background: linear-gradient(
    180deg,
    rgba(236, 248, 255, 0.98) 0%,
    rgba(204, 231, 255, 0.96) 100%
  );
  box-shadow: 0 0.18rem 0.54rem rgba(10, 43, 82, 0.32);
  position: relative;
  box-sizing: border-box;
}

.pop-panel-title {
  color: #1d4f9a;
  font-size: 0.42rem;
  font-weight: bold;
  line-height: 0.52rem;
  text-align: center;
  margin-bottom: 0.34rem;
}

.rank-list {
  display: flex;
  flex-direction: column;
  gap: 0.18rem;
}

.rank-item {
  display: flex;
  align-items: center;
}

.rank-num {
  width: 0.48rem;
  color: #f19a2c;
  font-size: 0.34rem;
  font-weight: bold;
}

.rank-name {
  flex: 1;
  min-width: 0;
  padding: 0 0.2rem;
}

.rank-score {
  font-weight: bold;
}

.rank-blood {
  font-weight: bold;
}

.pop-rank-new {
  width: 7.43rem;
  height: 12.7rem;
  position: relative;
  background: url("/custom/img/act/act260709/pop-rank.png") no-repeat center top;
  background-size: 100% 100%;
}

.pop-rank-new .pop-close {
  right: 0.04rem;
  top: 0.04rem;
  width: 0.84rem;
  height: 0.84rem;
}
.pop-rank-ques {
  width: 0.4rem;
  height: 0.4rem;
  position: absolute;
  background: url("/custom/img/act/act260709/pop-rank-ques.png") no-repeat
    center top;
  background-size: 100% 100%;
  left: 5.2rem;
  top: 1.2rem;
}

.pop-rank-scroll {
  position: absolute;
  left: 0.28rem;
  top: 2.89rem;
  width: 6.73rem;
  height: 8.28rem;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  padding-right: 0.06rem;
  box-sizing: border-box;
}

.rank-list-new {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.14rem;
  padding-bottom: 0.08rem;
}

.rank-list-new .rank-item {
  width: 6.15rem;
  height: 1.09rem;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  background: url("/custom/img/act/act260709/pop-rank-other.png") no-repeat
    center;
  background-size: 100% 100%;
  color: #2a4f94;
}

.rank-list-new .rank-num {
  width: 1.46rem;
  height: 1.04rem;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #ffffff;
  font-size: 0.34rem;
  font-weight: bold;
  line-height: 1;
  background: url("/custom/img/act/act260709/pop-rank-num-bot.png") no-repeat
    center;
  background-size: 0.72rem 0.72rem;
}

.rank-list-new .rank-item.is-top1 .rank-num {
  background-image: url("/custom/img/act/act260709/pop-rank-num-1.png");
  background-size: 0.92rem 0.92rem;
  color: #fff4d6;
}

.rank-list-new .rank-item.is-top2 .rank-num {
  background-image: url("/custom/img/act/act260709/pop-rank-num-2.png");
  background-size: 0.92rem 0.92rem;
  color: #edf6ff;
}

.rank-list-new .rank-item.is-top3 .rank-num {
  background-image: url("/custom/img/act/act260709/pop-rank-num-3.png");
  background-size: 0.92rem 0.92rem;
  color: #fff2ea;
}

.rank-list-new .rank-name {
  flex: 1;
  min-width: 0;
  padding: 0 0.2rem 0 0.04rem;
  color: #2f5299;
  font-size: 0.34rem;
  font-weight: bold;
  line-height: 0.42rem;
  text-align: center;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.rank-list-new .rank-blood {
  width: 1rem;
  flex-shrink: 0;
  color: #2f5299;
  font-size: 0.34rem;
  font-weight: bold;
  line-height: 0.42rem;
  text-align: center;
}

.rank-list-new .rank-score {
  width: 1.3rem;
  flex-shrink: 0;
  color: #9f6500;
  font-size: 0.34rem;
  font-weight: bold;
  line-height: 0.42rem;
  text-align: center;
}

.pop-rank-self {
  position: absolute;
  left: 50%;
  transform: translate(-50%, 0);
  bottom: 0.46rem;
  width: 6.38rem;
  height: 1.13rem;
  padding: 0 0.34rem 0 0.52rem;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  background: url("/custom/img/act/act260709/pop-rank-self.png") no-repeat
    center;
  background-size: 100% 100%;
}

.pop-rank-self-label {
  width: 1.66rem;
  flex-shrink: 0;
  position: relative;
  color: #ffffff;
  font-size: 0.26rem;
  font-weight: bold;
  line-height: 0.34rem;
}

.pop-rank-self-label span {
  display: block;
  width: 2.16rem;
  color: #fff;
  font-size: 0.28rem;
}

.pop-rank-self-label::after {
  content: "";
  position: absolute;
  left: 0;
  top: 0.35rem;
  width: 1.16rem;
  height: 0.03rem;
  background: #ffe36a;
}

.pop-rank-self-label strong {
  display: block;
  margin-top: 0.04rem;
  color: #fff3ae;
  font-size: 0.32rem;
  line-height: 0.38rem;
}

.pop-rank-self-info {
  flex: 1;
  display: flex;
  align-items: center;
  min-width: 0;
}

.pop-rank-self-info .rank-name {
  flex: 1;
  min-width: 0;
  padding-right: 0.16rem;
  color: #ffffff;
  font-size: 0.34rem;
  font-weight: bold;
  line-height: 0.42rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.pop-rank-self-info .rank-blood {
  width: 1.1rem;
  flex-shrink: 0;
  color: #ffffff;
  font-size: 0.34rem;
  font-weight: bold;
  line-height: 0.42rem;
  text-align: center;
}

.pop-rank-self-info .rank-score {
  width: 0.86rem;
  flex-shrink: 0;
  color: #fff3ae;
  font-size: 0.34rem;
  font-weight: bold;
  line-height: 0.42rem;
  text-align: center;
}

.pop-reward {
  width: 7.05rem;
  min-height: 12rem;
  padding: 0.42rem 0.28rem 0.34rem;
  border: 0;
  border-radius: 0;
  background: url("/custom/img/act/act260709/pop-gift.png") no-repeat center top;
  background-size: 100% 100%;
  box-shadow: none;
}

.pop-reward .pop-close {
  right: 0.06rem;
  top: 0.02rem;
  width: 0.84rem;
  height: 0.84rem;
}

.pop-reward-account {
  position: absolute;
  left: 50%;
  top: 1.8rem;
  transform: translateX(-50%);
  width: 5.3rem;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #2f5299;
}

.pop-reward-account-server,
.pop-reward-account-name {
  display: block;
  max-width: 2.44rem;
  font-size: 0.34rem;
  line-height: 0.42rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.pop-reward-account-server {
  text-align: left;
  margin-right: 0.5rem;
}

.pop-reward-account-name {
  text-align: right;
}

.reward-scroll {
  width: 5.98rem;
  height: 8.7rem;
  margin: 2.08rem auto 0;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

.reward-scroll-content {
  position: relative;
}

.reward-scroll-image {
  display: block;
  width: 100%;
  height: auto;
}

.reward-tag-get {
  display: none;
  position: absolute;
  width: 1.38rem;
  height: 1.17rem;
  background: url("/custom/img/act/act260709/tags-get.png") no-repeat center;
  background-size: 100% 100%;
}

.reward-tag-get.is-active {
  display: block;
}

.reward-tag-get.is-enter {
  top: 2.1rem;
  left: 4.45rem;
}

.reward-tag-get.is-complete {
  top: 4.5rem;
  left: 4.45rem;
}
.reward-tag-get.is-hide {
  top: 7rem;
  left: 4.45rem;
}

.reward-hide-status {
  position: absolute;
  left: 3.8rem;
  top: 6.42rem;
  width: 1.7rem;
  color: #204f98;
  font-size: 0.26rem;
  font-weight: bold;
  line-height: 0.34rem;
  text-align: center;
}

.icon-egg-ques{
  width: 0.5rem;
  height: 0.5rem;
  position: absolute;
  left: 1.5rem;
  top: 6rem;
}


.pop-role-change {
  width: 7.05rem;
  height: 7.23rem;
  padding: 0.42rem 0.34rem 0.3rem;
  box-sizing: border-box;
  position: relative;
  background: url("/custom/img/act/act260709/pop-role-change.png") no-repeat
    center top;
  background-size: 100% 100%;
}

.pop-role-change .pop-close {
  right: 0.06rem;
  top: 0.02rem;
  width: 0.84rem;
  height: 0.84rem;
}

.role-change-platforms {
  position: absolute;
  left: 50%;
  top: 3rem;
  transform: translateX(-50%);
  display: flex;
  justify-content: center;
  gap: 0.9rem;
}

.role-change-radio {
  position: relative;
  display: flex;
  align-items: center;
  gap: 0.12rem;
}

.role-change-radio span {
  color: #5b84c4;
  font-size: 0.34rem;
  line-height: 0.42rem;
}

.role-change-radio.is-disabled {
  opacity: 0.45;
}

.role-change-radio.is-disabled span {
  color: #8da4c9;
}

.role-change-radio input {
  appearance: none;
  -webkit-appearance: none;
  width: 0.35rem;
  height: 0.35rem;
  margin: 0;
  border: 0.02rem solid #5783b8;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.95);
  position: relative;
  flex-shrink: 0;
  box-shadow: 0 0 0 0.01rem rgba(157, 210, 255, 0.7) inset;
}

.role-change-radio input:checked::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 0.3rem;
  height: 0.3rem;
  background: url("/custom/img/act/act260709/choose-dot.png") no-repeat center;
  background-size: 100% 100%;
  transform: translate(-50%, -50%);
}

.role-change-field {
  position: absolute;
  left: 1.85rem;
  top: 3.75rem;
  width: 4rem;
  display: flex;
  align-items: center;
  gap: 0.18rem;
  overflow: visible;
}

.role-change-select {
  position: relative;
  width: 4.7rem;
  height: 0.56rem;
  padding: 0 0.58rem 0 0.26rem;
  border: 0.02rem solid #6793da;
  border-radius: 0.3rem;
  background: rgba(255, 255, 255, 0.9);
  color: #5d88c8;
  font-size: 0.26rem;
  line-height: 0.52rem;
  text-align: left;
  box-sizing: border-box;
  box-shadow: inset 0 0.01rem 0.08rem rgba(142, 184, 239, 0.18);
}

.role-change-select span {
  font-size: 0.26rem;
  display: block;
  width: 100%;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.role-change-select::after {
  content: "";
  position: absolute;
  right: 0.28rem;
  top: 50%;
  width: 0.18rem;
  height: 0.18rem;
  border-right: 0.04rem solid #4b78bb;
  border-bottom: 0.04rem solid #4b78bb;
  transform: translateY(-65%) rotate(45deg);
}

.role-change-select.is-open::after {
  transform: translateY(-35%) rotate(225deg);
}

.role-change-dropdown {
  position: absolute;
  left: 0;
  top: 0.68rem;
  width: 4rem;
  max-height: 2.4rem;
  padding: 0.08rem;
  box-sizing: border-box;
  border: 0.02rem solid #6793da;
  border-radius: 0.2rem;
  background: rgba(255, 255, 255, 0.98);
  box-shadow: 0 0.08rem 0.24rem rgba(61, 100, 164, 0.22);
  overflow-y: auto;
  display: none;
  z-index: 3;
}

.role-change-dropdown.is-show {
  display: block;
}

.role-change-option {
  width: 100%;
  min-height: 0.56rem;
  padding: 0.12rem 0.18rem;
  border: 0;
  border-radius: 0.14rem;
  background: transparent;
  color: #4f76b2;
  font-size: 0.25rem;
  line-height: 0.32rem;
  text-align: left;
}

.role-change-option + .role-change-option {
  margin-top: 0.04rem;
}

.role-change-option.is-empty {
  color: #8da4c9;
}

.role-change-confirm {
  position: absolute;
  left: 50%;
  bottom: 1.4rem;
  transform: translateX(-50%);
  width: 2.28rem;
  height: 0.76rem;
}

.pop-no-role {
  position: relative;
  width: 7.43rem;
  height: 6.22rem;
  background: url("/custom/img/act/act260709/pop-no-role.png") no-repeat
    center top;
  background-size: 100% 100%;
}

.pop-no-role .pop-close {
  right: 0.38rem;
  top: 0.74rem;
  width: 0.64rem;
  height: 0.64rem;
}

.pop-no-role-submit {
  position: absolute;
  left: 50%;
  bottom: 0.8rem;
  transform: translateX(-50%);
  width: 2.52rem;
  height: 0.82rem;
}

.pop-fight-continue {
  width: 7.43rem;
  height: 7.23rem;
  padding: 0.42rem 0.34rem 0.3rem;
  box-sizing: border-box;
  position: relative;
  background: url("/custom/img/act/act260709/pop-fight-continue.png") no-repeat
    center top;
  background-size: 100% 100%;
}

.pop-fight-continue .pop-close {
  right: 0.06rem;
  top: 0.02rem;
  width: 0.84rem;
  height: 0.84rem;
}

.fight-continue-actions {
  margin-top: 4.2rem;
  display: flex;
  justify-content: center;
  gap: 0.14rem;
}

.fight-continue-btn {
  width: 2.34rem;
  height: 0.76rem;
  border-radius: 0.38rem;
  font-size: 0.3rem;
  font-weight: bold;
  line-height: 0.72rem;
  text-align: center;
  box-sizing: border-box;
}

.pop-next-level {
  width: 7.43rem;
  height: 7.23rem;
  padding: 0.42rem 0.34rem 0.3rem;
  box-sizing: border-box;
  position: relative;
  background: url("/custom/img/act/act260709/pop-next-level.png") no-repeat
    center top;
  background-size: 100% 100%;
}

.pop-next-level .pop-close {
  right: 0.06rem;
  top: 0.02rem;
  width: 0.84rem;
  height: 0.84rem;
}

.next-level-actions {
  margin-top: 3.6rem;
  display: flex;
  justify-content: center;
  gap: 0.14rem;
}

.next-level-btn {
  width: 2.34rem;
  height: 0.76rem;
  border-radius: 0.38rem;
  font-size: 0.3rem;
  font-weight: bold;
  line-height: 0.72rem;
  text-align: center;
  box-sizing: border-box;
}

.pop-third-level {
  width: 7.18rem;
  height: 3.88rem;
  position: relative;
  box-sizing: border-box;
  border: 0.04rem solid #7aa4d4;
  background:
    radial-gradient(circle at 13% 18%, rgba(179, 236, 255, 0.72), transparent 31%),
    radial-gradient(circle at 88% 76%, rgba(255, 255, 255, 0.82), transparent 28%),
    linear-gradient(180deg, #dff2ff 0%, #d5e9f9 100%);
  box-shadow:
    inset 0 0 0 0.03rem rgba(255, 255, 255, 0.85),
    inset 0 0 0.22rem rgba(85, 153, 214, 0.18);
}

.pop-third-level::before,
.pop-third-level::after {
  content: "";
  position: absolute;
  inset: 0.08rem;
  border: 0.02rem solid rgba(116, 162, 211, 0.62);
  pointer-events: none;
}

.pop-third-level::after {
  inset: 0.18rem;
  border-color: rgba(255, 255, 255, 0.68);
}

.pop-third-level-text {
  position: absolute;
  left: 0.42rem;
  right: 0.42rem;
  top: 1.25rem;
  color: #17498f;
  font-size: 0.34rem;
  font-weight: bold;
  line-height: 0.48rem;
  letter-spacing: 0;
  text-align: center;
}

.pop-third-level-btn {
  position: absolute;
  left: 50%;
  bottom: 0.38rem;
  transform: translateX(-50%);
  width: 2.72rem;
  height: 0.86rem;
  border-radius: 0.43rem;
  background:
    linear-gradient(180deg, #2494e8 0%, #0a68be 100%);
  border: 0.03rem solid #f2be80;
  box-shadow:
    inset 0 0.05rem 0.08rem rgba(255, 255, 255, 0.42),
    0 0.06rem 0 rgba(18, 85, 160, 0.35);
}

.pop-third-level-btn::before {
  content: "开始探索";
  color: #ffffff;
  font-size: 0.38rem;
  font-weight: bold;
  line-height: 0.8rem;
  letter-spacing: 0;
  text-align: center;
  display: block;
}

.pop-fail {
  width: 7.39rem;
  height: 7.23rem;
  position: relative;
  background: url("/custom/img/act/act260709/pop-fail.png");
  background-size: 100% 100%;
}

.pop-fail .pop-close {
  right: 0.06rem;
  top: 0.02rem;
  width: 0.84rem;
  height: 0.84rem;
}

.pop-fail-time {
  color: #ca3330;
  font-size: 0.4rem;
  position: absolute;
  left: 3.6rem;
  top: 3.45rem;
  width: 0.6rem;
  text-align: center;
}

.pop-fail-actions {
  position: absolute;
  top: 4.7rem;
  left: 1.3rem;
}

.pop-fail-btn {
  width: 2.34rem;
  height: 0.76rem;
  border-radius: 0.38rem;
  box-sizing: border-box;
}

.pop-fail-report {
  width: 7.39rem;
  height: 12.7rem;
  position: relative;
  background: url("/custom/img/act/act260709/pop-fail-report.png") no-repeat
    center top;
  background-size: 100% 100%;
}

.pop-fail-report .pop-close {
  right: 0.1rem;
  top: 0.16rem;
  width: 0.84rem;
  height: 0.84rem;
}

.pop-fail-report-back {
  position: absolute;
  left: 0.22rem;
  top: -0.2rem;
  width: 0.97rem;
  height: 0.81rem;
  background: url("/custom/img/act/act260709/btn-back.png") no-repeat center;
  background-size: 100% 100%;
}

.pop-fail-report-summary {
  position: absolute;
  left: 0.84rem;
  top: 6.26rem;
  width: 5.4rem;
  min-height: 3.62rem;
  padding: 0.26rem 0.58rem 0.22rem;
  box-sizing: border-box;
  background: rgba(220, 236, 250, 0.62);
  border: 0.02rem solid rgba(177, 216, 247, 0.88);
}

.pop-fail-report-row,
.pop-fail-report-score-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.pop-fail-report-row + .pop-fail-report-row {
  margin-top: 0.1rem;
}

.pop-fail-report-label,
.pop-fail-report-score-label {
  color: #204f98;
  font-size: 0.32rem;
  font-weight: bold;
  line-height: 0.48rem;
}

.pop-fail-report-value {
  min-width: 1.2rem;
  color: #204f98;
  font-size: 0.32rem;
  line-height: 0.48rem;
  text-align: right;
}

.pop-fail-report-score-row {
  margin-top: 0.34rem;
  padding-top: 0.32rem;
  border-top: 0.02rem solid rgba(196, 208, 225, 0.92);
}

.pop-fail-report-score-label {
  font-size: 0.48rem;
  line-height: 0.6rem;
}

.pop-fail-report-score-value {
  min-width: 1.2rem;
  color: #e4556f;
  font-size: 0.52rem;
  font-weight: bold;
  line-height: 0.6rem;
  text-align: right;
}

.pop-fail-report-actions {
  position: absolute;
  left: 0.72rem;
  bottom: 1.4rem;
  width: 5.64rem;
  display: flex;
  justify-content: space-between;
}

.pop-fail-report-btn {
  width: 2.52rem;
  height: 0.78rem;
  border-radius: 0.38rem;
  box-sizing: border-box;
  background: transparent;
}

.pop-success {
  width: 7.39rem;
  height: 7.23rem;
  position: relative;
  background: url("/custom/img/act/act260709/pop-success.png") no-repeat center
    top;
  background-size: 100% 100%;
}

.pop-success .pop-close {
  right: 0.06rem;
  top: 0.02rem;
  width: 0.84rem;
  height: 0.84rem;
}

.pop-success-value {
  position: absolute;
  left: 4.9rem;
  top: 3.62rem;
  min-width: 0.7rem;
  color: #d94235;
  font-size: 0.42rem;
  font-weight: bold;
  line-height: 0.46rem;
  text-align: center;
}

.pop-success-actions {
  position: absolute;
  left: 50%;
  top: 4.88rem;
  transform: translateX(-50%);
}

.pop-success-btn {
  width: 2.34rem;
  height: 0.76rem;
  border-radius: 0.38rem;
  box-sizing: border-box;
}

.pop-success-report {
  width: 7.39rem;
  height: 12.7rem;
  position: relative;
  background: url("/custom/img/act/act260709/pop-success-report.png") no-repeat
    center top;
  background-size: 100% 100%;
}

.pop-success-report-summary {
  position: absolute;
  left: 0.76rem;
  top: 6.38rem;
  width: 5.76rem;
  min-height: 3.5rem;
  padding: 0.2rem 0.62rem 0.2rem;
  box-sizing: border-box;
  background: rgba(220, 236, 250, 0.62);
  border: 0.02rem solid rgba(177, 216, 247, 0.88);
}

.pop-success-report-row,
.pop-success-report-score-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.pop-success-report-row + .pop-success-report-row {
  margin-top: 0.1rem;
}

.pop-success-report-label,
.pop-success-report-score-label {
  color: #204f98;
  font-size: 0.32rem;
  font-weight: bold;
  line-height: 0.48rem;
}

.pop-success-report-value {
  min-width: 1.2rem;
  color: #204f98;
  font-size: 0.32rem;
  line-height: 0.48rem;
  text-align: right;
}

.pop-success-report-score-row {
  margin-top: 0.24rem;
  padding-top: 0.22rem;
  border-top: 0.02rem solid rgba(196, 208, 225, 0.92);
}

.pop-success-report-score-label {
  font-size: 0.48rem;
  line-height: 0.6rem;
}

.pop-success-report-score-value {
  min-width: 1.2rem;
  color: #e4556f;
  font-size: 0.52rem;
  font-weight: bold;
  line-height: 0.6rem;
  text-align: right;
}

.pop-success-report-actions {
  position: absolute;
  left: 0.72rem;
  bottom: 1.4rem;
  width: 5.64rem;
  display: flex;
  justify-content: space-between;
}

.pop-success-report-btn {
  width: 2.52rem;
  height: 0.78rem;
  border-radius: 0.38rem;
  box-sizing: border-box;
  background: transparent;
}

.pop-random,
.event-random,
.event-random-02,
.event-enemy,
.event-enemy-02,
.event-inn {
  width: 5.76rem;
  height: 3.18rem;
  position: relative;
  background-size: 100% 100%;
}

.pop-random,
.event-random {
  width: 6.27rem;
  height: 6.95rem;
  background: url("/custom/img/act/act260709/event-random.png") no-repeat center;
  background-size: 100% 100%;
}

.event-random-02 {
  width: 6.1rem;
  height: 6.69rem;
  background: url("/custom/img/act/act260709/event-random-02.png") no-repeat
    center;
  background-size: 100% 100%;
}

.event-random .pop-random-title,
.event-random-02 .pop-random-title {
  top: 3.9rem;
}
.event-random .pop-random-message,
.event-random-02 .pop-random-message {
  top: 4.5rem;
}

.event-enemy {
  width: 6.27rem;
  height: 6.95rem;
  background: url("/custom/img/act/act260709/event-enemy.png") no-repeat center;
  background-size: 100% 100%;
}

.event-enemy-02 {
  width: 6.55rem;
  height: 6.34rem;
  background: url("/custom/img/act/act260709/event-enemy-02.png") no-repeat
    center;
  background-size: 100% 100%;
}

.event-enemy .pop-random-title{
  top: 3.95rem;
}
.event-enemy-02 .pop-random-title {
  top: 3.45rem;
}
.event-enemy .pop-random-message{
  top: 4.7rem;
}
.event-enemy-02 .pop-random-message {
  top: 4.2rem;
}

.event-inn {
  width: 5.76rem;
  height: 3.21rem;
  background: url("/custom/img/act/act260709/event-inn.png") no-repeat center;
  background-size: 100% 100%;
}

.event-inn .pop-random-title {
  top: 3.9rem;
}
.event-inn .pop-random-message {
  top: 2.2rem;
}

.pop-random .pop-close,
.event-enemy .pop-close,
.event-enemy-02 .pop-close,
.event-inn .pop-close {
  right: 0.08rem;
  top: 0.08rem;
  width: 0.52rem;
  height: 0.52rem;
}

.pop-random-title {
  position: absolute;
  left: 0.46rem;
  top: 0.2rem;
  width: 4.82rem;
  color: #2f5299;
  font-size: 0.34rem;
  font-weight: bold;
  line-height: 0.42rem;
  text-align: center;
}

.pop-random-message {
  position: absolute;
  left: 0.46rem;
  top: 1.04rem;
  width: 4.82rem;
  min-height: 0.72rem;
  color: #2f5299;
  font-size: 0.24rem;
  line-height: 0.36rem;
  text-align: center;
  /*display: flex;*/
  /*align-items: center;*/
  /*justify-content: center;*/
}

.pop-random-confirm {
  position: absolute;
  left: 50%;
  bottom: 0.26rem;
  transform: translateX(-50%);
  width: 2.7rem;
  height: 0.8rem;
}

.event-tips {
  position: fixed;
  left: 50%;
  top: 4rem;
  transform: translateX(-50%);
  width: 7.18rem;
  height: 0.82rem;
  display: none;
  z-index: 10030;
  background: url("/custom/img/act/act260709/event-tips.png") no-repeat center;
  background-size: 100% 100%;
}

.event-tips.is-show {
  display: flex;
  align-items: center;
  justify-content: center;
}

.event-tips-message {
  width: 6.2rem;
  box-sizing: border-box;
  font-size: 0.24rem;
  font-weight: bold;
  line-height: 0.4rem;
  max-height: 0.8rem;
  overflow: hidden;
  text-align: center;
  white-space: normal;
  overflow-wrap: break-word;
  color: #14438a;
}

.event-tips-delta.is-positive {
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
  color: #8bffc8;
}

.event-tips-delta.is-negative {
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
  color: #ff8c8c;
}

.event-tips-hp {
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
  color: #ff8c8c;
}

.pop-share {
  width: 6rem;
  position: relative;
}

.pop-share .pop-close {
  right: -0.18rem;
  top: -1.1rem;
  width: 0.84rem;
  height: 0.84rem;
  z-index: 2;
}
.pop-share-close {
  width: 0.57rem;
  height: 0.56rem;
  background: url("/custom/img/act/act260709/pop-share-close.png") no-repeat
    center top;
  background-size: 100% 100%;
}

.pop-share-poster {
  position: relative;
  width: 6rem;
  height: 10.18rem;
  background: url("/custom/img/act/act260709/share-pg.png") no-repeat center top;
  background-size: 100% 100%;
  box-sizing: border-box;
  border: 0.03rem solid rgba(158, 232, 255, 0.92);
  box-shadow: 0 0 0 0.02rem rgba(255, 255, 255, 0.22) inset,
    0 0.16rem 0.48rem rgba(3, 16, 37, 0.34);
  cursor: pointer;
}

.pop-share-poster.is-composed {
  background: none;
}

.pop-share-poster-image {
  display: none;
  width: 100%;
  height: 100%;
}

.pop-share-poster.is-composed .pop-share-poster-image {
  display: block;
}

.pop-share-poster.is-composed .pop-share-qrcode {
  display: none;
}

.pop-share-qrcode {
  position: absolute;
  left: 50%;
  top: 8.6rem;
  width: 1.94rem;
  height: 1.94rem;
  transform: translateX(-50%);
  border: 0.04rem solid #d7bd70;
  box-sizing: border-box;
  background: linear-gradient(
    180deg,
    rgba(18, 32, 62, 0.78) 0%,
    rgba(73, 72, 70, 0.78) 100%
  );
  display: flex;
  align-items: center;
  justify-content: center;
  color: rgba(255, 255, 255, 0.72);
  font-size: 0.24rem;
  line-height: 0.3rem;
}

.pop-share-qrcode img {
  display: block;
  width: 100%;
  height: 100%;
}

.pop-share-hint {
  margin-top: 0.16rem;
  color: #ffffff;
  font-size: 0.26rem;
  line-height: 0.34rem;
  text-align: center;
  text-shadow: 0 0.04rem 0.1rem rgba(0, 0, 0, 0.35);
  font-weight: bold;
}

@keyframes musicSpin {
  from {
    transform: rotate(0deg);
  }

  to {
    transform: rotate(360deg);
  }
}

.pop-point-rule {
  width: 7.43rem;
  height: 7.23rem;
  background: url("/custom/img/act/act260709/pop-point-rule.png") no-repeat
    center top;
  background-size: 100% 100%;
}

.pop-egg-gift{
  width: 6.7rem;
  height: 6.57rem;
  background: url("/custom/img/act/act260709/pop-egg-box.png") no-repeat
  center top;
  background-size: 100% 100%;
}
.pop-random-close{
  top: 3.8rem!important;
  width: 0.6rem!important;
  height: 0.6rem!important;
  right: 0.5rem!important;
}
