@charset "utf-8";
#loading{width:100%;height:100%;position:fixed;top:0;left:0;background:#000;z-index:9999;font-size:18px;color:#cfd1cc;z-index:101}#loading .box{width:100%;height:1px;background:#414141;margin:0 auto;position:relative;top:50%;transform:translateY(-50%);left:0}#loading .box span{height:1px;background:#c4c4c4;position:relative;top:0;left:0;display:block}#loading .box p{font-size:16px;line-height:30px;color:silver;text-align:center}

body {
    position: relative;
    width: 100%;
    height: 100%;
    background: url(../images/bg.jpg) no-repeat 50% 0 / cover;
}

.section  {
	width: 100%;
    height:100vh;
    max-height: 1080px;
    margin:0 auto;
}
.section .logo {
    width: 1.7rem;
    height: .47rem;
    display: block;
    left:50%;margin-left: -4.8rem;top:.45rem;
    background: url(../images/logo.png) no-repeat 0 0 / contain;
}
.section .slogan {width: 7.57rem;height:4.19rem;background: url(../images/slogan.png) no-repeat 0 0 / contain;top:.53rem;left:50%;margin-left: -3.7rem;}

.section .nav-bar {width: 10.4rem;height:.56rem;top:8.75rem;left:50%;margin-left: -5.2rem;display: flex;justify-content: space-between;align-items: center;}
.section .nav-bar a {width: 1.97rem;height: .56rem;background: url(../images/btn-nav.png) no-repeat 0 0 / contain;font-size: .2rem;color:#a71c00;font-weight: bold;text-align: center;line-height: .56rem;}
.section .nav-bar a.btn-bm {width: 1.68rem;height:1.71rem;background: url(../images/btn-bm.png) no-repeat 0 0 / contain;}
.section .nav-bar a:not(.btn-bm):hover {background-image: url(../images/btn-nav-on.png);}
.section .nav-bar a.btn-bm:hover {filter: brightness(1.2);}
.section .user-bar {line-height: .3rem;font-size: .2rem;color:#fff;width: 4rem;margin-left:-2rem;top:10rem;left:50%;text-align: center;filter: drop-shadow(0 0 5px #000);}
.section .user-bar a {color:inherit;text-decoration: underline;}

.section .progress-bar {
    width: 2.54rem;
    height:2.63rem;
    background: url(../images/bg-progress.png) no-repeat 0 0 / contain;
    top:6rem;
    left: 50%;
    margin-left:.7rem;
    box-sizing: border-box;
    padding: .68rem 0 0 .62rem;
    }
.section .progress-bar .progress-ring {
    position: relative;
    /* 设计稿 200px → 2rem */
    width: 1.33rem;
    height: 1.33rem;
  }

.section .progress-bar .progress-ring svg {
    /*
       关键：旋转 SVG 使起点从默认的 3 点钟移到 9 点钟
       3点钟(0°) -> 9点钟(180°)
    */
    transform: rotate(180deg);
    width: 100%;
    height: 100%;
  }

.section .progress-bar .progress-ring circle {
    fill: none;
    stroke-width: 37;  /* viewBox 坐标系，保持固定比例 */
    /* stroke-linecap: round; */
    /* transition 在 JS 中动态添加，初始化时不应用动画 */
  }

.section .progress-bar .progress-ring .track {
    stroke: #5c5c5c;
  }

.section .progress-bar .progress-ring .bar {
    stroke: url(#blue-purple-gradient);
    stroke-dasharray: 0;
    stroke-dashoffset: 0;
  }


.progress-ring .label {width: 1.01rem;height:.7rem;background: url(../images/progress-title.png) no-repeat 50% 0 / 1.01rem .32rem;padding-top: .28rem;top: .4rem;left: .2rem;}
.progress-ring .label p{line-height: .3rem;font-size: .28rem;color:#fff;font-weight: bold;text-align: center;height: .3rem;text-align: center;background: linear-gradient(135deg, #00baf5, #fff, #ff66e9);-webkit-background-clip: text;background-clip: text;-webkit-text-fill-color: transparent;color: transparent;}

#preventRotate {
    position: fixed;
    inset: 0;
    width: 100vw;
    height: 100vh;
    overflow: hidden;
    text-align: center;
    z-index: 9998;
    background: #2e2e2e;
    display: none;
}

#preventRotate p {
    width: 100%;
    height: auto;
    font-size: .3rem;
    color: #626262;
    line-height: .5rem;
    text-align: center;
    position: absolute;
    top: 50%;
}

#preventRotate p::after {
    content:'';
    width: .9rem;
    height: 1.35rem;
    position: absolute;
    top:-1.5rem;
    left:50%;
    margin-left:-.3rem;
    background: url(data:image/png;base64,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) no-repeat 0 0 / contain;
    transform: rotate(90deg);
    animation: portIcon 1.5s infinite forwards;
}
.portrait .container {
    display: none
}

.portrait #preventRotate {
    display: block
}

