@import "reset.css";
@import "pop.css";
@import "animate.css";

/*** page ***/
@font-face {
    font-family: syst;
    src: url("//game.gtimg.cn/images/yxzj/cp/xxxx23333/font/SourceHanSerifCN-SemiBold.ttf") format("truetype");
    font-weight: 600;
    font-style: normal;
}
/* // 引入 MFXINGYAN_NONCOMMERCIAL-REGULAR.OTF  */
@font-face {
    font-family: MFXINGYAN_NONCOMMERCIAL-REGULAR;
    src: url("//game.gtimg.cn/images/yxzj/cp/xxxx23333/font/MFXINGYAN_NONCOMMERCIAL-REGULAR.OTF") format("opentype");
    font-weight: 600;
    font-style: normal;
}

.page_3 *{
    will-change: transform; /* 预提示浏览器优化 */
}


/* 统一的顶部topbar - Start */
.top-flex {
    width: 7.0rem;
    margin: 0 auto 0;
    padding: 1.1rem 0.3rem 0.2rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 11;
}

.btn-top {
    width: .67rem;
    height: .63rem;
    background-size: .67rem;
    background-position: center center;
}

.btn-top-left {
    display: flex;
    justify-content: flex-start;
    gap: .10rem;
}

.btn-top-right {
    display: flex;
    justify-content: flex-end;
    gap: .10rem;
}

.top-flex .btn-music {
    background-image: url("//game.gtimg.cn/images/yxzj/cp/xxxx23333/topbar/topbar-btn-music.png");
}

.top-flex .btn-music.muted {
    background-image: url("//game.gtimg.cn/images/yxzj/cp/xxxx23333/topbar/topbar-btn-music-pause.png");
}

.top-flex .btn-back {
    background-image: url("//game.gtimg.cn/images/yxzj/cp/xxxx23333/topbar/topbar-btn-back.png");
}


.top-flex .btn-rule {
    background-image: url("//game.gtimg.cn/images/yxzj/cp/xxxx23333/topbar/topbar-btn-rule.png");
}

.hell-topbar .top-flex .btn-rule {
    background-image: url("//game.gtimg.cn/images/yxzj/cp/xxxx23333/topbar/topbar-btn-rule2.png");
}


.top-flex .btn-share {
    background-image: url("//game.gtimg.cn/images/yxzj/cp/xxxx23333/topbar/topbar-btn-share.png");
}


.hell-topbar .top-flex .btn-music {
    background-image: url("//game.gtimg.cn/images/yxzj/cp/xxxx23333/topbar/topbar-btn-music2.png");
}

.hell-topbar .top-flex .btn-music.muted {
    background-image: url("//game.gtimg.cn/images/yxzj/cp/xxxx23333/topbar/topbar-btn-music-pause2.png");
}


.hell-topbar .top-flex .btn-back {
    background-image: url("//game.gtimg.cn/images/yxzj/cp/xxxx23333/topbar/topbar-btn-back2.png");
}
.hell-topbar .top-flex .btn-share {
    background-image: url("//game.gtimg.cn/images/yxzj/cp/xxxx23333/topbar/topbar-btn-share2.png");
}


.top-flex.on .btn-back {
    background-image: url("//game.gtimg.cn/images/yxzj/cp/xxxx23333/topbar/icon-back1.png");
}

.top-flex.on .btn-rule {
    background-image: url("//game.gtimg.cn/images/yxzj/cp/xxxx23333/topbar/icon-rule1.png");
}

.top-flex.on .btn-share {
    background-image: url("//game.gtimg.cn/images/yxzj/cp/xxxx23333/topbar/icon-share1.png");
}

.top-text {
    text-align: center;
    font-size: 0.24rem;
    color: #000;
    display: none;
}

