@charset "utf-8";
:root {
  --z-stage: 0;
  --z-map-items: 10;
  --z-controls: 20;
  --z-mask: 1000;
  --z-modal: 1010;
  --z-dialog: 1020;
  --z-system-dialog: 1100;
  --z-system: 2000;
  --z-activity-closed: 2900;
  --z-page-loading: 3000;
}
html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  font-size: 100%;
}
body,
dl,
dd,
ul,
ol,
h1,
h2,
h3,
h4,
h5,
h6,
p,
form,
header,
section,
article,
footer {
  margin: 0;
}
@font-face {
  font-family: "fz";
  src: url("./fz.ttf") format("truetype");
  font-style: normal;
  font-weight: normal;
  font-display: swap;
}
html,
body,
body *,
body *::before,
body *::after {
  font-family: "fz", sans-serif;
}
body,
button,
input,
select,
textarea {
  font: 0.12rem/1.5 "fz", sans-serif;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: 100%;
}
em,
b {
  font-style: normal;
}
a {
  text-decoration: none;
}
a:hover {
  text-decoration: underline;
}
img {
  border: 0;
  display: block;
  width: 100%;
  height: 100%;
}
body {
  position: relative;
  overflow-x: hidden;
  background:
    radial-gradient(
      circle at top,
      rgba(255, 243, 207, 0.16),
      rgba(0, 0, 0, 0) 65%
    ),
    linear-gradient(180deg, rgba(28, 17, 6, 0.96), rgba(10, 7, 2, 0.98));
  scrollbar-width: thin;
  scrollbar-color: #81501d #d7b27d;
}
#app {
  position: relative;
  width: 100%;
  min-width: 0;
  overflow-x: hidden;
}
* {
  scrollbar-width: thin;
  scrollbar-color: #81501d #d7b27d;
}
*::-webkit-scrollbar {
  width: 0.06rem;
  height: 0.06rem;
}
*::-webkit-scrollbar-track {
  background: #d7b27d;
  border-radius: 9.99rem;
}
*::-webkit-scrollbar-thumb {
  background: #81501d;
  border-radius: 9.99rem;
}
*::-webkit-scrollbar-thumb:hover {
  background: #94602b;
}
body.page-loading-lock {
  overflow: hidden;
}
.page-loading {
  position: fixed;
  inset: 0;
  z-index: var(--z-page-loading);
  display: flex;
  align-items: center;
  justify-content: center;
  background:
    radial-gradient(
      circle at top,
      rgba(255, 243, 207, 0.28),
      rgba(0, 0, 0, 0) 45%
    ),
    linear-gradient(180deg, rgba(28, 17, 6, 0.96), rgba(10, 7, 2, 0.98));
  transition:
    opacity 0.45s ease,
    visibility 0.45s ease;
}
.page-loading.is-hidden {
  opacity: 0;
  visibility: hidden;
}
.page-loading-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.18rem;
  width: 3.2rem;
  padding: 0.34rem 0.3rem 0.28rem;
  /* border: 0.01rem solid rgba(255, 222, 170, 0.28);
  background: rgba(60, 37, 11, 0.5);
  box-shadow: 0 0 0.6rem rgba(0, 0, 0, 0.35); */
}
.page-loading-logo {
  width: 1.82rem;
  height: 0.72rem;
  display: block;
  background: url(https://static.web.sdo.com/chd/pic/web7/images/home-logo.png)
    no-repeat center / contain;
  animation: pageLoadingPulse 1.8s ease-in-out infinite;
}
.page-loading-percent {
  font-family: "fz";
  font-size: 0.48rem;
  line-height: 1;
  color: #f6d08a;
  text-shadow: 0 0 0.12rem rgba(246, 208, 138, 0.38);
  letter-spacing: 0.01rem;
}
.page-loading-track {
  width: 100%;
  height: 0.1rem;
  overflow: hidden;
  border-radius: 9.99rem;
  background: rgba(255, 232, 191, 0.18);
  border: 0.01rem solid rgba(255, 225, 160, 0.22);
}
.page-loading-bar {
  display: block;
  height: 100%;
  width: 0%;
  border-radius: inherit;
  background: linear-gradient(90deg, #8f4f15, #d9a14d, #f6d08a);
  box-shadow: 0 0 0.1rem rgba(246, 208, 138, 0.45);
  transition: width 0.12s linear;
}
.activity-closed-mask {
  position: fixed;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: var(--z-activity-closed);
  background: #f5f6f8;
  color: #444;
  font-family: "fz", sans-serif;
}
.activity-closed-mask-inner {
  padding: 0.4rem;
  font-size: 0.22rem;
  text-align: center;
}
.lottery-empty {
  padding: 0.2rem;
  color: #5c1f05;
  text-align: center;
}
.page-loading-text {
  margin: 0;
  color: #e8c98a;
  font-size: 0.14rem;
  letter-spacing: 0.01rem;
}
@keyframes pageLoadingPulse {
  0%,
  100% {
    transform: scale(1);
    filter: brightness(1);
  }
  50% {
    transform: scale(1.03);
    filter: brightness(1.08);
  }
}
.wrap {
  position: relative;
  z-index: var(--z-stage);
}
.cover {
  position: fixed;
  inset: 0;
  z-index: var(--z-mask);
  background: rgba(0, 0, 0, 0.55);
  pointer-events: auto;
}
.lottery-interaction-lock {
  position: fixed;
  inset: 0;
  z-index: var(--z-system);
  pointer-events: auto;
  touch-action: none;
}
button,
input,
select,
textarea {
  font-size: 100%;
  outline: none;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}
li {
  list-style: none outside none;
}
td,
th,
ul,
ol {
  padding: 0;
}
input,
select,
textarea {
  padding: 0;
  margin: 0;
}
table {
  width: 100%;
  border-collapse: collapse;
  border-spacing: 0;
}
td,
th,
ul,
ol {
  padding: 0;
}
.clearfix:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}
.clearfix {
  display: flex;
  zoom: 1;
}
a:hover {
  text-decoration: none;
  filter: brightness(1.1);
}
.wrap {
  position: relative;
  left: 50%;
  margin: 0 0 0 -12.8rem;
  width: 25.6rem;
  height: 28.8rem;
  background: url(https://static.web.sdo.com/chd/pic/pro2026/Chicas/hero-background.jpg?v=14) no-repeat 0 0;
  background-size: 25.6rem 28.8rem;
}
.login-on {
  position: absolute;
  top: 15.5rem;
  left: 49.5%;
  transform: translateX(-50%);
  color: #5c1f05;
  z-index: calc(var(--z-controls) + 1);
  width: 11.1rem;
  pointer-events: auto;
  user-select: text;
  -webkit-user-select: text;
}
.login-on-inner {
  width: 100%;
  padding: 0.04rem 0.2rem;
  border-radius: 0.17rem;
  background: rgb(243 220 168 / 60%);
  font-size: 0.23rem;
  letter-spacing: 0.002rem;
  box-sizing: border-box;
  user-select: text;
  -webkit-user-select: text;
}
.login-on-account {
  color: #8b3d05;
  font-weight: bold;
}
.login-on #dqnum,
.login-on #mapnum,
.login-on #hlq {
  color: #b5450d;
  font-weight: bold;
}
.login-on a {
  color: #8f3400;
  font-weight: bold;
  text-decoration: none;
  border-bottom: 0.01rem solid rgba(143, 52, 0, 0.55);
}
.login-on a:hover {
  color: #c24f10;
  border-bottom-color: rgba(194, 79, 16, 0.75);
}
.btn-area a {
  display: block;
  position: absolute;
}
.btn-area {
  position: relative;
  z-index: var(--z-controls);
  width: 25.6rem;
  height: 28.8rem;
}
.btn-area a,
.login-btn,
.refresh-btn,
.btn-save,
#mypop .order-btn,
.order-btn-common,
.bigPop .close,
.common-pop .close,
.layout-pages a {
  transition:
    transform 0.18s ease,
    filter 0.18s ease,
    box-shadow 0.18s ease,
    opacity 0.18s ease,
    background-position 0.18s ease;
  transform-origin: center;
  will-change: transform, filter;
}
.btn-area .btn1 {
  top: 15.99rem;
  left: 16.1rem;
  width: 1.93rem;
  height: 0.61rem;
  text-indent: -999em;
}
.btn-area .btn2 {
  top: 25.47rem;
  left: 10.77rem;
  width: 3.44rem;
  height: 1.21rem;
  text-indent: -999em;
}
.btn-area .btn3 {
  top: 25.74rem;
  left: 7.42rem;
  width: 2.62rem;
  height: 0.91rem;
  text-indent: -999em;
}
.btn-area .btn4 {
  top: 25.7rem;
  left: 14.93rem;
  width: 2.62rem;
  height: 0.91rem;
  text-indent: -999em;
}
.btn-area .btn5 {
  top: 27.94rem;
  left: 10.49rem;
  width: 1.53rem;
  height: 0.43rem;
  text-indent: -999em;
}
.btn-area .btn6 {
  top: 27.94rem;
  left: 12.89rem;
  width: 1.53rem;
  height: 0.43rem;
  text-indent: -999em;
}
.btn-area .btn-art,
.login-btn-art {
  position: absolute;
  inset: 0;
  display: block;
  background-repeat: no-repeat;
}
.btn-area .btn-label {
  position: relative;
  z-index: 1;
  display: block;
}
.btn-area .btn1 .btn-art {
  inset: 0 auto 0 0;
  width: 2rem;
  background-image: url(https://static.web.sdo.com/chd/pic/pro2026/Chicas/my-items-button.png);
  background-size: 1.93rem 0.61rem;
}
.btn-area .btn2 .btn-art {
  background-image: url(https://static.web.sdo.com/chd/pic/pro2026/Chicas/treasure-hunt-button.png);
  background-size: 3.44rem 1.21rem;
}
.btn-area .btn3 .btn-art {
  background-image: url(https://static.web.sdo.com/chd/pic/pro2026/Chicas/rainbow-ticket-exchange-button.png);
  background-size: 2.62rem 0.91rem;
}
.btn-area .btn4 .btn-art {
  background-image: url(https://static.web.sdo.com/chd/pic/pro2026/Chicas/fragment-exchange-button.png);
  background-size: 2.62rem 0.91rem;
}
.btn-area .btn2.grey .btn-art,
.btn-area .btn3.grey .btn-art,
.btn-area .btn4.grey .btn-art {
  cursor: default;
  background-position: 0 bottom;
  filter: grayscale(1);
}
.btn-area .btn3,
.btn-area .btn4,
.btn-area .btn5,
.btn-area .btn6 {
  text-indent: 0;
  font-family: "fz", sans-serif;
  font-weight: bold;
  text-align: center;
  color: #713900;
  text-decoration: none;
}
.btn-area .btn1 {
  font-size: 0.26rem;
  line-height: 0.61rem;
}
.btn-area .btn2 {
  font-size: 0.56rem;
  line-height: 1.14rem;
}
.btn-area .bzqy-btn {
  top: 20.16rem;
  left: 50%;
  width: 3.78rem;
  height: 1.51rem;
  margin-left: -1.89rem;
  background: url(https://static.web.sdo.com/chd/pic/Chicas/images/bzqy_btn.png)
    no-repeat 0 0 / 3.78rem 1.51rem;
}
.btn-area .bzqy-btn.grey {
  filter: grayscale(1);
  cursor: default;
}
.btn-area .bzqy-btn.fortune-arrival-pending {
  opacity: 0;
  pointer-events: none;
}
.btn-area .bzqy-btn.fortune-arrival {
  z-index: 1;
}
.fortune-arrival-flare {
  position: absolute;
  z-index: 0;
  top: 19.38rem;
  left: 50%;
  width: 5.2rem;
  height: 2.9rem;
  margin-left: -2.6rem;
  pointer-events: none;
  opacity: 0;
  transform: translateY(0.12rem);
  animation: fortuneLocalReveal 1.8s cubic-bezier(0.16, 0.78, 0.2, 1) both;
}
.fortune-arrival-flare::before {
  position: absolute;
  top: 0.65rem;
  left: 50%;
  display: block;
  width: 2.2rem;
  height: 1.25rem;
  border-radius: 50%;
  background:
    radial-gradient(
      ellipse,
      rgba(255, 255, 238, 1) 0%,
      rgba(255, 248, 179, 0.96) 8%,
      rgba(255, 202, 49, 0.72) 28%,
      rgba(255, 159, 0, 0) 74%
    );
  opacity: 0;
  content: "";
  filter: blur(0.01rem);
  mix-blend-mode: screen;
  transform: translateX(-50%) scale(0.08);
  animation: fortuneLocalBurst 1.8s cubic-bezier(0.16, 0.78, 0.2, 1) both;
}
.fortune-arrival-flare::after {
  position: absolute;
  top: 0.88rem;
  left: -0.5rem;
  display: block;
  width: 1.15rem;
  height: 0.65rem;
  background: linear-gradient(
    105deg,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 221, 0.14) 25%,
    rgba(255, 255, 218, 0.98) 48%,
    rgba(255, 206, 51, 0.58) 63%,
    rgba(255, 255, 255, 0) 100%
  );
  opacity: 0;
  content: "";
  filter: blur(0.015rem);
  mix-blend-mode: screen;
  transform: skewX(-22deg) translateX(-1.1rem) scaleY(0.65);
  animation: fortuneLocalSweep 1.45s cubic-bezier(0.2, 0.7, 0.18, 1) 0.24s both;
}
@keyframes fortuneLocalReveal {
  0% {
    opacity: 0;
    transform: translateY(0.12rem) scale(0.7);
  }
  26% {
    opacity: 1;
  }
  68% {
    opacity: 0.92;
    transform: translateY(-0.02rem) scale(1.04);
  }
  100% {
    opacity: 0.68;
    transform: translateY(0) scale(1);
  }
}
@keyframes fortuneLocalBurst {
  0% {
    opacity: 0;
    transform: translateX(-50%) scale(0.08);
  }
  13% {
    opacity: 1;
  }
  37% {
    opacity: 0.92;
    transform: translateX(-50%) scale(0.76);
  }
  74% {
    opacity: 0.2;
    transform: translateX(-50%) scale(1.3);
  }
  100% {
    opacity: 0;
    transform: translateX(-50%) scale(1.65);
  }
}
@keyframes fortuneLocalSweep {
  0% {
    opacity: 0;
    transform: skewX(-22deg) translateX(-1.1rem) scaleY(0.65);
  }
  14% {
    opacity: 1;
  }
  68% {
    opacity: 0.86;
  }
  100% {
    opacity: 0;
    transform: skewX(-22deg) translateX(5.3rem) scaleY(1.2);
  }
}
@keyframes fortuneIdleFloat {
  0% {
    transform: translateY(0) scale(1);
  }
  100% {
    transform: translateY(-0.06rem) scale(1.045);
  }
}
@media (prefers-reduced-motion: reduce) {
  .fortune-arrival-flare,
  .btn-area .bzqy-btn.fortune-arrival:hover {
    animation: none;
  }
  .btn-area .bzqy-btn.fortune-arrival,
  .btn-area .bzqy-btn.fortune-arrival::before,
  .btn-area .bzqy-btn.fortune-arrival::after {
    animation: none;
  }
}
.btn-area .bzqy-btn.fortune-arrival {
  z-index: 1;
  overflow: visible;
  opacity: var(--fortune-button-opacity, 1);
  transform: translateY(var(--fortune-button-y, 0)) scale(var(--fortune-button-scale, 1));
  filter: brightness(var(--fortune-button-brightness, 1))
    saturate(var(--fortune-button-saturation, 1))
    drop-shadow(0 0 var(--fortune-button-shadow, 0.08rem) rgba(255, 184, 23, 0.58));
  animation: none;
  transition: none;
}
.btn-area .bzqy-btn.fortune-arrival::before,
.btn-area .bzqy-btn.fortune-arrival::after,
.fortune-arrival-flare::before,
.fortune-arrival-flare::after {
  display: none;
}
.btn-area .bzqy-btn.fortune-arrival.fortune-canvas-ready {
  animation: fortuneIdleFloat 1.15s ease-in-out infinite alternate;
}
.fortune-arrival-flare {
  position: fixed;
  inset: 0;
  z-index: 2;
  width: 100vw;
  height: 100vh;
  margin: 0;
  opacity: 1;
  transform: none;
  animation: none;
}
.fortune-arrival-canvas {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  pointer-events: none;
}
.btn-area .bzqy-btn.fortune-arrival:hover {
  filter: brightness(1.18) saturate(1.22)
    drop-shadow(0 0 0.18rem rgba(255, 202, 45, 0.92));
}
.btn-area .btn3,
.btn-area .btn4 {
  font-size: 0.29rem;
  line-height: 0.91rem;
}
.btn-area .btn5,
.btn-area .btn6 {
  color: #fff;
  font-size: 0.38rem;
  line-height: 0.43rem;
  white-space: nowrap;
  text-decoration: underline;
  text-decoration-thickness: 0.02rem;
  text-underline-offset: 0.04rem;
  text-shadow: 0 0 0.04rem rgba(0, 0, 0, 0.45);
}
.btn-area .btn5:hover,
.btn-area .btn6:hover {
  color: #fff;
  text-decoration: underline;
}

.order-btn.disabled {
  cursor: not-allowed;
  opacity: 0.55;
  filter: grayscale(1);
}
.lottery {
  position: absolute;
  top: 0;
  left: 0;
  z-index: var(--z-map-items);
  width: 25.6rem;
  height: 28.8rem;
}
.lottery-unit {
  position: absolute;
  width: 0.68rem;
  height: 0.68rem;
}
.lottery-unit .icon {
  position: relative;
  z-index: 1;
  width: 0.68rem;
  height: 0.68rem;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}
.lottery-unit .bg1 {
  position: absolute;
  top: -0.16rem;
  left: -0.32rem;
  z-index: 2;
  width: 1.3rem;
  height: 1.46rem;
  /* 直接复刻 Memory 的完整 bg1 sprite：框体、卷轴和状态都在同一张图内。 */
  background: url(https://static.web.sdo.com/chd/pic/Chicas/images/bg1.png)
    no-repeat 0 0;
  background-size: 2.6rem 2.92rem;
  transition:
    transform 0.22s ease,
    filter 0.22s ease;
}
.lottery-unit .ok {
  position: absolute;
  top: 0.16rem;
  left: 0.08rem;
  z-index: 3;
  width: 0.56rem;
  height: 0.56rem;
  display: none;
  background: url(https://static.web.sdo.com/chd/pic/Chicas/images/ok.png)
    no-repeat 0 0;
  background-size: 0.56rem 0.56rem;
}
.lottery-unit .bg1 .num {
  padding-top: 1rem;
  width: 1rem;
  margin: 0;
  margin-left: auto;
  margin-right: auto;
  color: #341306;
  font-size: 0.18rem;
  line-height: 0.23rem;
  text-align: center;
}
.lottery-unit.ignore .bg1 {
  background-position: right 0;
}
.lottery-unit.ignore .bg1 .num {
  color: #1b1b1b;
}
.lottery-unit .bg1.crown {
  background-position: 0 bottom;
}
.lottery-unit .bg1.crown .num {
  padding-top: 1.01rem;
}
.lottery-unit.ignore .bg1.crown {
  background-position: right bottom;
}
.lottery-unit.ignore .icon {
  filter: grayscale(100%);
  -webkit-filter: grayscale(100%);
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
}
.lottery-unit .bg2 {
  position: absolute;
  top: -0.7rem;
  left: -0.9rem;
  display: none;
  width: 2.54rem;
  height: 2.54rem;
  background: url(https://static.web.sdo.com/chd/pic/Chicas/images/bg2.png)
    no-repeat 0 0;
  background-size: 5.08rem 2.54rem;
  transform: scale(0.96);
  opacity: 0.88;
  transition:
    transform 0.22s ease,
    opacity 0.22s ease,
    filter 0.22s ease;
}
.lottery-unit.active .bg2,
.lottery-unit.ignore .bg2 {
  display: block;
}
.lottery-unit.ignore .bg2 {
  display: block;
  background-position: right 0;
}
.lottery-unit.ignore .ok {
  display: block;
}
.lottery.animating .lottery-unit {
  transition:
    transform 0.2s ease,
    filter 0.2s ease,
    opacity 0.2s ease;
}
.lottery.animating .lottery-unit:not(.active) {
  filter: brightness(0.92);
  opacity: 0.86;
}
.lottery-unit.active {
  z-index: 5;
}
.lottery-unit.active .icon {
  transform: translateY(-0.04rem) scale(1.08);
  filter: drop-shadow(0 0.1rem 0.16rem rgba(255, 189, 64, 0.45));
  transition:
    transform 0.18s ease,
    filter 0.18s ease;
}
.lottery-unit.active .bg1 {
  transform: translateY(-0.02rem) scale(1.06);
  filter: brightness(1.05);
}
.lottery-unit.active .bg2 {
  transform: scale(1.08);
  opacity: 1;
  filter: drop-shadow(0 0 0.16rem rgba(255, 214, 74, 0.8));
  animation: lotteryPulse 0.72s ease-in-out infinite alternate;
}

@keyframes lotteryPulse {
  0% {
    transform: scale(1.02);
    opacity: 0.88;
  }
  100% {
    transform: scale(1.1);
    opacity: 1;
  }
}
.lottery-unit-0 {
  top: 16.71rem;
  left: 10.21rem;
}
.lottery-unit-1 {
  top: 19.31rem;
  left: 9.31rem;
}
.lottery-unit-2 {
  top: 18.01rem;
  left: 14.93rem;
}
.lottery-unit-3 {
  top: 23.03rem;
  left: 14.61rem;
}
.lottery-unit-4 {
  top: 21.08rem;
  left: 8.87rem;
}
.lottery-unit-5 {
  top: 20.92rem;
  left: 11.07rem;
}
.lottery-unit-6 {
  top: 22.75rem;
  left: 11.34rem;
}
.lottery-unit-7 {
  top: 23.69rem;
  left: 12.59rem;
}
.lottery-unit-8 {
  top: 21.35rem;
  left: 13.63rem;
}
.lottery-unit-9 {
  top: 19.45rem;
  left: 13.37rem;
}
.lottery-unit-10 {
  top: 20.14rem;
  left: 15.17rem;
}
.lottery-unit-11 {
  top: 18.84rem;
  left: 11.34rem;
}
.bigPop {
  position: fixed;
  /* top: -3.64rem; */
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  opacity: 0;
  width: 7rem;
  height: 8.65rem;
  z-index: var(--z-modal);
  -webkit-transition: all 0.4s ease;
  -o-transition: all 0.4s ease;
  -moz-transition: all 0.4s ease;
  transform: translateY(-300%);
  transition: all 0.4s ease;
  background: url(https://static.web.sdo.com/chd/pic/Chicas/images/modal-bg.png)
    no-repeat;
}
.bigPop .cont {
  height: 100%;
}
.bigPop.show {
  display: block;
  transform: translateY(0);
  /* top: 3.64rem; */
  opacity: 1;
}
.bigPop .close {
  position: absolute;
  top: 0.48rem;
  right: 0.61rem;
  display: block;
  width: 0.22rem;
  height: 0.22rem;
  text-indent: -999em;
}

#rule .cont {
  font-family: "fz";
  color: #744918;
  font-size: 0.16rem;
  font-weight: bold;
  line-height: 0.36rem;
  box-sizing: border-box;
  padding: 0 0.61rem;
}

#rule .content {
  height: 7.25rem;
  overflow-y: auto;
}
#rule .cont h3 {
  font-size: 0.22rem;
  padding: 0 0 0.05rem 0;
  text-align: center;
}
#rule .cont ul {
  padding-inline-start: 0.4rem;
  margin-block-start: 0;
  margin-block-end: 0;
  padding-inline-start: 0.3rem;
}
#rule .cont ul li {
  padding: 0rem 0.08rem;
  line-height: 2;
  list-style: decimal;
}
#probability .cont h3 {
  font-family: "fz";
  font-size: 0.22rem;
  color: #744918;
  padding: 0.51rem 0 0.54rem 0;
  text-align: center;
  line-height: 0.36rem;
}
#probability .cont {
  max-height: 100%;
  overflow-y: auto;
  overflow-x: hidden;
}
.table1 {
  width: 5.08rem;
  margin: 0 auto;
  margin-bottom: 0.34rem;
}
.add-tips {
  height: 0.5rem;
  font-family: "fz";
  font-size: 0.16rem;
  color: #744918;
  text-align: center;
}
.table1 th,
.table1 td {
  font-family: "fz", sans-serif;
  font-size: 0.13rem;
  line-height: 0.44rem;
  color: #434343;
  text-align: center;
  background: url(https://static.web.sdo.com/chd/pic/Chicas/images/line.png)
    no-repeat 50% bottom;
}
.table1 th {
  font-weight: normal;
}
.table1 th.noline,
.table1 td.noline {
  background-image: none;
}
.refresh-btn {
  display: block;
  width: 1.04rem;
  height: 0.36rem;
  text-indent: -999em;
  margin: 0 auto;
  background: url(https://static.web.sdo.com/chd/pic/Chicas/images/refresh-btn.png)
    no-repeat;
}

#mypop .tab-nav {
  padding: 0.68rem 0 0.4rem 0;
}
#mypop .tab-nav ul {
  width: 3.44rem;
  margin: 0 auto;
}
#mypop .tab-nav ul li {
  float: left;
  width: 1.71rem;
  line-height: 0.43rem;
  text-align: center;
  font-family: "fz";
  font-size: 0.18rem;
  color: #b67d3d;
  font-weight: bold;
  border: solid 0.01rem #b07739;
}
#mypop .tab-nav ul li a {
  width: 100%;
  height: 100%;
  display: block;
  color: #b67d3d;
}
#mypop .tab-nav ul li.hov a {
  color: #fff;
}
#mypop .tab-nav ul li.hov {
  background: url(https://static.web.sdo.com/chd/pic/Chicas/images/tab-nav-hov.png)
    no-repeat;
}
.table2 {
  padding: 0 0.19rem;
  width: 5.48rem;
  margin: 0 auto;
  height: 4.32rem;
  overflow-y: scroll;
  overflow-x: hidden;
}
.table2 .th-bg {
  width: 1.36rem;
  line-height: 0.29rem;
  font-size: 0.18rem;
  font-family: "fz";
  text-align: center;
  margin: 0 auto;
  color: #fff;
  font-weight: bold;
  background: #b67b3c;
  border-radius: 0.07rem 0.07rem 0 0;
}
.table2 td {
  width: 1.37rem;
  font-family: "fz", sans-serif;
  line-height: 0.45rem;
  color: #434343;
  text-align: center;
  background: url(https://static.web.sdo.com/chd/pic/Chicas/images/line.png)
    repeat-x 0 bottom;
}
.table2 td div {
  width: 1.37rem;
  height: 0.45rem;
  vertical-align: middle;
  display: table-cell;
  text-align: center;
  line-height: 0.16rem;
  overflow: hidden;
}
.table2 td div p {
  width: 100%;
}
.table2.none {
  display: none;
}
#mypop .tips {
  text-align: center;
}
#mypop .mypop-cell-image {
  display: flex;
  align-items: center;
  justify-content: center;
}
#mypop .mypop-cell-image img {
  width: 0.4rem;
  height: 0.4rem;
  object-fit: cover;
}
#mypop .mypop-empty {
  width: 100%;
  height: 0.45rem;
  line-height: 0.45rem;
  color: #8f6a33;
}
/* .btn-primary {
  display: block;
  width: 0.58rem;
  height: 0.3rem;
  line-height: 0.3rem;
  font-size: 0.14rem;
  border-radius: 0.05rem;
  margin: 0 auto;
  color: #ffffff;
  text-align: center;
  text-decoration: none;
  text-shadow: 0 -0.01rem 0 rgba(0, 0, 0, 0.25);
  background-color: #006dcc;
  *background-color: #0044cc;
  background-image: -moz-linear-gradient(top, #0088cc, #0044cc);
  background-image: -webkit-gradient(
    linear,
    0 0,
    0 100%,
    from(#0088cc),
    to(#0044cc)
  );
  background-image: -webkit-linear-gradient(top, #0088cc, #0044cc);
  background-image: -o-linear-gradient(top, #0088cc, #0044cc);
  background-image: linear-gradient(to bottom, #0088cc, #0044cc);
  background-repeat: repeat-x;
  border-color: #0044cc #0044cc #002a80;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff0088cc', endColorstr='#ff0044cc', GradientType=0);
  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
} */
.login-btn {
  position: absolute;
  top: 15.75rem;
  left: 7.54rem;
  display: block;
  z-index: var(--z-controls);
  width: 1.69rem;
  height: 0.62rem;
  text-indent: -999em;
}
#fortune .fortune-cont {
  font-family: "fz";
  color: #744918;
  font-size: 0.17rem;
  font-weight: bold;
  line-height: 0.36rem;
  box-sizing: border-box;
  padding: 0 0.61rem;
  overflow-x: hidden;
  overflow-y: auto;
}
#fortune .fortune-heading {
  width: 2.35rem;
  height: 0.43rem;
  margin: 0.56rem auto 0.2rem;
  color: #fff4ce;
  font-size: 0.23rem;
  line-height: 0.43rem;
  text-align: center;
  background: #8d4d18;
  clip-path: polygon(8% 0, 92% 0, 100% 50%, 92% 100%, 8% 100%, 0 50%);
}
#fortune .fortune-reward-grid {
  display: flex;
  justify-content: center;
  gap: 0.15rem;
  width: 100%;
  margin: 0 auto;
}
#fortune .fortune-reward-card {
  width: 1.65rem;
  text-align: center;
  color: #5b351b;
}
#fortune .fortune-reward-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  width: 1rem;
  height: 1rem;
  margin: 0 auto 0.08rem;
  color: #744918;
  font-size: 0.12rem;
  font-weight: normal;
  background: rgba(255, 247, 224, 0.84);
  border: 0.02rem solid rgba(180, 129, 64, 0.55);
  box-shadow: inset 0 0 0.06rem rgba(125, 76, 26, 0.18);
}

