html,
body {
  position: fixed;
  width: 100%;
  height: 100%;
  overflow: auto;
  background: #1d7064;
}

.stopScroll {
  overscroll-behavior: none;
  -webkit-overflow-scrolling: auto;
}

.ui-main {
  width: 100%;
  height: 100%;
  position: relative;
  background: #521c9e;
}

.ui-bg {
  width: 100%;
  height: auto;
  position: absolute;
  top: 0;
  font-size: 0;
}

.ui-bg picture {
  display: block;
}

.ui-bg img {
  width: 100%;
  height: auto;
  display: block;
  vertical-align: bottom;
  margin-bottom: -1px;
  pointer-events: none;
}

.ui-logo {
  position: absolute;
  font-size: 0;
  top: 0.16rem;
  left: 50%;
  transform: translateX(-50%);
}

.ui-logo img {
  width: 3.98rem;
}

.ui-content {
  text-align: center;
  top: 1.66rem;
  position: relative;
  font-size: 0;
  padding-bottom: 0.5rem;
}

.ui-nav {
  margin-bottom: 6.42rem;
}

.ui-nav > a {
  display: inline-block;
  vertical-align: middle;
  width: 2.2rem;
  height: 0.48rem;
  font-size: 0.28rem;
  color: #ffffff;
  line-height: 0.48rem;
  text-align: center;
  border-radius: 0.1rem;
  background: #256e78;
  border: 1px solid #23cea6;
  box-shadow: 0px 0px 0.1rem 0px #929fff;
}

/* .ui-text-one {
  width: 7.25rem;
  height: 2.28rem;
  margin: 0 auto 4.85rem;
  background: url(../images/bg_text_one.png) no-repeat;
  background-size: 100% 100%;
} */

.ui-game-logo > img {
  width: 1.98rem;
}

.ui-content > a {
  display: inline-block;
  width: 4.19rem;
  height: 1.23rem;
  margin-bottom: 0.54rem;
}

