body {
    font-size: .3rem;
    text-align: center;
    font-family: "SourceHanSansCN", "Microsoft Yahei";
    color: #fff;
}

* {
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}

.info {
    background: url(/Public/special/images/20240506/m/info.png) no-repeat;
    background-size: 7.08rem 9.92rem;
}

.infos {
    background: url(/Public/web/m/images/cover/20251209/colse.png) no-repeat;
    background-size: 100% 100%;
}

.infob {
    background: url(/Public/web/m/images/cover/20251209/qdan.png) no-repeat;
    background-size: 100% 100%;
    color: #dc6a40 !important;
}

.infoc {
    background: url(/Public/web/m/images/cover/20250818/ljdl.png) no-repeat;
    background-size: 4.61rem 1.16rem;
    color: #dc6a40 !important;
}

.dn {
    display: none;
}

.header .h_down {
    background: none;
    margin: 0;
    padding: 0;
    height: auto;
    text-indent: 0;
}

.header {
    width: 10.8rem;
    height: 1.48rem;
    margin-left: -5.4rem;
    left: 50%;
    background: none;
    position: fixed;
    left: 50%;
}

.header .h_down:before {
    background: none;
}

.header h3 {
    font-size: .45rem;
    color: #fff;
    margin-left: -.2rem;
    padding: .24rem 0 .06rem 0;
}

.header p {
    font-size: .52rem;
    line-height: .4rem;
    color: #ffe7bb;
}

.header a {
    width: 1.84rem;
    margin-right: .2rem;
    margin-top: .34rem;
}

.header>div {
    padding: 0 .1rem 0 2.12rem;
}

.menu-btn {
    margin-top: 0.36rem;
    margin-right: 0.2rem;
}

.logo-ld {
    left: 0.32rem;
}

.logo-ds {
    width: 60%;
    height: 1rem;
    top: 1.8rem;
}

.dhxy-login {
    position: absolute;
    top: 1.8rem;
    right: 0.4rem;
    font-size: 0.35rem;
    padding: 0.1rem 0;
    color: #3a2420;
    font-weight: bold;
    border-bottom: 1px solid #3a2420;
    cursor: pointer;
    transition: all 0.3s ease;
}

.dhxy-login:hover {
    color: #dc6a40;
    border-bottom-color: #dc6a40;
    transform: translateY(-0.05rem);
}

.home {
    position: fixed;
    top: 8rem;
    left: 0rem;
    z-index: 15;
}

.home img {
    width: 1.5rem;
}

.dhxy-login:active {
    transform: translateY(0);
}

#web-main {
    background: url(/Public/web/m/images/cover/20251209/dt.jpg) no-repeat;
    height: 105.33rem;
    max-width: 1080px;
    background-size: 100% 100%;
}

.thunder_reappears {
    top: 19.8rem;
    width: 100%;
    left: 0;
}

/* 切换宠物样式 */
.switch_pets {
    margin-top: 0.8rem;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 1rem;
}

.switch-item {
    cursor: pointer;
    transition: all 0.3s ease;
    position: relative;
}

.switch-item img {
    width: 4rem;
    transition: opacity 0.3s ease;
}

/* 选中状态 - 红色边框/背景 */
.switch-item.active {
    transform: scale(1.05);
}

/* 未选中状态 - 藏青色 */
.switch-item:not(.active) {
    opacity: 0.7;
}

/* 三维雕像显示控制 */
.pet-display {
    transition: opacity 0.5s ease;
}

.jgz-display {
    display: block !important;
    width: 95% !important;
}

.ldlx-display {
    display: none !important;
    width: 95% !important;
}

.threedimensional_statue{
}
.ldlx-display{
    margin-top: 1rem;
    width: 100% !important;
}
/* 当选中雷帝时 */
.switch-item[data-pet="lei"].active~.threedimensional_statue .jgz-display,
body:has(.switch-item[data-pet="lei"].active) .threedimensional_statue .jgz-display {
    display: none !important;
}

.switch-item[data-pet="lei"].active~.threedimensional_statue .ldlx-display,
body:has(.switch-item[data-pet="lei"].active) .threedimensional_statue .ldlx-display {
    display: block !important;
}

.number {
    color: #ffdb8f;
}

.Thelonely_peakwins{
    top: 41rem;
    width: 100%;
    left: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.Thelonely_peakwins .picture_box{
    margin-top: 0.8rem;
    width: 95%;
    display: flex;
    justify-content: center;
    align-items: center;
    
}

.first-img{
    width: 82%;
}
.Thelonely_peakwins .picture_content{
    margin-top: 0.5rem;
    width: 68%;
    line-height: 0.6rem;
    font-size: 0.35rem;
    color: #ffaca3;
}
.Thelonely_peakwins .picture_content span{
    
    color: #fff;
}

.winter_benefits{
    top: 55.6rem;
    width: 100%;
    left: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.winter_content{
    display: flex;
    width: 90%;
    justify-content: space-between;
    margin-top: 0.8rem;
}
.winter_content .item_content{
    width: 4.5rem;
    display: flex;
    align-items: center;
}
.winter_content .item_content .gif-img{
    width: 3rem;
    height: 3rem;
    border-radius: 50%;
    top: 0.9rem;
    left: 0.8rem;
    object-fit: contain;
}

.daily_raffle{
    top: 69.5rem;
    width: 100%;
    left: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.appointment-lottery {
    width: 100%;
    position: absolute;
    top: 19rem;
    left: 0;
    /* z-index: 1000; */
}

.appointment-lottery img {
    width: 95%;
}

.detail-btn {
    width: 2.5rem;
    height: 0.8rem;
    position: absolute;
}

#chaxun1 {
    top: 4rem;
    left: 0.8rem;
}

#chaxun2 {
    top: 4.6rem;
    left: 4.2rem;
}

#chaxun3 {
    top: 4rem;
    left: 7.5rem;
}

#chaxun4 {
    top: 9.9rem;
    left: 0.8rem;
}

#chaxun5 {
    top: 10.5rem;
    left: 4.2rem;
}

#chaxun6 {
    top: 9.9rem;
    left: 7.5rem;
}

#chaxun7 {
    top: 15.9rem;
    left: 0.8rem;
}

#chaxun8 {
    top: 16.5rem;
    left: 4.2rem;
}

#chaxun9 {
    top: 15.9rem;
    left: 7.5rem;
}

.z-title img {
    width: 8.29rem;
}

.hot {
    color: #ff5a5a;
}

.box1 {
    height: 19.27rem;
}

.logo {
    width: 3.09rem;
    top: 1.8rem;
    left: 50%;
    margin-left: -1.54rem
}

.slogan {
    width: 9.77rem;
    top: 1.49rem;
    left: .49rem;
}

.yuyue-box {
    width: 7.44rem;
    line-height: .72rem;
    height: .73rem;
    font-size: .33rem;
    color: #424643;
    letter-spacing: .04rem;
    left: 50%;
    top: 14.1rem;
    background: url(/Public/special/images/20240506/m/ico5.png) no-repeat;
    background-size: 100% 100%;
    font-weight: bold;
    font-family: "黑体";
}

.appointment-lottery-content {
    width: 85%;
    position: absolute;
    top: 1.8rem;
    left: 0.7rem;
    display: flex;
    justify-content: center;
    align-items: center;

}

.appointment-lottery-item {
    width: 1.5rem;
    height: 1.5rem;
    margin: 0 0.1rem;
}

.appointment-lottery-item img {
    width: 100%;
}

.yuyue-lb {
    width: 9.41rem;
    top: 14.98rem;
    left: 50%;
    margin-left: -4.74rem;
}

.yuyue-progress {

    width: 9.52rem;
    height: 1.1rem;
    left: .49rem;
    top: 15.51rem;
    background: url(/Public/special/images/20240506/m/progress.png) no-repeat;
    background-size: 100% 100%;
}

.progress {
    border-radius: .06rem;
    margin: 0 0 0 .55rem;
    width: 8.88rem;
    overflow: hidden;
    border: .02rem solid #82b9a8;
    background-color: #f8e6bb;
    height: .11rem;
}

.progress i {
    border-radius: .04rem;
    background-color: #ff5a5a;
}

.yuyue-progress ul {
    height: 1.35rem;
    left: -.02rem;
    top: -.61rem;
}

.yuyue-progress ul li {
    margin-right: 1.5rem;
    width: 1.35rem;
    height: 100%;
    background-position: right bottom !important;
}

.top-but {
    top: 16.91rem;
}

.top-but a {
    width: 4.95rem;
    height: 1.42rem;
}

.top-but a:nth-child(1) {
    background-position: 0 -.74rem;
}

.top-but a.active {
    background: url(/Public/special/images/20240506/m/b-gift.png) no-repeat !important;
    background-position: 0 0 !important;
    background-size: 100% 100% !important;
}

.top-but a:nth-child(2) {
    background-position: 0 -2.18rem;
}

.box2 {
    margin-top: 1.5rem;
    height: 13.89rem;
}

.box1-content {
    width: 2.9rem;

}

.box1-left {
    left: 0.7rem;
    top: 3.5rem;
}

.box1-center {
    top: 6rem;
    left: 4.2rem;
}

.box1-right {
    top: 3.5rem;
    right: 0.3rem;
}

.zhe_zhao {
    width: 100%;
    z-index: 1000;
    bottom: 0;
}

.yin_yin {
    width: 100%;
    z-index: 900;
    bottom: 0;
}

.renwu {
    top: -1.3rem;
    width: 4rem;
    left: -1.2rem;
}

.button {
    width: 90%;
    position: absolute;
    bottom: 0.2rem;
    left: 0.2rem;
    z-index: 1000;
}

.left-di .name {
    width: 0.8rem;
    left: -0.5rem;
    top: 0.5rem;
    display: flex;
    justify-content: center;
    align-items: center;
}

.left-di .name div {
    width: 0.6rem;
    color: #fff;
    font-size: 0.355rem;
}

.box2 ul {
    margin-top: 1.02rem;
}

.box2 ul li {
    background: url(/Public/special/images/20240506/pc/act1-1.png) no-repeat;
}

.box2 ul li:nth-child(1),
.box2 ul li:nth-child(2),
.box2 ul li:nth-child(3) {
    width: 3.50rem;
    height: 5.14rem;
    background-size: 24.47rem 100%;
    margin: 0 .01rem .35rem;
}

.box2 ul li:nth-child(1) {
    background-position: 0 0;
}

.box2 ul li:nth-child(2) {
    background-position: -3.5rem 0;
}