@keyframes portIcon {
    0%,33% {transform: rotate(90deg);}
    100% {transform: rotate(0deg);}
}

.pop {display: none;}
.pop .btn_close{width: .6rem;height: .6rem;top: .1rem;right: .2rem;}
.pop-rules {width: 10.22rem;height:4.60rem;background: url(../images/pop-rules.png) no-repeat 0 0 / contain;padding: .8rem 1rem 0 1rem;box-sizing: border-box;}
.pop-rules p {color:#fff;font-size: .16rem;font-weight: bold;line-height: .3rem;}
.pop-rules p a,
.pop-rules p .yellow {color:#ffca00}
.pop-rules p .tips {font-weight: normal;font-size: .14rem;}

.pop-text,
.pop-my-gift {width: 4.8rem;height: 2.58rem;background: url(../images/pop.png) no-repeat 0 0 / contain;padding:.2rem}
.pop-text p,
.pop-my-gift p {height: 70%;justify-content: center;align-items: center;flex-direction: column;font-size: 0.2rem;line-height: .3rem;font-weight: bold;display: flex;text-align: center;color: #fff;}
.pop-text p a,
.pop-my-gift p a {color:#ffca00;text-decoration: underline;}
.pop-text .btn-confirm{width: 1.04rem;height: .38rem;background: url(../images/btn-confirm.png) no-repeat 0 0 / contain;top:2rem;left:50%;margin-left: -.52rem;text-indent: -999em}
.pop-my-gift .btn-copy {width: 1.04rem;height: .38rem;background: url(../images/btn-copy.png) no-repeat 0 0 / contain;top:2rem;left:50%;margin-left: -.52rem;text-indent: -999em}

.pop-text .btn-confirm:hover,
.pop-my-gift .btn-copy:hover {filter: brightness(1.2);}


.pop-confirm {width: 4.8rem;height: 2.58rem;background: url(../images/pop.png) no-repeat 0 0 / contain;padding:.2rem}
.pop-confirm  p {height:1.8rem;display: flex;justify-content: center;align-items: center;flex-direction: column;font-size: .24rem;line-height: .35rem;font-weight: bold;display: flex;text-align: center;color: #fff;}
.pop-confirm .btn-confirm {width: .94rem;height: .35rem;background: url(../images/btn-yes.png) no-repeat 0 0 / contain;top:2rem;left:50%;margin-left: -1.15rem;text-indent: -999em}
.pop-confirm .btn-confirm:hover {filter: brightness(1.2);}
.pop-confirm .btn-cancel {width: .94rem;height: .35rem;background: url(../images/btn-no.png) no-repeat 0 0 / contain;top:2rem;left:50%;margin-left: .25rem;text-indent: -999em;}
.pop-confirm .btn-confirm:hover,
.pop-confirm .btn-cancel:hover {filter: brightness(1.2);}

.pop-list {width: 8.98rem;height:3.66rem;background: url(../images/pop-list.png) no-repeat 0 0 / contain;padding: 1.5rem .2rem 0 .2rem;box-sizing: border-box;}

.pop ::-webkit-scrollbar{width: .1rem;height: .1rem;}
.pop ::-webkit-scrollbar-track{border-radius: .05rem;background-color: #fff;}
.pop ::-webkit-scrollbar-thumb{border-radius: .05rem;background-color: #ef5bfd;}

.pop-gift {width: 11.28rem;height:6.2rem;background: url(../images/pop-gift.png) no-repeat 0 0 / contain;padding:2.42rem 3.25rem 0 3.25rem;box-sizing: border-box; }
.pop-gift .btn_close{top: .26rem;right: .4rem;}
.pop-gift p {height:.55rem;line-height:.55rem;text-align: center;font-size: .22rem;}
.pop-gift .btn-list {width: 3.1rem;height:.77rem;background: url(../images/btn-list2.png) no-repeat 0 0 / contain;bottom:-.1rem;left:4.4rem;}
.pop-gift .btn-list:hover {filter: brightness(1.2);}
.pop-list {width:10.9rem;height:6.46rem;background: url(../images/pop-list.png) no-repeat 0 0 / contain;box-sizing: border-box;padding-top: .9rem;}
.pop-list .btn_close{top: .26rem;right: .4rem;}
.pop-list p {line-height:.3rem;text-align: center;font-size: .2rem;color:#fff;text-align: center;flex: 0 0 20%;}
.pop-list .list {width: 6.3rem;height:.6rem;line-height: .3rem;left: 3.7rem;top: 2.65rem;display: flex;justify-content: space-between;flex-wrap: wrap;font-size: .16rem;}
.pop-list .list p {font-size: .16rem;}
.pop-list .list p.on {color:#ffca00}
.pop-list .list-2 {top: 3.85rem;} 
.pop-list .list-3 {top: 4.95rem;overflow: auto;height: .9rem;} 

#sectionCopyright {height:185px}