* {
    margin: 0;
    padding: 0;
}

body {
    background: #000000;
}

a {
    text-decoration: none;
}

div {
    box-sizing: border-box;
}

.xiang {
    position: relative;
}

.jue {
    position: absolute;
}

.shuijz {
    left: 50%;
    transform: translateX(-50%);
}

.chuijz {
    top: 50%;
    transform: translateY(-50%);
}

.scjz {
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

[v-cloak] {
    display: none;
}

.container {
    width: 100%;
    /* height: 100%;
     */
    max-width: 7.5rem;
    height: 63rem;
    margin: auto;
    position: relative;
    padding-top: 5.25rem;
    overflow: hidden;
    z-index: 1;
    background: url(https://img.youxi290.com/khm/xchd2026/mobile/bg.jpg) center top no-repeat;
    background-size: 100%;
    box-sizing: border-box;
}

.background-layers {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    max-width: 19.2rem;
    height: 58.3rem;
    z-index: 0;
}

.bg-top {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 10.13rem;
    object-fit: cover;
    z-index: 1;
}

.bg-middle {
    position: absolute;
    top: 7.25rem;
    left: 0;
    width: 100%;
    height: 5.46rem;
    background: url(https://img.youxi290.com/khm/xchd2026/mobile/bg2.png) center center;
    background-size: cover;
    z-index: 3;
}

.bg-bottom {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 58.3rem;
    background: url(https://img.youxi290.com/khm/xchd2026/mobile/bg3.png) center center;
    background-size: cover;
    z-index: 2;
}

.activity-time {
    width: 100%;
    height: 0.53rem;
    text-align: center;
    font-size: 0.2rem;
    line-height: 0.44rem;
    font-size: 0.28rem;
    letter-spacing: 0rem;
    color: #ffffff;
    text-shadow: 0.01rem 0.01rem 0.07rem rgba(160, 8, 1, 0.74), 0.02rem 0.02rem 0.11rem rgba(82, 24, 5, 0.54), 0.02rem 0.02rem 0.11rem rgba(82, 24, 5, 0.74);
}

.change_server {
    width: 1.59rem;
    height: 0.59rem;
    background: url(https://img.youxi290.com/khm/xchd2026/mobile/server_bg.png) center top;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    position: absolute;
    top: -1rem;
    right: 0.3rem;
    z-index: 11;
    text-align: center;
    font-size: 0.2rem;
    font-weight: normal;
    font-stretch: normal;
    line-height: 0.52rem;
    letter-spacing: 0rem;
    color: #722800;
    cursor: pointer;
}

.change_server:hover {
    background: url(https://img.youxi290.com/khm/xchd2026/mobile/server_bg2.png) center top no-repeat;
    background-size: 100% 100%;
}

.top_title {
    width: 13.76rem;
    height: 4.02rem;
    background: url(https://img.youxi290.com/khm/xchd2026/mobile/top_title.png) center top no-repeat;
    background-size: 100%;
    margin: 0 auto;
    position: relative;
    z-index: 3;
}

.pagediv {
    width: 9rem;
    display: flex;
    margin: 0.92rem auto 0;
    justify-content: space-around;
}

.top_div {
    width: 1.75rem;
    height: 1.75rem;
    position: relative;
    cursor: pointer;
    transition: 0.3s;
}

.with_center_img::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 50%;
    height: 50%;
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    pointer-events: none;
}

.center_img_hsxb::after {
    background-image: url(https://img.youxi290.com/khm/xchd2026/mobile/top_bg1_3.png);
}

.center_img_hlhg::after {
    background-image: url(https://img.youxi290.com/khm/xchd2026/mobile/top_bg2_3.png);
}

.center_img_xcqy::after {
    background-image: url(https://img.youxi290.com/khm/xchd2026/mobile/top_bg3_3.png);
}

.center_img_xchs::after {
    background-image: url(https://img.youxi290.com/khm/xchd2026/mobile/top_bg4_3.png);
}

.top_hsxb {
    background: url(https://img.youxi290.com/khm/xchd2026/mobile/top_bg1_1.png) center no-repeat;
    background-size: 100%;
}

.top_hsxb:hover {
    background: url(https://img.youxi290.com/khm/xchd2026/mobile/top_bg1_2.png) center no-repeat;
    background-size: 100%;
}

.top_hlhg {
    margin-top: 1rem;
    background: url(https://img.youxi290.com/khm/xchd2026/mobile/top_bg2_1.png) center no-repeat;
    background-size: 100%;
}

.top_hlhg:hover {
    background: url(https://img.youxi290.com/khm/xchd2026/mobile/top_bg2_2.png) center no-repeat;
    background-size: 100%;
}

.top_xcqy {
    margin-top: 1rem;
    background: url(https://img.youxi290.com/khm/xchd2026/mobile/top_bg3_1.png) center no-repeat;
    background-size: 100%;
}

.top_xcqy:hover {
    background: url(https://img.youxi290.com/khm/xchd2026/mobile/top_bg3_2.png) center no-repeat;
    background-size: 100%;
}

.top_xchs {
    background: url(https://img.youxi290.com/khm/xchd2026/mobile/top_bg4_1.png) center no-repeat;
    background-size: 100%;
}

.top_xchs:hover {
    background: url(https://img.youxi290.com/khm/xchd2026/mobile/top_bg4_2.png) center no-repeat;
    background-size: 100%;
}

.content {
    margin: 0 auto;
    padding-top: 3.04rem;
}

.hsxb {
    width: 100%;
    margin: 0 auto;
}

.content_title {
    width: 100%;
    height: 2.28rem;
    margin: 0 auto 0.1rem;
    position: relative;
    background: none no-repeat center;
    background-size: 100%;
}

.hsxb_title {
    background-image: url(https://img.youxi290.com/khm/xchd2026/mobile/hsxb_title.png);
}

.hlhg_title {
    background-image: url(https://img.youxi290.com/khm/xchd2026/mobile/hlhk_title.png);
}

.xcqy_title {
    background-image: url(https://img.youxi290.com/khm/xchd2026/mobile/xcqy_title.png);
}

.xchs_title {
    background-image: url(https://img.youxi290.com/khm/xchd2026/mobile/xchs_title.png);
}

.hsxb_tab {
    /* margin-top: 0.56rem;
     */
    /* transform: translateX(1.31rem);
     */
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

.hsxb_tab_bg {
    display: inline-block;
    width: 3.31rem;
    height: 0.93rem;
    background: url(https://img.youxi290.com/khm/xchd2026/mobile/hsxb_tab.png) center no-repeat;
    background-size: 100%;
    /* font-family: SourceHanSerifCN-Heavy;
     */
    font-size: 0.32rem;
    color: #876229;
    text-align: center;
    line-height: 0.93rem;
    cursor: pointer;
}

.hsxb_tab_active {
    color: #ffedaf;
    background-image: url(https://img.youxi290.com/khm/xchd2026/mobile/hsxb_tab_active.png);
}

.hsxb_tab_bg:hover {
    color: #ffedaf;
    background-image: url(https://img.youxi290.com/khm/xchd2026/mobile/hsxb_tab_active.png);
}

.hsxb_tab_bg:nth-child(2) {
    margin-left: 0.05rem;
}

.hsxb_jf {
    display: inline-block;
    /* width: 0.2rem;
     */
    /* height: 0.42rem;
     */
    /* */
    /* font-size: 0.2rem;
     */
    /* font-weight: normal;
     */
    /* font-stretch: normal;
     */
    /* line-height: 0.22rem;
     */
    /* letter-spacing: 0.02rem;
     */
    /* color: #f8cb86;
     */
    /* margin-left: 2.36rem;
     */
    /* vertical-align: middle;
     */
    width: 1.22rem;
    float: left;
}

.jf_num {
    /* display: inline-block;
     */
    /* width: 2.9rem;
     */
    /* height: 0.45rem;
     */
    /* background: url(https://img.youxi290.com/khm/xchd2026/mobile/hsxb_jf.png) center no-repeat;
     */
    /* background-size: 100%;
     */
    /* vertical-align: middle;
     */
    /* margin-left: 0.12rem;
     */
    /* padding-left: 0.6rem;
     */
    /* */
    /* font-size: 0.24rem;
     */
    /* font-weight: normal;
     */
    /* font-stretch: normal;
     */
    /* line-height: 0.35rem;
     */
    /* letter-spacing: 0.02rem;
     */
    color: #fff8dc;
    font-weight: bold;
    float: left;
}

.hsxb_content_bg {
    /* margin-top: 0;
     */
    width: 7.3rem;
    height: 12.2rem;
    background: url(https://img.youxi290.com/khm/xchd2026/mobile/hsxb_bg.png) center top no-repeat;
    background-size: 100%;
    position: relative;
    margin: 0 auto;
    /* box-sizing: border-box;
     */
    padding-top: 0.9rem;
}

.hsxb_server {
    /* position: absolute;
     top: -0.2rem;
     left: 1.18rem;
     */
    margin-top: 0.26rem;
    /* */
    font-size: 0.24rem;
    line-height: 0.35rem;
    letter-spacing: 0.02rem;
    color: #9a4933;
    /* display: flex;
     */
    align-items: center;
    /* justify-content: space-around;
     */
    height: 0.42rem;
    line-height: 0.42rem;
}

.hsxb_server_score {
    /* display: flex;
     */
    /* align-items: flex-start;
     */
    /* justify-content: center;
     */
    height: 0.42rem;
    float: right;
    line-height: 0.42rem;
    width: 2.68rem;
}

.roll-btns-con {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 0.85rem;
}

.hsxb_left,
.hsxb_right {
    position: absolute;
}

.hsxb_left {
    /* left: 1.14rem;
     */
    /* top: 0.95rem;
     */
    position: relative;
    width: 6.4rem;
    margin: 0 auto;
    height: 7.22rem;
}

.hsxb_left .title {
    width: 2.38rem;
    height: 0.39rem;
    background: url(https://img.youxi290.com/khm/xchd2026/mobile/hsxb_left_title.png) center no-repeat;
    background-size: 100%;
    display: block;
    margin: 0 auto 0.28rem;
}

.hsxb_left_content {
    /* margin-top: 0.35rem;
     */
    /* font-family: SourceHanSerifCN-Heavy;
     */
    font-size: 0.24rem;
    line-height: 0.34rem;
    letter-spacing: 0rem;
    color: #9a4933;
}

.hsxb_left_content .rule {
    font-weight: bold;
    margin-bottom: 0.25rem;
}

.hsxb_left_content>p:nth-child(4) {
    margin-top: 0.25rem;
}

.hsxb_right {
    /* right: 1.19rem;
     */
    /* top: 0.93rem;
     */
    position: relative;
    width: 100%;
    height: 1.81rem;
    /* line-height: 0.42rem;
     */
    display: flex;
    align-items: flex-start;
}

.hsxb_right_btn {
    width: 1.81rem;
    height: 2.01rem;
    background-size: 100%;
    /* */
    font-size: 0.4rem;
    line-height: 0.47rem;
    letter-spacing: 0.03rem;
    color: #ffedaf;
    text-align: center;
    cursor: pointer;
    /* margin-bottom: 0.15rem;
     */
    transition: 0.3s;
    background: url(https://img.youxi290.com/khm/xchd2026/mobile/other3.png) center no-repeat;
    background-size: 100%;
    box-sizing: border-box;
    padding: 0.53rem 0.33rem;
}

.hsxb_right_btn.active {
    background-image: url(https://img.youxi290.com/khm/xchd2026/mobile/other2.png)
}

.hsxb_right_btn.right.red {
    line-height: 0.97rem;
}

/* .hsxb_right_btn.right {
     margin-left: 0.27rem;
}
 .hsxb_right_btn.red {
     background: url(https://img.youxi290.com/khm/xchd2026/mobile/other3.png) center no-repeat;
}
 .hsxb_right_btn.red:hover {
     background: url(https://img.youxi290.com/khm/xchd2026/mobile/hsxb_right_btn_red.png) center no-repeat;
}
 .hsxb_right_btn.yellow {
     background: url(https://img.youxi290.com/khm/xchd2026/mobile/hsxb_right_btn.png) center no-repeat;
}
 .hsxb_right_btn.yellow:hover {
     background: url(https://img.youxi290.com/khm/xchd2026/mobile/hsxb_right_btn_yellow.png) center no-repeat;
}
 */
.hsxb_one_top {
    position: absolute;
    top: -0.1rem;
    left: 1.3rem;
    width: 1.18rem;
    height: 0.24rem;
    background: url(https://img.youxi290.com/khm/xchd2026/mobile/hsxb_one_top.png) center no-repeat;
    background-size: 100%;
}

.hsxb_one,
.hsxb_ten {
    /* position: absolute;
     */
    width: 3.76rem;
    height: 1.18rem;
    /* background-size: 100%;
     */
    cursor: pointer;
    background: none no-repeat center;
    background-size: 100%;
}

.hsxb_one {
    /* top: 5.01rem;
     */
    /* left: 2.98rem;
     */
    background-image: url(https://img.youxi290.com/khm/xchd2026/mobile/hsxb_one.png);
    transition: 0.3s;
    position: relative;
}

.hsxb_one:hover {
    background-image: url(https://img.youxi290.com/khm/xchd2026/mobile/hsxb_one_active.png);
}

.hsxb_ten {
    top: 5.01rem;
    left: 6.79rem;
    background-image: url(https://img.youxi290.com/khm/xchd2026/mobile/hsxb_ten.png);
    transition: 0.3s;
}

.hsxb_ten:hover {
    background-image: url(https://img.youxi290.com/khm/xchd2026/mobile/hsxb_ten_active.png);
}

.hlhg {
    width: 100%;
    margin: 0 auto;
}

.hlhg_content_bg {
    margin-top: 0.21rem;
    width: 7.3rem;
    height: 10.44rem;
    background: url(https://img.youxi290.com/khm/xchd2026/mobile/xcqy_bg.png) center no-repeat;
    background-size: 100% 100%;
    position: relative;
    margin: 0 auto;
}

.hlhg_btns {
    height: 1.23rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

.hlhg_rule {
    width: 3.05rem;
    height: 0.96rem;
    background-image: url(https://img.youxi290.com/khm/xchd2026/mobile/hlhg_rule.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    font-size: 0.32rem;
    font-weight: bold;
    letter-spacing: 0.02rem;
    color: #ffedaf;
    /* display: flex;
     */
    /* align-items: center;
     */
    /* justify-content: center;
     */
    cursor: pointer;
    transition: 0.3s;
    text-indent: 0.9rem;
    line-height: 0.97rem;
}

.hlhg_rule:hover {
    background-image: url(https://img.youxi290.com/khm/xchd2026/mobile/hlhg_rule_active.png);
}

.hlhg_hb {
    width: 3.16rem;
    height: 1.23rem;
    background-image: url(https://img.youxi290.com/khm/xchd2026/mobile/hlhg_hb.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    font-size: 0.32rem;
    font-weight: bold;
    letter-spacing: 0.02rem;
    color: #ffedaf;
    /* display: flex;
     */
    /* align-items: center;
     */
    /* justify-content: center;
     */
    cursor: pointer;
    transition: 0.3s;
    text-indent: 0.97rem;
    line-height: 1.21rem;
}

.hlhg_hb:hover {
    background-image: url(https://img.youxi290.com/khm/xchd2026/mobile/hlhg_hb_active.png);
}

.hlhg .title {
    padding-top: 0.96rem;
    /* font-family: ZHFTSS_T;
     */
    font-size: 0.48rem;
    background-image: linear-gradient(to bottom, #410000 0%, #d51111 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
    text-align: center;
    font-weight: bold;
    margin-bottom: 0.14rem;
}

.hlhg .text {
    /* font-family: SourceHanSerifCN-Heavy;
     */
    font-size: 0.38rem;
    font-style: italic;
    background-image: linear-gradient(to bottom,
            /* 渐变方向：从上到下 */
            #ff1111 0%,
            /* 起始颜色和位置 */
            #950300 100%
            /* 结束颜色和位置 */
        );
    -webkit-background-clip: text;
    background-clip: text;
    /* 使文字颜色透明，显示背景渐变 */
    color: transparent;
    -webkit-text-fill-color: transparent;
    text-align: center;
}

.start_btn {
    /* position: absolute;
     */
    /* left: 4.83rem;
     */
    /* bottom: -0.32rem;
     */
    width: 5.02rem;
    height: 1.58rem;
    background: url(https://img.youxi290.com/khm/xchd2026/mobile/hlhg_start_btn.png) center no-repeat;
    background-size: 100%;

    font-size: 0;
    /* font-weight: normal;
     */
    /* font-stretch: normal;
     */
    /* line-height: 1.1rem;
     */
    /* letter-spacing: 0.02rem;
     */
    /* color: #ffedaf;
     */
    text-align: center;
    cursor: pointer;
    transition: 0.3s;
    margin: 0 auto;
}

.start_btn:hover {
    background-image: url(https://img.youxi290.com/khm/xchd2026/mobile/hlhg_start_btn_active.png);
}

.start_btn.active {
    filter: grayscale(100%);
}

.cards {
    margin: 0.05rem auto 0.15rem;
    /* margin-bottom: 0.3rem;
     */
    width: 100%;
    height: 3.88rem;
    display: flex;
    justify-content: center;
    /* gap: 0.32rem;
     */
}

.card {
    width: 2.36rem;
    height: 3.88rem;
    cursor: pointer;
    position: relative;
    perspective: 8rem;
}

.card .front,
.card .back {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    backface-visibility: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2.5em;
    transition: transform 0.6s, background 0.2s;
    background: none no-repeat center;
    background-size: 100%;
}

.card .front {
    background-image: url(https://img.youxi290.com/khm/xchd2026/mobile/hlhg_card_active.png);
    /* background-size: 100% 100%; */
    z-index: 2;
    transform: rotateY(0deg);
}

.card.flipped .front {
    transform: rotateY(180deg);
}

.card .front_icon {
    height: 0.57rem;
    background-size: cover;
    transform: translateY(-0.2rem);
    background: none no-repeat center;
    background-size: 100%;
}

.card .front_2 {
    width: 0.48rem;
    background-image: url(https://img.youxi290.com/khm/xchd2026/mobile/2yuan.png);
}

.card .front_40 {
    width: 0.66rem;
    background: url(https://img.youxi290.com/khm/xchd2026/mobile/40yuan.png) center no-repeat;
    background-size: 100%;
}

.card .front_100 {
    width: 0.83rem;
    background-image: url(https://img.youxi290.com/khm/xchd2026/mobile/100yuan.png);
}

.card .front_text {
    position: absolute;
    bottom: 0.8rem;
    font-size: 0.22rem;
    color: #eda57d;
}

.card .back {
    width: 2.36rem;
    height: 3.88rem;
    background: url(https://img.youxi290.com/khm/xchd2026/mobile/hlhg_back.png) center no-repeat;
    background-size: 100%;
    transform: rotateY(180deg);
    z-index: 1;
    transition: transform 0.6s, background 0.2s;
}

.card.flipped .back {
    transform: rotateY(0deg);
}

.card .back:hover {
    /* background: url(https://img.youxi290.com/khm/xchd2026/mobile/hlhg_back_active.png) center no-repeat;
     */
}

.start_btn.disabled {
    opacity: 0.6;
    cursor: not-allowed;
    pointer-events: none;
}

.xcqy {
    width: 100%;
    margin: 0 auto;
}

.xcqy_content_bg {
    margin-top: 0;
    width: 100%;
    height: 10.32rem;
    background: url(https://img.youxi290.com/khm/xchd2026/mobile/xchs_bg1.png) center no-repeat;
    background-size: 100% 100%;
    position: relative;
    padding-top: 0.72rem;
}

.xcqy_content_bg .title {
    /* margin-right: 0.3rem;
     */
    padding-top: 0.17rem;
    /* font-family: ZHFTSS_T; */
    font-size: 0.48rem;
    background-image: linear-gradient(to bottom,
            /* 渐变方向：从上到下 */
            #410000 0%,
            /* 起始颜色和位置 */
            #d51111 100%
            /* 结束颜色和位置 */
        );
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
    text-align: center;
    font-weight: bold;
}

.fu_title {
    margin-top: 0.28rem;
    font-size: 0.24rem;
    line-height: 0.27rem;
    letter-spacing: 0.02rem;
    color: #af0d0d;
    text-align: center;
}

.main_title {
    margin-top: 0.3rem;
    font-weight: bold;
    text-align: center;
    font-size: 0.28rem;
    color: #a32803;
    width: 82%;
    margin: 0.3rem auto 0;
    position: relative;
    z-index: 2;
}

.main_title::before {
    content: "";
    float: left;
    width: 0.24rem;
    height: 0.24rem;
    background: url(https://img.youxi290.com/khm/xchd2026/mobile/other1.png) center no-repeat;
    background-size: 100%;
    /* margin-right: 0.1rem;
     */
    margin-top: 0.08rem;
}

.main_title::after {
    content: "";
    float: right;
    width: 0.24rem;
    height: 0.24rem;
    transform: rotate(180deg);
    background: url(https://img.youxi290.com/khm/xchd2026/mobile/other1.png) center no-repeat;
    background-size: 100%;
    /* margin-right: 0.1rem;
     */
    margin-top: 0.08rem;
}

.xcqy_fire {
    width: 100%;
    height: 5.7rem;
    margin: 0.08rem auto 0;
}

.xcqy_bp {
    /* display: flex; */
    /* justify-content: space-around; */
    height: 4.7rem;
    width: 5.8rem;
    margin: 0 auto;
}

.xcqy_msg {
    font-size: 0.28rem;
    line-height: 0.22rem;
    color: #9a4933;
    height: 0.4rem;
    line-height: 0.4rem;
    width: 100%;
    text-align: center;
    margin-bottom: 0.18rem;
}

.bp_fire {
    width: 2.98rem;
    height: 0.98rem;
    background: url(https://img.youxi290.com/khm/xchd2026/mobile/ljdh.png) no-repeat center;
    margin: 0;
    background-size: 100% 100%;
    margin: 0 auto;
}

.xcqy_fire_zi {
    width: 2.5rem;
    height: 4.16rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    margin: 0 auto;
}

.xcqy_fire_zi div {
    width: 3.5rem;
    height: 3.5rem;
    background: url(https://img.youxi290.com/khm/xchd2026/mobile/bp/bp1.png);
    background-size: 8rem 8rem;
    margin: 0;
    background-position: -2.5rem -2.97rem;
}

.xcqy_fire_zi img {
    /* width: 1.2rem;
     */
    margin: 0 0.36rem 0.39rem 0;
}

.xcqy_fire_zi span {
    width: 2.73rem;
    height: 1.17rem;
    background-image: url(https://img.youxi290.com/khm/xchd2026/mobile/other7.png);
    background-size: 100% 100%;
    font-size: 0.24rem;
    color: #fffac9;
    font-weight: bold;
    line-height: 1.39rem;
    text-align: center;
    text-shadow: 0rem 0rem 0.05rem #971e06;
    cursor: pointer;
    display: block;
}

.xcqy_fire_zi span:hover {
    /* background-image: url(https://img.youxi290.com/khm/xchd2026/mobile/bp/ljdhact.png);
     */
}

.xcqy_dh {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.xcqy_dan {
    width: 100%;
    height: 100%;
    position: relative;
    transform: scale(0.2);
}

.xcqy_xfxs {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.xcqy_dh,
.xcqy_dan,
.xcqy_ql,
.xcqy_xfxs {
    transition: all 1.5s ease;
    opacity: 0;
}

.xcqy_dh.show,
.xcqy_ql.show,
.xcqy_xfxs.show {
    opacity: 1;
}

.xcqy_dan.show {
    opacity: 1;
    transform: scale(0.6);
}

.xcqy_dh .dp7,
.xcqy_dh .dp8,
.xcqy_dh .dp9 {
    width: 3.8rem;
    height: 3.8rem;
}

.scqy_danzi {
    width: 3.1rem;
    height: 4.2rem;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    transition: all 1.5s ease;
    opacity: 0;
    pointer-events: none;
    /* 非活动状态不响应点击 */
}

.scqy_danzi.show {
    opacity: 1;
    pointer-events: auto;
    /* 活动状态响应点击 */
}

.scqy_danzi div {
    width: 2.6rem;
    height: 3.2rem;
    position: absolute;
    top: 0.36rem;
    left: 0.24rem;
    cursor: pointer;
    z-index: 4;
}

.xcqy_dan img {
    position: absolute;
    transform: translate(-50%, -50%);
}

.xcqy_dan .dan1 {
    width: 3.5rem;
    top: 40%;
    left: 50%;
    z-index: 2;
}

.xcqy_dan .dan2 {
    width: 1.5rem;
    top: 17%;
    left: 70%;
    z-index: 1;
}

.xcqy_dan .dan3 {
    width: 3rem;
    top: 77%;
    left: 36%;
    z-index: 3;
}

.xcqy_dan .dan4 {
    width: 3.4rem;
    top: 31%;
    left: 50%;
    z-index: 2;
}

.xcqy_dan .dan5 {
    width: 3.4rem;
    top: 66%;
    left: 50%;
    z-index: 2;
}

.xcqy_ql {
    width: 100vw;
    height: 100vh;
    position: fixed;
    right: 0;
    bottom: 0;
    background-color: #00000060;
    transition: opacity 3s ease, transform 3s ease, width 3s ease, height 3s ease;
}

.xcqy_ql.active {
    width: 2.6rem;
    height: 3.2rem;
    position: absolute;
    background: none;
}

.xcqy_ql.active .qltypr {
    width: 3.5rem;
    height: auto;
    top: 0;
    right: 0;
    transform: none;
}

.qltypr {
    position: absolute;
    width: 9.32rem;
    height: 8.69rem;
    top: 50%;
    right: 50%;
    transform: translate(50%, -50%);
    transition: all 3s ease;
}

.actt {
    width: 2.6rem;
    height: 3.2rem;
    bottom: 0.5rem;
    right: 0.2rem;
    position: relative;
}

.gbi {
    width: 0.4rem;
    height: 0.4rem;
    background-image: url(https://img.youxi290.com/khm/xchd2026/mobile/bp/guabi.png);
    background-size: 100% 100%;
    position: absolute;
    top: 0.05rem;
    right: 0.05rem;
    cursor: pointer;
    z-index: 10;
}

.xcqy_xfxs .xfdi {
    width: 7.5rem;
    height: 6.59rem;
    background-image: url(https://img.youxi290.com/khm/xchd2026/mobile/bp/xfdi.png);
    background-size: 100% 100%;
    padding: 2.17rem 0.82rem 1.23rem 1.04rem;
    box-sizing: border-box;
}

.xcqy_xfxs .xfdi span {
    color: #d74d28;
    font-family: '楷体';
    font-size: 0.32rem;
    text-align: left;
    font-weight: bold;
    line-height: 0.6rem;
    display: block;
}

.xchs {
    width: 100%;
    margin: 0 auto;
}

.xchs_content_bg {
    margin-top: 0.21rem;
    width: 100%;
    height: 8.14rem;
    background: url(https://img.youxi290.com/khm/xchd2026/mobile/xchs_bg.png) center no-repeat;
    background-size: 100% 100%;
    position: relative;
}

.xchs_news {
    /* padding-top: 1.28rem;
     */
    transform: translateY(1.5rem);
    width: 5.3rem;
    margin: 0 auto;
    max-height: 4.9rem;
    overflow-y: auto;
    font-size: 0;
    text-align: center;
}

.xchs_news::-webkit-scrollbar {
    width: 4px;
    height: 8px;
}

.xchs_news::-webkit-scrollbar-track {
    border-radius: 10px;
}

/* 滚动条滑块 */
.xchs_news::-webkit-scrollbar-thumb {
    background: #ff9000;
    border-radius: 10px;
}

.xchs_news p {
    display: inline;
    font-size: 0;
}

.xchs_news a {
    display: inline-block;
    width: 4.62rem;
    height: 0.65rem;
    border-radius: 0.32rem;
    border: solid 0.02rem #ff9000;
    background-color: #f5bf9d;
    font-size: 0.24rem;
    font-weight: bold;
    text-align: center;
    line-height: 0.6rem;
    box-sizing: border-box;
    /* margin: 0 0.16rem 0.16rem; */
    margin: 0 auto 0.3rem;
    text-decoration: none;
}

.xchs_news a span {
    font-size: 0.22rem !important;
}

.xchs_new {
    width: 5.71rem;
    height: 0.61rem;
    border: solid 1px #c19e7b;
    font-family: SourceHanSansCN-Regular;
    font-size: 0.24rem;
    line-height: 0.26rem;
    color: #c46824;
    margin-bottom: 0.09rem;
    padding: 0.16rem;
    cursor: pointer;
    transition: 0.3s;
}

.xchs_new:hover {
    /* font-size: 0.24rem;
     */
    color: #763211;
    background-color: #d1b191;
}

.xchs_new:hover .new_img {
    background: url(https://img.youxi290.com/khm/xchd2026/mobile/xchs_xw_active.png) center no-repeat;
    background-size: 100%;
}

.xchs_new a {
    color: inherit;
    text-decoration: none;
}

.new_img {
    display: inline-block;
    width: 0.56rem;
    height: 0.29rem;
    background: url(https://img.youxi290.com/khm/xchd2026/mobile/xchs_xw.png) center no-repeat;
    background-size: 100%;
    float: left;
}

.new_time {
    float: right;
}

.new_content {
    margin-left: 0.1rem;
}

.left_fix {
    position: fixed;
    top: 50%;
    left: 0.4rem;
    width: 2.3rem;
    height: 4.32rem;
    z-index: 10;
    /* 默认隐藏：用过渡做平滑出现/消失 */
    opacity: 0;
    transform: translateY(-50%);
    pointer-events: none;
    transition: opacity 260ms cubic-bezier(0.22, 1, 0.36, 1), transform 260ms cubic-bezier(0.22, 1, 0.36, 1);
    will-change: opacity, transform;
}

.left_fix.is-visible {
    opacity: 1;
    /* transform: translateY(0);
     */
    pointer-events: auto;
}

.left_fix .line {
    width: 0.12rem;
    height: 3.93rem;
    background: url(https://img.youxi290.com/khm/xchd2026/mobile/left_fix_line.png) center no-repeat;
    background-size: 100% 100%;
    margin: 0;
    position: absolute;
}

.left_fix>div:not(.line):not(.gotoTop) {
    width: 2.3rem;
    height: 0.7rem;
    cursor: pointer;
    font-size: 0.24rem;
    color: #fffdbd;
    transition: 0.3s;
    margin-bottom: 0.27rem;
    margin-left: -0.15rem;
    text-align: center;
    line-height: 0.6rem;
    padding-left: 0.1rem;
}

.left_fix>div:not(.line):not(.gotoTop):hover {
    /* font-weight: bold;
     */
    background: url(https://img.youxi290.com/khm/xchd2026/mobile/left_fix_active.png) center no-repeat;
    background-size: 100% 100%;
}

.gotoTop {
    width: 2.3rem;
    height: 0.7rem;
    cursor: pointer;
    font-size: 0.24rem;
    color: #fffdbd;
    transition: 0.3s;
    margin-bottom: 0.27rem;
    margin-left: -0.15rem;
    text-align: center;
    line-height: 0.6rem;
    padding-left: 0.1rem;
}

.gotoTop:hover {
    background: url(https://img.youxi290.com/khm/xchd2026/mobile/gotop.png) center no-repeat;
    background-size: 100% 100%;
}

.alert_outbox {
    width: 100vw;
    height: 100vh;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 101;
    background: rgba(0, 0, 0, 0.5);
    /* display: none;
     */
}

.small_alert {
    width: 7.07rem;
    height: 3.8rem;
    background: url(https://img.youxi290.com/khm/xchd2026/mobile/small_alert.png) center no-repeat;
    background-size: 100% 100%;
    font-size: 0;
}

.small_alert.act1 {
    width: 100%;
    height: 5.12rem;
    padding-top: 0.2rem;
}

/* 切换服务器弹窗（按截图的“2个下拉 + 底部2按钮”布局） */
.qiehuan_modal {
    padding: 0 0.7rem;
}

.qiehuan_title {
    margin-top: 0.34rem;
}

.qiehuan_form {
    margin-top: 0.16rem;
    display: flex;
    flex-direction: column;
    gap: 0.18rem;
}

.qiehuan_row {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.1rem;
}

.qiehuan_label {
    width: 1rem;
    text-align: right;

    font-size: 0.24rem;
    color: #9f462a;
    letter-spacing: 0.01rem;
}

.qiehuan_select {
    padding: 0 0.1rem;
    width: 2.33rem;
    height: 0.4rem;
    background-color: #fffdf3;
    border-radius: 0.03rem;
    border: solid 1px #e87944;
    outline: none;
    font-size: 0.24rem;
}

.qiehuan_actions {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0.65rem;
    display: flex;
    justify-content: center;
    /* gap: 0.27rem;
     */
}

.qiehuan_actions .alert_btn {
    margin-left: 0;
    /* 覆盖通用样式里的 margin-left */
}

.alert_close {
    width: 0.78rem;
    height: 0.78rem;
    background: url(https://img.youxi290.com/khm/xchd2026/mobile/pay_close.png) center no-repeat;
    background-size: 100% 100%;
    transition: 0.3s;
    cursor: pointer;
    position: absolute;
    bottom: -0.72rem;
    right: 0;
    left: 0;
    margin: 0 auto;
}

.alert_close:hover {
    background-image: url(https://img.youxi290.com/khm/xchd2026/mobile/pay_close_active.png);
}

.alert_outbox .title,
.alert_outbox .jian {
    font-family: SourceHanSansCN-Bold;
    font-size: 0.36rem;
    line-height: 0.5rem;
    font-weight: bold;
    margin-top: 0.5rem;
}

.jian {
    background-image: linear-gradient(to bottom,
            /* 渐变方向：从上到下 */
            #b93e13 0%,
            /* 起始颜色和位置 */
            #d51111 100%
            /* 结束颜色和位置 */
        );
    -webkit-background-clip: text;
    background-clip: text;
    /* 使文字颜色透明，显示背景渐变 */
    color: transparent;
    -webkit-text-fill-color: transparent;
    /* 可选：添加文字阴影增强可读性 */
    /* text-shadow: 0 0.02rem 0.04rem rgba(0, 0, 0, 0.1);
     */
    /* 居中显示 */
    /* margin: 0.5rem auto;
     */
    text-align: center;
    /* width: fit-content;
     */
}

.qrcode {
    margin: 0 auto;
    margin-top: 0.1rem;
    margin-bottom: 0.1rem;
    /* background-color: white;
     */
    text-align: center;
}

.qrcode img {
    width: 1.4rem;
    margin: 0 0.05rem;
}

.alert_outbox p {
    text-align: center;
    color: #9f462a;
}

.alert_msg {
    font-size: 0.24rem;
    height: 1.15rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.alert_msg p {
    margin: 0;
    line-height: 0.28rem;
}

.alert_btns {
    height: 0.66rem;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 0.05rem;
}

.alert_btn {
    display: inline-block;
    width: 2.25rem;
    height: 0.66rem;
    background: url(https://img.youxi290.com/khm/xchd2026/mobile/alert_btn.png) center no-repeat;
    background-size: 100% 100%;
    transition: 0.3s;
    cursor: pointer;
    font-size: 0.3rem;
    color: #fff4df;
    text-align: center;
    /* margin-left: 1.13rem;
     */
    line-height: 0.6rem;
    margin: 0 0.22rem;
}

.alert_btn:hover {
    background-image: url(https://img.youxi290.com/khm/xchd2026/mobile/alert_btn_active.png);
}

.rule_alert {
    width: 100%;
    height: 7.7rem;
    background: url(https://img.youxi290.com/khm/xchd2026/mobile/rule_alert.png) center no-repeat;
    background-size: 100% 100%;
}

.rule_close {
    /* top: 0.5rem;
     */
    /* right: 0.8rem;
     */
}

.alert_outbox .rule_title {
    margin-top: 0.5rem;
    font-size: 0.3rem;
}

.rule_content {
    margin: 0.2rem auto 0;
    width: 6rem;
    height: 5.5rem;
    overflow: auto;
}

.rule_content p {
    font-size: 0.24rem;
    line-height: 0.38rem;
    color: #9f462a;
    text-align: left;
    margin-top: 0.1rem;
}

.prize_alert {
    width: 9.41rem;
    height: 4.71rem;
    background: url(https://img.youxi290.com/khm/xchd2026/mobile/prize_alert.png) center no-repeat;
    background-size: 100% 100%;
}

.prize_close {
    top: 0.5rem;
    right: 0.8rem;
}

.alert_outbox .prize_title {
    margin-top: 0.4rem;
}

.treasure {
    /* width: 9.71rem;
     */
    /* height: 4.86rem;
     */
}

/* 奖池弹窗 */
.prizepool_tab_hint {
    width: 7.58rem;
    margin: 0 auto;
    padding-bottom: 0.06rem;
    font-size: 0.14rem;
    color: #6b2a10;
    opacity: 0.8;
}

.prizepool_tabs {
    width: 6rem;
    margin: 0 auto;
    display: flex;
    overflow: hidden;
}

.prizepool_tab {
    position: relative;
    flex: 1;
    height: 0.66rem;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.26rem;
    letter-spacing: 0.02rem;
    border: solid 1px rgba(191, 59, 25, 0.4);
    cursor: pointer;
}

.prizepool_tab.is-green {
    color: #294e37;
}

.prizepool_tab.is-blue {
    color: #1d4567;
}

.prizepool_tab.is-purple {
    color: #4a2679;
}

.prizepool_tab.is-orange {
    color: #bf3b19;
}

.prizepool_tab.is-active {
    background: rgb(192, 175, 150, 0.5) !important;
}

.prize_cards.prize_cards_grid {
    width: 6.2rem;
    height: 5.3rem;
    margin: 0.25rem auto 0;
    overflow-y: auto;
}

.prize_cards::-webkit-scrollbar {
    width: 0.1rem;
}

.prize_cards::-webkit-scrollbar-thumb {
    background-color: #ecb48c;
    border-radius: 0.08rem;
}

.prize_cards::-webkit-scrollbar-track {
    background-color: #e2cebe;
    border-radius: 0.08rem;
}

.prize_card {
    display: inline-block;
    width: 1.5rem;
    height: 1.6rem;
    position: relative;
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    margin-left: 0;
    position: relative;
}

.prize_card img {
    position: absolute;
    width: 0.96rem;
    height: 0.96rem;
    left: 0.27rem;
    top: 0.29rem;
}

.prize_card_name {
    position: absolute;
    left: 0;
    right: 0;
    bottom: -0.16rem;
    text-align: center;
    font-size: 0.24rem;
    color: #333;
}

/* 寻宝记录弹窗表格 */
.record_content {
    width: 6rem;
    height: 5.7rem;
    margin: 0.26rem auto 0;
    display: flex;
    align-items: center;
}

.record_table {
    width: 100%;
    border: 2px solid #b34c2b;
    border-radius: 0.03rem;
    /* overflow: hidden;
     */
    background: rgba(255, 240, 221, 0.55);
}

.record_row {
    display: flex;
    width: 100%;
    height: 0.66rem;
}

.record_row+.record_row {
    border-top: 0.01rem solid #b34c2b;
}

.record_header {
    height: 0.68rem;
    background: #da916d;
}

.record_list {
    width: 100%;
    max-height: 5.2rem;
    min-height: 0.44rem;
    overflow-y: auto;
}

.record_list::-webkit-scrollbar {
    display: none;
}

.record_col {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;

    font-size: 0.24rem;
    color: #7a2f12;
    letter-spacing: 0.01rem;
    padding: 0.05rem;
}

.record_col.quality1 {
    color: #53b901;
}

.record_col.quality2 {
    color: #12d1ff;
}

.record_col.quality3 {
    color: #c200ff;
}

.record_col.quality4 {
    color: #ff7800;
}

.record_col+.record_col {
    border-left: 0.01rem solid #b34c2b;
}

.record_header .record_col {
    font-size: 0.24rem;
    color: #722800;
}

.qsyo {
    width: 1.32rem;
    height: 0.44rem;
    font-size: 0.22rem;
    border-radius: 0.22rem;
    background-color: #cd1818;
    color: #ffffff;
    text-align: center;
    line-height: 0.44rem;
}

.qsyo.active {
    background-color: #666666;
}

.record_empty {
    width: 100%;
    height: 2.2rem;
    display: flex;
    align-items: center;
    justify-content: center;

    font-size: 0.24rem;
    color: #9f462a;
}

.store_alert {
    width: 100%;
    height: 11.85rem;
    background: url(https://img.youxi290.com/khm/xchd2026/mobile/store_alert.png) center no-repeat;
    background-size: 100% 100%;
    padding-top: 1.61rem;
}

.store_close {
    width: 0.94rem;
    height: 0.94rem;
    background: url(https://img.youxi290.com/khm/xchd2026/mobile/store_close.png) center no-repeat;
    background-size: 100% 100%;
    cursor: pointer;
    transition: 0.3s;
    position: absolute;
    bottom: -0.28rem;
    left: 0;
    right: 0;
    margin: 0 auto;
}

.store_close:hover {
    background-image: url(https://img.youxi290.com/khm/xchd2026/mobile/store_close_active.png);
}

.store_title {
    font-family: SourceHanSansCN-Bold;
    font-size: 0.44rem;
    line-height: 0.54rem;
    color: #3c6249;
    text-align: center;
    background-image: linear-gradient(to bottom,
            /* 渐变方向：从上到下 */
            #f9eab5 0%,
            /* 起始颜色和位置 */
            #fff5e7 100%
            /* 结束颜色和位置 */
        );
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
    height: 0.54rem;
    margin-bottom: 0.26rem;
}

.store_jf {
    font-size: 0.32rem;
    line-height: 0.4rem;
    color: #5d280d;
    /* margin-left: 7.3rem;
     */
    width: 100%;
    height: 0.4rem;
    text-align: center;
    margin-bottom: 0.15rem;
}

.prize_lists {
    width: 6rem;
    height: 7rem;
    margin: 0 auto;
    overflow-y: auto;
}

.prize_lists::-webkit-scrollbar {
    display: none;
}

.prize_list {
    display: block;
    width: 2rem;
    /* height: 1.76rem;
     */
    margin-left: 0;
    margin-bottom: 0.35rem;
    float: left;
}

.xianl {
    font-size: 0.24rem;
    color: #ab2800;
    text-align: center;
}

.prize {
    width: 1rem;
    height: 1rem;
    background-color: #4c2919;
    box-shadow: 0rem 0.02rem 0.15rem 0.01rem rgba(135, 54, 0, 0.54);
    border-style: solid;
    border-width: 0.03rem;
    border-image-source: linear-gradient(-44deg, #b78838 0%, #f1d971 100%);
    border-image-slice: 1;
    margin: 0.09rem auto 0;
}

.prize img {
    float: left;
    width: 96%;
    height: 96%;
    margin: 1%
}

.prize_name {
    width: 100%;
    height: 0.29rem;
    /* 背景放到伪元素里做两侧“虚化/羽化” */
    background-color: transparent;
    text-align: center;
    font-family: SourceHanSansCN-Bold;
    font-size: 0.24rem;
    color: #821b00;
    margin-top: 0.17rem;
    position: relative;
    z-index: 0;
    overflow: hidden;
    text-align: center;
}

.prize_name::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    /* 只让背景变透明，不影响文字 */
    /* background-color: rgba(236, 208, 123, 0.7);
     */
    /* border: 1px solid transparent;
     */
    /* box-sizing: border-box;
     */
    /* border-image-source: linear-gradient(0deg, #c16747 0%, #c8775e 100%);
     */
    /* border-image-slice: 1;
     */
    /* -webkit-mask-image: linear-gradient(to right, transparent 0%, #000 18%, #000 82%, transparent 100%);
     */
    /* mask-image: linear-gradient(to right, transparent 0%, #000 18%, #000 82%, transparent 100%);
     */
    /* -webkit-mask-size: 100% 100%;
     */
    /* mask-size: 100% 100%;
     */
    /* -webkit-mask-repeat: no-repeat;
     */
    /* mask-repeat: no-repeat;
     */
    /* pointer-events: none;
     */
}

.prize_jf {
    width: 1.69rem;
    height: 0.58rem;
    background: url(https://img.youxi290.com/khm/xchd2026/mobile/exchange_btn.png) center no-repeat;
    background-size: 100% 100%;
    cursor: pointer;
    transition: 0.3s;
    text-align: center;
    font-size: 0.23rem;
    color: #fffaef;
    margin-top: 0.14rem;
    line-height: 0.58rem;
    margin: 0.17rem auto 0;
}

.prize_jf.gray {
    filter: grayscale(0.8) !important;
}

.prize_jf:hover {
    background-image: url(https://img.youxi290.com/khm/xchd2026/mobile/store_get_active.png);
}

.exchange_alert {
    width: 7.07rem;
    height: 5.24rem;
    background: url(https://img.youxi290.com/khm/xchd2026/mobile/exchange_alert.png) center no-repeat;
    background-size: 100% 100%;
    position: relative;
}

.exchange_close {
    width: 0.95rem;
    height: 0.94rem;
    background: url(https://img.youxi290.com/khm/xchd2026/mobile/store_close.png) center no-repeat;
    background-size: 100% 100%;
    cursor: pointer;
    transition: 0.3s;
    position: absolute;
    bottom: -0.74rem;
    right: 0;
    z-index: 20;
    left: 0;
    margin: 0 auto;
}

.exchange_close:hover {
    background-image: url(https://img.youxi290.com/khm/xchd2026/mobile/exchange_close_active.png);
}

.exchange_btn {
    width: 1.69rem;
    height: 0.58rem;
    background: url(https://img.youxi290.com/khm/xchd2026/mobile/exchange_btn.png) center no-repeat;
    background-size: 100% 100%;
    cursor: pointer;
    transition: 0.3s;
    /* font-family: SourceHanSansCN-Bold;
     */
    font-size: 0.24rem;
    letter-spacing: 0.01rem;
    color: #640e00;
    text-align: center;
    line-height: 0.58rem;
}

.exchange_btn:hover {
    background-image: url(https://img.youxi290.com/khm/xchd2026/mobile/exchange_btn_active.png);
}

.exchange_text {
    position: absolute;
    left: 0;
    right: 0;
    top: 0.4rem;
    text-align: center;
    color: #7a2f12;
}

.exchange_title_small {
    font-size: 0.26rem;
    margin-bottom: 0.1rem;
}

.exchange_title_big {
    font-size: 0.33rem;
    letter-spacing: 0.01rem;
    color: #b93e13;
    /* font-weight: bold;
     */
}

.exchange_item_content {
    width: 1.2rem;
    height: 1.2rem;
    background-color: #4c2919;
    box-shadow: 0rem 0.02rem 0.15rem 0.01rem rgba(135, 54, 0, 0.54);
    border-style: solid;
    border-width: 0.03rem;
    border-image-source: linear-gradient(-44deg, #b78838 0%, #f1d971 100%);
    border-image-slice: 1;
    margin: 0.24rem auto 0.15rem;
}

.exchange_item_content img{
    width: 96%;
    height: 96%;
    margin: 2%;
}

.exchange_item_name {
    margin-top: 0.15rem;

    font-size: 0.28rem;
    line-height: 0.32rem;
    color: #a55a3a;
}

.exchange_qty_row {
    margin-top: 0.1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.1rem;

    font-size: 0.24rem;
    color: #a55a3a;
}

.exchange_step {
    width: 0.4rem;
    height: 0.4rem;
    border: 1px solid #c19e7b;
    background: rgba(255, 240, 221, 0.55);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    line-height: 1;
}

.exchange_qty_num {
    width: 0.39rem;
    text-align: center;
    font-family: SourceHanSansCN-Bold;
    font-size: 0.28rem;
    color: #b93e13;
}

.exchange_btns {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0.63rem;
    display: flex;
    justify-content: center;
    gap: 0.44rem;
}

.pay_alert {
    width: 7.47rem;
    height: 4.37rem;
    background: url(https://img.youxi290.com/khm/xchd2026/mobile/pay_alert.png) center no-repeat;
    background-size: 100% 100%;
    position: relative;
    padding-top: 0.64rem;
}

.pay_back {
    position: absolute;
    top: 0.57rem;
    left: 0.91rem;
    height: 0.24rem;
    line-height: 0.24rem;
    padding-left: 0.15rem;
    background: url(https://img.youxi290.com/khm/xchd2026/mobile/pay_back.png) left center no-repeat;
    background-size: auto 100%;
    font-size: 0.24rem;
    color: #9f462a;
    cursor: pointer;
    text-indent: 0.1rem;
}

.pay_title {
    text-align: center;
    font-family: SourceHanSansCN-Bold;
    font-size: 0.32rem;
    color: #651d0f;
}

.pay_price {
    margin-top: 0.3rem;
    text-align: center;
    color: #b93e13;
}

.pay_price_num {
    font-family: SourceHanSansCN-Bold;
    font-size: 0.48rem;
    letter-spacing: 0.02rem;
    font-weight: bold;
}

.pay_price_unit {

    font-size: 0.22rem;
}

.pay_qty_row {
    margin-top: 0.26rem;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.08rem;

    font-size: 0.16rem;
    color: #a55a3a;
}

.pay_step {
    width: 0.22rem;
    height: 0.22rem;
    border: 1px solid #c19e7b;
    background: rgba(255, 240, 221, 0.55);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.pay_qty_input {
    width: 0.56rem;
    height: 0.22rem;
    border: 1px solid #c19e7b;
    background: rgba(255, 240, 221, 0.35);
    text-align: center;
    font-family: SourceHanSansCN-Bold;
    font-size: 0.16rem;
    color: #b93e13;
    outline: none;
}

.pay_btn {
    width: 2.28rem;
    height: 0.62rem;
    margin: 0.43rem auto 0;
    background: url(https://img.youxi290.com/khm/xchd2026/mobile/pay_btn.png) center no-repeat;
    background-size: 100% 100%;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: SourceHanSansCN-Bold;
    font-size: 0.24rem;
    color: #640e00;
    transition: 0.3s;
}

.pay_btn:hover {
    background: url(https://img.youxi290.com/khm/xchd2026/mobile/pay_btn_active.png) center no-repeat;
    background-size: 100% 100%;
}

.pay_method_list {
    width: 4.2rem;
    margin: 0.32rem auto 0;
    border-radius: 0.04rem;
    overflow: hidden;
    box-shadow: 0 0 0 0.01rem rgba(175, 117, 76, 0.45);
}

.pay_method_item {
    height: 0.6rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 0.24rem;
    background-color: #fffcec;
    cursor: pointer;
}

.pay_method_item+.pay_method_item {
    border-top: 0.01rem solid rgba(201, 165, 123, 0.7);
}

.pay_method_item.active {
    background-color: #e3dec8;
}

.pay_method_left {
    display: flex;
    align-items: center;
    gap: 0.1rem;
}

.pay_method_icon {
    width: 0.3rem;
    height: 0.3rem;
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100% 100%;
}

.pay_method_icon--alipay {
    background-image: url(https://img.youxi290.com/khm/xchd2026/mobile/alipay.png);
}

.pay_method_icon--wechat {
    background-image: url(https://img.youxi290.com/khm/xchd2026/mobile/wechat.png);
}

.pay_method_text {

    font-size: 0.16rem;
    color: #5b240d;
}

.pay_method_check {
    width: 0.2rem;
    height: 0.2rem;
    background: url(https://img.youxi290.com/khm/xchd2026/mobile/pay_dui.png) center no-repeat;
    background-size: 100% 100%;
}

.pay_content {
    margin-top: 0.8rem;
    margin-bottom: 0.74rem;
    text-align: center;
    font-size: 0.28rem;
    letter-spacing: 0.01rem;
    color: #a03c29;
}

.pay_close {
    width: 0.94rem;
    height: 0.94rem;
    background: url(https://img.youxi290.com/khm/xchd2026/mobile/store_close.png) center no-repeat;
    background-size: 100% 100%;
    cursor: pointer;
    transition: 0.3s;
    position: absolute;
    bottom: -0.78rem;
    left: 0;
    right: 0;
    margin: 0 auto;
}

.pay_close:hover {
    /* background: url(https://img.youxi290.com/khm/xchd2026/mobile/pay_close_active.png) center no-repeat;
     */
    /* background-size: cover;
     */
}

.hs {
    width: 1.14rem;
    height: 1.12rem;
    background-size: 100% 100%;
}

.pay_item {
    font-size: 0.24rem;
    margin-top: 0.3rem;
}

.pay_hs {
    margin: 0.1rem auto 0;
}

.hs_normal {
    background-image: url(https://img.youxi290.com/khm/xchd2026/mobile/hs_normal.png);
}

.hs_cyan {
    background-image: url(https://img.youxi290.com/khm/xchd2026/mobile/hs_cyan.png);
}

.hs_orange {
    background-image: url(https://img.youxi290.com/khm/xchd2026/mobile/hs_orange.png);
}

.hs_green {
    background-image: url(https://img.youxi290.com/khm/xchd2026/mobile/hs_green.png);
}

.hs_purple {
    background-image: url(https://img.youxi290.com/khm/xchd2026/mobile/hs_purple.png);
}

.bag_content {
    width: 6rem;
    margin: 0.26rem auto 0;
}

.bag_header {
    padding-bottom: 0.06rem;
    border-bottom: solid 0.02rem #e54d30;
    margin-bottom: 0.06rem;
}

.bag_header_row {
    display: flex;
    height: 0.44rem;
    align-items: center;

    font-size: 0.18rem;
    color: #7a2f12;
}

.bag_header_row .bag_col {
    font-size: 0.24rem;
}

.bag_select_all {
    display: flex;
    align-items: center;
    cursor: pointer;
    gap: 0.06rem;
    justify-content: center;
    white-space: nowrap;
    width: 100%;
}

.bag_checkbox {
    width: 0.24rem;
    height: 0.24rem;
    border-radius: 50%;
    border: 2px solid #c19e7b;
    background: rgba(255, 240, 221, 0.65);
    flex-shrink: 0;
}

.bag_select_all_text {
    white-space: nowrap;
    flex-shrink: 0;
    font-size: 0.24rem;
}

.bag_header_label {
    min-width: 0.48rem;
}

.bag_quality_filter select {
    width: 0.72rem;
    height: 0.3rem;
    padding: 0 0.08rem;
    border-radius: 0.04rem;
    border: 1px solid #c19e7b;
    background: rgba(255, 240, 221, 0.85);
    font-family: inherit;
    font-size: 0.14rem;
    color: #7a2f12;
    outline: none;
    appearance: none;
}

.bag_header_score {
    /* font-family: SourceHanSansCN-Bold;
     */
    font-size: 0.24rem;
    color: #7a2f12;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    margin-left: 0.9rem;
}

.bag_score {
    color: #b93e13;
    margin-left: 0.04rem;
}

.bag_table {
    width: 100%;
    border-radius: 0.03rem;
    overflow: hidden;
}

.bag_table_head {
    display: flex;
    height: 0.42rem;
    background: #da916d;
}

.bag_table_body {
    max-height: 2rem;
    overflow-y: auto;
}

.bag_table_body::-webkit-scrollbar {
    width: 0.1rem;
}

.bag_table_body::-webkit-scrollbar-thumb {
    background-color: #ecb48c;
    border-radius: 0.08rem;
}

.bag_table_body::-webkit-scrollbar-track {
    background-color: #e2cebe;
    border-radius: 0.08rem;
}

.bag_row {
    display: flex;
    height: 0.72rem;
    /* border-top: 0.01rem solid #b34c2b;
     */
    border-bottom: solid 0.01rem #9c7770;
}

.bag_col {
    display: flex;
    align-items: center;
    justify-content: center;

    font-size: 0.24rem;
    color: #7a2f12;
}

.bag_col_check {
    width: 0.8rem;
    flex: 0 0 auto;
}

.bag_col_name {
    width: 0.92rem;
}

.bag_col_quality {
    /* flex: 1;
     */
    width: 1.8rem;
}

.bag_col_actions {
    flex: 1.6;
    gap: 0.12rem;
}

.bag_select {
    padding: 0 0.1rem;
    width: 1.2rem;
    height: 0.4rem;
    background-color: #fffdf3;
    border-radius: 0.03rem;
    border: solid 1px #e87944;
    outline: none;
    margin-left: 0.1rem;
    font-size: 0.22rem;
    line-height: 0.24rem;
}

.bag_select option {
    font-size: 0.24rem;
}

.bag_radio {
    width: 0.24rem;
    height: 0.24rem;
    border-radius: 50%;
    border: 2px solid #c19e7b;
    background: rgba(255, 240, 221, 0.65);
    box-sizing: border-box;
    cursor: pointer;
}

.bag_radio.is-checked {
    position: relative;
}

.bag_radio.is-checked::after {
    content: "";
    position: absolute;
    /* inset: 0.03rem;
     border-radius: 50%;
     background: linear-gradient(180deg,#ffdfb8 0%,#e66a34 100%);
     */
    width: 0.15rem;
    height: 0.22rem;
    top: -0.08rem;
    left: 0;
    background: url(https://img.youxi290.com/khm/xchd2026/mobile/bag_dui.png) center no-repeat;
    background-size: cover;
}

.bag_checkbox.is-checked {
    position: relative;
}

.bag_checkbox.is-checked::after {
    content: "";
    position: absolute;
    width: 0.15rem;
    height: 0.22rem;
    top: -0.05rem;
    left: 0.02rem;
    background: url(https://img.youxi290.com/khm/xchd2026/mobile/bag_dui.png) center no-repeat;
    background-size: cover;
}

.bag_action_btn {
    width: 1.27rem;
    height: 0.41rem;
    padding: 0 0.1rem;

    font-size: 0.14rem;
    color: #fff7e5;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: 0.3s;
    background-image: url(https://img.youxi290.com/khm/xchd2026/mobile/bag_btn.png);
    background-size: cover;
    background-repeat: no-repeat;
    font-size: 0.24rem;
}

.bag_action_btn:hover {
    background-image: url(https://img.youxi290.com/khm/xchd2026/mobile/bag_btn_active.png);
}

.bag_footer {
    position: absolute;
    bottom: 0.79rem;
    right: 0;
    display: flex;
    justify-content: center;
    gap: 0.4rem;
    left: 0;
}

.bag_footer_btn {
    width: 2.25rem;
    height: 0.66rem;
    /* font-family: SourceHanSansCN-Bold;
     */
    font-size: 0.24rem;
    color: #fff7e7;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: 0.3s;
    background-image: url(https://img.youxi290.com/khm/xchd2026/mobile/alert_btn.png);
    background-size: cover;
    background-repeat: no-repeat;
}

.bag_footer_btn:hover {
    background-image: url(https://img.youxi290.com/khm/xchd2026/mobile/alert_btn_active.png);
}

.card_alert {
    width: 7.14rem;
    height: 8.75rem;
    background: url(https://img.youxi290.com/khm/xchd2026/mobile/xcqy_bg.png) center no-repeat;
    background-size: cover;
    position: relative;
}

.card_close {
    width: 0.78rem;
    height: 0.78rem;
    background: url(https://img.youxi290.com/khm/xchd2026/mobile/pay_close.png) center no-repeat;
    background-size: 100% 100%;
    transition: 0.3s;
    cursor: pointer;
    position: absolute;
    bottom: -0.72rem;
    right: 0;
    left: 0;
    margin: 0 auto;
}

.card_text {
    width: 2.61rem;
    height: 0.58rem;
    background: url(https://img.youxi290.com/khm/xchd2026/mobile/card_text.png) center no-repeat;
    background-size: cover;
}

.card_prize {
    width: 1.4rem;
    height: 1.45rem;
    background: url(https://img.youxi290.com/khm/xchd2026/mobile/card_prize.png) center no-repeat;
    background-size: cover;
    position: absolute;
    right: 0.29rem;
    top: 0.15rem;
    cursor: pointer;
    font-size: 0.26rem;
    line-height: 0.3rem;
    color: #fff3d8;
    text-align: center;
    padding-top: 0.64rem;
    text-shadow: 0.01rem 0.01rem 0.01rem #000;
}

.card_prize p {
    color: #fff3d8;
}

.card_header {
    position: absolute;
    top: 0.86rem;
    left: 0.3rem;
    right: 0;
    height: 0.82rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    pointer-events: none;
}

.card_tip_left {
    display: flex;
    align-items: center;
}

.card_tip_left .card_text {
    font-size: 0.2rem;
    color: #fff9c2;
    padding-left: 0.28rem;
}

.card_text {
    display: flex;
    align-items: center;
    justify-content: center;

    font-size: 0.16rem;
    color: #722800;
    text-shadow: 0 0.01rem 0 rgba(255, 255, 255, 0.35);
}

.card_tip_right {
    /* 
     */
    font-size: 0.24rem;
    color: #fff9c2;
    letter-spacing: 0.01rem;
    text-shadow: 0 0.01rem 0 rgba(255, 255, 255, 0.35);
    background: url(https://img.youxi290.com/khm/xchd2026/mobile/card_text.png) no-repeat center;
    background-size: 100%;
    width: 3.94rem;
    height: 0.82rem;
    text-indent: 1.1rem;
    line-height: 0.93rem;
}

.card_grid {
    position: absolute;
    left: 0.27rem;
    top: 2.21rem;
    height: 4rem;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: flex-start;
    width: 6.6rem;
}

.card_grid.card_before {
    top: 1.5rem;
}

.card_grid>div {
    width: 100%;
    height: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: flex-start;
}

.card_grid.card_grid_single>div {
    justify-content: center;
    align-items: center;
    align-content: center;
}

.card_slot {
    background-repeat: no-repeat;
    background-position: center;
}

.card_hs {
    width: 1.16rem;
    height: 1.17rem;
    margin-top: 0.2rem;
    background: none no-repeat;
    background-size: 100%;
    position: relative;
}

.card_hs img {
    width: 60%;
    height: 60%;
    margin: 20%;
}

.card_hs span {
    position: absolute;
    width: 100%;
    bottom: 0.1rem;
    left: 0;
    text-align: center;
    color: #fff;
    text-shadow: 0.01rem 0.01rem 0.07rem rgb(0 0 0), 0.02rem 0.02rem 0.11rem rgb(0 0 0), 0.02rem 0.02rem 0.11rem rgb(0 0 0);
    font-size: 0.2rem;
}

.card_slot:nth-child(2),
.card_slot:nth-child(4),
.card_slot:nth-child(7),
.card_slot:nth-child(9) {
    transform: translateY(0.73rem);
}

.card_slot:nth-child(3),
.card_slot:nth-child(8) {
    transform: translateY(0.43rem);
}

.card_footer {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 1.34rem;
    display: flex;
    align-items: flex-end;
    justify-content: center;
}

.card_draw_group {
    width: 2.6rem;
    text-align: center;
}

.card_draw_label {
    font-size: 0.22rem;
    color: #df3f0e;
    letter-spacing: 0.02rem;
    margin-bottom: -0.05rem;
}

.card_draw_btn {
    width: 2.49rem;
    height: 0.8rem;
    cursor: pointer;
    transition: 0.3s;
    background: url(https://img.youxi290.com/khm/xchd2026/mobile/card_one.png) center no-repeat;
    background-size: cover;
}

.card_draw_btn:hover {
    background: url(https://img.youxi290.com/khm/xchd2026/mobile/card_one_active.png) center no-repeat;
    background-size: cover;
}

.card_draw_btn.is-ten {
    background: url(https://img.youxi290.com/khm/xchd2026/mobile/card_ten.png) center no-repeat;
    background-size: cover;
}

.card_draw_btn.is-ten:hover {
    background: url(https://img.youxi290.com/khm/xchd2026/mobile/card_ten_active.png) center no-repeat;
    background-size: cover;
}

.fix {
    position: fixed;
    z-index: 4;
}

.float {
    top: 10%;
    left: 0.1rem;
    width: 2.66rem;
    height: 3.44rem;
    cursor: pointer;
    transition: 0.3s;
    background: url(https://img.youxi290.com/khm/xchd2026/mobile/float.png) center no-repeat;
    background-size: cover;
}

.join {
    top: 1.9rem;
    right: 0;
    width: 1.84rem;
    height: 2.22rem;
    cursor: pointer;
    transition: 0.3s;
    background: url(https://img.youxi290.com/khm/xchd2026/mobile/gfhb.png) center no-repeat;
    background-size: cover;
    padding-top: 1.78rem;
}

.fix p {
    text-align: center;
    font-size: 0.23rem;
    font-weight: normal;
    font-stretch: normal;
    line-height: 0.22rem;
    letter-spacing: 0rem;
    color: #ffebb0;
    text-shadow: 0 0 0.04rem rgba(82, 24, 5, 0.74), 0 0 0.08rem rgba(82, 24, 5, 0.74);
}

.fix span {
    margin-top: 0.08rem;
    font-size: 0.2rem;
    line-height: 0.22rem;
    color: #ffebb0;
    display: block;
    text-align: center;
    text-shadow: 0 0 0.04rem rgba(82, 24, 5, 0.74), 0 0 0.08rem rgba(82, 24, 5, 0.74);
}

.hs_2 {
    background-image: url(https://img.youxi290.com/khm/xchd2026/mobile/hs_cyan.png);
}

.hs_4 {
    background-image: url(https://img.youxi290.com/khm/xchd2026/mobile/hs_orange.png);
}

.hs_1 {
    background-image: url(https://img.youxi290.com/khm/xchd2026/mobile/hs_green.png);
}

.hs_3 {
    background-image: url(https://img.youxi290.com/khm/xchd2026/mobile/hs_purple.png);
}

.hs_0 {
    background-image: url(https://img.youxi290.com/khm/xchd2026/mobile/hs_normal.png);
}

.codebox {
    width: 2.56rem;
    height: 2.56rem;
    display: block;
    margin: 0.46rem auto 0;
}

.codebox .code {
    width: 2.56rem;
    height: 2.56rem;
}

.alert_success {
    height: 4.6rem;
    padding-top: 0.5rem;
}

.alert_success span {
    height: 0.56rem;
    line-height: 0.56rem;
    display: block;
    text-align: center;
    font-size: 0.24rem;
    color: #a03c29;
}

.alert_success .pay_back {
    top: 0.64rem;
}

.swiper-container {
    width: 5.8rem;
    height: 4.7rem;
}

.swiper-slide {
    background-position: center;
    background-size: cover;
    width: 100%;
}

.swiper-button-prev {
    background-image: url(https://img.youxi290.com/khm/xchd2026/mobile/sjx.png);
    background-size: 100%;
    transform: rotateY(180deg);
}

.swiper-button-next {
    background-image: url(https://img.youxi290.com/khm/xchd2026/mobile/sjx.png);
    background-size: 100%;
}