.box2 ul li:nth-child(3) {
    background-position: -7rem 0;
}

.box2 ul li:nth-child(4),
.box2 ul li:nth-child(5),
.box2 ul li:nth-child(6),
.box2 ul li:nth-child(7) {
    width: 4.44rem;
    height: 6.53rem;
    background-size: 31.08rem 100%;
    margin: 0 .3rem .7rem;
}

.box2 ul li:nth-child(4) {
    background-position: -13.32rem 0;
}

.box2 ul li:nth-child(5) {
    background-position: -17.76rem 0;
}

.box2 ul li:nth-child(6) {
    background-position: -22.2rem 0;
}

.box2 ul li:nth-child(7) {
    background-position: right 0;
}

.b-baotuan {
    width: 5.24rem;
    height: 1.28rem;

    background-position: 0 -4.88rem;
}

.box3 {
    margin-top: 0.5rem;
    height: 21.84rem;
}

.seond-box {
    width: 4.2rem;
    display: flex;
    justify-content: center;
    align-items: center;
}

.seond-1 {
    top: 2.3rem;
    left: 1.2rem
}

.seond-2 {
    top: 3.3rem;
    right: 0.8rem
}

.seond-3 {
    top: 6.6rem;
    left: 1.2rem
}

.seond-4 {
    top: 7.6rem;
    right: 0.8rem
}

.seond-5 {
    top: 10.9rem;
    left: 1.2rem
}

.seond-6 {
    top: 11.8rem;
    right: 0.8rem
}

.seond-buntton {
    width: 70%;
    bottom: 0.20rem;
}

.bj-box {
    width: 100%;
    top: 3.2rem;
}

.bj-box a {
    width: 3.05rem;
    line-height: .64rem;
    font-size: .36rem;
    color: #556b49;
    letter-spacing: .03rem;
    background-position: 0 -6.18rem;
}

.a-left{
    left: 0.2rem;
}
.a-right{
    right: 0.2rem;
}

.ml10 {
    margin-left: .1rem;
}

.video-box{
    top:6rem;
    left: 0.5rem;
    display: flex;
    justify-content: center;
    align-items: center;
}
.video-img{
    width: 3.5rem;
}
.video-dt{
    width: 3.4rem;
    border-radius: 0.2rem;
    position: absolute;
    top: 0.03rem;
    left: 0.04rem;
}
.video-fan{
    position: absolute;
    width: 1.5rem;
}

.login_box {
    left: 0.4rem;
    top: 2rem;
    font-size: 0.38rem;
    color: #3b231e;
    padding: 0.4rem 0.3rem;
    width: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    background: url(/Public/web/m/images/cover/20251209/loginbg.png) no-repeat;
    background-size: 100% 100%;
}

.login_box img {
    width: 0.5rem;
    height: 0.5rem;
    margin-right: 0.2rem;
}

.login_box span {
    color: #ffe17b;
}

.lottery-wp {
    width: 10.2rem;
    height: 12.02rem;
    background: url(/Public/web/m/images/cover/20251209/zpbg.png) no-repeat;
    background-size: 100% 100%;
    left: 50%;                    /* 改为标准居中 */
    margin-left: -0.5rem;        /* 宽度的一半：10.2 / 2 = 5.1 */
    top: 1rem;
    position: relative; 
}
.hbyq{
    bottom: -1.3rem;
    width: 5rem;
    left: 25%;
}
.lottery-bg {
    width: 8.51rem;
    top: 1.2rem;
    left: 50%;                    /* 在父容器内水平居中 */
    margin-left: -4.255rem;      /* 宽度的一半：8.51 / 2 = 4.255 */
    /* 确保图片居中 */
    display: flex;
    align-items: center;
    justify-content: center;     /* 向左偏移宽度的一半，精确居中 */
    
}
.lottery-bg img {
    width: 100%;
    height: 100%;
    display: block;
    transform-origin: center center !important;
    -webkit-transform-origin: center center !important;
}
.b-LuckDraw{
    width: 3rem;
    height: 3.3rem;
    background: url(/Public/web/m/images/cover/20251209/luckDraw.png) no-repeat;
    background-size: 100% 100%;
    top: 4.1rem;
    left: 5.05rem;
  }
.lottery-chances{
    bottom: 0.8rem;
    width: 3.8rem;
    height: 0.4rem;
    left: 30%;
    background: url(/Public/web/m/images/cover/20251209/numdt.png) no-repeat;
    background-size: 100% 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #7f3323;
} 
.l-r1 {
    width: 3.85rem;
    left: -1.54rem;
    bottom: -1.1rem;
}

.l-r2 {
    width: 4.21rem;
    right: -2.1rem;
    bottom: -.7rem;
}

.task-list{
    top: 18rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.box3 .b-share {
    width: 5.07rem;
    height: 1.24rem;
    left: 50%;
    top: 8.74rem;
    background-position: 0 -3.63rem;
}

.box4 {
    height: 25.3rem;
}



.box6 {
    height: 20rem;
}

/* 新增：调整卡片和人物样式 */
.circle-container {
    position: relative;
    width: 100%;
    height: 11rem;
    margin-top: 1.5rem;
    perspective: 20rem;
}

.rotating-circle {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    transform-style: preserve-3d;
    pointer-events: none;
}

.rotating-circle.back {
    z-index: 1;
}

.center-img {
    z-index: 2;
    position: absolute;
    left: 50%;
    top: 50%;
    width: 10rem;
    transform: translate(-50%, -50%);
    pointer-events: none;
}

.rotating-circle.front {
    z-index: 3;
}

.circle-item {
    position: absolute;
    left: 50%;
    top: 55%;
    width: 2rem;
    /* 缩小宽度 */
    height: 3rem;
    /* 缩小高度，保持比例 */
    margin: -1rem 0 0 -0.8rem;
    /* margin 也要对应调整为 -height/2 和 -width/2 */
    transition: transform 0.4s cubic-bezier(.4, 1.6, .6, 1), z-index 0.4s;
}

.circle-item img {
    width: 100%;
    height: 100%;
}

.lottery-btn {
    width: 5rem;
    background: transparent;
    display: block;
    border: none;
    left: 50%;
    top: 90%;
    transform: translate(-50%, -50%);
}

.draw-btn {
    display: block;
    color: #a85b1b;
    border: none;
    border-radius: 30px;
    font-size: 1.2em;
    cursor: pointer;
}

.chibang {
    width: 5.5rem;
    left: 0.2rem;
    top: 3rem;
}

.guangquan {
    width: 9rem;
    left: 0.15rem;
    top: 8rem;
}

.wuqi {
    width: 3rem;
    top: 9rem;
    left: 0.5rem;
}

.shizhuang {
    width: 8rem;
    top: 5.5rem;
    left: 2rem;

}

.chongwu {
    width: 6rem;
    top: 13.5rem;
    right: -0.2rem;
}

.name-list {
    width: 0.8rem;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    right: 0rem;
    top: 0rem;
}

.titles {
    width: 0.6rem;
    font-size: 0.35rem;
    margin-top: -0.2rem;
}

.more-list {
    width: 5rem;
    top: 17rem;
    left: 30%;
}

.ts-swiper {
    width: 10.8rem;
    height: 16.4rem;
    background: url(/Public/special/images/20240506/m/a3bg.png) no-repeat center 1.09rem;
    background-size: 100% 13.9rem;
    margin-top: .96rem;
}

.tocj {
    width: 2.2rem;
    top: 0.2rem;
    left: 0.2rem;
}

.boxCbs {
    position: fixed;
    z-index: 15;
    top: 8rem;
    right: 0rem;
}

.closecj {
    right: -0.02rem;
    top: 0.25rem;
    width: 0.5rem;
}

.ts-swiper .z {
    top: 0;
    width: 4.67rem;
    left: 50%;
    margin-left: -2.33rem;
}

.ts-swiper .z img {
    width: 100%;
}

.ts-swiper .z-min {
    width: 4.22rem;
    margin-left: -2.11rem;
}

.swiper-button-z {
    width: .86rem;
    height: .72rem;
    top: 8.22rem;
}

.ts-swiper .swiper-button-prev {
    left: .2rem;
    background-position: 0 0;
}

.ts-swiper .swiper-button-next {
    right: .2rem;
    background-position: -.88rem 0;
}

.ts-swiper .swiper-slide>img {
    position: absolute;
    left: 50%;
    bottom: 4.09rem;
}

.ts-swiper .swiper-slide .swiper-more {
    width: 2.66rem;
    height: 2.66rem;
    background-position: 0 bottom;
    left: 50%;
    margin-left: -1.33rem;
    bottom: 0;
}

#address_success .pop-title-img {
    margin-top: 2rem;
    margin-bottom: 0.5rem;
}

#address_success .pop-title-img img {
    width: 70%;
}

#gift_win .pop-title-img {
    margin-top: 4.2rem;
    margin-bottom: 0.2rem;
}

.pop-content {
    font-size: 0.45rem;
    margin-bottom: 0.3rem;
    color: #9d4f3a;
}

#gift_win .pwin_box {
    padding-left: .14rem;
    width: 100%;
    height: 13rem;
    font-size: .3rem;
    color: #333333;
    background: url(/Public/web/m/images/cover/20250818/ztc.png) no-repeat;
    background-size: 100% 100%;
    z-index: 1000;
}

#caption_win .pwin_box {
    padding-left: .14rem;
    width: 100%;
    height: 11rem;
    font-size: .3rem;
    color: #333333;
    background: url(/Public/web/m/images/cover/20251209/tcd.png) no-repeat;
    background-size: 100% 100%;
    z-index: 1000;
}

#teamup_fight .pwin_box {
    padding-left: .14rem;
    width: 100%;
    height: 15rem;
    font-size: .3rem;
    color: #333333;
    background: url(/Public/web/m/images/cover/20251209/tcd.png) no-repeat;
    background-size: 100% 100%;
    z-index: 1000;
}

#teamup_fight .pwin_box .pop-xs {
    top: -1rem;
    right: 0.7rem;
}

#invite_friends_win .pwin_box {
    padding-left: .14rem;
    width: 100%;
    height: 16rem;
    font-size: .3rem;
    color: #333333;
    background: url(/Public/web/m/images/cover/20250818/ztc.png) no-repeat;
    background-size: 100% 100%;
    z-index: 1000;
}

#invite_friends_win .pwin_box .pop-xs {
    top: 2.1rem;
}

#invite_friends_win .pop-title {
    margin: 4rem 0 .3rem 0;
}