#fortune .fortune-reward-mark {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 1.32rem;
  height: 1.32rem;
  border: 0.03rem solid rgba(165, 103, 38, 0.62);
  border-radius: 50%;
  color: #8b4a17;
  font-size: 0.3rem;
  line-height: 1;
  letter-spacing: 0.02rem;
  background: radial-gradient(
    circle,
    rgba(255, 252, 231, 0.95) 0,
    rgba(255, 224, 142, 0.78) 68%,
    rgba(211, 139, 45, 0.62) 100%
  );
  box-shadow:
    inset 0 0 0.12rem rgba(255, 255, 255, 0.9),
    0 0.03rem 0.08rem rgba(125, 76, 26, 0.2);
}
#fortune .fortune-reward-card p {
  min-height: 0.34rem;
  margin: 0;
  font-size: 0.12rem;
  line-height: 0.17rem;
}
#fortune .fortune-rule {
  margin: 0.16rem 0.08rem 0;
  color: #5b351b;
  font-size: 0.13rem;
  font-weight: normal;
  line-height: 0.24rem;
}
#fortune .fortune-rule h3 {
  margin: 0;
  font-size: 0.16rem;
  line-height: 0.3rem;
}
#fortune .fortune-rule ol {
  margin: 0;
  padding-left: 0.24rem;
}
#fortune .fortune-rule li {
  padding-left: 0.03rem;
}
#rule .cont.rule-cont {
  padding-top: 0.8rem;
}
.xm-btn {
  display: block;
  width: 1.85rem;
  height: 0.65rem;
  margin: 0.18rem auto 0;
  text-indent: -999em;
  background: url(https://static.web.sdo.com/chd/pic/Chicas/images/xm_btn.png)
    no-repeat 0 0 / 1.85rem 0.65rem;
}
.xm-btn.grey {
  cursor: default;
  filter: grayscale(1);
}
.sr-only {
  position: absolute;
  width: 0.01rem;
  height: 0.01rem;
  padding: 0;
  margin: -0.01rem;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.login-btn-art {
  background-image: url(https://static.web.sdo.com/chd/pic/Chicas/images/login-btn.png);
  background-size: 1.69rem 0.62rem;
}

/* 旧项目的选择区和回忆弹窗不属于当前藏宝图底图，暂不参与本版渲染。 */
.layout-consumption,
.memory {
  display: none !important;
}

/* 24 */

.layout-consumption {
  width: 100%;
  height: 4.41rem;
  position: absolute;
  overflow: hidden;

  left: 0;
}

.layout-avata {
  width: 100%;
  height: 4.3rem;
  position: absolute;
  top: 15.49rem;
  left: 0;
}

.layout-pages {
  position: absolute;
  /* background-color: red; */
  bottom: 0.32rem;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  left: 0;
  font-size: 0.14rem;
}
.layout-pages a,
.layout-pages a:visited,
.layout-pages a {
  color: #5c1f05;
}
.layout-pages a:first-child,
.layout-pages a:last-child {
  background-color: #5c1f05;
  color: #d8b570;
  width: 0.6rem;
  height: 0.22rem;
  border-radius: 0.04rem;
  text-align: center;
  line-height: 0.22rem;
}

.layout-pages span,
.layout-pages a {
  margin: 0 0.1rem;
}

.layout-pages .page-info {
  margin: 0 0.08rem;
  color: #5c1f05;
  font-weight: 700;
  white-space: nowrap;
}

.layout-consumption li {
  width: 1.8rem;
  height: 1.8rem;
  background-color: rgb(255, 237, 198);
  border: 0.06rem solid rgb(238 207 136);
  border-radius: 0.06rem;
}

.consumption1 li.active {
  border: 0.06rem solid #5c1f05;
  border-radius: 0.06rem;
}

.consumption1 li {
  cursor: pointer;
  margin: 0 auto;
  transition:
    transform 0.2s ease,
    border-color 0.2s ease,
    box-shadow 0.2s ease,
    background-color 0.2s ease;
}

.consumption1 li:hover {
  transform: translateY(-0.04rem);
  border-color: #c88b3e;
  background-color: #fff4d8;
  box-shadow: 0 0.1rem 0.18rem rgba(123, 74, 23, 0.2);
}

.consumption1 li.active:hover {
  border-color: #5c1f05;
  box-shadow: 0 0.12rem 0.2rem rgba(92, 31, 5, 0.22);
}

.consumption2 li {
  width: 1.35rem;
}

.layout-consumption ul {
  position: relative;
  padding-top: 1.02rem;
  display: flex;
  width: 86%;
  margin: 0 auto;
  justify-content: space-between;
}

.layout-consumption .pager-panel {
  margin: 0;
  box-sizing: border-box;
}

.layout-consumption .pager-static {
  width: 86%;
  margin: 0 auto;
}

.layout-consumption p {
  font-size: 0.14rem;
  color: #5c1f05;
  text-align: center;
}
.layout-consumption img {
  width: 100%;
  height: 1.8rem;
  margin-bottom: 0.1rem;
}

.layout-btns {
  position: absolute;
  display: flex;
  justify-content: space-between;
  width: 4.4rem;
  height: 0.46rem;
}

.btn7,
.btn8,
.btn9 {
  position: relative !important;
  display: block;
  background-image: url(https://static.web.sdo.com/chd/pic/Chicas24/btns.png);
  background-position: 0 -0.53rem;
  width: 1.39rem;
  height: 0.46rem;
  top: 3.66rem;
  left: 0.47rem;
}

.btn8 {
  background-position: -1.48rem -0.53rem;
}
.btn9 {
  background-position: -3rem -0.53rem;
}

.memory {
  padding: 0.54rem 0.75rem;
  box-sizing: border-box;
}
.memory h3 {
  font-size: 0.22rem;
  color: #744918;
  text-align: center;
  margin-bottom: 0.06rem;
}

.memory .tips {
  margin: 0 auto;
  width: 3.7rem;
  height: 0.3rem;
  background-color: #c3984e;
  border-radius: 0.5rem;
  font-size: 0.17rem;
  display: flex;
  align-items: center;
  justify-content: center;
  color: white;
  margin-bottom: 0.2rem;
}
.memory .list {
  overflow-y: scroll;
  height: 6rem;
}
.memory .list li {
  cursor: pointer;
  width: 50%;
  height: 0.62rem;
  border-bottom: 0.01rem solid #cca875;
  padding: 0.1rem;
  padding-right: 0;
  box-sizing: border-box;
  float: left;
}

.memory .list li .icon-g {
  width: 0.14rem;
  height: 0.14rem;
  background-color: white;
  border: 0.02rem solid #c78228;
  display: block;
  margin-right: 0.1rem;
}
.memory .list li img {
  margin-right: 0.1rem;
  width: 0.34rem;
  height: 0.34rem;
  display: block;
}
.memory .list li p {
  width: 1.5rem;
  overflow: hidden;
  font-size: 0.14rem;
  color: #744918;
}

.memory .list li.active .m-cont {
  background-color: #efb66b;
}
.memory .list li.active .icon-g {
  background-image: url(https://static.web.sdo.com/chd/pic/Chicas24/icon-gou.png);
  background-repeat: no-repeat;
  background-position: center;
}

.memory .list li .m-cont {
  display: flex;
  align-items: center;
  height: 0.46rem;
  padding: 0 0.06rem;
  text-wrap: nowrap;
}

.memory .layout-pages {
  bottom: 0.64rem;
}

.btn-save {
  cursor: pointer;
  width: 0.67rem;
  height: 0.39rem;
  background-image: url(https://static.web.sdo.com/chd/pic/Chicas24/btn10-save.png);
  background-repeat: no-repeat;
  background-position: center;
}

.btn-save.disabled {
  cursor: not-allowed;
  opacity: 0.5;
  filter: grayscale(100%);
}

/* 桌面端按钮交互保持原有悬停反馈。 */
.btn-area a:hover:not(.grey),
.login-btn:hover,
.refresh-btn:hover,
.btn-save:hover:not(.disabled),
#mypop .order-btn:hover,
.order-btn-common:hover,
.bigPop .close:hover,
.common-pop .close:hover,
.layout-pages a:hover:not(.disabled),
.btn-area .btn2.grey:hover,
.btn-area .btn3.grey:hover,
.btn-area .btn4.grey:hover,
.btn-save.disabled:hover,
.layout-pages a.disabled:hover {
  transform: translateY(-0.02rem);
  filter: brightness(1.08) saturate(1.05);
}

.btn-area .btn2.grey:hover,
.btn-area .btn3.grey:hover,
.btn-area .btn4.grey:hover,
.btn-save.disabled:hover,
.layout-pages a.disabled:hover {
  transform: none;
  filter: grayscale(1);
  box-shadow: none;
  opacity: 0.85;
}

.memory .btn-save {
  position: absolute;
  bottom: 0.56rem;
  left: 0;
  right: 0;
  margin: auto;
}

.layout-consumption .btn-save {
  position: absolute;
  bottom: 0.64rem;
  left: 0;
  right: 0;
  margin: auto;
}

/* 全局 rem：设计稿基准为 100 设计单位 = 1rem，舞台、奖品和控件统一使用设计稿比例。 */
html {
  font-size: 625%;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

  :root {
    --z-stage: 0;
    --z-map-items: 10;
    --z-controls: 20;
    --z-mask: 1000;
    --z-modal: 1010;
    --z-dialog: 1020;
    --z-system-dialog: 1100;
    --z-system: 2000;
    --z-activity-closed: 2900;
    --z-page-loading: 3000;
  }
  body,
  dl,
  dd,
  ul,
  ol,
  h1,
  h2,
  h3,
  h4,
  h5,
  h6,
  p,
  form,
  header,
  section,
  article,
  footer {
    margin: 0;
  }
  body,
  button,
  input,
  select,
  textarea {
    font: 0.12rem/1.5 "fz", sans-serif;
  }
  h1,
  h2,
  h3,
  h4,
  h5,
  h6 {
    font-size: 100%;
  }
  em,
  b {
    font-style: normal;
  }
  a {
    text-decoration: none;
  }
  a:hover {
    text-decoration: underline;
  }
  img {
    border: 0;
    display: block;
    width: 100%;
    height: 100%;
  }
  body {
    position: relative;
    overflow-x: hidden;
    background:
      radial-gradient(
        circle at top,
        rgba(255, 243, 207, 0.16),
        rgba(0, 0, 0, 0) 65%
      ),
      linear-gradient(180deg, rgba(28, 17, 6, 0.96), rgba(10, 7, 2, 0.98));
    scrollbar-width: thin;
    scrollbar-color: #81501d #d7b27d;
  }
  * {
    scrollbar-width: thin;
    scrollbar-color: #81501d #d7b27d;
  }
  *::-webkit-scrollbar {
    width: 0.06rem;
    height: 0.06rem;
  }
  *::-webkit-scrollbar-track {
    background: #d7b27d;
    border-radius: 9.99rem;
  }
  *::-webkit-scrollbar-thumb {
    background: #81501d;
    border-radius: 9.99rem;
  }
  *::-webkit-scrollbar-thumb:hover {
    background: #94602b;
  }
  body.page-loading-lock {
    overflow: hidden;
  }
  .page-loading {
    position: fixed;
    inset: 0;
    z-index: var(--z-page-loading);
    display: flex;
    align-items: center;
    justify-content: center;
    background:
      radial-gradient(
        circle at top,
        rgba(255, 243, 207, 0.28),
        rgba(0, 0, 0, 0) 45%
      ),
      linear-gradient(180deg, rgba(28, 17, 6, 0.96), rgba(10, 7, 2, 0.98));
    transition:
      opacity 0.45s ease,
      visibility 0.45s ease;
  }
  .page-loading.is-hidden {
    opacity: 0;
    visibility: hidden;
  }
  .page-loading-inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.18rem;
    width: 3.2rem;
    padding: 0.34rem 0.3rem 0.28rem;
    /* border: 0.01rem solid rgba(255, 222, 170, 0.28);
    background: rgba(60, 37, 11, 0.5);
    box-shadow: 0 0 0.6rem rgba(0, 0, 0, 0.35); */
  }
  .page-loading-logo {
    width: 1.82rem;
    height: 0.72rem;
    display: block;
    background: url(https://static.web.sdo.com/chd/pic/web7/images/home-logo.png)
      no-repeat center / contain;
    animation: pageLoadingPulse 1.8s ease-in-out infinite;
  }
  .page-loading-percent {
    font-family: "fz";
    font-size: 0.48rem;
    line-height: 1;
    color: #f6d08a;
    text-shadow: 0 0 0.12rem rgba(246, 208, 138, 0.38);
    letter-spacing: 0.01rem;
  }
  .page-loading-track {
    width: 100%;
    height: 0.1rem;
    overflow: hidden;
    border-radius: 9.99rem;
    background: rgba(255, 232, 191, 0.18);
    border: 0.01rem solid rgba(255, 225, 160, 0.22);
  }
  .page-loading-bar {
    display: block;
    height: 100%;
    width: 0%;
    border-radius: inherit;
    background: linear-gradient(90deg, #8f4f15, #d9a14d, #f6d08a);
    box-shadow: 0 0 0.1rem rgba(246, 208, 138, 0.45);
    transition: width 0.12s linear;
  }
  .page-loading-text {
    margin: 0;
    color: #e8c98a;
    font-size: 0.14rem;
    letter-spacing: 0.01rem;
  }
  @keyframes pageLoadingPulse {
    0%,
    100% {
      transform: scale(1);
      filter: brightness(1);
    }
    50% {
      transform: scale(1.03);
      filter: brightness(1.08);
    }
  }
  .wrap {
    position: relative;
    z-index: var(--z-stage);
  }
  .cover {
    position: fixed;
    inset: 0;
    z-index: var(--z-mask);
    background: rgba(0, 0, 0, 0.55);
    pointer-events: auto;
  }
  button,
  input,
  select,
  textarea {
    font-size: 100%;
    outline: none;
  }
  table {
    border-collapse: collapse;
    border-spacing: 0;
  }
  li {
    list-style: none outside none;
  }
  td,
  th,
  ul,
  ol {
    padding: 0;
  }
  input,
  select,
  textarea {
    padding: 0;
    margin: 0;
  }
  table {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
  }
  td,
  th,
  ul,
  ol {
    padding: 0;
  }
  .clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
  }
  .clearfix {
    display: flex;
    zoom: 1;
  }
  a:hover {
    text-decoration: none;
    filter: brightness(1.1);
  }
  .wrap {
    position: relative;
    left: 50%;
    margin: 0 0 0 -12.8rem;
    width: 25.6rem;
    height: 28.8rem;
    background: url(https://static.web.sdo.com/chd/pic/pro2026/Chicas/hero-background.jpg?v=14) no-repeat 0 0;
    background-size: 25.6rem 28.8rem;
  }
  .login-on {
    position: absolute;
    top: 15.5rem;
    left: 49.5%;
    transform: translateX(-50%);
    color: #5c1f05;
    z-index: var(--z-controls);
    width: 11.1rem;
  }
  .login-on-inner {
    width: 100%;
    padding: 0.04rem 0.2rem;
    border-radius: 0.17rem;
    background: rgb(243 220 168 / 60%);
    font-size: 0.23rem;
    letter-spacing: 0.002rem;
    box-sizing: border-box;
  }
  .login-on-account {
    color: #8b3d05;
    font-weight: bold;
  }
  .login-on #dqnum,
  .login-on #mapnum,
  .login-on #hlq {
    color: #b5450d;
    font-weight: bold;
  }
  .login-on a {
    color: #8f3400;
    font-weight: bold;
    text-decoration: none;
    border-bottom: 0.01rem solid rgba(143, 52, 0, 0.55);
  }
  .login-on a:hover {
    color: #c24f10;
    border-bottom-color: rgba(194, 79, 16, 0.75);
  }
  .btn-area a {
    display: block;
    position: absolute;
  }
  .btn-area {
    position: relative;
    z-index: var(--z-controls);
    width: 25.6rem;
    height: 28.8rem;
  }
  .btn-area a,
  .login-btn,
  .refresh-btn,
  .btn-save,
  #mypop .order-btn,
  .order-btn-common,
  .bigPop .close,
  .common-pop .close,
  .layout-pages a {
    transition:
      transform 0.18s ease,
      filter 0.18s ease,
      box-shadow 0.18s ease,
      opacity 0.18s ease,
      background-position 0.18s ease;
    transform-origin: center;
    will-change: transform, filter;
  }
  .btn-area .btn1 {
    top: 15.99rem;
    left: 16.1rem;
    width: 1.93rem;
    height: 0.61rem;
    text-indent: -999em;
  }
  .btn-area .btn2 {
    top: 25.47rem;
    left: 10.77rem;
    width: 3.44rem;
    height: 1.21rem;
    text-indent: -999em;
  }
  .btn-area .btn3 {
    top: 25.74rem;
    left: 7.42rem;
    width: 2.62rem;
    height: 0.91rem;
    text-indent: -999em;
  }
  .btn-area .btn4 {
    top: 25.7rem;
    left: 14.93rem;
    width: 2.62rem;
    height: 0.91rem;
    text-indent: -999em;
  }
  .btn-area .btn5 {
    top: 27.94rem;
    left: 10.49rem;
    width: 1.53rem;
    height: 0.43rem;
    text-indent: -999em;
  }
  .btn-area .btn6 {
    top: 27.94rem;
    left: 12.89rem;
    width: 1.53rem;
    height: 0.43rem;
    text-indent: -999em;
  }
  .btn-area .bzqy-btn {
    top: 20.16rem;
    left: 50%;
    width: 3.78rem;
    height: 1.51rem;
    margin-left: -1.89rem;
    text-indent: -999em;
    background-size: 3.78rem 1.51rem;
  }
  .btn-area .btn-art,
  .login-btn-art {
    position: absolute;
    inset: 0;
    display: block;
    background-repeat: no-repeat;
  }
  .btn-area .btn1 .btn-art {
    inset: 0 auto 0 0;
    width: 2rem;
    background-image: url(https://static.web.sdo.com/chd/pic/pro2026/Chicas/my-items-button.png);
    background-size: 1.93rem 0.61rem;
  }
  .btn-area .btn2 .btn-art {
    background-image: url(https://static.web.sdo.com/chd/pic/pro2026/Chicas/treasure-hunt-button.png);
    background-size: 3.44rem 1.21rem;
  }
  .btn-area .btn3 .btn-art {
    background-image: url(https://static.web.sdo.com/chd/pic/pro2026/Chicas/rainbow-ticket-exchange-button.png);
    background-size: 2.62rem 0.91rem;
  }
  .btn-area .btn4 .btn-art {
    background-image: url(https://static.web.sdo.com/chd/pic/pro2026/Chicas/fragment-exchange-button.png);
    background-size: 2.62rem 0.91rem;
  }
  .btn-area .btn1,
  .btn-area .btn2,
  .btn-area .btn3,
  .btn-area .btn4,
  .btn-area .btn5,
  .btn-area .btn6 {
    text-indent: 0;
    font-family: "fz", sans-serif;
    font-weight: bold;
    text-align: center;
    color: #713900;
    text-decoration: none;
  }
  .btn-area .btn1 {
    font-size: 0.26rem;
    line-height: 0.61rem;
  }
  .btn-area .btn2 {
    font-size: 0.56rem;
    line-height: 1.14rem;
  }
  .btn-area .btn3 {
    font-size: 0.29rem;
    line-height: 0.81rem;
  }
  .btn-area .btn4 {
    font-size: 0.29rem;
    line-height: 0.81rem;
  }
  .btn-area .btn5,
  .btn-area .btn6 {
    font-size: 0.38rem;
    line-height: 0.43rem;
  }
  .btn-area .btn2.grey .btn-art,
  .btn-area .btn3.grey .btn-art,
  .btn-area .btn4.grey .btn-art {
    cursor: default;
    background-position: 0 bottom;
    filter: grayscale(1);
  }
  .lottery {
    position: absolute;
    top: 0;
    left: 0;
    z-index: var(--z-map-items);
    width: 25.6rem;
    height: 28.8rem;
  }
  .lottery-unit {
    position: absolute;
    width: 0.68rem;
    height: 0.68rem;
  }
  .lottery-unit .icon {
    position: relative;
    z-index: 1;
    width: 0.68rem;
    height: 0.68rem;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
  }
  .lottery-unit .bg1 {
    position: absolute;
    top: -0.16rem;
    left: -0.32rem;
    z-index: 2;
    width: 1.3rem;
    height: 1.46rem;
    background: url(https://static.web.sdo.com/chd/pic/Chicas/images/bg1.png)
      no-repeat 0 0;
    background-size: 2.6rem 2.92rem;
    transition:
      transform 0.22s ease,
      filter 0.22s ease;
  }
  .lottery-unit .ok {
    position: absolute;
    top: 0.16rem;
    left: 0.08rem;
    z-index: 3;
    width: 0.56rem;
    height: 0.56rem;
    display: none;
    background: url(https://static.web.sdo.com/chd/pic/Chicas/images/ok.png)
      no-repeat 0 0;
    background-size: 0.56rem 0.56rem;
  }
  .lottery-unit .bg1 .num {
    padding-top: 1rem;
    width: 1rem;
    margin: 0;
    margin-left: auto;
    margin-right: auto;
    color: #341306;
    font-size: 0.18rem;
    line-height: 0.23rem;
    text-align: center;
  }
  .lottery-unit .bg1.crown {
    background-position: 0 bottom;
  }
  .lottery-unit .bg1.crown .num {
    padding-top: 1.01rem;
  }
  .lottery-unit.ignore .bg1 {
    background-position: right 0;
  }
  .lottery-unit.ignore .bg1 .num {
    color: #1b1b1b;
  }
  .lottery-unit.ignore .bg1.crown {
    background-position: right bottom;
  }
  .lottery-unit.ignore .icon {
    filter: grayscale(100%);
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    -o-filter: grayscale(100%);
  }
  .lottery-unit .bg2 {
    position: absolute;
    top: -0.7rem;
    left: -0.9rem;
    display: none;
    width: 2.54rem;
    height: 2.54rem;
    background: url(https://static.web.sdo.com/chd/pic/Chicas/images/bg2.png)
      no-repeat 0 0;
    background-size: 5.08rem 2.54rem;
    transform: scale(0.96);
    opacity: 0.88;
    transition:
      transform 0.22s ease,
      opacity 0.22s ease,
      filter 0.22s ease;
  }
  .lottery-unit.active .bg2,
  .lottery-unit.ignore .bg2 {
    display: block;
  }
  .lottery-unit.ignore .bg2 {
    display: block;
    background-position: right 0;
  }
  .lottery-unit.ignore .ok {
    display: block;
  }
  .lottery.animating .lottery-unit {
    transition:
      transform 0.2s ease,
      filter 0.2s ease,
      opacity 0.2s ease;
  }
  .lottery.animating .lottery-unit:not(.active) {
    filter: brightness(0.92);
    opacity: 0.86;
  }
  .lottery-unit.active {
    z-index: 5;
  }
  .lottery-unit.active .icon {
    transform: translateY(-0.04rem) scale(1.08);
    filter: drop-shadow(0 0.1rem 0.16rem rgba(255, 189, 64, 0.45));
    transition:
      transform 0.18s ease,
      filter 0.18s ease;
  }
  .lottery-unit.active .bg1 {
    transform: translateY(-0.02rem) scale(1.06);
    filter: brightness(1.05);
  }
  .lottery-unit.active .bg2 {
    transform: scale(1.08);
    opacity: 1;
    filter: drop-shadow(0 0 0.16rem rgba(255, 214, 74, 0.8));
    animation: lotteryPulse 0.72s ease-in-out infinite alternate;
  }

  @keyframes lotteryPulse {
    0% {
      transform: scale(1.02);
      opacity: 0.88;
    }
    100% {
      transform: scale(1.1);
      opacity: 1;
    }
  }
  .lottery-unit-0 {
    top: 16.71rem;
    left: 10.21rem;
  }
  .lottery-unit-1 {
    top: 19.31rem;
    left: 9.31rem;
  }
  .lottery-unit-2 {
    top: 18.01rem;
    left: 14.93rem;
  }
  .lottery-unit-3 {
    top: 23.03rem;
    left: 14.61rem;
  }
  .lottery-unit-4 {
    top: 21.08rem;
    left: 8.87rem;
  }
  .lottery-unit-5 {
    top: 20.92rem;
    left: 11.07rem;
  }
  .lottery-unit-6 {
    top: 22.75rem;
    left: 11.34rem;
  }
  .lottery-unit-7 {
    top: 23.69rem;
    left: 12.59rem;
  }
  .lottery-unit-8 {
    top: 21.35rem;
    left: 13.63rem;
  }
  .lottery-unit-9 {
    top: 19.45rem;
    left: 13.37rem;
  }
  .lottery-unit-10 {
    top: 20.14rem;
    left: 15.17rem;
  }
  .lottery-unit-11 {
    top: 18.84rem;
    left: 11.34rem;
  }
  .bigPop {
    position: fixed;
    /* top: -3.64rem; */
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    opacity: 0;
    width: 7rem;
    height: 8.65rem;
    z-index: var(--z-modal);
    -webkit-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    transform: translateY(-300%);
    transition: all 0.4s ease;
    background: url(https://static.web.sdo.com/chd/pic/Chicas/images/modal-bg.png)
      no-repeat;
  }
  .bigPop .cont {
    height: 100%;
  }
  .bigPop.show {
    display: block;
    transform: translateY(0);
    /* top: 3.64rem; */
    opacity: 1;
  }
  .bigPop .close {
    position: absolute;
    top: 0.48rem;
    right: 0.61rem;
    display: block;
    width: 0.22rem;
    height: 0.22rem;
    text-indent: -999em;
  }

  #rule .cont {
    font-family: "fz";
    color: #744918;
    font-size: 0.16rem;
    font-weight: bold;
    line-height: 0.36rem;
    box-sizing: border-box;
    padding: 0 0.61rem;
  }

  #rule .content {
    height: 7.25rem;
    overflow-y: auto;
  }
  #rule .cont h3 {
    font-size: 0.22rem;
    padding: 0 0 0.05rem 0;
    text-align: center;
  }
  #rule .cont ul {
    padding-inline-start: 0.4rem;
    margin-block-start: 0;
    margin-block-end: 0;
    padding-inline-start: 0.3rem;
  }
  #rule .cont ul li {
    padding: 0rem 0.08rem;
    line-height: 2;
    list-style: decimal;
  }
  #probability .cont h3 {
    font-family: "fz";
    font-size: 0.22rem;
    color: #744918;
    padding: 0.51rem 0 0.54rem 0;
    text-align: center;
    line-height: 0.36rem;
  }
  #probability .cont {
    max-height: 100%;
    overflow-y: auto;
    overflow-x: hidden;
  }
  #fortune .fortune-cont {
    font-family: "fz";
    color: #744918;
    font-size: 0.17rem;
    font-weight: bold;
    line-height: 0.36rem;
    box-sizing: border-box;
    padding: 0 0.61rem;
    overflow-x: hidden;
    overflow-y: auto;
  }
  .xm-btn {
    width: 1.85rem;
    height: 0.65rem;
    margin: 0.18rem auto 0;
    background-size: 1.85rem 0.65rem;
  }
  .table1 {
    width: 5.08rem;
    margin: 0 auto;
    margin-bottom: 0.34rem;
  }
  .add-tips {
    height: 0.5rem;
    font-family: "fz";
    font-size: 0.16rem;
    color: #744918;
    text-align: center;
  }
  .table1 th,
  .table1 td {
    font-family: "fz", sans-serif;
    font-size: 0.13rem;
    line-height: 0.44rem;
    color: #434343;
    text-align: center;
    background: url(https://static.web.sdo.com/chd/pic/Chicas/images/line.png)
      no-repeat 50% bottom;
  }
  .table1 th {
    font-weight: normal;
  }
  .table1 th.noline,
  .table1 td.noline {
    background-image: none;
  }
  .refresh-btn {
    display: block;
    width: 1.04rem;
    height: 0.36rem;
    text-indent: -999em;
    margin: 0 auto;
    background: url(https://static.web.sdo.com/chd/pic/Chicas/images/refresh-btn.png)
      no-repeat;
  }

  #mypop .tab-nav {
    padding: 0.68rem 0 0.4rem 0;
  }
  #mypop .tab-nav ul {
    width: 3.44rem;
    margin: 0 auto;
  }
  #mypop .tab-nav ul li {
    float: left;
    width: 1.71rem;
    line-height: 0.43rem;
    text-align: center;
    font-family: "fz";
    font-size: 0.18rem;
    color: #b67d3d;
    font-weight: bold;
    border: solid 0.01rem #b07739;
  }
  #mypop .tab-nav ul li a {
    width: 100%;
    height: 100%;
    display: block;
    color: #b67d3d;
  }
  #mypop .tab-nav ul li.hov a {
    color: #fff;
  }
  #mypop .tab-nav ul li.hov {
    background: url(https://static.web.sdo.com/chd/pic/Chicas/images/tab-nav-hov.png)
      no-repeat;
  }
  .table2 {
    padding: 0 0.19rem;
    width: 5.48rem;
    margin: 0 auto;
    height: 4.32rem;
    overflow-y: scroll;
    overflow-x: hidden;
  }
  .table2 .th-bg {
    width: 1.36rem;
    line-height: 0.29rem;
    font-size: 0.18rem;
    font-family: "fz";
    text-align: center;
    margin: 0 auto;
    color: #fff;
    font-weight: bold;
    background: #b67b3c;
    border-radius: 0.07rem 0.07rem 0 0;
  }
  .table2 td {
    width: 1.37rem;
    font-family: "fz", sans-serif;
    line-height: 0.45rem;
    color: #434343;
    text-align: center;
    background: url(https://static.web.sdo.com/chd/pic/Chicas/images/line.png)
      repeat-x 0 bottom;
  }
  .table2 td div {
    width: 1.37rem;
    height: 0.45rem;
    vertical-align: middle;
    display: table-cell;
    text-align: center;
    line-height: 0.16rem;
    overflow: hidden;
  }
  .table2 td div p {
    width: 100%;
  }
  .table2.none {
    display: none;
  }
  #mypop .tips {
    text-align: center;
  }
  #mypop .mypop-cell-image {
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #mypop .mypop-cell-image img {
    width: 0.4rem;
    height: 0.4rem;
    object-fit: cover;
  }
  #mypop .mypop-empty {
    width: 100%;
    height: 0.45rem;
    line-height: 0.45rem;
    color: #8f6a33;
  }
  /* .btn-primary {
    display: block;
    width: 0.58rem;
    height: 0.3rem;
    line-height: 0.3rem;
    font-size: 0.14rem;
    border-radius: 0.05rem;
    margin: 0 auto;
    color: #ffffff;
    text-align: center;
    text-decoration: none;
    text-shadow: 0 -0.01rem 0 rgba(0, 0, 0, 0.25);
    background-color: #006dcc;
    *background-color: #0044cc;
    background-image: -moz-linear-gradient(top, #0088cc, #0044cc);
    background-image: -webkit-gradient(
      linear,
      0 0,
      0 100%,
      from(#0088cc),
      to(#0044cc)
    );
    background-image: -webkit-linear-gradient(top, #0088cc, #0044cc);
    background-image: -o-linear-gradient(top, #0088cc, #0044cc);
    background-image: linear-gradient(to bottom, #0088cc, #0044cc);
    background-repeat: repeat-x;
    border-color: #0044cc #0044cc #002a80;
    border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff0088cc', endColorstr='#ff0044cc', GradientType=0);
    filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
  } */
  .login-btn {
    position: absolute;
    top: 15.75rem;
    left: 7.54rem;
    display: block;
    z-index: var(--z-controls);
    width: 1.69rem;
    height: 0.62rem;
    text-indent: -999em;
  }
  .login-btn-art {
    background-image: url(https://static.web.sdo.com/chd/pic/Chicas/images/login-btn.png);
    background-size: 1.69rem 0.62rem;
  }

  /* 旧项目的选择区和回忆弹窗不属于当前藏宝图底图，暂不参与本版渲染。 */
  .layout-consumption,
  .memory {
    display: none !important;
  }

  /* 24 */

  .layout-consumption {
    width: 100%;
    height: 4.41rem;
    position: absolute;
    overflow: hidden;

    left: 0;
  }

  .layout-avata {
    width: 100%;
    height: 4.3rem;
    position: absolute;
    top: 15.49rem;
    left: 0;
  }

  .layout-pages {
    position: absolute;
    /* background-color: red; */
    bottom: 0.32rem;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    left: 0;
    font-size: 0.14rem;
  }
  .layout-pages a,
  .layout-pages a:visited,
  .layout-pages a {
    color: #5c1f05;
  }
  .layout-pages a:first-child,
  .layout-pages a:last-child {
    background-color: #5c1f05;
    color: #d8b570;
    width: 0.6rem;
    height: 0.22rem;
    border-radius: 0.04rem;
    text-align: center;
    line-height: 0.22rem;
  }

  .layout-pages span,
  .layout-pages a {
    margin: 0 0.1rem;
  }

  .layout-pages .page-info {
    margin: 0 0.08rem;
    color: #5c1f05;
    font-weight: 700;
    white-space: nowrap;
  }

  .layout-consumption li {
    width: 1.8rem;
    height: 1.8rem;
    background-color: rgb(255, 237, 198);
    border: 0.06rem solid rgb(238 207 136);
    border-radius: 0.06rem;
  }

  .consumption1 li.active {
    border: 0.06rem solid #5c1f05;
    border-radius: 0.06rem;
  }

  .consumption1 li {
    cursor: pointer;
    margin: 0 auto;
    transition:
      transform 0.2s ease,
      border-color 0.2s ease,
      box-shadow 0.2s ease,
      background-color 0.2s ease;
  }

  .consumption1 li:hover {
    transform: translateY(-0.04rem);
    border-color: #c88b3e;
    background-color: #fff4d8;
    box-shadow: 0 0.1rem 0.18rem rgba(123, 74, 23, 0.2);
  }

  .consumption1 li.active:hover {
    border-color: #5c1f05;
    box-shadow: 0 0.12rem 0.2rem rgba(92, 31, 5, 0.22);
  }

  .consumption2 li {
    width: 1.35rem;
  }

  .layout-consumption ul {
    position: relative;
    padding-top: 1.02rem;
    display: flex;
    width: 86%;
    margin: 0 auto;
    justify-content: space-between;
  }

  .layout-consumption .pager-panel {
    margin: 0;
    box-sizing: border-box;
  }

  .layout-consumption .pager-static {
    width: 86%;
    margin: 0 auto;
  }

  .layout-consumption p {
    font-size: 0.14rem;
    color: #5c1f05;
    text-align: center;
  }
  .layout-consumption img {
    width: 100%;
    height: 1.8rem;
    margin-bottom: 0.1rem;
  }

  .layout-btns {
    position: absolute;
    display: flex;
    justify-content: space-between;
    width: 4.4rem;
    height: 0.46rem;
  }

  .btn7,
  .btn8,
  .btn9 {
    position: relative !important;
    display: block;
    background-image: url(https://static.web.sdo.com/chd/pic/Chicas24/btns.png);
    background-position: 0 -0.53rem;
    width: 1.39rem;
    height: 0.46rem;
    top: 3.66rem;
    left: 0.47rem;
  }

  .btn8 {
    background-position: -1.48rem -0.53rem;
  }
  .btn9 {
    background-position: -3rem -0.53rem;
  }

  .memory {
    padding: 0.54rem 0.75rem;
    box-sizing: border-box;
  }
  .memory h3 {
    font-size: 0.22rem;
    color: #744918;
    text-align: center;
    margin-bottom: 0.06rem;
  }

  .memory .tips {
    margin: 0 auto;
    width: 3.7rem;
    height: 0.3rem;
    background-color: #c3984e;
    border-radius: 0.5rem;
    font-size: 0.17rem;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    margin-bottom: 0.2rem;
  }
  .memory .list {
    overflow-y: scroll;
    height: 6rem;
  }
  .memory .list li {
    cursor: pointer;
    width: 50%;
    height: 0.62rem;
    border-bottom: 0.01rem solid #cca875;
    padding: 0.1rem;
    padding-right: 0;
    box-sizing: border-box;
    float: left;
  }

  .memory .list li .icon-g {
    width: 0.14rem;
    height: 0.14rem;
    background-color: white;
    border: 0.02rem solid #c78228;
    display: block;
    margin-right: 0.1rem;
  }
  .memory .list li img {
    margin-right: 0.1rem;
    width: 0.34rem;
    height: 0.34rem;
    display: block;
  }
  .memory .list li p {
    width: 1.5rem;
    overflow: hidden;
    font-size: 0.14rem;
    color: #744918;
  }

  .memory .list li.active .m-cont {
    background-color: #efb66b;
  }
  .memory .list li.active .icon-g {
    background-image: url(https://static.web.sdo.com/chd/pic/Chicas24/icon-gou.png);
    background-repeat: no-repeat;
    background-position: center;
  }

  .memory .list li .m-cont {
    display: flex;
    align-items: center;
    height: 0.46rem;
    padding: 0 0.06rem;
    text-wrap: nowrap;
  }

  .memory .layout-pages {
    bottom: 0.64rem;
  }

  .btn-save {
    cursor: pointer;
    width: 0.67rem;
    height: 0.39rem;
    background-image: url(https://static.web.sdo.com/chd/pic/Chicas24/btn10-save.png);
    background-repeat: no-repeat;
    background-position: center;
  }

  .btn-save.disabled {
    cursor: not-allowed;
    opacity: 0.5;
    filter: grayscale(100%);
  }

  .memory .btn-save {
    position: absolute;
    bottom: 0.56rem;
    left: 0;
    right: 0;
    margin: auto;
  }

  .layout-consumption .btn-save {
    position: absolute;
    bottom: 0.64rem;
    left: 0;
    right: 0;
    margin: auto;
  }

/* 页面分层：舞台只负责基础视觉；弹窗提升到 #app 根层，避免被舞台 stacking context 限制。 */
.stage-layer {
  position: absolute;
  inset: 0;
}

.stage-layer--hero {
  z-index: 1;
}

.hero-video {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 25.6rem;
  height: 14.4rem;
  object-fit: cover;
  opacity: 0;
  transition: opacity var(--hero-video-switch-duration, 0ms) ease;
}

.hero-video--opening {
  z-index: 2;
}

.hero-video--loop {
  z-index: 1;
}

.hero-video.is-ready {
  opacity: 1;
}

.hero-video--loop.is-ready {
  z-index: 3;
}

.hero-video--opening.is-hidden {
  opacity: 0;
}

.stage-layer--lottery {
  z-index: var(--z-map-items);
}

.stage-layer--controls {
  z-index: var(--z-controls);
}

.stage-layer--controls .btn-area {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

.stage-layer--controls .btn-area > a {
  pointer-events: auto;
}

.modal-layer {
  position: fixed;
  inset: 0;
  z-index: var(--z-mask);
  display: none;
  isolation: isolate;
}

.modal-layer.is-active {
  display: block;
}

.modal-layer .cover {
  position: absolute;
  inset: 0;
  z-index: var(--z-mask);
}

.modal-layer .bigPop {
  z-index: var(--z-modal);
}

.modal-layer .bigPop.show,
.modal-layer .common-pop.show {
  display: block;
}

/* 隐藏弹窗不保留全屏命中区域；弹窗显示状态由 .show 控制。 */
.modal-layer .bigPop:not(.show),
.modal-layer .common-pop:not(.show) {
  display: none;
}

/* 公共 Sys 登录弹窗属于系统层，始终高于活动层。 */
#sdo-LoginMask,
#sdo-LoginBox,
#sdoLoginIframe {
  z-index: var(--z-system) !important;
}

/* 新 PSD 宝藏奇缘弹窗：1119×1070，所有设计坐标按 100 个设计像素=1rem。 */
#fortune {
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 11.19rem;
  height: 10.7rem;
  max-width: none;
  max-height: none;
  margin: auto;
  background: url(https://static.web.sdo.com/chd/pic/pro2026/Chicas/fortune-modal-background.png) no-repeat 0 0 / 11.19rem
    10.7rem;
}

#fortune .close {
  top: 0.76rem;
  right: 0.94rem;
  width: 0.38rem;
  height: 0.38rem;
  background: url(https://static.web.sdo.com/chd/pic/pro2026/Chicas/fortune-modal-close.png) no-repeat 0 0 / 0.36rem
    0.35rem;
}

#fortune .fortune-cont {
  position: relative;
  width: 100%;
  height: 100%;
  padding: 0;
  overflow: hidden;
  box-sizing: border-box;
  color: #6d280b;
  font-family: "fz", sans-serif;
  font-weight: bold;
}

#fortune .fortune-heading {
  position: absolute;
  top: 0.82rem;
  left: 3.62rem;
  width: 3.94rem;
  height: 0.78rem;
  margin: 0;
  color: #fff1ca;
  font-size: 0.48rem;
  font-family: "fz", sans-serif;
  line-height: 0.78rem;
  text-align: center;
  text-shadow: 0 0.01rem 0.01rem rgba(93, 28, 4, 0.55);
  background: #6d280b;
  clip-path: polygon(
    12% 0,
    88% 0,
    100% 50%,
    88% 100%,
    12% 100%,
    0 50%
  );
}

#fortune .fortune-heading::before,
#fortune .fortune-heading::after {
  position: absolute;
  top: 0.04rem;
  width: 0.04rem;
  height: 0.7rem;
  content: "";
  background: #f4d795;
  transform: skewX(-28deg);
}

#fortune .fortune-heading::before {
  left: 0.37rem;
}

#fortune .fortune-heading::after {
  right: 0.37rem;
}

#fortune .fortune-reward-grid {
  position: absolute;
  top: 1.99rem;
  left: 1.36rem;
  display: grid;
  width: 8.47rem;
  margin: 0;
  grid-template-columns: repeat(3, 2.29rem);
  column-gap: 0.8rem;
}