.top-flex.on .top-text {
    display: block;
    font-size: 0.34rem;
    position: absolute;
    top: 78%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.top-flex.on a {
    width: 0.4rem;
    height: 0.4rem;
    background-size: contain;
}
.top-flex.on a.btn-music{
    display: none;
}

.top-flex.on .btn-rule {
    margin-right: 0.3rem;
}

.btn-top-right a:last-child {
    margin-right: 0;
}

/* 统一的顶部topbar - End */


body {
    background-color: #f9f8e5;
    box-sizing: border-box;
    overflow-x: hidden;
}

.page-wrap {
    width: 100%;
    height: 100%;
}

.ani-page-bg {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
}

.ani-page-mode {
    visibility: hidden;
}
.ani-page-mode.show {
    visibility: visible;
}


.ani-page-bg canvas {
    width: 100%;
    height: 16.24rem;
    object-fit: cover;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.page, .head {
    position: relative;
    width: 100%;
}

.page-con {
    position: relative;
    width: 100%;
    height: 100%;
    padding-top: .01rem;
    box-sizing: border-box;
    overflow: hidden;
}

.page {
    background: url("//game.gtimg.cn/images/yxzj/cp/xxxx23333/bg1.jpg") no-repeat center center/100% auto;
    height: 100%;
    min-height: 16.24rem;
    display: none;
}

.page.show {
    display: block;
    animation: fadeIn 1s ease-in-out forwards;
}


.page_1 {
    background-image: url("//game.gtimg.cn/images/yxzj/cp/xxxx23333/bg1.jpg");
}

.page_2 {
    background-image: url("//game.gtimg.cn/images/yxzj/cp/xxxx23333/bg2.jpg");
}

.page_3 {
    background-image: url("//game.gtimg.cn/images/yxzj/cp/xxxx23333/bg3.jpg");
}

@media screen and (max-aspect-ratio: 750/1624) {
    .page {
        background-size: cover;
    }
}

/* 登录信息 - Start */
.loginfo {
    width: 100%;
    text-align: center;
    position: absolute;
    top: 3.50rem;
    left: 0;
    font-size: .2rem;
    color: #fff;

    display: flex;
    justify-content: center;
    align-items: center;
}

.loginfo-box {
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    background: rgba(50, 136, 202, .6);
    border-radius: .3rem;
    height: .44rem;
    text-align: center;
    padding: 0 .1rem;
    min-width: 3.4rem;
}

.loginfo-box::after {
    left: initial;
    right: -.8rem;
    background-position-x: right;
}

.loginfo .role_name {
    max-width: 3.2rem;
    display: inline-block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.loginfo a {
    text-decoration: underline;
    color: #1368c1;
}

.btn-change {
    background: url("//game.gtimg.cn/images/yxzj/cp/xxxx23333/icon-change-role.png") no-repeat center center/.26rem auto;
    width: .28rem;
    height: .28rem;
    font-size: 0;
    text-indent: -9999px;
    display: inline-block;
    margin-left: .04rem;
}

/* 登录信息 - End */

.btn-reserve {
    position: absolute;
    left: 0;
    top: 50%;
    margin-top: 2.5rem;
    background-image: url("//game.gtimg.cn/images/yxzj/cp/xxxx23333/btn-reserve.png");
    width: 1.97rem;
    height: 1.80rem;
}

.btn-reserve.get {
    background-image: url("//game.gtimg.cn/images/yxzj/cp/xxxx23333/btn-reserve-get.png");
}

.btn-reserve.got {
    background-image: url("//game.gtimg.cn/images/yxzj/cp/xxxx23333/btn-reserve-got.png");
}





.side-btns{
    position: absolute;
    left: 50%;
    top: 4.06rem;
    transform: translate(-50%, 0);
    display: flex;
    gap: .2rem;
}
.side-btns a{
    display: block;
    width: 1.28rem;
    height: .46rem;
    margin-bottom: .14rem;
}
.btn-game-record {
    background-image: url("//game.gtimg.cn/images/yxzj/cp/xxxx23333/btn-game-record.png");
}
.btn-gift-record {
    background-image: url("//game.gtimg.cn/images/yxzj/cp/xxxx23333/btn-record.png");
}
.btn-rank {
    background-image: url("//game.gtimg.cn/images/yxzj/cp/xxxx23333/btn-side-rank.png");
}



.slogan {
    background-image: url("//game.gtimg.cn/images/yxzj/cp/xxxx23333/slogan.png");
    width: 6.36rem;
    height: 1.86rem;
    margin-left: .63rem;
    margin-top: 1.70rem;
}

.btn-start {
    background-image: url("//game.gtimg.cn/images/yxzj/cp/xxxx23333/btn-start.png");
    width: 4.27rem;
    height: 2.25rem;
    position: absolute;
    left: 50%;
    margin-left: -1.95rem;
    top: 50%;
    margin-top: 5.10rem;
}

.btn-start canvas {
    width: 4.22rem;
    height: 1.98rem;
    position: absolute;
    left: -0.24rem;
    bottom: .06rem;
}

.page-loading {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 6.66rem;
    margin-top: 3.30rem;
    color: #ffffff;
    text-align: center;
}

.page-loading-bar-wrap {
    width: 100%;
    height: .21rem;
    background: rgba(15, 89, 144, .3);
    border-radius: .10rem;
    overflow: hidden;
    position: relative;
    margin: .18rem auto;
}

.page-loading-bar {
    position: absolute;
    top: 0;
    left: 0;
    width: 0;
    height: 100%;
    background: url("//game.gtimg.cn/images/yxzj/cp/xxxx23333/loading-bar.png") no-repeat left center/auto 100%;
    transition: all .1s;
    border-radius: .10rem;
}

.page-loading-text {
    font-size: .24rem;
}

.page-percent-text {
    font-size: .40rem;
    font-family: 'MFXINGYAN_NONCOMMERCIAL-REGULAR', serif;
}

.slogan2 {
    background-image: url("//game.gtimg.cn/images/yxzj/cp/xxxx23333/slogan2.png");
    width: 2.8rem;
    height: .71rem;
    position: absolute;
    top: .96rem;
    left: 2.38rem;
}

.page_3 .page-con{
    padding-top: 2.16rem;
}

.stats-row {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 5.30rem;
    height: .47rem;
    border-radius: .2rem;
    margin: 0 auto;
    background: #c6e086;
}

.stat-card {
    width: 1.88rem;
    height: .62rem;
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    position: relative;
}

.stat-val {
    line-height: .38rem;
    font-size: .30rem;
    color: #f9f8e5;
    font-weight: bold;
    font-family: 'MFXINGYAN_NONCOMMERCIAL-REGULAR', serif;
    text-shadow:

            0 0.01rem .03rem #64811d,
            0 -0.01rem .03rem #64811d,
            0.01rem 0.03rem #64811d,
            -0.01rem 0.03rem #64811d,

            0 0.02rem .03rem #64811d,
            0 -0.02rem .03rem #64811d,
            0.02rem 0.03rem #64811d,
            -0.02rem 0.03rem #64811d,

            0 0.01rem .02rem #ffffff,
            0 -0.01rem .02rem #ffffff,
            0.01rem 0.02rem #ffffff,
            -0.01rem 0.02rem #ffffff,

            0 0.02rem .02rem #ffffff,
            0 -0.02rem .02rem #ffffff,
            0.02rem 0.02rem #ffffff,
            -0.02rem 0.02rem #ffffff,

            0 0.02rem .03rem #ffffff,
            0 -0.02rem .03rem #ffffff,
            0.02rem 0.03rem #ffffff,
            -0.02rem 0.03rem #ffffff,

            0 0.03rem .03rem #ffffff,
            0 -0.03rem .03rem #ffffff,
            0.03rem 0.03rem #ffffff,
            -0.03rem 0.03rem #ffffff,

            0 0.03rem .03rem #ffffff,
            0 -0.03rem .03rem #ffffff,
            0.03rem 0.03rem #ffffff,
            -0.03rem 0.03rem #ffffff,

            0 0.03rem .03rem #ffffff,
            0 -0.03rem .03rem #ffffff,
            0.03rem 0.03rem #ffffff,
            -0.03rem 0.03rem #ffffff;

    position: relative;
    top: -.04rem;
}

.stat-label {
    font-size: .18rem;
    color: #79913f;
    position: absolute;
    top: .6rem;
    transform: scale(.9);
    transform-origin: center top;
}

.game-panel {
    background-image: url("//game.gtimg.cn/images/yxzj/cp/xxxx23333/game/bg1.png");
    width: 7.12rem;
    height: 10.03rem;
    margin: .24rem auto 0;
    box-sizing: border-box;
    padding: .42rem .20rem;
    position: relative;
    z-index: 2;
}

.level-row {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    font-size: .18rem;
    color: #ffffff;
    border-radius: .12rem;
    position: absolute;
    top: -.08rem;
    width: 100%;
    left: 0;
}

.level-chip {
    display: inline-block;
    background: url("//game.gtimg.cn/images/yxzj/cp/xxxx23333/game/level-chip.png") no-repeat center center/100%;
    min-width: 1.23rem;
    height: .45rem;
    line-height: .44rem;
    font-size: .23rem;
    color: #1c577d;
    font-family: 'MFXINGYAN_NONCOMMERCIAL-REGULAR', serif;
    text-align: center;
}

.progress-wrap {
    width: 6.55rem;
    height: .12rem;
    margin: .36rem auto 0;
    background: #719b38;
    border-radius: .08rem;
    overflow: hidden;
}

.progress-bar {
    width: 10%;
    height: 100%;
    background: url("//game.gtimg.cn/images/yxzj/cp/xxxx23333/game/progress-bar1.jpg") repeat-x left center/auto 100%;
    border-radius: .08rem;
}

.game-area {
    margin: .40rem auto 0;
    box-sizing: border-box;
    width: 6.35rem;
    height: 7.33rem;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    z-index: 2;
}

.card-field {
    position: relative;
    margin: 0 auto;
    left: .02rem;
}

.game-pass-wrap {
    width: 100%;
    height: 100%;
    box-sizing: border-box;
    padding-top: .2rem;
}

.tit-pass-all {
    background-image: url("//game.gtimg.cn/images/yxzj/cp/xxxx23333/tit-pass-all.png");
    width: 4.62rem;
    height: 1.07rem;
    margin: 0 auto ;
}

.txt-get-prize {
    margin-top: .5rem;
}

.txt-got-prize {
    margin-top: .3rem;
    display: none;
}

.txt-get-prize, .txt-got-prize {
    font-size: .32rem;
    color: #fff8e2;
    font-family: 'MFXINGYAN_NONCOMMERCIAL-REGULAR', serif;
    text-align: center;
}

.lottery-box {
    position: relative;
}
/*.lottery-box::before {*/
/*    content: '';*/
/*    position: absolute;*/
/*    top: 50%;*/
/*    left: 50%;*/
/*    background: url("../ossweb-img/lottery-bg.png") no-repeat center center/100%;*/
/*    margin-left: -3.45rem;*/
/*    margin-top: -3.45rem;*/
/*    width: 6.90rem;*/
/*    height: 6.90rem;*/
/*    animation: aniCicle 2s linear infinite;*/
/*}*/

.prize-box-img {
    /*background: url("//game.gtimg.cn/images/yxzj/cp/xxxx23333/icon-box.png") no-repeat center center/100%;*/
    width: 3.16rem;
    height: 2.52rem;
    margin: .7rem auto .3rem;
    pointer-events: none;
    position: relative;
}

.prize-box-img canvas {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 7.50rem;
    height: 7.50rem;
    margin-top: -0.5rem;
    margin-left: -.1rem;
}

.ani-prize-open {
    width: 3.29rem;
    height: 3.07rem;
    margin: .4rem auto 0;
    display: none;
    position: relative;
    left: -.2rem;
}

.ani-prize-open-img, .ani-prize-open-bg {
    position: absolute;
    width: 7.5rem;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.ani-prize-open-bg {
    height: 16.24rem;
    margin-top: -.1rem;
}

.ani-prize-open canvas {
    width: 100%;
    height: 100%;
}

.btn-open {
    background-image: url("//game.gtimg.cn/images/yxzj/cp/xxxx23333/btn-open.png");
    width: 2.08rem;
    height: .86rem;
    margin: 0 auto;
    position: relative;
    z-index: 2;
}

.open-prize .txt-get-prize, .open-prize .prize-box-img{
    display: none;
}

.open-prize .ani-prize-open, .open-prize .txt-got-prize{
    display: block;
    animation: fadeIn .5s ease-in-out forwards;
}

.open-prize .btn-open {
    background-image: url("//game.gtimg.cn/images/yxzj/cp/xxxx23333/btn-opened.png");
    margin-top: .3rem;
    pointer-events: none;
}


/* ── slot-area ── */
.slot-area {
    background: url("//game.gtimg.cn/images/yxzj/cp/xxxx23333/game/bg-slot1.png") no-repeat center center/100%;
    width: 6.74rem;
    height: 1.75rem;
    box-sizing: border-box;
    padding: .38rem 0 0 0;
    margin: .16rem auto .16rem;
    position: relative;
}
.slot-area.danger {
    animation: shake .3s;
}

.slots-ani-spawn {
    width: 6.48rem;
    height: .91rem;
    padding: .06rem .08rem 0 .08rem;
    box-sizing: border-box;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    align-items: center;
    position: absolute;
    top: .46rem;
    left: 50%;
    transform: translateX(-50%);
}
.slots-ani-spawn-item {
    flex-shrink: 0;
    width: .90rem;
    height: .91rem;
    position: relative;
    pointer-events: none;
}
.ani-spawn {
    width: 1.8rem;
    height: 1.8rem;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    pointer-events: none;
}
.ani-spawn canvas {
    width: 100%;
    height: 100%;
    pointer-events: none;
}


/* 收集槽自适应：7格平均分配宽度，slot 内 padding 决定可用宽 */
.slot-cards {
    width: 6.48rem;
    padding: .06rem .08rem 0 .08rem;
    box-sizing: border-box;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    align-items: center;
}
.slot-area.danger .slot-cards{
    border-radius: .14rem;
    box-shadow: 0 0 0 2px rgba(255,90,90,.85), 0 4px 0 #0288d1, 0 6px 16px rgba(2,136,209,.25);
}

.slot-card {
    flex-shrink: 0;
    width: .90rem;
    height: .91rem;
    aspect-ratio: 1;
    border-radius: .14rem;
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
    background: url("//game.gtimg.cn/images/yxzj/cp/xxxx23333/game/box-s.png") no-repeat center center/100%;
}

.slot-card.slot-last {
    /*animation: slotIn .18s .15s ease both;*/
    opacity: 1;
    transition: all .180s .150s ease;
}
.slot-card.slot-spawned {
    opacity: 1;
    animation: fadeOut .180s .150s ease forwards;
}

.slot-card img{
    width: .65rem;
    height: .65rem;
}

.slot-empty {
    width: 100%;
    aspect-ratio: 1;
    border-radius: .10rem;
    flex-shrink: 0;
}

/* ── cards ── */
.card {
    position: absolute;
    width: 1.02rem;
    height: 1.04rem;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: transform .15s, filter .55s;
    user-select: none;
    /* 参考图：白色底+彩色顶块+明显阴影，模拟卡牌立体感 */
    background: url("//game.gtimg.cn/images/yxzj/cp/xxxx23333/game/box.png") no-repeat center center/100%;
    /*border: 2px solid rgba(255,255,255,.95);*/
    /*filter:*/
    /*        drop-shadow(0 .06rem 0 rgba(0,0,0,.18))      !* 底部厚度立体感 *!*/
    /*        drop-shadow(0 .10rem .26rem rgba(0,0,0,.18))   !* 投影 *!;*/
    -webkit-tap-highlight-color: transparent;
}

.card-clone {
    transition-duration: var(--card-clone-duration, .35s);
    transition-timing-function: linear;
    /*transition-timing-function: cubic-bezier(.4, 0, .2, 1);*/
    z-index: 9!important;
}

.card:not(.locked):hover {
    /*transform: scale(1.1) translateY(-.05rem);*/
    /*z-index: 200 !important;*/
    /*filter:*/
    /*    drop-shadow(0 .08rem 0 rgba(0,0,0,.18))      !* 底部厚度立体感 *!*/
    /*    drop-shadow(0 .12rem .28rem rgba(0,0,0,.25));   !* 投影 *!*/
    -webkit-tap-highlight-color: transparent;
}

.card.locked:not(.entering) {
    filter: brightness(.6) saturate(.4);
    cursor: not-allowed;
}


.card.locked:not(.entering) {
    transition: transform .3s, filter .35s;
}

/* 卡片顶部彩色条块（用 ::before 实现，宽满、高约 40%，圆上角） */
/*.card::before {*/
/*    content: '';*/
/*    position: absolute;*/
/*    inset: 0;*/
/*    border-radius: .11rem;*/
/*    background: inherit; !* 让卡片背景色只在顶部 ::before 块显示 *!*/
/*    pointer-events: none;*/
/*}*/

.card-img {
    flex-shrink: 0;
    width: .9rem;
    height: .9rem;
    object-fit: contain;
    pointer-events: none;
    position: relative;
    z-index: 1;
    border-radius: .12rem;
    /*filter: drop-shadow(0 .01rem .03rem rgba(0,0,0,.25));*/
    transition: filter .15s;
    top: -.02rem;
    -webkit-tap-highlight-color: transparent;
}


/* ── GM 重置按钮 ── */
.gm-bar {
    display: none;
    gap: 7px;
    justify-content: flex-end;
    position: absolute;
    bottom: .2rem;
    right: .1rem;
    background: #ffffff;
    border-radius: .2rem;
}

.gm-btn {
    background: rgba(255, 193, 7, .15);
    border: 1px dashed rgba(255, 193, 7, .6);
    border-radius: 20px;
    color: #c77800;
    padding: 5px 13px;
    font-size: 11px;
    font-weight: 700;
    cursor: pointer;
    transition: all .18s;
    display: flex;
    align-items: center;
    gap: 5px;
}

.gm-btn:hover {
    background: rgba(255, 193, 7, .28);
    transform: translateY(-1px);
}

/* ── tools ── */
.tools-bar {
    width: 6.82rem;
    margin: 0 auto;
    display: flex;
    gap: 10px;
}

.tool-btn {
    flex: 1;
    border: none;
    text-align: center;
    cursor: pointer;
    transition: all .18s;
    position: relative;
    outline: none;
    background: no-repeat center center/100%;
    width: 2.04rem;
    height: .82rem;
}

/* 撤回：绿色 */
.tool-undo {
    background-image: url("//game.gtimg.cn/images/yxzj/cp/xxxx23333/game/btn-backward.png");
}

/* 打乱：橙色 */
.tool-shuffle {
    background-image: url("//game.gtimg.cn/images/yxzj/cp/xxxx23333/game/btn-random.png");
}

/* 移出：紫色 */
.tool-remove {
    background-image: url("//game.gtimg.cn/images/yxzj/cp/xxxx23333/game/btn-remove.png");
}

.tool-btn.empty:hover {
    transform: translateY(-1px);
}

.tool-btn.disabled {
    filter: grayscale(100%);
    pointer-events: none;
}

.tool-badge {
    position: absolute;
    right: -.04rem;
    top: -.04rem;
    background: url("//game.gtimg.cn/images/yxzj/cp/xxxx23333/game/badge.png") no-repeat center center/100%;
    width: .36rem;
    height: .37rem;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: .2rem;
    color: #657c0f;
    font-weight: bold;
}

/*炼狱模式*/
.hell-mode .page_3 .slogan2 {
    background-image: url("//game.gtimg.cn/images/yxzj/cp/xxxx23333/slogan3.png");
}
.hell-mode .page_3 {
    background-image: url("//game.gtimg.cn/images/yxzj/cp/xxxx23333/bg3-hell.jpg");
}
.hell-mode .page_3 .page-con {
    padding-top: 1.80rem;
}
.hell-mode .level-chip {
    margin-top: .38rem;
    width: 1.58rem;
    height: .74rem;
    background: url("//game.gtimg.cn/images/yxzj/cp/xxxx23333/game/level-chip2.png") no-repeat center center/100%;
    padding-top: 0.2rem;
    box-sizing: border-box;
    color: #7d271c;
}
.hell-mode .game-panel{
    margin-top: 0;
    width: 7.50rem;
    height: 10.73rem;
    background: url("//game.gtimg.cn/images/yxzj/cp/xxxx23333/game/bg2.png") no-repeat center center/100%;
    padding-top: 1.04rem;
}
.hell-mode .game-area {
    margin-top: .46rem;
}
.hell-mode .stats-row {
    background: #7f5e8e;
}
.hell-mode .stat-val {
    color: #faf3ff;
    text-shadow:
            0 0.02rem .03rem #786288,
            0 -0.02rem .03rem #786288,
            0.02rem 0.03rem #786288,
            -0.02rem 0.03rem #786288,
            0 0.03rem .03rem #ffffff,
            0 -0.03rem .03rem #ffffff,
            0.03rem 0.03rem #ffffff,
            -0.03rem 0.03rem #ffffff;
}
.hell-mode .stat-label{
    color: #e4cef4;
}
.hell-mode .progress-wrap {
    background: #503c6a;
}
.hell-mode .progress-bar {
    background-image: url("//game.gtimg.cn/images/yxzj/cp/xxxx23333/game/progress-bar2.jpg");
}
.hell-mode .slots-ani-spawn {
    top: .50rem;
}
.hell-mode .ani-spawn {
    margin-left: -.04rem;
}
.hell-mode .slot-cards {
    padding: .14rem .04rem 0 .04rem;
}
.hell-mode .slot-area {
    margin-top: .10rem;
    background-image: url("//game.gtimg.cn/images/yxzj/cp/xxxx23333/game/bg-slot2.png");
}
.hell-mode .card {
    transition: transform .2s, filter .15s;
}