#bound_win .pop-title {
    margin-top: 1rem;
}

#bound_win .pop-title {
    font-size: 0.55rem;
}

#bound_win .ls-from {
    margin-top: 0;
}

#address_win .pwin_box {
    width: 100%;
    height: 12rem;
    font-size: .3rem;
    color: #333333;
    background: url(/Public/web/m/images/cover/20251209/tcd.png) no-repeat;
    background-size: 100% 100%;
    z-index: 1000;
}
#znxt_win .pwin_box {
    width: 100%;
    height: 14rem;
    font-size: .3rem;
    color: #333333;
    background: url(/Public/web/m/images/cover/20251209/tcd.png) no-repeat;
    background-size: 100% 100%;
    z-index: 1000;
}
#znxt_win .pwin_box .title{
    color: red;
    font-size: 0.4rem;
    font-weight: bold;
    margin-bottom: 0.2rem;
}
#xcb_win .pwin_box {
    width: 100%;
    height: 13rem;
    font-size: .3rem;
    color: #333333;
    background: url(/Public/web/m/images/cover/20251209/tcd.png) no-repeat;
    background-size: 100% 100%;
    z-index: 1000;
}
#video_win .pwin_box {
    width: 100%;
    font-size: .3rem;
    height: auto;
    color: #333333;
    background: transparent;
    z-index: 1000;
}
#video_win .pwin_box video{
    width: 90%;
}
#xzq_win .pwin_box {
    width: 100%;
    height: 14rem;
    font-size: .3rem;
    color: #333333;
    background: url(/Public/web/m/images/cover/20251209/tcd.png) no-repeat;
    background-size: 100% 100%;
    z-index: 1000;
}
#ldzz_win .pwin_box {
    width: 100%;
    height: 14rem;
    font-size: .3rem;
    color: #333333;
    background: url(/Public/web/m/images/cover/20251209/tcd.png) no-repeat;
    background-size: 100% 100%;
    z-index: 1000;
}
#sztp_win .pwin_box {
    width: 100%;
    height: 14rem;
    font-size: .3rem;
    color: #333333;
    background: url(/Public/web/m/images/cover/20251209/tcd.png) no-repeat;
    background-size: 100% 100%;
    z-index: 1000;
}
#win_list .pwin_box {
    width: 100%;
    height: 14rem;
    font-size: .3rem;
    color: #333333;
    background: url(/Public/web/m/images/cover/20251209/tcd.png) no-repeat;
    background-size: 100% 100%;
    z-index: 1000;
    display: flex;
    flex-direction: column;
    align-items: center;
}

#win_list .pop-xs {
    top: -1rem;
    right: 0.7rem;
}

.One-collect {
    position: absolute;
    left: 2.5rem;
    bottom: 1rem;
}

#invite_list .pwin_box {
    padding-left: .34rem;
    width: 100%;
    height: 13rem;
    font-size: .3rem;
    color: #333333;
    background: url(/Public/web/m/images/cover/20250818/ztc.png) no-repeat;
    background-size: 100% 100%;
    z-index: 1000;
}

#invite_list .pop-xs {
    top: 2rem;
}

#invite_record_win .pwin_box {
    padding-left: .34rem;
    width: 100%;
    height: 15rem;
    font-size: .3rem;
    color: #333333;
    background: url(/Public/web/m/images/cover/20250818/ztc.png) no-repeat;
    background-size: 100% 100%;
    z-index: 1000;
}
#jgz_win .pwin_box {
    padding-left: .14rem;
    width: 100%;
    height: 10rem;
    font-size: .3rem;
    color: #333333;
    background: url(/Public/web/m/images/cover/20251209/tcd.png) no-repeat;
    background-size: 100% 100%;
    z-index: 1000;
}
#invite_record_win .pwin_box .pop-xs {
    top: 2.3rem;
}

#address_win .pwin_box .pop-xs {
    top: -1rem;
    right: 0.7rem;
}

#address_win .pop-title {
    margin-left: 1rem;
    text-align: left;
    margin-top: 3.3rem;
}

#address_win .ls-from {
    /* margin-left: 1rem; */
    margin-top: 1rem;
}

#win_list .pop-title {
    margin: 4rem 0 .3rem 0;
}

.pop_win .pwin_box {
    width: 100%;
    max-width: 1080px;
    height: 9rem;
    font-size: .3rem;
    color: #333333;
    background: url(/Public/web/m/images/cover/20251209/tcd.png) no-repeat;
    background-size: 100% 100%;
    z-index: 1000;
}

.pop_win .pwin_box .pop-x {
    width: .69rem;
    height: .65rem;

    top: -.65rem;
    right: 0;
    background-position: -1.76rem 0 !important;
}

#caption_win .pwin_box .pop-xs {
    top: -1rem;
    right: 0.7rem;
}

.pop_win .pwin_box .pop-xs {
    width: 0.8rem;
    height: 0.8rem;
    top: -1rem;
    right: 0.7rem;
}

.pop_win .pop-title {
    font-size: .38rem;
    line-height: .84rem;
    font-weight: bold;
    color: #b66225;
    height: .84rem;
    margin: 1rem 0 .3rem 0;
}

.pop_win .pop-title span {
    color: #30996b;
    letter-spacing: .06rem;
    position: relative;
    font-weight: bold;
}

#bind_win .pop-title {
    font-size: 0.55rem;
}

#bind_win .ls-from {
    margin-top: 0rem !important;
}

.pop-message {
    font-size: 0.45rem;
    color: #c19b84;
    line-height: 0.5rem;
    margin: 0.2rem 0 1rem;
}

.pop-message p {
    line-height: 0.6rem;
}

#preview_win ul {
    padding-top: .4rem;
    width: 90%;
    margin-left: 0.7rem;
}

#preview_win span {
    width: 2rem;
}

#preview_win span i {
    width: 1.65rem;
    height: 1.65rem;
    background-position: -6.6rem -1.83rem;
}

#preview_win span p {
    height: 1rem;
    padding-top: .1rem;
    line-height: .4rem;
}

#preview_win img {
    padding: 0;
    width: 90%;
}

.pop_win .pop-title span::after,
.pop_win .pop-title span::before {
    content: "";
    position: absolute;
    background-color: #30996b;
    width: .08rem;
    height: .08rem;
    border-radius: 100%;
    top: 50%;
    margin-top: -.04rem;
}

.pop_win .pop-title span::after {
    left: -.28rem;
}

.pop_win .pop-title span::before {
    right: -.21rem;
}

.z-butc {
    width: 4.61rem;
    font-weight: bold;
    font-size: .48rem;
    height: 1.16rem;
    line-height: 1.26rem;
    color: #ffeec4 !important;
    display: flex;
    align-items: center;
    justify-content: center;
}

.z-buts {
    width: 5.61rem;
    font-weight: bold;
    font-size: .55rem;
    height: 1.2rem;
    line-height: 1.26rem;
    color: #bf512a !important;
}

.z-but {
    width: 4.61rem;
    font-weight: bold;
    font-size: .48rem;
    height: 1.06rem;
    line-height: 1.06rem;
    color: #ffeec4;
    background-position: -2.47rem -6.18rem !important;
}

.z-bind-but {
    background-position: 0 bottom;
}

.z-but span {
    line-height: 1.06rem;
    letter-spacing: .05rem;
    background: -webkit-linear-gradient(to bottom, #ffedc3, #fef5e5);
    background: linear-gradient(to bottom, #ffedc3, #fef5e5);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
}
#hb_win .pwin_box .pop-xs{
    top: -1rem;
    right: 0rem;
}
.ls-input-title {
    display: flex;
    align-items: center;
    font-size: 0.4rem;
    color: #ffae73;
    margin-bottom: 0.2rem;
}

.input-code {
    display: flex;
}

.ls-from {
    margin-top: 4rem;
    width: 7.5rem;
}

.ls-input textarea{
    background: none;
    border: none;
    font-size: .32rem;
    width: 100%;
    height: 1.5rem;
    text-align: left;
    color: #e49154;
    font-family: "Microsoft YaHei", sans-serif;
    outline: none;
    transition: all 0.3s ease;
}
.ls-input input,
.ls-input select {
    background: none;
    border: none;
    font-size: .32rem;
    width: 100%;
    text-align: left;
    color: #333;
    font-family: "Microsoft YaHei", sans-serif;
    outline: none;
    transition: all 0.3s ease;
}

.ls-input input::placeholder,
.ls-input textarea::placeholder {
    color: #999;
    font-size: .28rem;
}

.pop-contents-message {
    margin-top: 5rem;
    font-size: 0.5rem;
    font-weight: bold;
    color: #b66225;
    text-align: center;
}

.ls-input:focus-within {
    border-color: #ff6b35;
    box-shadow: 0 2px 8px rgba(255, 107, 53, 0.2);
    transform: translateY(-1px);
}

.ls-input input,
.ls-input select,
.ls-input input,
.ls-input>span {
    height: 1.1rem;
    line-height: 1.1rem;
}

.ls-input-min {
    width: 65%;
}


.b-pop-min {
    width: 31%;
    line-height: 1.1rem;
    color: #fff;
    text-align: center;
    border: solid 1px #ff6b35;
    background: #ff6b35;
    height: 1.1rem;
    margin-left: .2rem;
    border-radius: .08rem;
    font-size: .28rem;
    font-weight: bold;
    transition: all 0.3s ease;
}

.getCode{
    color: #dc6a40;
    right: 2.5rem;
    line-height: 0.8rem;
}

/* 添加新的输入组样式 */
.input-group {
    display: flex;
    align-items: center;
    margin-bottom: .52rem;
}

.input-code {
    display: flex;
    align-items: center;
    flex: 1;
}

.address-from .ls-input {
    margin-bottom: 0.23rem;
}

.pop-title-img {
    margin-top: 1.1rem;
}

.pop-title-img img {
    width: 6rem;
}

.cont-box {
    line-height: .6rem;
    margin-top: 0.5rem;
    padding: 0 0.3rem;
    color: #9d4f3a;
    height: 10.2rem;
    width: 70%;
    font-size: 0.32rem;
}

.cont-box p {
    display: flex;
}

.cont-box p img {
    display: flex;
    width: 0.3rem;
    height: 0.3rem;
    margin-right: 0.1rem;
    margin-top: 0.15rem;
}

/* .cont-box img{ padding:15px 0; max-width: 100%;} */
.img-content::-webkit-scrollbar {
    width: 8px;
    /* 滚动条宽度 */
    background: transparent;
    /* 滚动条轨道背景 */
}

.img-content::-webkit-scrollbar-thumb {
    background: #e7c98a;
    /* 滚动条颜色（可自定义） */
    border-radius: 6px;
    /* 圆角 */
    border: 2px solid #f7ecd2;
    /* 滚动条与轨道之间的间隙色 */
}

.img-content::-webkit-scrollbar-track {
    background: #f7ecd2;
    /* 轨道颜色（可自定义） */
    border-radius: 6px;
}

#cont_win .pwin_box {
    height: 13.58rem;
    background: url(/Public/special/images/20240506/m/pbg2.png) no-repeat;
    background-size: 100% 100%;
}