#fortune .fortune-reward-card {
  width: 2.29rem;
  height: 2.59rem;
  color: #6d280b;
  text-align: center;
}

#fortune .fortune-reward-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2.29rem;
  height: 2.3rem;
  margin: 0;
  box-sizing: border-box;
  color: #744918;
  font-size: 0.12rem;
  font-weight: normal;
  background: rgba(255, 239, 198, 0.84);
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  border: 0.01rem solid rgba(180, 129, 64, 0.55);
  box-shadow: inset 0 0 0.06rem rgba(125, 76, 26, 0.18);
}

/* PSD 的奖励框是空白占位框，不额外绘制非设计稿内的圆形图标。 */
#fortune .fortune-reward-mark {
  display: none;
}

#fortune .fortune-reward-card p {
  min-height: 0.2rem;
  margin: 0.09rem 0 0;
  color: #6d280b;
  font-size: 0.16rem;
  line-height: 0.2rem;
}

#fortune .fortune-rule {
  position: absolute;
  top: 5.89rem;
  left: 1.1rem;
  width: 8.86rem;
  height: 3.78rem;
  margin: 0;
  box-sizing: border-box;
  color: #6d280b;
  font-size: 0.26rem;
  font-weight: normal;
  line-height: 0.34rem;
  font-family: "Microsoft YaHei", "微软雅黑", sans-serif;
}