.ui-btn {
  background-color: #2ed556;
  background-image: linear-gradient(180deg, #4ef472 0%, #1db83d 100%);
  border-radius: 0.615rem;
  box-shadow: 0 0.08rem 0.15rem rgba(0, 0, 0, 0.3), inset 0 0.04rem 0.04rem rgba(255, 255, 255, 0.5);
  color: #0a4d22;
  font-size: 0.55rem;
  font-weight: 800;
  text-align: center;
  line-height: 1.15rem; /* adjusted for border */
  text-decoration: none;
  border: 0.04rem solid #7eff9a;
  box-sizing: border-box;
}

/* .ui-btn-apple {
  background: url(../images/btn_apple.png) no-repeat;
  background-size: 100% 100%;
} */

.ui-msg {
  position: fixed;
  display: flex;
  align-items: center;
  justify-content: center;
  top: 50%;
  left: 50%;
  width: 3.6rem;
  height: 1.4rem;
  color: #fff;
  text-align: center;
  font-size: 0.36rem;
  border-radius: 0.4rem;
  transform: translate(-50%, -50%);
  opacity: 0;
  z-index: 200;
  background: rgba(0, 0, 0, 0.8);
  transition: all 0.3s ease-in-out;
}

.ui-msg.active {
  opacity: 1;
}

.ui-intro {
  width: 6.68rem;
  height: 3.28rem;
  border-radius: 0.18rem;
  padding: 0.35rem 0.4rem 0.35rem 0.5rem;
  margin: 0 auto;
  text-align: left;
  background: #1b5c54;
  border: 1px solid #57ffa6;
  box-shadow: 0px 0px 0.1rem 0px #929fff;
}

.ui-textBox {
  font-size: 0.32rem;
  color: #ffffff;
}

.ui-textFirst {
  float: left;
  line-height: 1;
  font-size: 0.87rem;
  color: #ffffff;
  margin-right: 0.13rem;
}

.ui-paragraph {
  line-height: 1.6;
}

.ui-text-red {
  color: #ff5039;
}

.ui-text-blue {
  color: #57d2ff;
}

.ui-text-purple {
  color: #ff73f3;
}

.ui-text-yellow {
  color: #ffd83a;
}

.ui-footer {
  margin-top: 0.46rem;
}

.ui-footer-one > a {
  font-size: 0.28rem;
  color: #ffff00;
  padding-bottom: 0.1rem;
  border-bottom: 2px solid #ffff00;
}

.ui-footer-icon {
  font-size: 0;
  text-align: center;
  margin: 0.69rem 0 0;
}

.ui-footer-icon > img:first-child {
  width: 2.42rem;
}

.ui-footer-icon > img:nth-child(2) {
  width: 0.72rem;
  margin: 0 0.25rem;
}

.ui-footer-icon > img:nth-child(3) {
  width: 3.02rem;
}

.ui-footer-three {
  font-size: 0.26rem;
  color: #3eb5a4;
  margin-top: 0.35rem;
}

/* 兜底：弹窗一律默认隐藏，只有 openModal() 里显式 display:block 才出现。
   曾经出现过「一进页面就弹免责声明且关不掉」，根因是某个弹窗类漏了隐藏规则，
   于是它带着 position:fixed 直接铺在页面上。 */
.ui-modal,
.ui-policy-modal {
  display: none;
}

.ui-modal {
  position: fixed;
  width: 7rem;
  height: 10.32rem;
  left: 50%;
  top: 50%;
  z-index: 100;
  border-radius: 0.2rem;
  transform: translate(-50%, -50%);
  background: rgba(25 83 76/ 90%);
}

.ui-about {
  display: none;
}

.ui-btn-close {
  position: absolute;
  top: -0.04rem;
  right: 0.32rem;
  width: 0.74rem;
  height: 0.77rem;
  background: url(../images/btn_close.png) no-repeat;
  background-size: 100% 100%;
}

.ui-about-title {
  font-weight: 900;
  font-size: 0.56rem;
  color: #4deee8;
  text-align: center;
  margin: 0.2rem auto 0.5rem;
}

.ui-about-imgbox {
  width: 6.2rem;
  margin: 0 auto;
}

.ui-about-imgbox > img {
  width: 100%;
}

.ui-about-content {
  font-size: 0.28rem;
  color: #7dfffa;
  line-height: 1.7;
  padding: 0 0.5rem 0 0.72rem;
}

.ui-contact {
  display: none;
}

.ui-contact-title {
  font-weight: 900;
  color: #4deee8;
  font-size: 0.56rem;
  text-align: center;
  margin: 0.2rem auto 0.5rem;
}

.ui-contact-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.ui-contact-content > div {
  margin-bottom: 0.64rem;
}

.ui-title-email {
  width: 6.41rem;
  height: 0.48rem;
  background: url(../images/bg_email.png) no-repeat;
  background-size: 100% 100%;
}

.ui-title-telegram {
  width: 6.41rem;
  height: 0.48rem;
  background: url(../images/bg_telegram.png) no-repeat;
  background-size: 100% 100%;
}

.ui-title-contact-text {
  font-size: 0.28rem;
  color: #cfd9f5;
  text-align: center;
  margin: 0.12rem 0 0.16rem;
}

.ui-input-profile {
  font-size: 0;
  text-align: center;
  margin-bottom: 0.24rem;
}

.ui-contact-line {
  width: 6.44rem;
  height: 0.02rem;
  background: url(../images/contact_line.png) no-repeat;
  background-size: 100% 100%;
  margin: 0 auto;
}

.ui-contact-content > div > a {
  display: block;
  width: 1.6rem;
  height: 0.69rem;
  margin: 0 auto;
  background: url(../images/btn_copy.png) no-repeat;
  background-size: 100% 100%;
}

.ui-input-profile > span {
  font-size: 0.28rem;
  color: #3dd5e5;
}

.ui-policy-modal {
  position: fixed;
  display: none;
  width: 7rem;
  height: 10.82rem;
  left: 50%;
  top: 50%;
  z-index: 100;
  border-radius: 0.2rem;
  transform: translate(-50%, -50%);
  background: rgba(25 83 76/ 90%);
}

.ui-policy-title {
  font-weight: 900;
  font-size: 0.56rem;
  color: #4deee8;
  text-align: center;
  margin: 0.2rem auto 0.5rem;
}

.ui-policy-content {
  padding: 0 0.5rem;
}

.ui-policy-content > div {
  margin-bottom: 0.5rem;
}

.ui-content-title {
  font-size: 0.24rem;
  font-weight: bold;
  color: #57d2ff;
  margin-bottom: 0.2rem;
}

.ui-content-text {
  font-size: 0.22rem;
  color: #7dfffa;
}

.ui-mask {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: none;
  background: rgba(0, 0, 0, 0.7);
}

/* ---------- 下载说明 / 客服 / 适龄提示 / FAQ ---------- */
.ui-info {
  width: 6.68rem;
  margin: 0.26rem auto 0;
  text-align: left;
}

.ui-info-card {
  padding: 0.26rem 0.32rem;
  margin-bottom: 0.2rem;
  border-radius: 0.18rem;
  border: 1px solid rgba(87, 255, 166, 0.45);
  background: #1b5c54;
}

.ui-info-card > h2 {
  margin: 0 0 0.14rem;
  font-size: 0.3rem;
  font-weight: 700;
  color: #4deee8;
}

.ui-info-card dl {
  margin: 0;
}

.ui-info-card dt {
  margin-top: 0.16rem;
  font-size: 0.26rem;
  font-weight: 700;
  color: #ffd83a;
}

.ui-info-card dt:first-child {
  margin-top: 0;
}

.ui-info-card dd {
  margin: 0.05rem 0 0;
  font-size: 0.25rem;
  line-height: 1.62;
  color: #d6f5f1;
}

.ui-info-card p {
  margin: 0 0 0.08rem;
  font-size: 0.25rem;
  line-height: 1.62;
  color: #d6f5f1;
}

.ui-info-card p.ui-info-strong {
  font-size: 0.26rem;
  font-weight: 700;
  color: #4deee8;
  word-break: break-all;
}

.ui-faq {
  width: 6.68rem;
  margin: 0 auto;
  padding: 0.26rem 0.32rem;
  border-radius: 0.18rem;
  border: 1px solid rgba(87, 255, 166, 0.45);
  background: #1b5c54;
  text-align: left;
  box-sizing: border-box;
}

.ui-faq > h2 {
  margin: 0 0 0.14rem;
  font-size: 0.3rem;
  font-weight: 700;
  color: #4deee8;
}

.ui-faq details {
  padding: 0.16rem 0;
  border-top: 1px solid rgba(87, 255, 166, 0.18);
}

.ui-faq details:first-of-type {
  border-top: none;
  padding-top: 0;
}

.ui-faq summary {
  font-size: 0.26rem;
  font-weight: 700;
  color: #ffd83a;
  cursor: pointer;
  list-style: none;
}

.ui-faq summary::-webkit-details-marker {
  display: none;
}

.ui-faq summary::before {
  content: "+ ";
  color: #4deee8;
}

.ui-faq details[open] summary::before {
  content: "- ";
}

.ui-faq p {
  margin: 0.1rem 0 0;
  font-size: 0.25rem;
  line-height: 1.62;
  color: #d6f5f1;
}

.ui-footer-links {
  margin-top: 0.2rem;
  font-size: 0.24rem;
  color: #a093ff;
}

.ui-footer-links a {
  color: #a093ff;
  text-decoration: none;
  margin: 0 0.12rem;
}

/* 法务弹窗内容较长，内容区独立滚动 */
.ui-modal-content {
  height: 100%;
  overflow-y: auto;
  box-sizing: border-box;
}

/* 适龄标识：样式绘制，替代原 bg_warning.png（含 CADPA 标识且文字不可本地化） */
.ui-footer-two {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.16rem;
  padding: 0 0.35rem;
}

.ui-age-badge {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 0.86rem;
  height: 0.86rem;
  border-radius: 0.16rem;
  background: #7c5cff;
  color: #ffffff;
  font-size: 0.3rem;
  font-weight: 800;
}

.ui-age-text {
  margin: 0;
  font-size: 0.24rem;
  line-height: 1.5;
  color: #a093ff;
  text-align: left;
}

.ui-age-strong {
  color: #ffffff;
  font-weight: 700;
}


.ui-ver {
  margin-left: 0.1rem;
  font-size: 0.22rem;
  font-weight: 400;
  color: #4deee8;
}