#cont_win .cont-box {
    height: 10.5rem;
}


.list-box {
    text-align: center;
}

.list-box .list-box-title {
    color: #b54a4a;
}

.list-box li {
    line-height: .6rem;
    padding: .15rem 0;
    margin-bottom: 2px;
    border-bottom: 1px solid #c29179;
}

/* .list-box li:nth-child(1){ border-top: 1px solid #d7e9c4; } */
.list-box li a {
    line-height: .6rem;
    padding: 0 .2rem;
    border-radius: .3rem;
    color: #fff;
    background-color: #94d186;
}

.list-box li span:nth-child(1) {
    width: 40%;
}

.list-box li span:nth-child(2) {
    flex: 1;
}

.list-box li span:nth-child(3) {
    width: 24%;
}

.list-box .win-list {
    padding: 0 .12rem;
    width: 8.78rem;
    height: 7rem;
    box-sizing: content-box;
    overflow: hidden;
}

.or-but {
    margin-top: .2rem;
}

.or-but a {
    margin: 0 .24rem;
    text-decoration: underline;
    color: #f06555;
    vertical-align: top;
}

.notes {
    line-height: .5rem;
    color: #808080;
}

.rid_list {
    height: 4.3rem;
    margin: .2rem 0 .3rem;
    overflow: hidden;
}

.rid_list li {
    margin: .2rem 0;
    line-height: .6rem;
    height: .6rem;
}

.rid_list li label:nth-child(1) {
    width: 36%;
}

.rid_list li label:nth-child(2) {
    flex: 1;
    margin-right: .2rem;
}

.rid_list li label span {
    color: #30996b;
}

.rid_list a {
    width: 1.5rem;
    position: relative;
    line-height: .6rem;
    height: .6rem;
    border-radius: .3rem;
    color: #ffebb5;
    background-color: #bf4d34;
}

.rid_list a::after {
    content: "切 换";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

.rid_list a.active {
    color: #bf4d34;
    background-color: #fac15a;
}

.rid_list a.active::after {
    content: "当 前";
}

#prize_win .pwin_box {
    font-size: .8rem;
    height: 13.58rem;
    background: url(/Public/web/m/images/cover/20251209/jltc.png) no-repeat;
    background-size: 100% 100%;
}

#prize_win .pwin_box .pop-xs {
    top: -1rem;
}

#prize_win .pop-title-img {
    margin-top: 1rem;
}

#prize_win .pop-title-img img {
    width: 6rem;
}

.prize_bg {
    display: flex;
    flex-direction: column;
    align-items: center;
}

#prize_win .prize-img {
    padding: .7rem 0 .2rem 0;
    height: 5rem;
}

#prize_win .prize-img img {
    height: 100%;
}

#prize_win .prize-name {
    margin-bottom: .5rem;
    font-size: .56rem;
    color: #e15f4e !important;
}

#hb_win .pwin_box {
    background: none;
    width: 10rem;
    height: 16.35rem;
    padding: 0 !important;
    margin: 0 !important;
}


#login_win .pwin_box {
    padding-left: .14rem;
    width: 100%;
    height: 12rem;
    font-size: .3rem;
    color: #333333;
    background: url(/Public/web/m/images/cover/20251209/tcd.png) no-repeat;
    background-size: 100% 100%;
    z-index: 1000;
}
#login_win .pwin_box .pop-xs {
    top: -1rem;
    right: 0.7rem;
}

/* 登录弹窗整体 */
#login_win .pwin_box.login-box {
    width: 100%;
    height: 14rem;
    padding: 0 0.5rem 0.6rem;
    background: url(/Public/web/m/images/cover/20251209/tcd.png) no-repeat;
    background-size: 100% 100%;
  }
  
  .change-login-register{
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0.2rem;
    width: 100%;
    border-radius: 0.2rem;
    padding: 0.06rem;
    margin-bottom: 0.2rem;
    margin-top: 0.2rem;
  }
  .login-register-tab{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 3.5rem;
  }

  /* tabs */
  .account-tabs {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0.2rem;
    width: 100%;
    border-radius: 0.2rem;
    padding: 0.06rem;
    margin-bottom: 0.2rem;
  }
  
  .account-tab {
    width: 3.2rem;
    height: 0.9rem;
    line-height: 0.9rem;
    border: none;
    border-radius: 0.2rem;
    font-size: 0.38rem;
    color: #b45b28;
    font-weight: bold;
    background: #fff9d3 !important;
    background: transparent;
    cursor: pointer;
    transition: all 0.2s ease;
  }
  
  .account-tab.active {
    
    background: #ed9571 !important;
    color: #fffcea;
  }
  
  /* 输入框容器、标签 */
  #login_win .ls-from {
    width: 6.8rem;
    margin: 0.5rem auto;
    background: #ffffff;
    padding: 0.2rem;
    border-radius: 0.2rem;
    border: 2px solid #ffdfb2;
  }
  
  #login_win .input-group {
    flex-direction: column;
    align-items: flex-start;
    margin-bottom: 0.35rem;
  }
  
  #login_win .input-label {
    width: 100%;
    font-size: 0.38rem;
    color: #c27b39;
    margin-bottom: 0.15rem;
  }
  
  #login_win .ls-input {
    border: 2px solid #f7b886;
    border-radius: 0.3rem;
    background: #fffce9;
  }
  
  #login_win .ls-input input {
    height: 0.95rem;
    font-size: 0.35rem;
    color: #863f1b;
    font-weight: bold;
  }
  
  #login_win .ls-input input::placeholder {
    font-weight: normal;
    color: #c9c0bb;
  }
  
  #login_win .getCode {
    
    margin-left: 0.2rem;
    font-size: 0.3rem;
    font-weight: bold;
  }
  
  .password-group {
    transition: max-height 0.25s ease;
  }
  
  /* 按钮 */
  #login_win .z-buts.but-login {
    width: 4.3rem;
    margin: 0.3rem auto 0;
    background: url(/Public/web/m/images/cover/20251209/qdan.png) no-repeat;
    background-size: 100% 100%;
    color: #a4471b !important;
    font-size: 0.5rem;
    font-weight: bold;
  }

#qcode {
    width: 3.08rem;
    height: 3.08rem;
    left: .8rem;
    bottom: .5rem;
    overflow: hidden;
}

#invite_code_win .ls-from {
    margin-top: 4.3rem;
}

#hb_win .pwin_box .pop-x {
    top: -46px;
    right: 0;
}

.but-invite-code {
    margin-top: 1rem;
}

.info_v2 {
    background: url(/Public/special/images/20240506/m/v2/info.png) no-repeat;
    background-size: 8rem 7.7rem;
}
.info_v3 {
    background: url(/Public/web/m/images/cover/20251209/jryx.png) no-repeat;
    background-size: 100% 100%;
}

.all-swiper {
    margin-top: 0.2rem;
    height: 6.35rem;
    padding-bottom: .25rem;
    width: 100%;
    background: url(/Public/web/m/images/cover/20251209/activity-k.png) no-repeat right top;
    background-size: 100% 100%;
}

.all-swiper .swiper-slide img {
    width: 85% !important; /* 可以调整为 80%、90% 等，根据需求 */
    height: auto;
    max-width: 100%;
    object-fit: contain;
}
.swiper-button-y {
    width: 1.07rem;
    height: 1.08rem;
    top: 50%;
    margin-top: -.54rem;
}

.all-swiper .swiper-button-prev {
    left: .2rem;
    background-position: right -4.73rem;

}

.all-swiper .swiper-button-next {
    right: .2rem;
    background-position: right -3.64rem;
}

.go-yd {
    width: 5.32rem;
    height: 1.15rem;
    background-position: 0 bottom;
    bottom: 0;
    left: 55%;
    margin-left: -3.21rem;
    z-index: 55;
}

.year-container {
    height: 17.3rem;
    background: url(/Public/special/images/20240506/m/v2/nbbg.png) no-repeat;
    background-size: 100% 16.21rem;
    margin-top: .4rem;
}

.swiper1 .swiper-slide {
    opacity: 0 !important;
    -webkit-transition: all 0.3s ease-in 0;
    transition: all 0.3s ease-in 0s;
}

.swiper1 .swiper-slide.current {
    opacity: 1 !important;
}

.swiper1-sz {
    width: 1.46rem;
    left: 0;
    top: 7.72rem;
    z-index: 2;
}

.swiper1 .slide1 .text_box {
    background: url(/Public/special/images/20240506/m/v2/nb1.png) no-repeat;
}

.swiper1 .slide2 .text_box {
    background: url(/Public/special/images/20240506/m/v2/nb2.png) no-repeat;
    color: #37403a !important;
    line-height: .84rem !important;
}

.swiper1 .slide3 .text_box {
    background: url(/Public/special/images/20240506/m/v2/nb3.png) no-repeat;
    line-height: .8rem !important;
}

.swiper1 .slide4 .text_box {
    background: url(/Public/special/images/20240506/m/v2/nb4.png) no-repeat;
    line-height: .78rem !important;
}

.swiper1 .slide5 .text_box {
    background: url(/Public/special/images/20240506/m/v2/nb5.png) no-repeat;
    line-height: 1rem !important;
}

.swiper1 .slide6 .text_box {
    background: url(/Public/special/images/20240506/m/v2/nb6.png) no-repeat;
    color: #37403a !important;
}

.swiper1 .slide7 .text_box {
    background: url(/Public/special/images/20240506/m/v2/nb7.png) no-repeat;
    line-height: 1rem !important;
}

.swiper1 .slide8 .text_box {
    background: url(/Public/special/images/20240506/m/v2/nb8.png) no-repeat;
    line-height: .64rem !important;
}

.swiper1 .slide9 .text_box {
    background: url(/Public/special/images/20240506/m/v2/nb3.png) no-repeat;
    line-height: 1.1rem !important;
}