#fortune .fortune-rule h3 {
  margin: 0;
  color: #6d280b;
  font-size: 0.26rem;
  font-weight: normal;
  line-height: 0.34rem;
  font-family: "Microsoft YaHei", "微软雅黑", sans-serif;
}

#fortune .fortune-rule ol {
  margin: 0;
  padding-left: 0.25rem;
  font-weight: normal;
  list-style: decimal outside;
  list-style-position: outside;
  font-size: 0.26rem;
  line-height: 0.34rem;
  font-family: "Microsoft YaHei", "微软雅黑", sans-serif;
}

#fortune .fortune-rule li {
  padding-left: 0.03rem;
  font-size: 0.26rem;
  font-weight: normal;
  line-height: 0.34rem;
  list-style: decimal outside;
  font-family: "Microsoft YaHei", "微软雅黑", sans-serif;
}

#fortune .xm-btn {
  position: absolute;
  top: 4.92rem;
  left: 4.74rem;
  display: block;
  width: 1.76rem;
  height: 0.62rem;
  margin: 0;
  background-size: 1.76rem 0.62rem;
}

/* 新 PSD 规则弹窗：615×657。 */
#rule {
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 6.39rem;
  height: 7.63rem;
  max-width: none;
  max-height: none;
  margin: auto;
  background: url(https://static.web.sdo.com/chd/pic/pro2026/Chicas/rule-probability-modal-background.png) no-repeat 0 0 /
    6.39rem 7.63rem;
}