.swiper1 .slide10 .text_box {
    background: url(/Public/special/images/20240506/m/v2/nb9.png) no-repeat;
    line-height: 1.1rem !important;
}

.swiper1 .swiper-slide .text_box {
    background-size: 100% 100%;
    width: 10.03rem;
    height: 14.54rem;
    float: right;
    margin-top: 1.01rem;
    padding: 1.25rem .2rem 0 .98rem;
    text-align: left;
    color: #333333;
    font-size: .37rem;
    line-height: .58rem;
}

.swiper1 .swiper-slide .text_box p {
    position: relative;
}

.swiper1 .swiper-slide .text_box h2 {
    font-size: .4rem;
    line-height: .68rem;
    color: #fff;
}

.swiper1 .swiper-slide .text_box h3 {
    font-weight: bold;
    font-size: .35rem;
    margin-top: .5rem;
    position: relative;
}

.swiper1 .slide1 .text_box h3::after,
.swiper1 .slide2 .text_box p::after,
.swiper1 .slide3 .text_box p::after,
.swiper1 .slide4 .text_box p::after,
.swiper1 .slide6 .text_box h3::after,
.swiper1 .slide7 .text_box p::after,
.swiper1 .slide9 .text_box p::after,
.year-forms li::after {
    position: absolute;
    width: .12rem;
    height: .12rem;
    left: -.24rem;
    top: 50%;
    margin-top: -.06rem;
    content: "";
    border-radius: 50%;
}

.swiper1 .slide1 .text_box h3::after {
    background-color: #6d5530;
}

.swiper1 .slide2 .text_box p::after,
.swiper1 .slide6 .text_box h3::after {
    background-color: #497758;
}

.swiper1 .slide3 .text_box p::after {
    background-color: #6d5167;
}

.swiper1 .slide4 .text_box p::after,
.swiper1 .slide7 .text_box p::after {
    background-color: #8b71b6;
}

.swiper1 .slide3 .text_box p::after {
    background-color: #4a4a4a;
}

.swiper1 .slide2 .text_box p,
.swiper1 .slide3 .text_box p,
.swiper1 .slide4 .text_box p,
.swiper1 .slide9 .text_box p {
    margin-left: .24rem;
}

.swiper1 .slide4 .text_box h2 {
    margin: .1rem 0 .2rem;
}

.swiper1 .slide5 .text_box h2 {
    margin: .35rem 0 .3rem;
}

.swiper1 .slide6 .text_box h2 {
    margin: 0 0 .2rem;
}

.swiper1 .slide7 .text_box h2 {
    margin: .1rem 0 .5rem;
}

.swiper1 .slide8 .text_box h2 {
    margin: 0 0 .3rem;
}

.swiper1 .slide9 .text_box h2 {
    margin: 0 0 .3rem;
}

.swiper1 .slide10 .text_box h2 {
    margin: .35rem 0 .3rem;
}

.slide10 a {
    width: 5.21rem;
    height: 1.27rem;
    top: 13.5rem;
    left: 50%;
    margin-left: -2.2rem;
    background-position: 0 0;
}

.swiper1 .swiper-pagination {
    padding-right: 2.8rem;
    height: .46rem;
    bottom: 0;
    text-align: right;
}

.swiper1 .swiper-pagination span {
    width: .44rem;
    height: .44rem;
    background: url(/Public/special/images/20240506/m/v2/nd2.png) no-repeat;
    background-size: 100% 100%;
    opacity: 1 !important;
    margin: 0 .16rem !important;
}

.swiper1 .swiper-pagination span.swiper-pagination-bullet-active {
    background: url(/Public/special/images/20240506/m/v2/nd1.png) no-repeat;
    background-size: 100% 100%;
}

.b-pass {
    width: 1.3rem;
    line-height: .48rem;
    color: #fff;
    font-size: .32rem;
    border-radius: .24rem;
    bottom: 0;
    background-color: #77a078;
    right: 1.3rem;
    z-index: 12;
}

.year-forms {
    margin-top: .79rem;
    height: 14.77rem;
    width: 10.3rem;
    background: url(/Public/special/images/20240506/m/v2/nsbg.png) no-repeat;
    background-size: 100% 100%;
}

.year-forms ul {
    width: 9.34rem;
    margin-top: 1.5rem;
}

.year-forms li {
    color: #333333;
    font-size: .36rem;
    float: left;
    margin: .22rem 0;
    line-height: .58rem;
    padding-right: .3rem;
    text-align: left;
    position: relative;

}

.year-forms li::after {
    left: -.3rem;
    margin-top: .22rem;
    top: 0;
    background-color: #333333;
}

.year-forms li:nth-child(odd) {
    width: 4.64rem;
}

.year-forms li:nth-child(even) {
    width: 4.7rem;
}

.year-forms li span,
.swiper1 .text_box p span {
    color: #e0734c;
    font-weight: bold;
}

.b-tag {
    width: 4.24rem;
    height: 1.27rem;
    background-position: 0 -1.29rem;
    left: 50%;
    margin-left: -2rem;
    top: 14rem;
}

.tag_win {
    width: 10.03rem;
    right: 0;
    height: 14.53rem;
    background: url(/Public/special/images/20240506/m/v2/xbg.png) no-repeat;
    background-size: 100% 100%;
    top: 1.01rem;
    padding: 1.07rem .18rem 0 .88rem;
    text-align: left;
    color: #333333;
}

.tag_win h2 {
    line-height: .8rem;
    font-size: .4rem;
    margin-bottom: .26rem;
}

.tag_win ul {
    height: 11rem;
    width: 100%;
    overflow: hidden;
}

.tag_win ul li {
    width: 7.86rem;
    float: left;
    font-size: .37rem;
    line-height: 1.22rem;
    border-radius: .62rem;
    padding-left: 1.18rem;
    border: solid 1px #d3b482;
    margin-bottom: .28rem;
    position: relative;
}

.tag_win ul li.active {
    background-color: #d3b482;
}

.tag_win ul li::after {
    position: absolute;
    width: .4rem;
    height: .4rem;
    border-radius: 50%;
    border: solid .03rem #caa66c;
    content: "";
    left: .49rem;
    top: 50%;
    margin-top: -.2rem;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
}

.tag_win ul li.active::after {
    border: solid .03rem #e16945;
}

.tag_win ul li.active::before {
    position: absolute;
    width: .24rem;
    height: .24rem;
    border-radius: 50%;
    background-color: #e16945;
    content: "";
    left: .57rem;
    top: 50%;
    margin-top: -.12rem;
}

.tag_win .btn_confirm {
    position: absolute;
    width: 6rem;
    height: 1.94rem;
    background-position: 0 -2.58rem;
    left: 1.83rem;
    bottom: -1rem;
}

.menu-mask {
    display: none;
    position: fixed;
    z-index: 998;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.01);
    /* 几乎透明，只用于捕获点击 */
}

.side-menu.active+.menu-mask,
.menu-mask.active {
    display: block;
}

.menu-btn {
    margin-top: 0.36rem;
    margin-right: 0.2rem;
}

/* 侧边栏菜单 */
.side-menu {
    position: fixed;
    top: 0;
    right: -6rem;
    width: 6rem;
    max-width: 320px;
    height: 11rem;
    background: rgba(120, 40, 20, 0.92);
    /* 半透明红棕色 */
    color: #fff;
    z-index: 99;
    transition: right 0.3s;
    box-shadow: -2px 0 16px rgba(0, 0, 0, 0.18);
    border-radius: 0 0 16px 16px;
    padding-top: 1.5rem;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.side-menu.active {
    right: 0;
}

.side-menu ul {
    width: 90%;
    margin: 0 auto;
    padding: 0;
    list-style: none;
}

.menu-item {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    font-size: 0.5rem;
    padding: 0.5rem 0;
    border-bottom: 1px solid #a44b38;
    color: #fff;
    letter-spacing: 2px;
    position: relative;
    /* 确保没有任何过渡效果 */
    transition: none !important;
}

/* 选中项高亮 - 立即切换，无过渡动画 */
.menu-item.active {
    color: #ffd97a !important;
    font-weight: bold !important;
    transition: none !important;
}

.menu-item.active::before,
.menu-item.active::after {
    content: "◆";
    color: #ffd97a;
    font-size: 0.8rem;
    margin: 0 0.2rem;
    vertical-align: middle;
    transition: none !important;
}

/* 鼠标悬停效果 - 立即切换 */
.menu-item:hover {
    color: #ffd97a;
    cursor: pointer;
    transition: none !important;
}

/* 预约抽奖按钮样式 */
.lottery-buttons {
    position: absolute;
    bottom: 1.2rem;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    /* z-index: 1001; */
}

button {
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
    background: none !important;
}

.lottery-btns {
    width: 4.5rem;
    display: flex;
    background: none;
    border: none;
    cursor: pointer;
    transition: transform 0.3s ease;
}

.lottery-btn:hover {
    transform: scale(1.05);
}

.lottery-btn img {
    width: 4rem;
    height: auto;
}

/* 奖品展示区域 */
.prize-display {
    position: absolute;
    top: 1.5rem;
    left: 49%;
    transform: translateX(-50%);
    display: flex;
    gap: 0.1rem;
    /* z-index: 1001; */
}

.prize-item {
    width: 1.7rem;
    height: 1.7rem;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

.prize-item.selected {
    border-color: #ff5a5a;
}

.prize-item img {
    width: 80%;
    height: 80%;
    object-fit: contain;
}


@keyframes spin {
    0% {
        transform: translate(-50%, -50%) rotate(0deg);
    }

    25% {
        transform: translate(-50%, -50%) rotate(90deg);
    }

    50% {
        transform: translate(-50%, -50%) rotate(180deg);
    }

    75% {
        transform: translate(-50%, -50%) rotate(270deg);
    }

    100% {
        transform: translate(-50%, -50%) rotate(360deg);
    }
}

/* 预约成功提示 */
.appointment-success {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: rgba(0, 0, 0, 0.8);
    color: white;
    padding: 1rem;
    border-radius: 0.5rem;
    z-index: 10000;
    display: none;
}

.invite-friends {
    width: 100%;
    position: absolute;
    top: 25.2rem;
    left: 0;
    display: flex;
    flex-direction: column;
}

.invite-friends img {
    width: 75%;
}

.invite-friends-content {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    position: relative;
    margin-top: 1.5rem;
}

.invite-friends-content img {
    width: 100%;
}

.invite-friends-content-btn {
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    top: -0.45rem;
    right: 0.5rem;
    z-index: 1000;
}

.invite-friends-content-btn img {
    width: 2.5rem;
}

.invite-friends-number {
    position: absolute;
    top: 1.8rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

.invite-friends-number-img {
    display: flex;
    width: 65% !important;
}

.invite-friends-number-content {
    position: absolute;
    color: #d86f57;
    font-size: 0.35rem;
    letter-spacing: 0.1rem;
    font-weight: bold;
    margin-left: 0.1rem;
}

.invite-friends-number-content span {
    color: #d86f57;
    font-size: 0.456rem;
    font-weight: bold;
}

/* 邀请好友相关样式 */
.invite-friends-title {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.activity-rules-btn {
    position: absolute;
    right: 0.5rem;
    top: 4.2rem;
    cursor: pointer;
}

.activity-rules-btn img {
    width: 2.5rem;
}

/* 好友头像展示区域 */
.friends-avatars {
    position: absolute;
    top: 2.8rem;
    left: 48.5%;
    transform: translateX(-50%);
    display: flex;
    align-items: center;
    justify-content: flex-end;
    z-index: 10;
    width: 65%;
    max-width: 8rem;
}

.friends-avatar-list {
    display: flex;
    width: 5.5rem;
    gap: 0.2rem;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
    /* Firefox */
    -ms-overflow-style: none;
    /* IE and Edge */
    margin-right: 0.2rem;
}

.friends-avatar-list::-webkit-scrollbar {
    display: none;
    /* Chrome, Safari and Opera */
}

.friends-avatar-list .friend-avatar {
    flex-shrink: 0;
}

.friend-avatar {
    width: 1.2rem;
    height: 1.2rem;
    border-radius: 50%;
    overflow: hidden;
    border: 2px solid #ffdb8f;
}

.friend-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.add-friend-btn {
    width: 1.2rem;
    height: 1.2rem;
    border-radius: 50%;
    background: #ffab74;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    border: 2px solid #ffab74;
}

.add-friend-btn img {
    width: 60%;
    height: 60%;
}

/* 邀请操作按钮 */
.invite-actions {
    position: absolute;
    top: 4.5rem;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 0.5rem;
    z-index: 10;
}

.invite-action-btn {
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
}

.invite-action-btn img {
    width: 3rem;
    height: auto;
}

/* 邀请任务列表 */
.invite-tasks {
    position: absolute;
    top: 7.1rem;
    left: 50%;
    transform: translateX(-50%);
    width: 80%;
    z-index: 10;
}

.task-item {
    width: 90%;
    display: flex;
    align-items: center;
    background: url(/Public/web/m/images/cover/20251209/yqbjgg.png) no-repeat center center;
    background-size: 100% 100%;
    border-radius: 0.3rem;
    padding: 0.2rem 0.3rem;
    margin-bottom: 0.2rem;
    backdrop-filter: blur(10px);
}
.item-content{
    display: flex;
    flex-direction: column;
}
.item-title{
    color: #0e0e0e;
    font-size: 0.35rem;
    margin-bottom: 0.05rem;
}
.item-num{
    color: #ec914b;
    font-size: 0.3rem;
    display: flex;
}
.task-icon {
    width: 1.3rem;
    height: 1.3rem;
    margin-right: 0.2rem;
    flex-shrink: 0;
}

.task-icon img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.task-content {
    flex: 1;
    margin-right: 0.3rem;
}

.task-title {
    text-align: left;
    font-size: 0.32rem;
    color: #0e0e0e;
    margin-bottom: 0.1rem;
    letter-spacing: 0.01rem;
}

.task-message {
    text-align: left;
    font-size: 0.3rem;
    color: #0e0e0e;
    margin-bottom: 0.1rem;
    letter-spacing: 0.01rem;
}

.task-progress {
    font-size: 0.18rem;
    text-align: left;
    font-size: 0.32rem;
    color: #ec914b;
}

.task-action {
    flex-shrink: 0;
}

.task-btn {
    position: absolute;
    right: 0.4rem;
    border: none;
    width: 2rem;
    font-size: 0.2rem;
    padding: 0.15rem 0.3rem;
    cursor: pointer;
    transition: all 0.3s ease;
}

/* ✅ 让按钮内的图片不拦截点击事件 */
.task-btn img {
    pointer-events: none;
    user-select: none;
}

.task-btn:hover {
    transform: scale(1.05);
}

.task-btn.completed {
    cursor: not-allowed;
    opacity: 0.6;
}

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

.task-btn:hover:disabled {
    transform: none; /* 禁用时取消hover效果 */
}
.task-limit{
    top: 25.7rem;
    display: flex;
    align-items: center;
    right: 0.6rem;
    color: #752c20;
}
.task-limit img{
    width: 0.4rem;
    height: 0.4rem;
    margin-right: 0.2rem;
}
.version-activity{
    top: 26.5rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.nicescroll-cursors{ background:#62ac4f; }
.activity-k{
    margin-top: 0.3rem;
}
.enter-event{
    width: 5rem;
    bottom: 0rem;
}
.task-btn.completed {}

/* 邀请记录按钮 */
.invite-record-btn {
    position: absolute;
    top: 6.5rem;
    right: 1rem;
    font-size: 0.3rem;
    color: #d85a59;
    cursor: pointer;
}

.invite-record-btn img {
    width: 2rem;
}

/* 邀请码输入弹窗样式 */
.invite-code-from {
    padding: 0.5rem 0;
}

/* 邀请记录弹窗样式 */
.invite-record-list {
    max-height: 6rem;
    overflow-y: auto;
}

.invite-record-list li {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.3rem 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.invite-record-list li:last-child {
    border-bottom: none;
}

/* 邀请记录详细信息样式 */
.record-info {
    flex: 1;
}

.record-name {
    font-size: 0.28rem;
    color: #fff;
    margin-bottom: 0.1rem;
}

.record-time {
    font-size: 0.22rem;
    color: #999;
}

.record-status {
    font-size: 0.24rem;
    color: #ffdb8f;
    padding: 0.1rem 0.2rem;
    border-radius: 0.1rem;
    background: rgba(255, 219, 143, 0.1);
}

.record-status.completed {
    color: #4ecdc4;
    background: rgba(78, 205, 196, 0.1);
}

/* 邀请好友弹窗样式 */
.invite-share-content {
    padding: 0.5rem;
}

.share-url-section {
    margin-bottom: 0.5rem;
}

.share-url-label {
    font-size: 0.3rem;
    color: #8B4513;
    margin-bottom: 0.2rem;
}

.share-url-input {
    display: flex;
    gap: 0.2rem;
}

.share-url-input input {
    flex: 1;
    padding: 0.2rem;
    border: 1px solid #ccc;
    border-radius: 0.1rem;
    font-size: 0.25rem;
    background: #fff;
    color: #333;
}

.copy-btn {
    background: #ff6b6b;
    color: #8B4513;
    border: none;
    border-radius: 0.1rem;
    padding: 0.2rem 0.4rem;
    font-size: 0.25rem;
    cursor: pointer;
}

.share-qrcode-section {
    /* margin-bottom: 0.5rem; */
}

.share-invite-label {
    font-size: 0.3rem;
    color: #8B4513;
    margin-bottom: 0.2rem;
}

.share-invite-input input {
    flex: 1;
    padding: 0.2rem;
    border: 1px solid #ccc;
    border-radius: 0.1rem;
    font-size: 0.25rem;
    background: #fff;
    color: #333;
}

.share-invite-input {
    display: flex;
    gap: 0.2rem;
}

.share-invite-section {
    margin-bottom: 0.3rem;
}

.share-qrcode-label {
    font-size: 0.3rem;
    color: #8B4513;
    margin-bottom: 0.2rem;
}

.share-qrcode {
    display: flex;
    justify-content: center;
    padding: 0.5rem;
    background: #fff;
    border-radius: 0.2rem;
    width: 4rem;
    margin: 0 auto;
}

.share-tips {
    background: rgba(255, 255, 255, 0.1);
    border-radius: 0.2rem;
    padding: 0.3rem;
}

.share-tips p {
    font-size: 0.25rem;
    color: #8B4513;
    margin: 0.1rem 0;
    line-height: 1.4;
}

/* 响应式调整 */
@media (max-width: 768px) {


    .friend-avatar,
    .add-friend-btn {
        width: 1.2rem;
        height: 1.2rem;
    }

    .invite-action-btn img {
        width: 3rem;
    }

    .task-item {
        padding: 0.2rem 0.3rem;
    }

    .task-title {
        text-align: left;
        font-size: 0.32rem;
        color: #0e0e0e;
    }

    .task-progress {
        font-size: 0.18rem;
        text-align: left;
        font-size: 0.32rem;
        color: #ec914b;
    }

    .task-btn {
        font-size: 0.18rem;
        padding: 0.1rem 0.2rem;
    }
}

/* 签到功能样式 - 重新设计以匹配设计图 */
.sign-in {
    width: 100%;
    position: absolute;
    top: 51rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

}

.sign-in-title {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 75%;
    margin-bottom: 0.5rem;
}

.sign-in-title img {
    width: 100%;
}

.sign-in-content {
    width: 100%;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
}

.sign-in-content img {
    width: 100%;
}

/* 签到日历面板 - 重新设计以匹配设计图 */
.sign-in-calendar-panel {
    position: absolute;
    top: 42.5%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 89%;
    z-index: 10;
}

/* 日历标题栏 */
.calendar-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.2rem 0.3rem 0 0.3rem;
    border-radius: 0.15rem;
}

.calendar-nav-btn {
    width: 0.8rem;
    height: 0.8rem;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.3s ease;
}

.next-month {
    position: absolute;
    right: 0.2rem;
    top: 3.6rem;
    z-index: 10;
}

.prev-month {
    position: absolute;
    left: 0.2rem;
    top: 3.6rem;
    z-index: 10;
}

.calendar-nav-btn:hover {
    transform: scale(1.1);
}

.calendar-nav-btn img {
    width: 100%;
    height: 100%;
}

.calendar-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    font-size: 0.28rem;
    color: #fff;
    font-weight: bold;
}

.calendar-tip {
    color: #fff;
    font-size: 0.24rem;
    flex: 1;
    text-align: left;
}

.calendar-month {
    color: #ffd700;
    font-size: 0.42rem;
    text-align: right;
}

.calendar-month-img {
    display: flex;
    justify-content: center;
    align-items: center;
}

.calendar-month-img img {
    width: 1.5rem;
    height: auto;
    object-fit: contain;
}

/* 日历网格 - 严格按照设计图7列布局 */
.calendar-grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 0.03rem;
}

.calendar-day {
    width: 100%;
    height: 0.9rem;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.42rem;
    color: #929292;
    font-weight: bold;
    border-radius: 0.03rem;
    cursor: pointer;
    transition: all 0.3s;
    position: relative;
}

.calendar-day .day-number {
    position: relative;
}

.calendar-day .sign-status-img {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    height: 100%;
    object-fit: contain;
    z-index: 1;
}

.calendar-day.today.signed .sign-status-img {
    z-index: 3;
    /* 今天已签到时，图片在最上层 */
    width: 80%;
    /* 稍微小一点，避免遮挡背景 */
    height: 80%;
}

.calendar-day.other-month {
    color: #c15638;
    background: #f0f0f0;
    cursor: default;
}

.calendar-day.signed {
    background: none;
    /* 移除背景图片，只使用img标签 */
    color: #929292;
    position: relative;
}

.calendar-day.missed {
    background-color: #d7d7d7 !important;
    color: #929292 !important;
    opacity: 0.6;
}

/* 确保未签到日期不显示签到图标 */
.calendar-day.missed.signed {
    background: #d7d7d7 !important;
    color: #929292 !important;
    opacity: 0.6;
}

/* 确保今天的日期不显示灰色背景 */
.calendar-day.today.missed {
    background: url(/Public/web/m/images/cover/20250818/qdgl.png) no-repeat center center !important;
    background-size: 110% 110% !important;
    color: #929292 !important;
    opacity: 1 !important;
}



.calendar-day.today {
    background: url(/Public/web/m/images/cover/20250818/qdgl.png) no-repeat center center;
    background-size: 110% 110%;
    color: #c15638;
}

.calendar-day.today .sign-status-img {
    display: none;
    /* 今天不显示签到图片，只显示背景 */
}

.calendar-day.today.signed {
    background: url(/Public/web/m/images/cover/20250818/qdgl.png) no-repeat center center;
    background-size: 110% 110%;
    color: #c15638;
    font-weight: bold;
}

.calendar-day.today.signed .sign-status-img {
    display: block !important;
    /* 今天已签到时显示签到图片 */
    z-index: 3;
    /* 确保图片在最上层 */
}

/* 签到按钮 - 调整位置 */
.sign-in-btn-container {
    position: absolute;
    bottom: 0.6rem;
    left: 50%;
    transform: translateX(-50%);
    z-index: 10;
}

.zzb-img {
    position: absolute;
    display: flex;
    bottom: -2.5rem;
    left: 0;
    z-index: 8;
}

.zzb-img img {
    width: 3.5rem;
}

.sign-in-btn {
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
    transition: all 0.3s ease;
}

.sign-in-btn img {
    width: 5.2rem;
    height: auto;
}

.signed-btn {
    cursor: default;
    opacity: 0.8;
}

.signed-btn:hover {
    opacity: 0.8;
}

/* 抽奖功能样式 - 重新设计以匹配设计图 */
.lottery-contents {
    width: 100%;
    position: relative;
    position: absolute;
    top: 65.5rem;
}

.lottery-contents-title {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 75%;
    margin: 0 auto 0.5rem;
}

.lottery-contents-title img {
    width: 100%;
}

.lottery-contents-content {
    width: 100%;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 0.5rem;
}

.lottery-number {
    top: 0.5rem;
    position: absolute;
    color: #f4e2b0;
    font-size: 0.5rem;
    letter-spacing: 0.03rem;
}

.zx-img {
    position: absolute;
    bottom: -3rem;
    right: 0;
    z-index: 10;
    display: flex;
}

.zx-img img {
    width: 4rem;
}

.lottery-contents-content img {
    width: 100%;
    height: 100%;
}

/* 九宫格宝盒样式 - 优化设计 */
.treasure-box {
    position: absolute;
    top: 44%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 75%;
    height: 50%;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: repeat(2, 1fr);
    gap: 0.2rem;
    z-index: 10;
    background: linear-gradient(135deg, rgba(255, 215, 0, 0.1), rgba(255, 165, 0, 0.05));
    border-radius: 0.15rem;
    padding: 0.15rem;
    border: 2px solid rgba(255, 215, 0, 0.3);
    box-shadow:
        0 0 20px rgba(255, 215, 0, 0.2),
        inset 0 0 20px rgba(255, 215, 0, 0.1);
}

.treasure-slot {

    border-radius: 0.08rem;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.14rem;
    color: #333;
    position: relative;
    flex-direction: column;
    transition: all 0.3s ease;

    overflow: hidden;
}

.treasure-slot::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.4), transparent);
    transition: left 0.5s ease;
}

.treasure-slot:hover::before {
    left: 100%;
}



.prize-label {
    position: absolute;
    bottom: 0rem;
    font-size: 0.25rem;
    width: 1.5rem;
    /* 自动换行 */
    word-wrap: break-word;
    word-break: break-all;
    color: #333;
    text-align: center;
    margin-top: 0.03rem;
    font-weight: bold;
    text-shadow: 0 1px 2px rgba(255, 255, 255, 0.8);
    transition: all 0.3s ease;
}

.treasure-slot:hover .prize-label {
    color: #ff6b35;
    transform: scale(1.05);
}

/* 抽奖按钮 - 调整位置 */
.lottery-contents-content-btn {
    position: absolute;
    bottom: 0.2rem;
    left: 50%;
    transform: translateX(-50%);
    z-index: 10;
}

.lottery-contents-content-btn-btn {
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
}

.lottery-contents-content-btn-btn img {
    width: 5.2rem;
    height: auto;
}

/* 角色绑定和抽奖记录 - 调整位置 */
.lottery-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    z-index: 10;
}