#rule .close,
#probability .close {
  top: 0.29rem;
  right: 0.22rem;
  width: 0.32rem;
  height: 0.31rem;
  background: url(https://static.web.sdo.com/chd/pic/pro2026/Chicas/common-modal-close.png) no-repeat 0 0 / 0.32rem
    0.31rem;
}

/* 弹窗内容层使用 relative 定位，关闭按钮必须提升到内容层之上才能接收点击。 */
.bigPop .close,
.common-pop .close {
  z-index: 2;
  cursor: pointer;
}

#rule .rule-cont,
#probability .cont {
  position: relative;
  width: 100%;
  height: 100%;
  padding: 0;
  overflow: hidden;
  box-sizing: border-box;
  color: #7c4932;
  font-family: "fz", sans-serif;
}

#rule .cont.rule-cont {
  padding: 0;
}

#rule .content {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
  font-family: "Microsoft YaHei", "微软雅黑", sans-serif;
}

#rule .content h3 {
  position: absolute;
  top: 0.54rem;
  left: 0;
  width: 100%;
  height: 0.36rem;
  margin: 0;
  padding: 0;
  color: #7c4932;
  font-size: 0.32rem;
  font-weight: bold;
  line-height: 0.36rem;
  text-align: center;
  font-family: "fz", sans-serif;
}