.lottery-bind-link {
    font-size: 0.42rem;
    color: #cd5a40;
    cursor: pointer;
    padding: 0.2rem 0;
    margin-left: 0.4rem;
    border-radius: 0.1rem;
    border-bottom: 1px solid #cd5a40;
}

.lottery-record-btn img {
    width: 2.5rem;
    margin-right: 0.6rem;
}

.lottery-record-btn:hover {
    background: rgba(255, 255, 255, 0.3);
}


@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    25% {
        transform: rotate(90deg);
    }

    50% {
        transform: rotate(180deg);
    }

    75% {
        transform: rotate(270deg);
    }

    100% {
        transform: rotate(360deg);
    }
}


@keyframes boxSpin {
    0% {
        transform: scale(1) rotate(0deg);
    }

    25% {
        transform: scale(1.05) rotate(90deg);
    }

    50% {
        transform: scale(1.1) rotate(180deg);
    }

    75% {
        transform: scale(1.05) rotate(270deg);
    }

    100% {
        transform: scale(1) rotate(360deg);
    }
}


@keyframes buttonSpin {
    0% {
        transform: scale(1) rotate(0deg);
    }

    25% {
        transform: scale(1.1) rotate(5deg);
    }

    50% {
        transform: scale(1.05) rotate(0deg);
    }

    75% {
        transform: scale(1.1) rotate(-5deg);
    }

    100% {
        transform: scale(1) rotate(0deg);
    }
}

/* 奖品闪光效果 */
.prize-glow {
    animation: glow 0.5s ease-in-out;
    box-shadow: 0 0 10px rgba(255, 215, 0, 0.8);
}

@keyframes glow {
    0% {
        box-shadow: 0 0 5px rgba(255, 215, 0, 0.3);
    }

    50% {
        box-shadow: 0 0 20px rgba(255, 215, 0, 0.8);
    }

    100% {
        box-shadow: 0 0 5px rgba(255, 215, 0, 0.3);
    }
}

.activities-colorful {
    position: absolute;
    top: 83rem;
    left: 0;
    width: 100%;
    z-index: 10;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.activities-colorful-title {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 75%;
}

.activities-colorful-title img {
    width: 100%;
}

/* 活动卡片样式 */
.activities-colorful-content {
    width: 100%;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 1rem;
}

.activity-cards {
    width: 100%;
}

.activity-card {
    display: flex;
    width: 6rem;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
    position: absolute;
}

.activity-card:nth-child(1) {
    left: 0;
}

.activity-card:nth-child(2) {
    left: 5rem;
    top: 2.5rem;
}

.activity-card:nth-child(3) {
    left: 0rem;
    top: 5.8rem;
}

.activity-card:nth-child(4) {
    left: 5rem;
    top: 8rem;
}

.activity-card img {
    width: 100%;
}

.activity-card-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: 1.5rem;
}


.activity-card:active {
    transform: translateY(-0.1rem) scale(1.02);
}

/* 点击波纹效果 */
.activity-card {
    overflow: hidden;
}

.activity-card::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 0;
    height: 0;
    background: rgba(255, 255, 255, 0.3);
    border-radius: 50%;
    transform: translate(-50%, -50%);
    transition: width 0.3s, height 0.3s;
}

.activity-card:active::after {
    width: 200%;
    height: 200%;
}

.activity-icon {
    width: 3.5rem;
    height: 3.5rem;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.activity-icon img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    filter: drop-shadow(0 0.2rem 0.4rem rgba(255, 215, 0, 0.3));
    transition: all 0.3s ease;
}

.activity-card:hover .activity-icon img {
    filter: drop-shadow(0 0.3rem 0.6rem rgba(255, 215, 0, 0.6));
    transform: scale(1.1);
}

.activity-title {
    font-size: 0.32rem;
    color: #dd6754;
    font-weight: bold;
    text-align: center;
    margin-bottom: 0.1rem;
}

.activity-subtitle {
    font-size: 0.32rem;
    color: #dd6754;
    text-align: center;
    font-weight: bold;
}

/* 活动卡片动画效果 */
.activity-card {
    animation: fadeInUp 0.6s ease-out;
}

.activity-card:nth-child(1) {
    animation-delay: 0.1s;
}

.activity-card:nth-child(2) {
    animation-delay: 0.2s;
}

.activity-card:nth-child(3) {
    animation-delay: 0.3s;
}

.activity-card:nth-child(4) {
    animation-delay: 0.4s;
}

@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(2rem);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* 输入组容器 */
.input-group {
    display: flex;
    align-items: center;
    margin-bottom: 0.5rem;
    width: 100%;
}

/* 标签样式 */
.input-label {
    width: 1.5rem;
    font-size: 0.45rem;
    color: #dc6a40;
    font-weight: bold;
    text-align: left;
    margin-right: 0.3rem;
    flex-shrink: 0;
    line-height: 1.1rem;
}

/* 输入框容器 */
.input-container {
    flex: 1;
    display: flex;
    align-items: center;
}

/* 输入框样式 */
.ls-input {
    background: #fff;
    border-radius: 0.6rem;
    padding: 0 0.3rem;
    overflow: hidden;

}

.ls-input:focus-within {
    /* border-color: #ff6b35; */
    /* box-shadow: 0 2px 8px rgba(255, 107, 53, 0.2); */
}

.ls-input input {
    background: none;
    border: none;
    font-size: 0.32rem;
    width: 100%;
    text-align: left;
    color: #e49154;
    font-family: "Microsoft YaHei", sans-serif;
    outline: none;
    height: 1.1rem;
    line-height: 1.1rem;
}

.ls-input input::placeholder {
    color: #c4bcbc;
    font-weight: bold;
    font-size: 0.35rem;
}

/* 验证码输入框 */
.verification-input {
    flex: 1;
}

/* 验证码按钮 */




/* 手机号输入框 */
.phone-input {
    width: 100%;
}


@keyframes spin {
    0% {
        transform: translate(-50%, -50%) rotate(0deg);
    }

    25% {
        transform: translate(-50%, -50%) rotate(90deg);
    }

    50% {
        transform: translate(-50%, -50%) rotate(180deg);
    }

    75% {
        transform: translate(-50%, -50%) rotate(270deg);
    }

    100% {
        transform: translate(-50%, -50%) rotate(360deg);
    }
}


@keyframes buttonSpin {
    0% {
        transform: scale(1) rotate(0deg);
    }

    25% {
        transform: scale(1.1) rotate(5deg);
    }

    50% {
        transform: scale(1.05) rotate(0deg);
    }

    75% {
        transform: scale(1.1) rotate(-5deg);
    }

    100% {
        transform: scale(1) rotate(0deg);
    }
}

.pop-neser {
    width: 6.5rem;
    margin-left: 2rem;
    font-size: 0.4rem;
    margin-bottom: 0.5rem;
    color: #f96a65;
}

/* 九宫格槽位高亮动画 - 类似图片中的黄色高亮效果 */
.treasure-slot.active-slot {
    background: url(/Public/web/m/images/cover/20250818/jlgld.png) no-repeat center center;
    background-size: 100% 100%;
    transform: scale(1.2);
    z-index: 10;
    position: relative;
    animation: slotPulse 0.5s ease-in-out;
}

.treasure-slot.active-slot::before {
    content: '';
    position: absolute;
    top: -3px;
    left: -3px;
    right: -3px;
    bottom: -3px;
    /* background: linear-gradient(45deg, #ffd700, #ffa500, #ffd700); */
    border-radius: 10px;
    z-index: -1;
    animation: borderGlow 0.8s ease-in-out infinite;
}

.treasure-slot.active-slot::after {
    content: '★';
    position: absolute;
    top: -10px;
    right: -10px;
    color: #ffd700;
    font-size: 18px;
    font-weight: bold;
    text-shadow: 0 0 10px rgba(255, 215, 0, 0.8);
    animation: starTwinkle 1s ease-in-out infinite;
}

@keyframes slotPulse {
    0% {
        transform: scale(1);
        box-shadow: 0 0 5px rgba(255, 215, 0, 0.3);
    }

    50% {
        transform: scale(1.15);
        box-shadow:
            0 0 25px rgba(255, 215, 0, 1),
            0 0 50px rgba(255, 215, 0, 0.6);
    }

    100% {
        transform: scale(1.1);
        box-shadow:
            0 0 15px rgba(255, 215, 0, 0.8),
            0 0 30px rgba(255, 215, 0, 0.4);
    }
}

@keyframes borderGlow {
    0% {
        opacity: 0.6;
        transform: scale(1);
    }

    50% {
        opacity: 1;
        transform: scale(1.02);
    }

    100% {
        opacity: 0.6;
        transform: scale(1);
    }
}

@keyframes starTwinkle {
    0% {
        opacity: 0.3;
        transform: scale(0.8) rotate(0deg);
    }

    50% {
        opacity: 1;
        transform: scale(1.3) rotate(180deg);
    }

    100% {
        opacity: 0.3;
        transform: scale(0.8) rotate(360deg);
    }
}

/* 奖品闪光效果 */
.prize-glow {
    animation: glow 0.8s ease-in-out;
    box-shadow: 0 0 20px rgba(255, 215, 0, 1);
}

@keyframes glow {
    0% {
        box-shadow: 0 0 5px rgba(255, 215, 0, 0.3);
        transform: scale(1.1);
    }

    50% {
        box-shadow: 0 0 30px rgba(255, 215, 0, 1);
        transform: scale(1.2);
    }

    100% {
        box-shadow: 0 0 5px rgba(255, 215, 0, 0.3);
        transform: scale(1.1);
    }
}

/* 抽奖记录表格样式 */
.lottery-record-table {
    margin-top: 0.5rem;
    width: 67%;
    margin-bottom: 0.5rem;
}

.table-header {
    display: flex;
    height: 1.3rem;
    justify-content: center;
    align-items: center;
    border-bottom: 1px solid #c29077;
}

.header-cell {
    flex: 1;
    text-align: center;
    color: #c29077;
    font-size: 0.32rem;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.table-header .header-cell:last-child {
    border-right: none;
}

.table-body {
    width: 100% !important;
    max-height: 8rem;
    overflow-y: auto;
}

.lottery-record-list {
    padding: 0;
    list-style: none;
    
}

.lottery-record-list li {
    display: flex;
    align-items: center;
    transition: background-color 0.3s ease;
    border-bottom: 1px solid #c29077;
}

.lottery-record-list li:hover {
    background: #f8f9fa;
}

.lottery-record-list li:last-child {
    /* border-bottom: none; */
}

.lottery-record-list .record-cell {
    flex: 1;
    text-align: center;
    font-size: 0.28rem;
    color: #9d4f3a !important;
    word-break: break-word;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 1.19rem;
}

.lottery-record-list .record-cell:last-child {
    border-right: none;
}

.lottery-record-list .prize-name {
    font-weight: 500;
    color: #2c3e50;
}

.lottery-record-list .record-time {
    color: #7f8c8d;
    font-size: 0.26rem;
}

.lottery-record-list .claim-status {
    display: flex;
    justify-content: center;
    align-items: center;
}

.claim-btn {

    padding: 0.15rem 0.4rem;
    border-radius: 0.2rem;
    font-size: 0.24rem;
    font-weight: 500;
    text-decoration: none;
    transition: all 0.3s ease;
    border: none;
    cursor: pointer;
    min-width: 1.2rem;
    text-align: center;
}

.claim-btn img {
    width: 1.8rem;
}

.claim-btn.claimed {
    background: #95a5a6;
    color: #fff;
    cursor: default;
}

.claim-btn.claim-now {
    color: #fff;
}

.claim-btn.claim-now:hover {
    background: linear-gradient(135deg, #c0392b, #a93226);
    transform: translateY(-1px);
    box-shadow: 0 4px 8px rgba(231, 76, 60, 0.4);
}

.claim-btn.claim-now:active {
    transform: translateY(0);
    box-shadow: 0 2px 4px rgba(231, 76, 60, 0.3);
}

/* 空状态样式 */
.lottery-record-list .empty-state {
    text-align: center;
    padding: 2rem 0;
    color: #7f8c8d;
    font-size: 0.3rem;
    display: flex;
    justify-content: center;
}

/* 滚动条样式 */
.table-body::-webkit-scrollbar {
    width: 0.2rem;
    color: #30996b;
}

.table-body::-webkit-scrollbar-track {
    background: #ede0c5;
}

.table-body::-webkit-scrollbar-thumb {
    background: #edce8a;
    border-radius: 0.1rem;
}

.table-body::-webkit-scrollbar-thumb:hover {
    background: #a8a8a8;
}

.bound-rid-display {
    text-align: center;

}

.bound-rid-display span {
    font-size: 0.45rem;
    color: #b66224;
    font-weight: bold;
    letter-spacing: 0.03rem;
}

.appointment-success-content {
    text-align: center;
    padding: 0.5rem 0;
}

.success-message {
    font-size: 0.6rem;
    color: #666;
    margin: 0;
}

#appointment_success_win .pop-title-img {
    margin-top: 4rem;
}

.appointment-success-buttons {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    margin-top: 0.8rem;
    width: 90%;
    margin-left: 5%;
}

/* 已接受邀请弹窗样式 */
#accepted_invite_popup .pwin_box {
    background: linear-gradient(135deg, #fff9e6, #fff5d6);
    border: 2px solid #ffd700;
    border-radius: 0.5rem;
    box-shadow: 0 4px 20px rgba(255, 215, 0, 0.3);
    position: relative;
    overflow: hidden;
}

#accepted_invite_popup .pwin_box::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><defs><pattern id="waves" x="0" y="0" width="20" height="20" patternUnits="userSpaceOnUse"><path d="M0 10 Q5 5 10 10 T20 10" stroke="rgba(255,215,0,0.1)" fill="none" stroke-width="1"/></pattern></defs><rect width="100" height="100" fill="url(%23waves)"/></svg>');
    opacity: 0.3;
    pointer-events: none;
}

#accepted_invite_popup .pop-content {
    padding: 2rem 1.5rem;
    text-align: center;
    position: relative;
    z-index: 1;
}

#accepted_invite_popup .accepted-text {
    font-size: 0.8rem;
    font-weight: bold;
    color: #8B4513;
    margin: 0;
    line-height: 1.4;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}

#accepted_invite_popup .pop-exit {
    position: absolute;
    top: 0.5rem;
    right: 0.5rem;
    width: 1.5rem;
    height: 1.5rem;
    background: rgba(255, 255, 255, 0.8);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.8rem;
    color: #666;
    text-decoration: none;
    z-index: 2;
    transition: all 0.3s ease;
}

#accepted_invite_popup .pop-exit:hover {
    background: rgba(255, 255, 255, 1);
    color: #333;
    transform: scale(1.1);
}

/* 确保注册模式下账号类型切换可见 */
#login_win .account-tabs {
    display: flex;
}

/* 注册模式时可以隐藏账号类型切换 */
#login_win.register-mode .account-tabs {
    display: none;
}

/* 输入组初始隐藏状态 */
.verification-input-group,
.confirm-password-group {
    display: none;
}

.confirm-password-group.dn {
    display: none !important;
}

.password-group.dn {
    display: none !important;
}