#rule .rule-list {
  position: absolute;
  top: 1.04rem;
  left: 0.38rem;
  width: 5.6rem;
  height: 5.14rem;
  margin: 0;
  padding: 0 0 0 0.25rem;
  color: #7c4932;
  font-size: 0.2rem;
  font-weight: normal;
  line-height: 0.26rem;
  list-style: decimal outside;
  box-sizing: border-box;
  font-family: "Microsoft YaHei", "微软雅黑", sans-serif;
}

#rule .rule-list li {
  padding-left: 0.02rem;
  list-style: decimal outside;
  font-family: "Microsoft YaHei", "微软雅黑", sans-serif;
}

#rule .rule-time {
  color: #e21e12;
}

/* 新 PSD 概率弹窗：615×739。 */
#probability {
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 6.39rem;
  height: 7.63rem;
  max-width: none;
  max-height: none;
  margin: auto;
  background: url(https://static.web.sdo.com/chd/pic/pro2026/Chicas/rule-probability-modal-background.png) no-repeat 0 0 /
    6.39rem 7.63rem;
}

#probability .cont {
  overflow: hidden;
  font-family: "Microsoft YaHei", "微软雅黑", sans-serif;
}

#probability .cont h3 {
  position: absolute;
  top: 0.54rem;
  left: 0;
  width: 100%;
  height: 0.36rem;
  margin: 0;
  padding: 0;
  color: #7c4932;
  font-size: 0.32rem;
  font-weight: bold;
  line-height: 0.36rem;
  text-align: center;
  font-family: "fz", sans-serif;
}

#probability .table1 {
  position: absolute;
  top: 1rem;
  left: 0.57rem;
  width: 5.19rem;
  /* height: 4.86rem; */
  margin: 0;
  padding-right: 0.2rem;
  overflow-x: hidden;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: rgba(124, 73, 50, 0.65) transparent;
}

#probability .table1::-webkit-scrollbar {
  width: 0.08rem;
}

#probability .table1::-webkit-scrollbar-thumb {
  border-radius: 0.04rem;
  background: rgba(124, 73, 50, 0.65);
}

#probability .table1::-webkit-scrollbar-track {
  background: transparent;
}

#probability .table1 table {
  width: 100%;
  height: auto;
  table-layout: fixed;
}

#probability .table1 th,
#probability .table1 td {
  padding: 0;
  border-bottom: 0.01rem dotted rgba(151, 91, 55, 0.9);
  color: #7c4932;
  font-weight: normal;
  line-height: 0.41rem;
  text-align: center;
  background: none;
  font-family: "Microsoft YaHei", "微软雅黑", sans-serif;
}

#probability .table1 tr:first-child {
  height: 0.35rem;
}

#probability .table1 tr:first-child th {
  border-bottom: 0.01rem dotted rgba(151, 91, 55, 0.9);
  font-size: 0.2rem;
  line-height: 0.35rem;
}

#probability .table1 tr:not(:first-child) {
  height: 0.41rem;
}

#probability .table1 tr:not(:first-child) td {
  font-size: 0.2rem;
}

#probability .table1 th:first-child,
#probability .table1 td:first-child {
  width: 3.55rem;
}

#probability .table1 th:last-child,
#probability .table1 td:last-child {
  width: 1.44rem;
}

#probability .refresh-btn {
  position: absolute;
  top: 6.6rem;
  left: 2.42rem;
  display: block;
  width: 1.69rem;
  height: 0.59rem;
  margin: 0;
  color: #7a4a00;
  font-size: 0.24rem;
  font-weight: bold;
  line-height: 0.54rem;
  text-align: center;
  text-decoration: none;
  text-indent: 0;
  font-family: "Microsoft YaHei", "微软雅黑", sans-serif;
  background: url(https://static.web.sdo.com/chd/pic/pro2026/Chicas/refresh-button.png) no-repeat 0 0 / 1.69rem
    0.59rem;
}

#probability .refresh-btn::after {
  content: "↻";
  margin-left: 0.03rem;
  font-family: "fz", sans-serif;
}

/* 概率弹窗标题 32px，表格内容 20px。 */
#probability .cont,
#probability .table1 th,
#probability .table1 td {
  font-size: 0.2rem;
}

#probability .cont h3 {
  font-size: 0.32rem;
}

#probability .refresh-btn,
#probability .refresh-btn::after {
  font-size: 0.24rem;
}

/* 设计稿底部文字按钮的最终覆盖：旧版重复样式位于此文件中段，必须在末尾锁定。 */
.btn-area .btn5,
.btn-area .btn6 {
  color: #fff;
  font-size: 0.38rem;
  line-height: 0.43rem;
  white-space: nowrap;
  text-decoration: underline;
  text-decoration-thickness: 0.02rem;
  text-underline-offset: 0.04rem;
  text-shadow: 0 0 0.04rem rgba(0, 0, 0, 0.45);
}

.btn-area .btn6 {
  top: 27.94rem;
  height: 0.43rem;
}

.btn-area .btn5:hover,
.btn-area .btn6:hover {
  color: #fff;
  text-decoration: underline;
}

/* 我的宝物切图含有旧标题，只保留左侧宝箱，标题统一由页面字体渲染。 */
.btn-area .btn1 .btn-art {
  inset: 0 auto 0 0;
  width: 2rem;
  background-size: 1.93rem 0.61rem;
}

/* 标准业务弹窗统一外壳：提示、确认和抽奖结果共用同一套状态与按钮模型。 */
.common-pop {
  position: absolute;
  inset: 0;
  z-index: calc(var(--z-dialog) + 1);
  opacity: 0;
  transform: scale(0);
  transition: opacity 0.5s ease, transform 0.5s ease;
}

.common-pop.show {
  opacity: 1;
  transform: scale(1);
}

.common-pop .common-pop-cont {
  position: absolute;
  top: 50%;
  left: 50%;
  display: flex;
  flex-direction: column;
  width: 6.4rem;
  height: 4.11rem;
  min-height: 0;
  margin: -2.055rem 0 0 -3.2rem;
  padding: 0.47rem 0 0.5rem;
  box-sizing: border-box;
  background: url(https://static.web.sdo.com/chd/pic/pro2026/Chicas/common-modal-background.png) no-repeat 0 0 / 6.4rem
    4.11rem;
}

.common-pop .close {
  position: absolute;
  top: 0.22rem;
  right: 0.24rem;
  width: 0.32rem;
  height: 0.31rem;
  background: url(https://static.web.sdo.com/chd/pic/pro2026/Chicas/common-modal-close.png) no-repeat 0 0 / 0.32rem
    0.31rem;
  z-index: 2;
}

.common-pop-body {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 1 1 auto;
  width: 100%;
  min-height: 0;
  padding: 0 0.28rem;
  box-sizing: border-box;
  color: #80503b;
  font-size: 0.22rem;
  line-height: 0.32rem;
  text-align: center;
}

.common-pop .common-pop-input {
  display: flex;
  flex: 1 1 auto;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 0;
  margin: 0;
}

.common-pop .title {
  margin: 0;
  color: #80503b;
  font-family: "fz", sans-serif;
  font-size: 0.32rem;
  font-weight: bold;
  line-height: 0.4rem;
  text-align: center;
}

.common-pop-message,
.common-pop-result,
.common-pop-rich {
  width: 100%;
}

.common-pop-form {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  color: #80503b;
  font-size: 0.22rem;
  line-height: 0.32rem;
}

.common-pop-form label {
  margin-right: 0.12rem;
}

.common-pop-form select {
  width: 1.2rem;
  height: 0.34rem;
  padding: 0 0.08rem;
  color: #80503b;
  font-family: "fz", sans-serif;
  font-size: 0.18rem;
  line-height: 0.34rem;
  text-align: center;
  border: 0.01rem solid #c99d65;
  border-radius: 0.04rem;
  background: #fff8e8;
}

.common-pop-form input {
  width: 1.6rem;
  height: 0.34rem;
  box-sizing: border-box;
  padding: 0 0.08rem;
  color: #80503b;
  font-family: "fz", sans-serif;
  font-size: 0.18rem;
  line-height: 0.34rem;
  text-align: center;
  border: 0.01rem solid #c99d65;
  border-radius: 0.04rem;
  background: #fff8e8;
}

.common-pop-stepper {
  display: flex;
  align-items: center;
  width: 1.36rem;
  height: 0.36rem;
  box-sizing: border-box;
  overflow: hidden;
  border: 0.01rem solid #c99d65;
  border-radius: 0.05rem;
  background: #fff8e8;
}

.common-pop-stepper-button {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 0.38rem;
  width: 0.38rem;
  height: 100%;
  margin: 0;
  padding: 0;
  color: #80503b;
  font-family: "fz", sans-serif;
  font-size: 0.24rem;
  line-height: 1;
  border: 0;
  background: transparent;
  cursor: pointer;
}

.common-pop-stepper-button:hover {
  background: rgba(201, 157, 101, 0.16);
}

.common-pop-stepper input {
  flex: 1 1 auto;
  width: auto;
  height: 100%;
  min-width: 0;
  padding: 0 0.08rem;
  border: 0;
  border-right: 0.01rem solid #c99d65;
  border-left: 0.01rem solid #c99d65;
  border-radius: 0;
  background: transparent;
}

.common-pop-stepper input::-webkit-outer-spin-button,
.common-pop-stepper input::-webkit-inner-spin-button {
  margin: 0;
  -webkit-appearance: none;
}

.common-pop-stepper input[type="number"] {
  -moz-appearance: textfield;
}

.common-pop-result span,
.common-pop-rich strong,
.common-pop-rich em {
  color: #ff4e00;
  font-style: normal;
  font-weight: bold;
}

.common-pop-result .common-pop-milestone-hint {
  display: block;
  margin-top: 0.33rem;
  color: #80503b;
  font-size: 0.18rem;
  font-weight: normal;
  line-height: 0.28rem;
}

.common-pop-rich {
  line-height: 0.32rem;
}

.common-pop-buttons {
  position: static;
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  width: 100%;
  gap: 0.5rem;
  min-height: 0.48rem;
  margin: 0;
}

.common-pop-buttons .common-pop-button {
  display: inline-block;
  width: 1.69rem;
  height: 0.59rem;
  margin: 0;
  box-sizing: border-box;
  color: #7a4a00;
  font-family: "fz", sans-serif;
  font-size: 0.2rem;
  font-weight: bold;
  line-height: 0.59rem;
  text-align: center;
  text-decoration: none;
  text-indent: 0;
  background: url(https://static.web.sdo.com/chd/pic/pro2026/Chicas/refresh-button.png) no-repeat 0 0 / 1.69rem
    0.59rem;
}

.common-pop--message .common-pop-body {
  min-height: 0;
}

.common-pop--confirm .common-pop-body {
  min-height: 0;
}

.common-pop--result .common-pop-body {
  min-height: 0;
}

.common-pop--one-button .common-pop-buttons {
  gap: 0;
}
