body{background:#F5F7FA;font-size:15px;overflow-x:hidden;overflow-y:auto;}
html,body{}
/*html{filter:grayscale(100%);}*/
/*公共部分*/
.ui-backtop{display:none;}
.ui-sidebar{z-index:10 !important;box-shadow: 0 2px 8px 0 rgb(0 0 0);border-radius: 6px;}
.ui-filter{background:none;box-shadow:none;margin:0;border:0;}
.ui-filter .ui-row{padding-bottom:10px;}
.ui-filter .ui-row .ui-filter-left{font-size:16px;width:100px;color:#1b2337;text-align:left;}
.ui-filter .ui-row .ui-filter-left span{background:#7F7F8C;padding:6px 15px;border-radius:25px 0 25px 25px;color:#fff;font-size:15px;}
.ui-filter .ui-row .ui-filter-right{flex:1;overflow:hidden;font-size:0;border-bottom:1px solid #eee;padding-bottom:0px;}
.ui-filter .ui-row .ui-filter-right a{color:#505a71;border:0;font-size:15px;border:1px solid transparent;padding:6px 12px;}
.ui-filter .ui-row .ui-filter-right a:hover{color:#2E95FF;background:#FBFCFF;border:1px solid #E3E6FF;border-radius:18px;}
.ui-filter .ui-row .ui-filter-right a.active{color:#2E95FF;background:#FBFCFF;border:1px solid #E3E6FF;border-radius:18px;}
pre{background:#F4F8FF;border:1px solid #e0eaff;padding:15px 20px;border-radius:4px;line-height:1.5;margin:0;color:#666;position:relative;margin:20px 0;}
.ui-comment-emoji{display:flex;flex-wrap:wrap;width:100%;max-width:100%;max-height:200px;overflow-x:hidden;overflow-y:auto;padding:10px;}
.ui-comment-emoji div{width:40px;height:40px;line-height:40px;font-size:24px;border:1px solid #fff;display:block;text-align:center;border-radius:4px;cursor:pointer;font-family:'Segoe UI Emoji';}
.ui-comment-emoji div:hover{border-color:#eaeaea;}

.ui-payway{display:flex;flex-wrap:wrap;}
.ui-payway-item{flex:0 0 48.5%;max-width:48.5%;display:flex;align-items:center;justify-content:center;margin:1.5% 0;padding:15px 0;border:.8px solid #e1e6f0;color:#a1abc2;border-radius:4px;text-align:center;position:relative;cursor:pointer;font-size:16px;}
.ui-payway-item:nth-child(odd){margin-right:1.5%;}
.ui-payway-item:nth-child(even){margin-left:1.5%;}
.ui-payway-item img{height:40px;}
.ui-payway-item i{font-size:24px;margin-right:10px;color:#fff;background:#999;display:inline-block;width:40px;height:40px;line-height:40px;border-radius:50%;}
.ui-payway-item span{position:absolute;right:1px;bottom:0px;color:#fff;z-index:20;font-size:12px;display:none;}
.ui-payway-item.blue i{background:#1890FF}
.ui-payway-item.green i{background:#19BE6B}
.ui-payway-item.red i{background:#ED4014}
.ui-payway-item.active{border-color:#2E95FF;}
.ui-payway-item.active:before{position:absolute;content:"";right:0;bottom:0;color:#2E95FF;width:0;height:0;border-bottom:30px solid #2E95FF;border-left:30px solid transparent;z-index:10;}
.ui-payway-item.active span{display:block;}
.ui-payway.one .ui-payway-item{flex:0 0 100%;max-width:100%;margin:0;margin-bottom:20px;padding:10px 0}
.ui-payway.one .ui-payway-item:last-child{margin-bottom:0;}


/*VIP类型*/
.vip-list{display:flex;flex-wrap:wrap;margin:30px 0 0 -3%;}
.vip-list-item{width:47%;margin:0 0 3% 3%;padding:25px;background:#fff;border-radius:6px;border:.8px solid #e1e6f0;color:#a1abc2;position:relative;overflow:hidden;cursor:pointer;}
.vip-list-item:hover{box-shadow:0 0 .8px rgba(38,45,61,.08),0 .8px 3.2px rgba(38,45,61,.04),0 4.8px 9.6px rgba(38,45,61,.14);}
.vip-list-wrap{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;}
.vip-list-item .left{display:flex;flex-wrap:wrap;align-items:center;}
.vip-list-item .icon{background:#a1abc2;width:55px;height:55px;line-height:50px;border-radius:50%;text-align:center;margin-right:20px;}
.vip-list-item .icon i{font-size:30px;color:#fff;}
.vip-list-item h3{color:#333;font-size:18px;font-weight:bold;color:#262d3d;}
.vip-list-item .price{font-size:20px;color:#f30;}
.vip-list-item .price span{font-size:14px;color:#999;margin-left:10px;}
.vip-list-item .ischeck{position:absolute;right:3px;bottom:0px;color:#fff;z-index:20;font-size:24px;display:block;}
.vip-list-item.active{box-shadow:0 0 .8px rgba(38,45,61,.08),0 .8px 3.2px rgba(38,45,61,.04),0 4.8px 9.6px rgba(38,45,61,.14);border-color:#ddd}
.vip-list-item.active:after{position:absolute;content:"";right:0;bottom:0;color:#2E95FF;width:0;height:0;border-bottom:50px solid #2E95FF;border-left:50px solid transparent;z-index:10;}
.vip-list-item.active .ischeck{display:block;}
.vip-list-item.active .icon{background:#2E95FF;}
.vip-list-item.disabled{cursor:not-allowed;opacity:0.4}
.vip-list-item.disabled:after{position:absolute;content:"";right:0;bottom:0;width:100%;height:100%;background:rgba(0,0,0,0.1);}
.vip-list-item.disabled .ischeck{display:none;}
.vip-list-item.disabled:hover{box-shadow:none;}

/*评论*/
.comment-post{display:flex;justify-content:space-between;flex-wrap:wrap;margin:30px 0;}
.comment-post-face{width:70px;padding-right:10px;}
.comment-post-face img{width:50px;height:50px;border-radius:50%;}
.comment-post-body{flex:1;border:3px solid #f0f0f0;}
.comment-post-body-wrap{display:flex;justify-content:space-between;}
.comment-post-body-area{flex:1;padding:15px;}
.comment-post-body-area textarea{border:0;width:100%;resize:none;min-height:60px;}
.comment-post-action{border-top:1px solid #f0f0f0;display:flex;justify-content:space-between;align-items:center;padding:15px;}
.comment-post-action-name{font-weight:bold;}
.comment-post-action-name i{margin-left:10px;font-weight:normal;}
.comment-post-login{width:100px;background:#2E95FF;color:#fff;margin:-2px;text-align:center;z-index:999;display:flex;align-items:center;}
.comment-post-login a{display:block;margin:0 auto;font-size:18px;color:#fff;}

.subject{text-align:center;}
.subject h2{font-size:24px;color:#0c0c0c;margin:30px 0;position:relative;padding-bottom:18px;margin-bottom:24px;}
.subject h2:after{content:'';display:inline-block;position:absolute;bottom:0;left:50%;transform:translateX(-50%);height:6px;width:40px;background:#2E95FF;border-radius:3px}

.intro-wrap{display:flex;flex-wrap:wrap;align-items:center;margin:30px auto;}
.intro-item{width:50%;padding:0 30px;}
.intro-item:first-child{padding-right:30px;}
.intro-item:last-child{padding-left:30px;}
.intro-item img{max-width:100%;}
.intro-list{list-style:none;}
.intro-list li{background:#fff;border-bottom:1px solid #eaeaea;margin-bottom:15px;padding-bottom:15px;}
.intro-list li h3{font-size:20px;font-weight:bold;}
.intro-list li p{line-height:40px;font-size:16px;}

.cms-version tr td:first-child{border-right:1px solid #EBF2FF;position:relative;text-align:left !important;}
.cms-version tr td:first-child i{position:absolute;right:15px;color:#ddd;}

.width{width:75%;min-width:180px;max-width:1440px;margin:0 auto;}

.header-wrap {
    background: linear-gradient(180deg, #16d4f1 0%, #00BCD4);
    min-width: 1280px;
    height: 60px;
    box-shadow: 0 2px 8px 0 rgb(0 0 0);
}
.header{display: flex;justify-content: space-around;}
.header-left,.header-right{display:flex;align-items:center;}
.logo{padding:0 20px;}
.logo img{height:40px;}
.nav{margin:0;height:60px;}
.nav ul{list-style:none;display:flex;}
.nav ul li{position:relative;}
.nav ul li a{line-height:60px;padding:0 9px;font-size:16px;font-weight: bold;color:#545c63;display:block;}
.nav ul li:hover:after{width:75%;}
.nav ul li:after{width:0;height:2px;content:'';transition:0.3s;position:absolute;bottom:0;left:50%;transform:translateX(-50%);background:#2E95FF;}
.nav ul li a:hover{color:#2E95FF;}
.nav ul li.active:after{width:75%;}
.nav ul li.active a{color: #1a4458;}

.nav ul li ul{flex-wrap:wrap;z-index:999;}
.nav ul li ul li{width:100%;border-bottom:1px solid #f3f3f3;}
.nav ul li ul li a{color:#333 !important;font-size:14px;}
.nav ul li ul li a:hover{background:#fff;color:#f30 !important;}
.nav ul li ul li:hover:after{display:none;}

.s{text-align:right;position:relative;}
.s input,.s button{vertical-align:middle;}
.s input{border:1px solid #eaeaea;height:40px;line-height:36px;padding:0 20px;width:180px;border-radius:20px;}
.s button{border:0;height:36px;line-height:30px;width:36px;background:#2E95FF;color:#fff;border-radius:50%;position:absolute;right:2px;top:2px;}

.toplink{margin-right:10px;line-height:60px;height:60px;}
.toplink a{display:inline-block;font-size:16px;}
.toplink a i{color:#2E95FF;margin-right:3px;}

.nologin{line-height:60px;height:60px;}
.nologin a{display:inline-block;padding:0 20px;font-size:16px;}
.nologin a.active{background:#2E95FF;color:#fff;height:60px;line-height:60px;}
.islogin{line-height:60px;padding-right:10px;}
.islogin .account{display:inline-block;position:relative;}
.islogin .account a{}
.islogin .account a img{width:40px;height:40px;border-radius:50%;border:1px solid #f3f3f3;padding:2px;margin-right:4px;}
.islogin .account a i{font-size:14px;color:#999;}
.islogin .account .panel{position:absolute;top:60px;right:0px;background:#fff;width:260px;z-index:9999;box-shadow:0 0 10px 1px rgba(0,0,0,.1);border:1px solid #f3f3f3;display:none;}
.islogin .account .panel-header{border-bottom:1px solid #F5F5F5;padding:15px 20px;display:flex;align-items:center;/*background:linear-gradient(180deg,#F5F7FA 1%,#fff 90%);*/}
.islogin .account .panel-header .face{margin-right:15px;}
.islogin .account .panel-header .face img{width:50px;height:50px;border-radius:50%;}
.islogin .account .panel-header .info{line-height:20px;}
.islogin .account .panel-header .info span{color:#999;display:block;}
.islogin .account .panel-list{list-style:none;}
.islogin .account .panel-list li{line-height:50px;}
.islogin .account .panel-list li a{padding:0 20px;display:block;color:#666;}
.islogin .account .panel-list li a:hover{background:#fafafa;}
.islogin .account .panel-list li a i{margin:0 15px;color:#666;font-size:22px;}
.islogin .account .panel-list li a span{float:right;color:#f30;border:1px solid #FFE9E3;background:#FFFCFB;padding:4px 6px;display:inline-block;line-height:16px;margin-top:14px;border-radius:4px;font-size:12px;}
.islogin .account .panel-list li.border{border-top:1px solid #f5f5f5;}
.islogin .account:hover .panel{display:block;}

.banner{margin-top:30px;background:#fff;border-radius:10px;}
.banner-header{border-radius:10px 10px 0 0;overflow:hidden;}

.banner-footer{display:flex;background: linear-gradient(180deg, #03a9f4 0%, #2196f363);padding:15px 20px;border-radius:0 0 10px 10px;box-shadow:0 5px 20px 0 rgba(0,0,0,0.1);align-items:center;justify-content:space-between;}
.banner-footer .notice{display:flex;align-items:center;}
.banner-footer .notice ul{overflow:hidden;height:50px;}
.banner-footer .search{text-align:right;position:relative;}
.banner-footer .search input,.banner-footer .search button{vertical-align:middle;}
.banner-footer .search input{border:1px solid #eaeaea;height:40px;line-height:36px;padding:0 20px;width:240px;border-radius:20px;}
.banner-footer .search button{border:0;height:36px;line-height:30px;width:36px;background:#2E95FF;color:#fff;border-radius:50%;position:absolute;right:2px;top:2px;}

.banner .ui-carousel-prev,.ui-carousel-next{width:90px;}
.banner .ui-carousel-page{bottom:25px;}
.banner .ui-carousel-page li{height:12px;width:12px;border-radius:12px;transition:all 1s}
.banner .ui-carousel-page li.active{width:40px;}

.home-subject{display:inline-block;font-size:24px;font-weight:bold;}
.home-nav{display:inline-block;margin-left:20px;}
.home-nav a{border:1px solid #dbdee0;color:#8f8f8f;background:#fff;padding:8px 14px;display:inline-block;margin-left:10px;border-radius:4px;}
.home-nav a.active,.home-nav a:hover{border-color:#2E95FF;background:#2E95FF;color:#fff;}

.temp-list{margin:0;min-height:300px;}
.temp-list-wrap{margin:0 -14px;display:flex;flex-wrap:wrap;padding:5px 0;}
.temp-list-item{width:25%;padding:0 14px;margin-bottom:28px;position:relative;}
.temp-list-item .ui-ring{right:12px;}
.temp-list-item .ui-ring.left{left:10px;}

.temp-list-box{background:#fff;border-radius:8px;border:0.8px solid transparent;}
.temp-list-box:hover{box-shadow:0 0 .8px rgba(38,45,61,.08),0 .8px 3.2px rgba(38,45,61,.04),0 4.8px 9.6px rgba(38,45,61,.14);border-color:#e1e6f0;}
.temp-list-box .item-image{position:relative;overflow:hidden;padding-bottom:56.2%;background:#F8FBFF;border-radius:8px 8px 0 0;}
.temp-list-box .item-image img{width:100%;min-height:100%;height:auto;position:absolute;z-index:1;/*object-fit:cover;*/border-radius:8px 8px 0 0;}
.temp-list-box .item-image svg{width:100%;height:100%;text-anchor:middle;border-radius:8px 8px 0 0;font-size:20px;position:absolute;}
.temp-list-box .item-text{padding:20px 20px;}
.temp-list-box .item-text a{font-size:18px;font-weight:bold;line-height:30px;height:35px;display:block;}
.temp-list-box .item-text a.ui-text-hide-2{height:65px;}
.temp-list-box .item-text p{color:#a1abc2;line-height:24px;height:50px;font-size:14px;overflow:hidden;}
.temp-list-box .item-footer{padding:0 20px 20px 20px;display:flex;justify-content:space-between;align-items:center;border-radius:0 0 8px 8px;min-height:55px;}
.temp-list-box .item-footer .user{vertical-align:middle;}
.temp-list-box .item-footer .user a{color:#b5b5b5;}
.temp-list-box .item-footer .user a:hover{color:#FF6000;}
.temp-list-box .item-footer .user img{width:24px;height:24px;border-radius:50%;margin-right:8px;vertical-align:middle;}
.temp-list-box .item-footer .info{text-align:right;}
.temp-list-box .item-footer .info em{border:1px solid #ED4014;color:#ed4014;padding:3px 5px 4px 5px;font-size:12px;border-radius:4px;background:#fff;}
.temp-list-box .item-footer .price{color:#f30;font-size:16px;}
.temp-list-box .item-footer .price del{color:#999;font-size:12px;margin-left:5px;}
.temp-list-box .item-footer .price span{color:#999;font-size:15px;margin-left:5px;}

.pro-list .temp-list-box .item-image{padding-bottom:100%;}

.link{padding:10px 0;}
.link a{display:inline-block;margin:10px 8px 0 0;border:1px solid #f3f3f3;padding:10px 15px;border-radius:4px;font-size:15px;color:#666;}
.link a:hover{border-color:#2469F6;color:#2469F6;}

.position-relative{position:relative;margin-top:30px;}
.shape{position:absolute;pointer-events:none;right:0;bottom:-2px;left:0;overflow:hidden;}
.shape svg{transform:scale(2);width:100%;height:34px;transform-origin:top center;vertical-align:middle;color:#202942;background:#fff}
.footer{min-height:30px;background:#202942;color:#adb5bd;padding:5px 0 5px 0;position:relative;}
.copyright{border-top:0px solid #283353;padding:15px 0;}
.copyright-body {
    max-width: 96%;
    margin: 0 auto;
    color: #fff;
    display: flex;
    justify-content: center;
    padding: 0;
}
.copyright-body div,.copyright-body div a{color:#adb5bd;}
.copyright-body div a:hover{color:#fff;}

.page_single{display:flex;margin:30px 0;box-shadow:0 0 .8px rgba(38,45,61,.08),0 .8px 3.2px rgba(38,45,61,.04),0 4.8px 9.6px rgba(38,45,61,.14);border-radius:10px;}
.page_single_left{width:250px;background:#39364D;border-radius:10px 0 0 10px;min-height:700px;}

.page_nav ul{margin:30px 0;list-style:none;}
.page_nav ul li{line-height:60px;padding-left:44px;border-bottom:1px solid #222031;position:relative;}
.page_nav ul li:after{position:absolute;content:'';display:block;width:100%;height:1px;background:#46425E;left:0;bottom:-2px;}
.page_nav ul li a{font-size:16px;color:#fff;}
.page_nav ul li.active{background:linear-gradient(90deg,#FFF7F4 1%,#fff 90%);border-left:4px solid #2E95FF;margin-left:-10px;border-bottom:0;}
.page_nav ul li.active:after{display:none;}
.page_nav ul li.active a{color:#2E95FF;}

.ucenter{background:#045AFF url('../images/active.jpg') no-repeat center;background-size:cover;height:220px;padding:20px 0;}
.u-header{display:flex;align-items:center;justify-content:space-between;}

.user-info{display:flex;align-items:center;justify-content:space-between;padding:30px 0 0 0;}
.user-info .face{width:120px;}
.user-info .face img{width:100%;height:100%;border-radius:50%;border:3px solid rgba(255,255,255,0.8)}
.user-info .name{color:#fff;font-size:28px;font-weight:bold;margin-left:30px;}
.user-info .name div{font-size:16px;font-weight:normal;line-height:40px;}
.user-info-data{display:flex;align-items:center;padding-top:30px;min-width:120px;}
.user-info-data .item{width:100%;position:relative;text-align:center;padding:0 40px;}
.user-info-data .item:after{content:'';position:absolute;display:block;right:0;top:0;width:1px;height:60%;background:rgba(255,255,255,0.2);transform:translateY(40%);}
.user-info-data .item:last-child:after{display:none;}
.user-info-data .item .info{font-size:16px;color:#fff;line-height:40px;}
.user-info-data .item .num{font-size:30px;color:#fff;}

.user_nav{padding:0 20px;margin-top:20px;}
.user_nav .ui-fold ul{padding:0;}
.user_nav .ui-fold ul>li{border-bottom:0;}
.user_nav .ui-fold ul>li>a{color:#B1AEC2;font-size:16px;display:block;padding-left:30px;}
.user_nav .ui-fold ul li>i{right:5px;}
.user_nav .ui-fold ul li.active{color:#fff;}
.user_nav .ui-fold ul li.active>a{color:#fff;background:#29263A;border-radius:10px 10px 0 0}
.user_nav .ui-fold ul li ul{background:#29263A;padding:0 0 10px 0;border-radius:0 0 10px 10px;padding-bottom:10px;border-top:0;}
.user_nav .ui-fold ul li ul.show{display:block;}
.user_nav .ui-fold ul li ul li{line-height:45px;padding-left:20px;border-radius:0;}
.user_nav .ui-fold ul li ul li a{font-size:14px;}
.user_nav .ui-fold ul li ul li{border:0;line-height:45px;padding:0;}
.user_nav .ui-fold ul li ul li a i{font-size:20px;margin-right:10px;}
.user_nav .ui-fold ul li ul li a{color:#908BB5;padding:0 0 0 40px;display:block;font-size:14px;}
.user_nav .ui-fold ul li ul li a:hover{color:rgba(255,255,255,0.8);}
.user_nav .ui-fold ul li ul li.active a{color:rgba(255,255,255,0.8);}

.page_single_right{flex:1;overflow:hidden;background:#fff;border-radius:0 10px 10px 0;padding:40px 64px;}
.page_title{font-size:24px;color:#000;margin-bottom:10px;border-bottom:1px solid #eee;padding-bottom:20px;position:relative;}
.page_title:after{content:'';display:block;bottom:0;width:100px;height:2px;background:#2E95FF;position:absolute;}
.page_content{min-height:100px;margin-top:20px;}
.page_content *{max-width:100%;}
.page_content>p{margin-bottom:15px;font-size:16px;line-height:34px;}
.page_content>h1{font-size:28px;line-height:normal;border-bottom:1px solid #e9e9e9;margin:20px 0;padding-bottom:20px;}
.page_content>h2{font-size:24px;line-height:normal;border-bottom:1px solid #e9e9e9;margin:20px 0;padding-bottom:20px;}
.page_content>h3{font-size:20px;line-height:normal;border-bottom:1px solid #e9e9e9;margin:20px 0;padding-bottom:20px;}
.page_content>h4{font-size:16px;line-height:normal;}

.page_contact{font-family:verdana;color:#666;}
.page_contact h1{color:#262d3d;margin:30px 0 -10px 0;font-size:26px;}

.proshow{display:flex;margin:30px 0;box-shadow:0 0 .8px rgba(38,45,61,.08),0 .8px 3.2px rgba(38,45,61,.04),0 4.8px 9.6px rgba(38,45,61,.14);border-radius:10px;background:#fff;padding:30px;position:relative;}
.proshow-left{width:350px;margin-right:30px;}
.proshow-left img{width:100%;}
.proshow-right{flex:1;overflow:hidden;}
.pro-name{font-size:24px;color:#262d3d;font-weight:bold;}
.pro-intro{color:#a1abc2;padding:15px 0;}
.pro-price{display:flex;align-items:center;justify-content:space-between;background:#F8F8F8;padding:15px 30px;margin-bottom:20px;}
.pro-price .price{color:#f30;font-size:20px;}
.pro-price .price del{color:#777;font-size:15px;margin-left:10px;}
.pro-price em{border:1px solid #2E95FF;color:#2E95FF;padding:4px;border-radius:4px;}

.pro-ul{list-style:none;padding:0 10px;clear:both;}
.pro-ul li{display:flex;padding:6px 0;align-items:center;}
.pro-ul li em{color:#a1abc2;width:56px;display:block;font-size:15px;}

.pro-action{display:flex;justify-content:space-between;align-items:center;margin-top:10px;}
.pro-action-left{padding-left:65px;line-height:50px;display:flex;}
.pro-action-left button{display:block;padding:0 25px;color:#2E95FF;text-align:center;border:0;overflow:hidden;font-size:16px;margin-right:15px;border-radius:4px;}
.pro-action-left button.red{background:#ff4837;color:#fff;}
.pro-action-left button.blue{background:#2E95FF;color:#fff;}
.pro-action-left button.yellow{background:#ff8037;color:#fff;}
.pro-action-left button.green{background:#19BE6B;color:#fff;}
.pro-action-right{text-align:right;}


.proshow-intro{margin:30px 0 0 0;box-shadow:0 0 .8px rgba(38,45,61,.08),0 .8px 3.2px rgba(38,45,61,.04),0 4.8px 9.6px rgba(38,45,61,.14);min-height:300px;background:#fff;border-radius:0 10px 10px 10px;}
.proshow-nav{background:#fbfbfb;border-bottom:1px solid #f1f1f1;border-radius:0 10px 0 0;}
.proshow-nav ul{list-style:none;display:flex;margin-bottom:-1px;}
.proshow-nav ul li{}
.proshow-nav ul li a{display:block;padding:15px 25px;}
.proshow-nav ul li.active{background:#fff;border:1px solid #f3f3f3;border-bottom:1px solid #fff;border-top:3px solid #2E95FF;border-radius:4px 4px 0 0;}
.proshow-nav ul li.active a{color:#2E95FF;font-weight:bold;}

.ui-tab-panel{padding:30px;min-height:500px;}
.ui-tab-panel img{max-width:100%;}

.tempshow{display:flex;justify-content:space-between;position:relative;margin-bottom:30px;}
.tempshow-left{flex:1;padding-right:30px;}
.tempshow-right{width:300px;}
.tempbox{box-shadow:0 0 .8px rgba(38,45,61,.08),0 .8px 3.2px rgba(38,45,61,.04),0 4.8px 9.6px rgba(38,45,61,.14);min-height:300px;background:#fff;border-radius:10px;}

.tempshow-head{margin:0;}
.temp-action-left{line-height:40px;display:flex;}


.video_buy{background:#151625;border-radius:6px;height:500px;display:flex;align-items:center;justify-content:center;color:#fff;position:relative;text-align:center;font-size:20px;}
.video_buy p{font-size:14px;margin-top:10px;color:#999;line-height:30px;}
.video_buy p span{color:#ff6022;}
.video_buy a{display:block;margin:25px auto;color:#663D00;background-image:linear-gradient(-135deg, #FFDF89 0%, #F2CA5B 15%, #E2C078 100%);border-radius:30px;font-size:14px;line-height:36px;font-weight:400;width:100px;}
.video_buy a.upgrade{width:160px;}
.video_buy .group-wrap{display:flex;flex-wrap:wrap;width:280px;margin:20px auto}
.video_buy .group{font-size:14px;color:#ccc;line-height:26px;text-align:left;width:50%;}
.video_buy .group span{color:#fff;margin-right:5px;}
.video_buy .group em{color:#333;margin:0 5px 0 10px;background:linear-gradient(-135deg, #FEE7AE 0%, #F3D16A 15%, #E2C078 100%);color:#5A3C00;font-size:12px;padding:1px 2px;border-radius:4px;}
.video_buy .bottom{position:absolute;left:20px;right:20px;bottom:0;line-height:55px;border-top:3px solid #434645;text-align:left;color:#cfcfcf;cursor:not-allowed;display:flex;justify-content:space-between}
.video_buy .bottom .play{}
.video_buy .bottom .play span{font-size:12px;margin-left:10px;color:#999;}
.video_buy .bottom .icon i{margin-left:10px;}

.art_buy{padding:30px 30px 0 30px;}
.art_buy .group-wrap{display:flex;flex-wrap:wrap;width:100%;margin:10px auto}
.art_buy .group{font-size:14px;color:#555;line-height:26px;text-align:center;width:50%;}
.art_buy .group span{color:#06f;margin-right:5px;}
.art_buy .group em{color:#333;margin:0 5px 0 10px;border:1px solid #FFEFE7;background:#FFFDFC;color:#FF6F27;font-size:13px;padding:1px 2px;border-radius:4px;}

.down_tips{border-top:1px solid #eaeaea;padding-top:15px;}
.down_tips .group-wrap{display:flex;flex-wrap:wrap;width:100%;}
.down_tips .group{font-size:14px;color:#555;line-height:26px;text-align:left;flex:50%;}
.down_tips .group span{color:#06f;margin-right:5px;}
.down_tips .group em{color:#333;margin:0 5px 0 10px;border:1px solid #FFEFE7;background:#fff;color:#FF6F27;font-size:13px;padding:1px 2px;border-radius:4px;}

.videoshow{display:flex;flex-wrap:wrap;margin-bottom:30px;background:#151625;color:#fff;border-radius:5px;}
.videoshow-left{flex:1;padding:5px;overflow:hidden;}
.videoshow-left .video_buy{height:100%;}
.videoshow-left video{width:100%;height:100%;}
.videoshow-right{width:330px;padding:20px;position:relative;overflow:hidden;}
.videoshow-right .name{font-size:20px;margin-bottom:15px;font-weight:600;line-height:26px;word-break:break-all;}
.videoshow-right .intro{font-size:14px;word-break:break-all;color:#ccc;}
.videoshow-right .more{position:relative;}
.videoshow-right .intro_show{position:absolute;right:0;bottom:0;color:#FEE7AE;padding:0 5px 0 18px;font-size:14px;background:#151625;z-index:9;cursor:pointer;}
.videoshow-right .ui-menu{border-bottom:1px solid #2D2E3B;margin-top:20px;color:#ff6022;}
.videoshow-right .playlist{overflow:auto;height:380px;margin-top:18px;}
.videoshow-right ul{list-style:none;padding:0;margin:0;}
.videoshow-right ul li{line-height:30px;position:relative;margin-bottom:3px;}
.videoshow-right ul li a{color:#999;padding:5px 10px;display:block;background:#1B1D30;font-size:14px;}
.videoshow-right ul li a:hover{color:#fff;}
.videoshow-right ul li.active a{color:#fff;}
.videoshow-right ul li em{background:linear-gradient(-135deg, #FEE7AE 0%, #F3D16A 15%, #E2C078 100%);color:#5A3C00;font-size:12px;padding:1px 2px;border-radius:4px;margin-left:8px;}
.videoshow-right ul li em i{font-size:12px;vertical-align:baseline}
.videoshow-right ul.box{display:flex;flex-wrap:wrap;padding-right:5px;}
.videoshow-right ul.box li{width:16.2%;padding:5px;}
.videoshow-right ul.box li span{display:none;}
.videoshow-right ul.box li a{background:#1B1C2F;width:100%;display:inline-block;text-align:center;border-radius:4px;line-height:24px;}
.videoshow-right ul.box li a:hover{background:#30313D;}
.videoshow-right ul.box li.active a{background:#30313D;}
.videoshow-right ul.box li em{position:absolute;width:22x;height:22px;line-height:22px;top:-2px;right:-4px;padding:0 2px;font-size:12px;transform:scale(0.8);}
.videoshow-right .intro_bar{position:absolute;left:100%;top:0;right:0%;bottom:0;height:100%;width:100%;background:#1C1D2F;padding:30px;z-index:10;transition:all 0.5s;border-radius:0 5px 5px 0}
.videoshow-right .intro_bar .close{position:absolute;right:15px;top:15px;cursor:pointer;}
.videoshow-right .intro_bar .info{display:flex;align-items:center;margin:10px 0 20px 0;border-bottom:1px solid #333444;padding-bottom:20px;}
.videoshow-right .intro_bar .info .user{vertical-align:middle;}
.videoshow-right .intro_bar .info .user img{width:48px;height:48px;border-radius:50%;margin-right:10px;vertical-align:middle;}
.videoshow-right .intro_bar .info .other a{color:#fff;}
.videoshow-right .intro_bar .info .other a:hover{color:#f30;}
.videoshow-right .intro_bar .info .other span{display:block;font-size:13px;color:#A3A3A3;}
.videoshow-right .intro_bar.show{left:0;}


.temp-box{box-shadow:0 0 .8px rgba(38,45,61,.08),0 .8px 3.2px rgba(38,45,61,.04),0 4.8px 9.6px rgba(38,45,61,.14);background:#fff;border-radius:10px;padding:25px 30px;position:relative;}
.temp-name{font-size:20px;color:#000;margin-bottom:10px;border-bottom:1px solid #eee;padding-bottom:20px;position:relative;overflow:hidden;}
.temp-name:after{content:'';display:block;bottom:0;width:60px;height:2px;background:#2E95FF;position:absolute;}
.temp-name a{float:right;font-size:15px;margin-top:10px;}
.temp-name a span{color:#f30;margin-right:5px;}
.temp-author{display:flex;align-items:center;margin-top:20px;}
.temp-author .face{width:70px;margin-right:20px;}
.temp-author .face img{width:100%;height:100%;border-radius:50%;}
.temp-author .body{}
.temp-author .body .name{font-size:16px;}
.temp-author .body .star{color:#F90;}

.artlist{list-style:none;}
.artlist li{line-height:40px;border-bottom:1px solid #f3f3f3;padding:5px 0;}
.artlist li a{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}
.artlist li a em{background:#999;color:#fff;height:26px;line-height:26px;width:26px;border-radius:50%;font-family:verdana;margin-right:10px;font-size:12px;display:inline-block;text-align:center;}
.artlist li:nth-child(1) a em{background:#ff7300;}
.artlist li:nth-child(2) a em{background:#ff7300;}
.artlist li:nth-child(3) a em{background:#ff7300;}

.plugshow-left{width:152px;margin-right:40px;}
.plugshow-left img{width:100%;border:1px solid #f3f3f3;border-radius:4px;box-shadow:0 1px 5px 0 rgba(0,0,0,0.1);}
.plug-action-right{text-align:right;color:#999;}
.plug-action-right span{font-size:24px;color:#f30;margin-left:5px;}

.artshow{margin:0;box-shadow:0 0 .8px rgba(38,45,61,.08),0 .8px 3.2px rgba(38,45,61,.04),0 4.8px 9.6px rgba(38,45,61,.14);border-radius:10px;background:#fff;padding:40px;position:relative;}
.art-title h1{font-size:32px;line-height:40px;color:#1c1f21;}
.art-info{color:#9199a1;line-height:24px;font-size:15px;padding:20px 0;display:flex;align-items:center;justfily-content:space-between;border-bottom:1px solid #f3f3f3;}
.art-info-left{display:flex;align-items:center;}
.art-info-right{text-align:right;flex:1;overflow:hidden;}
.art-info .user{vertical-align:middle;}
.art-info .user img{width:48px;height:48px;border-radius:50%;margin-right:10px;vertical-align:middle;}
.art-info .info{}
.art-info .info a{color:#333;}
.art-info .info a:hover{color:#f30;}
.art-info .info span{display:block;font-size:14px;}

.ui-share{text-align:right;color:#999;}
.ui-share a{display:inline-block;width:40px;line-height:35px;height:40px;border-radius:50%;border:1px solid #eaeaea;margin-left:10px;text-align:center;vertical-align:middle;}
.ui-share a i{font-size:22px;}
.ui-share a:nth-child(1){color:#1890FF;}
.ui-share a:hover:nth-child(1){border-color:#1890FF;}
.ui-share a:nth-child(2){color:#ED4014;}
.ui-share a:hover:nth-child(2){border-color:#ED4014;}
.ui-share a:nth-child(3){color:#19BE6B;}
.ui-share a:hover:nth-child(3){border-color:#19BE6B;}

.art-body{word-break:break-all;padding-top:30px;font-size:16px;}
.art-body img{max-width:100%;}
.art-body p{margin-bottom:20px;line-height:32px;font-size:16px;}

.user_info{display:flex;padding:20px 0;margin-bottom:30px;}
.user_info_left{width:50%;display:flex;}
.user_info_left .face{width:150px;margin-right:30px;}
.user_info_left .face img{width:140px;height:140px;border-radius:50%;}
.user_info_left .info{line-height:35px;font-size:16px;}
.user_info_left .info p{font-weight:bold;}
.user_info_left .info p span{font-weight:normal;margin-left:15px;font-size:14px;color:rgba(0,0,0,.4);}
.user_info_left .info div span{color:rgba(0,0,0,.4);}
.user_info_right{width:50%;display:flex;align-items:center;padding-top:20px;}
.user_info_right.bill{width:70%;}
.user_info_right .item{width:33.33%;position:relative;text-align:center;}
.user_info_right .item:after{content:'';position:absolute;display:block;right:0;top:0;width:1px;height:80%;background:#eaeaea;transform:translateY(10%);}
.user_info_right .item:last-child:after{display:none;}
.user_info_right .item .info{font-size:15px;color:rgba(0,0,0,.4);line-height:40px;}
.user_info_right .item .num{font-size:24px;color:#666;}
.user_info_right .item .num span{font-size:12px;color:#999;margin-left:5px;}
.user_info_right .item .num.red{color:#f30;}

.fee_wrap{margin:20px -14px 0 -14px;display:flex;flex-wrap:wrap;}
.fee_item{width:33.33%;padding:14px;}
.fee_item_body{background:#F8FBFF;padding:15px 20px;border:1px solid #E5EBF5;border-radius:4px;}
.fee_item_head{font-size:15px;color:#000;line-height:40px;}
.fee_item_foot{display:flex;justify-content:space-between;align-items:center;}
.fee_item_left{font-size:24px;}
.fee_item_left.red{color:#f30;}
.fee_item_left.blue{color:#06f;}
.fee_item_right{}

.prenext{display:flex;flex-wrap:wrap;margin-top:30px;}
.prenext-item{width:50%;}
.prenext-item:nth-child(odd){padding-left:0;padding-right:15px;}
.prenext-item:nth-child(even){padding-left:15px;padding-right:0;}

.ui-fold .ui-fold-menu{padding-left:10px;}
.ui-fold .ui-fold-menu.active{background:#fff;font-size:16px;}
.ui-fold .ui-fold-menu.active a{font-weight:bold;}

.page_contact{font-family:verdana;color:#666;}
.page_contact h1{color:#262d3d;margin:30px 0 -10px 0;font-size:26px;}
.contact{margin-top:50px;display:flex;flex-wrap:wrap;padding:5px 0;}
.contact-item{width:50%;margin-bottom:40px;}
.contact-item .wrap{padding:35px 45px;background:#fff;border-radius:6px;border:.8px solid #e1e6f0;color:#a1abc2;}
.contact-item .wrap:hover{box-shadow:0 0 .8px rgba(38,45,61,.08),0 .8px 3.2px rgba(38,45,61,.04),0 4.8px 9.6px rgba(38,45,61,.14);}
.contact-item em{font-size:30px;margin:0 30px 20px 0;float:left;background:#2E95FF;color:#fff;width:55px;height:55px;line-height:52px;border-radius:50%;text-align:center;}
.contact-item h3{font-family:microsoft yahei;color:#333;font-size:18px;font-weight:600;color:#262d3d;}
.contact-item:nth-child(1n){padding-right:40px;padding-right:0;}
.contact-item:nth-child(2n){padding-right:0;padding-left:40px;}

.page-bind{background:#fff;padding:120px 350px;margin-bottom:30px;}
.bind-list{}
.bind-list a{display:block;border:1px solid #eee;margin-bottom:20px;padding:15px 20px;color:#333;font-weight:bold;font-size:16px;}
.bind-list a p{color:#999;font-weight:normal;font-size:14px;margin-top:10px;}
.bind-list a:hover{color:#ff4837;background:#FFF6F6;border-color:#FFD1D0;}
.bind-list a:hover p{color:#555;}
*{margin:0;padding:0;box-sizing:border-box;list-style:none;text-decoration:none;}
body{background:#f5f6f8;font-family:"微软雅黑",sans-serif;font-size:14px;color:#333;}

/* 顶部导航 */
.top-nav{background:#1a2035;width:100%;}
.nav-wrap{width:1280px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;height:60px;}
.logo{color:#fff;font-size:24px;font-weight:bold;}
.nav-menu{display:flex;}
.nav-menu li{margin:0 15px;}
.nav-menu li a{color:#ccc;font-size:15px;transition:color 0.3s;}
.nav-menu li a:hover{color:#ff6700;}

/* 横幅轮播 */
.banner{width:100%;margin:0 auto;overflow:hidden; background: linear-gradient(180deg, #2196F3 0%, #2196f363);
 box-shadow: 0 2px 8px 0 rgb(0 0 0);position:relative;}
.banner .slide{width:100%;height:100%;position:absolute;top:0;left:0;opacity:0;transition:opacity 0.5s;}
.banner .slide.active{opacity:1;}
.banner .slide img{width:100%;height:100%;object-fit:cover;}
.banner-empty{width:100%;height:100%;display:flex;align-items:center;justify-content:center;color:#999;font-size:18px;}

/* 公告条 */
.notice-bar{width:1200px;margin:10px auto;background:#fff;padding:12px 20px;border-radius:8px;display:flex;align-items:center;gap:10px;box-shadow:0 1px 3px rgba(0,0,0,0.05);}
.notice-tag{color:#fff;background:#ff6700;padding:2px 6px;border-radius:4px;font-size:13px;font-weight:bold;}
.notice-text{color:#333;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}

/* 主体容器 */
.container{width:1480px;margin:0 auto; margin-top:10px;}
.block{
  background-image: 
    /* 上层：半透明网格线 */
    linear-gradient(rgba(148, 163, 184, 0.2) 1px, transparent 1px),
    linear-gradient(90deg, rgba(148, 163, 184, 0.2) 1px, transparent 1px),
    /* 下层：135度柔色渐变底色 */
    linear-gradient(135deg, #e0f2fe 0%, #ede9fe 50%, #fce7f3 100%);
  background-size: 
    24px 24px,
    24px 24px,
    100% 100%;
  background-attachment: fixed; /* 滚动时背景固定不动 */border-radius:8px;margin-top: 10px;padding:10px;margin-bottom:15px;box-shadow: 0 2px 8px 0 rgb(0 0 0);}
.block-title {
    font-size: 18px;
    font-weight: bold;
    border-left: 4px solid #03A9F4;
    border-bottom: 4px solid #ff572261;
    /* border: 1px solid #741912; */
    padding-left: 10px;
    margin-bottom: 15px;
    line-height: 28px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.more{font-size:13px;color: #03A9F4;}
.more:hover{color:#ff6700;}

/* 通用模块标签样式 */
.module-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 10px;
    border-bottom: 1px solid #FF9800;
}
.tab-item{padding:6px 12px;border-radius:4px 4px 0 0;cursor:pointer;color:#666;transition:all 0.3s;border-bottom:2px solid transparent;}
.tab-item.active{color:#ff6700;border-bottom-color:#ff6700;font-weight:bold;}
.tab-item:hover{color:#ff6700;}

/* 列表通用样式 */
.version-list{display:grid;grid-template-columns:repeat(4,1fr);gap:15px;}
.version-item{border: 1px solid #0a1e156e;background: #ffffff;border-radius:6px;overflow:hidden;transition:all 0.3s;cursor:pointer;position:relative;}
.version-item:hover{border-color:#ff6700;box-shadow:0 0 8px rgba(255,103,0,0.2);}

/* 角标样式 */
.card-tag {
    position: absolute;
    top: 0;
    left: 0;
    width: 60px;
    height: 20px;
    background: #ff4d4f;
    color: #fff;
    font-size: 12px;
    font-weight: bold;
    z-index: 10;
    display: flex;
    align-items: center;
    justify-content: center;
    transform: rotate(-45deg) translate(-15px, -10px);
}

.item-pic{width:100%;height:340px;background:#f9f9f9;display:flex;align-items:center;justify-content:center;color:#ccc;overflow:hidden;}
.item-pic img{width:100%;height:100%;object-fit:cover;display:block;transition:transform 0.3s;}
.version-item:hover .item-pic img{transform:scale(1.05);}

.item-info{padding:12px;}
.item-title{font-size:15px;color:#333;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:10px;line-height:1.4;}
.item-title:hover{color:#ff6700;}
.item-desc{font-size:13px;color:#666;margin-bottom:10px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}

/* 卡片底部信息栏 */
.card-footer{display:flex;justify-content:space-between;padding: 0 10px 10px 10px;align-items:center;font-size:12px;color:#999;}
.footer-left{display:flex;align-items:center;gap:8px;}
.footer-avatar{width:16px;height:16px;border-radius:50%;background:#f0f0f0;overflow:hidden;}
.footer-tag{padding:2px 6px;border-radius:4px;background:#f6ffed;color:#52c41a;}
.footer-time{color:#999;}
.footer-right{color:#ff4d4f;font-weight:bold;border:1px solid #ff4d4f;padding:2px 6px;border-radius:4px;}

/* 🔥 新增：友情链接样式 */
.link-list{
    display:flex;
    flex-wrap:wrap;
    gap:15px;
}
.link-list a{
    color:#666;
    padding:5px 12px;
    border:1px solid #eee;
    border-radius:4px;
    transition:all 0.3s;
}
.link-list a:hover{
    color:#ff6700;
    border-color:#ff6700;
    background:#fff7f0;
}

/* 🔥 新增：精美底部样式 */
.footer{
    background:#1a2035;
    color:#999;
    padding:20px 0 20px;
    margin-top:20px;
    box-shadow: 0 2px 8px 0 rgb(0 0 0);
}
.footer-wrap{
    width:1200px;
    margin:0 auto;
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:30px;
    margin-bottom:30px;
}
.footer-col h3{
    color:#fff;
    font-size:16px;
    margin-bottom:20px;
    padding-bottom:10px;
    border-bottom:2px solid #ff6700;
    display:inline-block;
}
.footer-col ul{
    display:flex;
    flex-direction:column;
    gap:10px;
}
.footer-col ul li a{
    color:#999;
    transition:color 0.3s;
}
.footer-col ul li a:hover{
    color:#ff6700;
}
.footer-col p{
    line-height:1.8;
    margin-bottom:10px;
}
.footer-bottom{
    text-align:center;
    padding-top:20px;
    border-top:1px solid #2d3748;
    color:#666;
    font-size:13px;
}

/* ✅ 核心修复：电脑端默认隐藏所有手机端元素 */
.mobile-header, .mobile-sidebar, .mobile-sidebar-overlay, .mobile-footer {
    display: none !important;
}

/* ✅ 文章教程横排样式 */
.article-list {
    display: flex;
    flex-direction: column;
    gap: 15px;
}
.article-item {
    display: flex;
    gap: 20px;
    padding: 20px;
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.05);
    transition: transform 0.2s;
    cursor: pointer;
}
.article-item:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 16px rgba(0,0,0,0.08);
}
.article-pic {
    width: 220px;
    height: 140px;
    flex-shrink: 0;
    border-radius: 6px;
    overflow: hidden;
}
.article-pic img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.article-info {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.article-title {
    font-size: 20px;
    font-weight: bold;
    color: #333;
    margin-bottom: 10px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.article-desc {
    color: #666;
    font-size: 15px;
    line-height: 1.8;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}
.article-meta {
    display: flex;
    align-items: center;
    gap: 25px;
    color: #999;
    font-size: 13px;
}
.article-meta span {
    display: flex;
    align-items: center;
    gap: 5px;
}

/* ✅ 曝光举报模块样式 */
.exposure-list {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 15px;
}
.exposure-item {
    background: #fff;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0,0,0,0.05);
    transition: transform 0.2s;
    position: relative;
    cursor: pointer;
}
.exposure-item:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 16px rgba(0,0,0,0.08);
}
.exposure-tag {
    position: absolute;
    top: 10px;
    left: 10px;
    background: linear-gradient(135deg, #ff4d4f 0%, #ff7875 100%);
    color: #fff;
    padding: 3px 8px;
    border-radius: 4px;
    font-size: 12px;
    z-index: 1;
}
.exposure-pic {
    width: 100%;
    height: 150px;
    overflow: hidden;
}
.exposure-pic img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.exposure-info {
    padding: 12px;
}
.exposure-title {
    font-size: 14px;
    font-weight: bold;
    color: #333;
    margin-bottom: 8px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.exposure-meta {
    display: flex;
    justify-content: space-between;
    color: #999;
    font-size: 12px;
}

/* ✅ 标签切换样式（鼠标悬停） */
.module-tabs .tab-item {
    cursor: pointer;
    transition: all 0.2s;
}
.module-tabs .tab-item:hover {
    color: #ff6700;
}
.module-tabs .tab-item.active {
    color: #ff6700;
    border-bottom: 2px solid #ff6700;
}

/* 隐藏非激活标签的内容 */
.tab-content {
    display: none;
}
.tab-content.active {
    display: block;
}

/* ======================================
   ✅ 手机端专属样式（终极修复版）
   ====================================== */
@media (max-width: 768px) {
    /* ✅ 核心修复1：强制覆盖cms.css的min-width限制 */
    html, body {
        min-width: 100% !important;
        width: 100% !important;
        overflow-x: hidden !important;
        position: relative !important;
    }
    
    /* ✅ 核心修复2：隐藏PV/UV统计条（它会覆盖导航按钮） */
    body > div:first-child:not(.mobile-header) {
        display: none !important;
    }
    
    /* 隐藏电脑端顶部导航和侧边栏 */
    .ui-fixed-warp, .ui-sidebar {
        display: none !important;
    }
    
    /* ✅ 手机端顶部导航（z-index最高，确保在所有元素之上） */
    .mobile-header {
        display: flex !important;
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        width: 100% !important;
        height: 60px !important;
        background: #1677ff !important;
        align-items: center !important;
        justify-content: space-between !important;
        padding: 0 15px !important;
        z-index: 100001 !important; /* 最高层级 */
        box-shadow: 0 2px 8px rgba(0,0,0,0.1) !important;
    }
    .mobile-logo {
        display: flex !important;
        align-items: center !important;
        gap: 10px !important;
        color: #fff !important;
        font-size: 24px !important;
        font-weight: bold !important;
    }
    .mobile-logo img {
        height: 40px !important;
    }
    .mobile-search {
        flex: 1 !important;
        margin: 0 15px !important;
    }
    .mobile-search input {
        width: 100% !important;
        height: 36px !important;
        border: none !important;
        border-radius: 18px !important;
        padding: 0 15px !important;
        font-size: 14px !important;
    }
    
    /* ✅ 核心修复3：扩大菜单按钮点击区域，确保可点击 */
    .mobile-menu-btn {
        width: 50px !important;
        height: 50px !important;
        display: flex !important;
        flex-direction: column !important;
        justify-content: center !important;
        align-items: center !important;
        gap: 6px !important;
        cursor: pointer !important;
        z-index: 100002 !important; /* 比header更高 */
        pointer-events: all !important;
        padding: 10px !important;
        position: relative !important;
    }
    .mobile-menu-btn span {
        width: 28px !important;
        height: 3px !important;
        background: #fff !important;
        transition: all 0.3s !important;
        border-radius: 2px !important;
    }
    
    /* ✅ 手机端侧边菜单（层级正确） */
    .mobile-sidebar-overlay {
        display: none !important;
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        width: 100% !important;
        background: rgba(0,0,0,0.5) !important;
        z-index: 99999 !important; /* 比header低 */
    }
    .mobile-sidebar-overlay.active {
        display: block !important;
    }
    .mobile-sidebar {
        display: block !important;
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        width: 80% !important;
        max-width: 300px !important;
        height: 100% !important;
        background: #fff !important;
        z-index: 100000 !important; /* 比遮罩高，比header低 */
        transform: translateX(-100%) !important;
        transition: transform 0.3s ease-in-out !important;
        overflow-y: auto !important;
    }
    .mobile-sidebar.active {
        transform: translateX(0) !important;
    }
    .mobile-nav-list {
        padding: 20px 0 !important;
    }
    .mobile-nav-item {
        padding: 15px 20px !important;
        border-bottom: 1px solid #f5f5f5 !important;
        cursor: pointer !important;
    }
    .mobile-nav-item:hover {
        background: #f5f5f5 !important;
    }
    .mobile-nav-item a {
        color: #333 !important;
        font-size: 16px !important;
        text-decoration: none !important;
        display: block !important;
        width: 100% !important;
    }
    
    /* 手机端主体内容 */
    body {
        padding-top: 60px !important;
        padding-bottom: 60px !important;
        background: #f5f5f5 !important;
    }
    .container {
        width: 100% !important;
        padding: 0 0px !important;
        margin: 10px auto !important;
    }
    .block {
        margin-bottom: 15px !important;
        background: #fff !important;
        border-radius: 8px !important;
        padding: 5px !important;
        box-shadow: 0 2px 8px rgba(0,0,0,0.05) !important;
    }
    .block-title {
        padding: 0 0 10px 0 !important;
        margin-bottom: 10px !important;
        border-bottom: 1px solid #f5f5f5 !important;
        font-size: 18px !important;
        font-weight: bold !important;
        color: #333 !important;
    }
    .block-title .more {
        font-size: 14px !important;
        color: #999 !important;
        font-weight: normal !important;
    }
    
    /* ✅ 修复：手机端轮播图正常显示 */
    .banner {
        margin-bottom: 15px !important;
        border-radius: 8px !important;
        overflow: hidden !important;
        box-shadow: 0 2px 8px rgba(0,0,0,0.05) !important;
    }
    .ui-carousel {
        height: 180px !important;
    }
    .ui-carousel-item {
        height: 180px !important;
    }
    .ui-carousel-item img {
        width: 100% !important;
        height: 180px !important;
        object-fit: cover !important;
        display: block !important;
    }
    
    /* ✅ 修复：手机端所有模块2列卡片布局 */
    .version-list {
        display: grid !important;
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 10px !important;
    }
    .version-item {
        background: #fff !important;
        border-radius: 8px !important;
        overflow: hidden !important;
        box-shadow: 0 1px 3px rgba(0,0,0,0.1) !important;
        transition: transform 0.2s !important;
        cursor: pointer !important;
    }
    .version-item:hover {
        transform: translateY(-2px) !important;
    }
    .version-item .item-pic {
        width: 100% !important;
        height: 120px !important;
        overflow: hidden !important;
    }
    .version-item .item-pic img {
        width: 100% !important;
        height: 120px !important;
        object-fit: cover !important;
    }
    .version-item .item-info {
        padding: 10px !important;
    }
    .version-item .item-title {
        font-size: 14px !important;
        font-weight: bold !important;
        color: #333 !important;
        margin-bottom: 5px !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }
    .version-item .item-desc {
        font-size: 12px !important;
        color: #666 !important;
        margin-bottom: 8px !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        display: -webkit-box !important;
        -webkit-line-clamp: 2 !important;
        -webkit-box-orient: vertical !important;
        line-height: 1.4 !important;
        height: 34px !important;
    }
    .version-item .card-footer {
        padding: 0 10px 10px 10px !important;
        display: flex !important;
        justify-content: space-between !important;
        align-items: center !important;
    }
    .version-item .footer-left {
        display: flex !important;
        align-items: center !important;
        gap: 5px !important;
    }
    .version-item .footer-avatar {
        width: 24px !important;
        height: 24px !important;
        border-radius: 50% !important;
        overflow: hidden !important;
    }
    .version-item .footer-avatar img {
        width: 24px !important;
        height: 24px !important;
        object-fit: cover !important;
    }
    .version-item .footer-tag {
        font-size: 12px !important;
        color: #52c41a !important;
        background: #f6ffed !important;
        padding: 2px 6px !important;
        border-radius: 4px !important;
    }
    .version-item .footer-time {
        font-size: 12px !important;
        color: #999 !important;
    }
    .version-item .footer-right {
        font-weight: bold !important;
        color: #ff4d4f !important;
    }
    
    /* 文章教程手机端样式 */
    .article-item {
        flex-direction: column !important;
        gap: 10px !important;
        padding: 15px !important;
        margin-bottom: 10px !important;
    }
    .article-pic {
        width: 100% !important;
        height: 180px !important;
    }
    .article-title {
        font-size: 16px !important;
    }
    .article-meta {
        gap: 15px !important;
        flex-wrap: wrap;
    }
    
    /* 曝光举报手机端样式 */
    .exposure-list {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 10px !important;
    }
    
    /* 标签手机端横向滚动 */
    .module-tabs {
        display: flex;
        overflow-x: auto;
        white-space: nowrap;
        padding-bottom: 5px;
        margin-bottom: 10px;
        -webkit-overflow-scrolling: touch;
    }
    .module-tabs::-webkit-scrollbar {
        display: none;
    }
    .module-tabs .tab-item {
        flex-shrink: 0;
        padding: 8px 15px;
        font-size: 14px;
    }
    
    /* 手机端底部tab栏 */
    .mobile-footer {
        display: flex !important;
        position: fixed !important;
        bottom: 0 !important;
        left: 0 !important;
        right: 0 !important;
        width: 100% !important;
        height: 60px !important;
        background: #fff !important;
        border-top: 1px solid #eee !important;
        z-index: 99999 !important;
    }
    .mobile-tab-item {
        flex: 1;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        color: #666;
        text-decoration: none;
        font-size: 12px;
    }
    .mobile-tab-item.active {
        color: #1677ff;
    }
    .mobile-tab-item i {
        font-size: 24px;
        margin-bottom: 5px;
    }
    
    /* 友情链接手机端 */
    .link-list {
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
    }
    .link-list a {
        padding: 5px 10px;
        background: #f5f5f5;
        border-radius: 4px;
        font-size: 12px;
    }
}

.backDiv {
    top: 0;
    left: 0;
    z-index: -999;
    width: 100%;
    height: 100%;
    transform: translateZ(0);
    -webkit-transform: translateZ(0);
    position: fixed;
}
.mqi1{
    position: fixed;
    left:0px;
    top:78px;
    z-index:9999999;
}
.mqi2{
    background: rgba(0,0,0,0.5);color:#fff;padding: 5px 10px;border-radius: 50px;font-size: 12px;font-family: '微软雅黑';
}
.mqi3{
    background: rgba(0,0,0,0.5);color:#fff;padding: 5px 10px;border-radius: 50px;font-size: 12px;font-family: '微软雅黑';margin-top: 10px;
} 
/* 友情链接容器 */
.friendlink {
    /*width: 1161.8888;*/
    margin: 0;
    padding: 15px 20px;
    background: #261f3c url(../images/footer.jpg) no-repeat top;
    /*background: url(../images/footer.gif);*/
    /*background: linear-gradient(to bottom, #9e0726, #ae092b);*/
    /*border-top: 1px solid #8a001d;*/
    /*border-bottom: 1px solid #9d0826;*/
}

/* 标题和按钮容器 */
.friendlink-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 15px;
}

.friendlink h3 {
    font-size: 16px;
    font-weight: bold;
    color: #00ff00;
    margin: 0;
}

/* 申请友链按钮 */
.apply-btn {
    background: #ff0000;
    color: #fff;
    border: none;
    padding: 5px 12px;
    font-size: 12px;
    border-radius: 3px;
    cursor: pointer;
    transition: all 0.3s;
}

.apply-btn:hover {
    background: #cc0000;
}

/* 友链列表 */
.friendlink ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 10px 15px;
}

.friendlink ul li {
    display: inline-block;
}

.friendlink ul li a {
    color: #fff;
    text-decoration: none;
    font-size: 14px;
    padding: 4px 8px;
    border-radius: 3px;
    background: #3d2817;
    transition: all 0.3s;
}

.friendlink ul li a:hover {
    color: #ffd700;
    background: #4a3020;
}

/* ========== 纯原生弹窗样式 ========== */
/* 遮罩层 */
.apply-mask {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.7);
    z-index: 9999;
    display: none;
}

/* 弹窗主体 */
.apply-popup {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 550px;
    background: #bdbdbd;
    border-radius: 5px;
    box-shadow: 0 0 20px rgba(0,0,0,0.5);
    z-index: 10000;
    display: none;
}

/* 弹窗标题 */
.apply-popup-header {
    padding: 15px 20px;
    background: #1b521e;
    border-bottom: 1px solid #000000;
    border-radius: 5px 5px 0 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.apply-popup-header h4 {
    color: #fff;
    margin: 0;
    font-size: 16px;
}

.apply-close {
    color: #999;
    font-size: 20px;
    cursor: pointer;
    transition: all 0.3s;
}

.apply-close:hover {
    color: #fff;
}

/* 弹窗内容 */
.apply-popup-body {
    padding: 20px;
}

/* 表单样式 */
.apply-form-item {
    margin-bottom: 15px;
}

.apply-form-item label {
    display: block;
    color: #0b420d;
    margin-bottom: 5px;
    font-size: 14px;
}

.apply-form-item input,
.apply-form-item textarea {
    width: 100%;
    padding: 8px 10px;
   background: #ffffff;
    border: 1px solid #7e7c7a;
        color: #000;
    border-radius: 3px;
    box-sizing: border-box;
}

.apply-form-item input:focus,
.apply-form-item textarea:focus {
    outline: none;
    border-color: #ffd700;
}

.apply-form-item textarea {
    height: 80px;
    resize: none;
}

/* 提交按钮 */
.apply-submit {
    width: 100%;
    padding: 10px;
    background: #273840;
    color: #8BC34A;
    border: none;
    border-radius: 3px;
    cursor: pointer;
    font-size: 14px;
    transition: all 0.3s;
}

.apply-submit:hover {
    background: #cc0000;
}
/* 手机自适应 */
@media (max-width:1200px){
    .nav-wrap,.banner,.notice-bar,.container,.footer-wrap{width:95%;}
    .version-list{grid-template-columns:repeat(2,1fr);}
    .footer-wrap{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:640px){
    .version-list{grid-template-columns:1fr;}
    .nav-menu{gap:10px;}
    .module-tabs{gap:10px;}
    .footer-wrap{grid-template-columns:1fr;}
}

/* 播放器外层盒子 */
.music-player-box {
    position: fixed;
    bottom: 30px;
    left: 0; /* 固定贴最左侧 */
    z-index: 99;
    transition: all 0.4s ease;
    /* 展开状态宽度 */
    width: 220px;
}
/* 收缩状态：向左移出大部分，只留侧边箭头 */
.music-player-box.close {
    width: 40px;
    transform: translateX(-180px); /* 向左缩进，只露出40px箭头按钮 */
}
/* 收缩箭头按钮固定在最左侧可视区域 */
.music-toggle-btn {
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 40px;
    height: 100%;
    background: rgba(0,0,0,0.2);
    border-radius: 0 8px 8px 0;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.music-player-box{
    position: fixed;
    left: 20px;
    bottom: 20px;
    width: 380px;
    background: linear-gradient(90deg, #f725ff7a, #41b8ff59);
    /* background: rgba(20, 20, 30, 0.85); */
    backdrop-filter: blur(10px);
    border-radius: 12px;
    color: #322f2f;
    z-index: 99999;
    box-shadow: 0 8px 32px rgba(0,0,0,0.3);
    /* border: 1px solid rgba(255, 255, 255, 0.1); */
    overflow: hidden;
    transition: all 0.3s ease;
}
.music-player-box.collapsed{
width: 70px !important;
    height: 70px !important;
    border-radius: 50% !important;
    padding: 0 !important;
    min-height: auto !important;
    background-image: url(/template/mob1/images/mqgzs.png);
    /* background: linear-gradient(135deg, #f725ff, #b6ff4159) !important; */
    /* box-shadow: 0 0px 0px 0 rgb(0 0 0 / 78%); */
    box-shadow: 0px 1px 2px 5px #070c0e2b;
    border: solid 1px #9E9E9E;
    cursor: pointer;
    /* width: 90px; */
    /* height: 20px; */
    /* border-radius: 5%;*/
}
.music-player-box.collapsed .player-main,
.music-player-box.collapsed .playlist-panel,
.music-player-box.collapsed .bottom-lyric-bar{
    display: none;
}
.music-player-box.collapsed .player-toggle-btn{
    width: 100%;
    height: 100%;
    position: static;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #e91e6314;
}
.music-player-box.collapsed .toggle-icon{
    transform: rotate(180deg);
}

/* 展开收起按钮 */
.player-toggle-btn{
    position: absolute;
    right: -1px;
    top: 9%;
    /*transform: translateY(-50%);*/
    width: 25px;
    height: 80px;
    background: rgb(93 88 94 / 42%);
    border-radius: 6px 0px 0px 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 10;
}
.toggle-icon{
    font-size: 18px;
    font-weight: bold;
    transition: transform 0.3s;
}

/* 主播放器布局 */
.player-main{
    display: flex;
    padding: 5px;
    gap: 5px;
}

/* 专辑封面 + 旋转动画 */
.album-cover{
    width: 80px;
    height: 80px;
    border-radius: 50%;
    overflow: hidden;
    flex-shrink: 0;
    border: 3px solid rgba(255,255,255,0.1);
    box-shadow: 0 0 15px rgba(0,0,0,0.3);
}
.album-cover img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.album-cover.playing{
    animation: rotate 10s linear infinite;
}
@keyframes rotate{
    from{transform: rotate(0deg);}
    to{transform: rotate(360deg);}
}

/* 右侧控制区 */
.player-right{
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.song-info{ margin-bottom: 8px; }
.song-name{
    font-size: 14px;
    font-weight: bold;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.song-singer{
    font-size: 12px;
    color: #607D8B;
    margin-top: 2px;
}

/* 控制按钮组 */
.control-btns{
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 8px;
}
.ctrl-btn{
    cursor: pointer;
    font-size: 14px;
    color: #5a5756;
    font-weight: bold;
    transition: color 0.2s;
}
.ctrl-btn:hover{ color: #fff; }
.play-btn{
   font-size: 20px;
   font-weight: bold;
    color: #484a4cc7;
}

/* 进度条 */
.progress-wrap{
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 5px;
}
.time-text{
    font-size: 11px;
   color: #322e2e;
    flex-shrink: 0;
    min-width: 35px;
    text-align: center;
}
.progress-bar{
    flex: 1;
    height: 4px;
    background: rgba(255,255,255,0.1);
    border-radius: 2px;
    cursor: pointer;
    position: relative;
}
.progress-fill{
    height: 100%;
    width: 0%;
    background: #2a7c2d82;
    border-radius: 2px;
    position: relative;
}
.progress-fill::after{
    content: '';
    position: absolute;
    right: -4px;
    top: 50%;
    transform: translateY(-50%);
    width: 8px;
    height: 8px;
    background: #fff;
    border-radius: 50%;
    opacity: 0;
    transition: opacity 0.2s;
}
.progress-bar:hover .progress-fill::after{ opacity: 1; }

/* 音量控制 */
.volume-wrap{
    display: flex;
    align-items: center;
    gap: 8px;
}
.volume-icon{
    font-size: 13px;
    cursor: pointer;
    flex-shrink: 0;
}
.volume-bar{
    width: 60px;
    height: 3px;
    background: rgba(255,255,255,0.1);
    border-radius: 2px;
    cursor: pointer;
}
.volume-fill{
    height: 100%;
    width: 50%;
    background: #817d71;
    border-radius: 2px;
}

/* 底部单行歌词条 */
.bottom-lyric-bar{
    height: 32px;
    line-height: 32px;
    border-top: 1px solid rgba(255,255,255,0.1);
    padding: 0 15px;
    background: rgba(0,0,0,0.2);
    overflow: hidden;
    transition: all 0.3s ease;
}
.bottom-lyric-bar.hidden{
    height: 0;
    padding-top: 0;
    padding-bottom: 0;
    border-top: none;
}
.lyric-scroll-box{
    width: 100%;
    overflow: hidden;
    white-space: nowrap;
}
.lyric-scroll-text{
    display: inline-block;
    color: #f5e3e9;
    font-size: 13px;
    font-weight: bold;
    animation: lyricScroll 8s linear infinite;
    padding-left: 10%;
}
@keyframes lyricScroll{
    0%{ transform: translateX(0); }
    100%{ transform: translateX(-100%); }
}

/* 展开面板 */
.playlist-panel{
    border-top: 1px solid rgba(255,255,255,0.1);
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease;
}
.playlist-panel.show{ max-height: 300px; }

/* 面板标签 */
.panel-tabs{
    padding: 10px 15px;
    display: flex;
    align-items: center;
    gap: 15px;
    border-bottom: 1px solid rgba(255,255,255,0.1);
    background: rgba(0,0,0,0.2);
}
.tab-item{
    font-size: 13px;
    cursor: pointer;
    color: #1c1c1c;
    font-weight: bold;
    padding-bottom: 2px;
    border-bottom: 2px solid transparent;
    transition: all 0.2s;
}
.tab-item.active{
    color: #fff;
    border-bottom-color: #007bff;
}
.list-count{
    margin-left: auto;
    font-size: 12px;
    color: #999;
}

/* 面板内容切换 */
.panel-content{
    display: none;
    max-height: 260px;
    overflow: hidden;
}
.panel-content.show{ display: block; }

/* 歌单列表 */
.playlist{
    list-style: none;
    margin: 0;
    padding: 5px 0;
    max-height: 240px;
    overflow-y: auto;
}
.playlist li{
    padding: 8px 15px;
    display: flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    font-size: 13px;
    transition: background 0.2s;
}
.playlist li:hover{ background: rgba(255,255,255,0.05); }
.playlist li.active{
    color: #007bff;
    background: rgba(0,123,255,0.1);
}
.list-index{
    width: 20px;
    color: #666;
    flex-shrink: 0;
    font-size: 12px;
}
.list-title{
    flex: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.list-singer{
    color: #888;
    font-size: 12px;
    flex-shrink: 0;
    max-width: 120px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* 歌词面板 */
.lyric-wrap{
    height: 260px;
    overflow-y: auto;
    padding: 80px 15px;
    box-sizing: border-box;
    text-align: center;
    transition: transform 0.3s ease;
}
.lyric-wrap::-webkit-scrollbar{ width: 4px; }
.lyric-wrap::-webkit-scrollbar-thumb{
    background: rgba(255,255,255,0.2);
    border-radius: 2px;
}
.lyric-line{
    padding: 6px 0;
    font-size: 13px;
    color: #888;
    transition: all 0.2s;
    line-height: 1.6;
}
.lyric-line.active{
    color: #007bff;
    font-size: 14px;
    font-weight: 500;
}
.lyric-empty{
    color: #666;
    font-size: 13px;
    padding-top: 100px;
}

/* 滚动条美化 */
.playlist::-webkit-scrollbar{ width: 4px; }
.playlist::-webkit-scrollbar-thumb{
    background: rgba(255,255,255,0.2);
    border-radius: 2px;
}
/* 强制按钮可点击，解决层级遮挡问题 */
.control-btns .ctrl-btn{
    position: relative;
    z-index: 20;
    pointer-events: auto !important;
    cursor: pointer !important;
    user-select: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
/* 手机端适配 */
@media (max-width: 768px){
    .music-player-box{
        width: calc(100% - 40px);
        left: 20px;
        bottom: 70px;
    }
    .volume-wrap{ display: none; }
}

/* 轮播主容器 */
.ui-carousel{
    position: relative;
    width: 100%;
    height: 400px;
    overflow: hidden;
    margin: 0 auto;
}
.ui-carousel-inner{
    position: relative;
    width: 100%;
    height: 100%;
}
/* 轮播项 */
.ui-carousel-item{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    transition: opacity 0.5s ease-in-out;
    z-index: 1;
}
.ui-carousel-item.active{
    opacity: 1;
    z-index: 2;
}
.ui-carousel-item a{
    display: block;
    width: 100%;
    height: 100%;
}
.ui-carousel-item img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    border: none;
}
.banner-empty{
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f5f5f5;
    color: #999;
    font-size: 18px;
}

/* 左右切换按钮 */
.ui-carousel-prev,
.ui-carousel-next{
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 40px;
    height: 60px;
    background: rgba(0,0,0,0.3);
    color: #fff;
    text-decoration: none;
    z-index: 10;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.3s;
    user-select: none;
}
.ui-carousel-prev:hover,
.ui-carousel-next:hover{
    background: rgba(0,0,0,0.5);
}
.ui-carousel-prev{ left: 15px; }
.ui-carousel-next{ right: 15px; }
.ui-carousel-prev-icon,
.ui-carousel-next-icon{
    border: solid #fff;
    border-width: 0 2px 2px 0;
    display: inline-block;
    padding: 6px;
}
.ui-carousel-prev-icon{ transform: rotate(135deg); }
.ui-carousel-next-icon{ transform: rotate(-45deg); }

/* 底部分页圆点 */
.ui-carousel-page{
    position: absolute;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    gap: 10px;
    z-index: 10;
}
.ui-carousel-page li{
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: rgba(255,255,255,0.5);
    cursor: pointer;
    transition: all 0.3s;
}
.ui-carousel-page li.active{
    background: #fff;
    width: 30px;
    border-radius: 6px;
}

/* 移动端适配 */
@media (max-width: 768px){
    .ui-carousel{ height: 200px; }
    .ui-carousel-prev,
    .ui-carousel-next{
        width: 30px;
        height: 45px;
    }
}
/* 懒加载图片淡入过渡效果 */
img.lazy {
    opacity: 0.65;
    transition: opacity 0.35s ease-in-out;
}
img.lazy.loaded {
    opacity: 1;
}
/* 登录用户下拉菜单样式 */
.header-user {
    position: relative;
    background: #4caf5082;
    color: #b73f3f;
    padding: 8px 10px;
    border-radius: 4px;
    font-size: 14px;
}
.active{color: #fffcfc;}
.user-dropdown{position:relative}
.user-name{color:#333;text-decoration:none;display:inline-block;line-height:20px;padding:0 0px}
.user-dropdown-menu{position:absolute;top:27px;right:0;min-width:120px;background:#fff;border:1px solid #eee;border-radius:4px;box-shadow:0 2px 8px rgba(0,0,0,.08);display:none;z-index:999}
.user-dropdown-menu li{list-style:none}
.user-dropdown-menu li a{display:block;padding:10px 15px;color:#333;text-decoration:none;font-size:14px}
.user-dropdown-menu li a:hover{background:#f5f7fa;color:#007acc}
.user-dropdown:hover .user-dropdown-menu{display:block}

/* ========== 修复后：独立轮播样式（不与UI库冲突） ========== */
.my-carousel{
    position: relative;
    width: 100%;
    height: 400px;
    overflow: hidden;
    margin: 0 auto;
    border-radius: 0px;
}
.my-carousel .ui-carousel-inner{
    position: relative;
    width: 100%;
    height: 100%;
}
.my-carousel .ui-carousel-item{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    transition: opacity 0.5s ease-in-out;
    z-index: 1;
}
.my-carousel .ui-carousel-item.active{
    opacity: 1;
    z-index: 2;
}
.my-carousel .ui-carousel-item a{
    display: block;
    width: 100%;
    height: 100%;
}
.my-carousel .ui-carousel-item img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    border: none;
}
.my-carousel .ui-carousel-prev,
.my-carousel .ui-carousel-next{
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 40px;
    height: 60px;
    background: rgba(0,0,0,0.3);
    color: #fff;
    text-decoration: none;
    z-index: 10;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.3s;
    user-select: none;
}
.my-carousel .ui-carousel-prev:hover,
.my-carousel .ui-carousel-next:hover{
    background: rgba(0,0,0,0.5);
}
.my-carousel .ui-carousel-prev{ left: 15px; }
.my-carousel .ui-carousel-next{ right: 15px; }
.my-carousel .ui-carousel-prev-icon,
.my-carousel .ui-carousel-next-icon{
    border: solid #fff;
    border-width: 0 2px 2px 0;
    display: inline-block;
    padding: 6px;
}
.my-carousel .ui-carousel-prev-icon{ transform: rotate(135deg); }
.my-carousel .ui-carousel-next-icon{ transform: rotate(-45deg); }
.my-carousel .ui-carousel-page{
    position: absolute;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    gap: 10px;
    z-index: 10;
}
.my-carousel .ui-carousel-page li{
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: rgba(255,255,255,0.5);
    cursor: pointer;
    transition: all 0.3s;
}
.my-carousel .ui-carousel-page li.active{
    background: #fff;
    width: 30px;
    border-radius: 6px;
}
@media (max-width: 768px){
    .my-carousel{ height: 200px; }
    .my-carousel .ui-carousel-prev,
    .my-carousel .ui-carousel-next{
        width: 30px;
        height: 45px;
    }
}

/* ========== 修复后：音乐播放器圆形收起样式 ========== */
#musicPlayerBox{
    position: fixed;
    left: 20px;
    bottom: 60px;
    width: 280px;
    min-height: 100px;
    background: linear-gradient(90deg, #f725ff7a, #41b8ff59);
    backdrop-filter: blur(10px);
    border-radius: 12px;
    color: #322f2f;
    z-index: 2147483647;
    box-shadow: 0 8px 32px rgba(0,0,0,0.3);
    overflow: hidden;
    transition: all 0.3s ease;
}
/* 收起后圆形效果 */
#musicPlayerBox.collapsed{
    width: 60px !important;
    height: 60px !important;
    border-radius: 50% !important;
    padding: 0 !important;
    min-height: auto !important;
    cursor: pointer;
}
#musicPlayerBox.collapsed .player-main,
#musicPlayerBox.collapsed .playlist-panel,
#musicPlayerBox.collapsed .bottom-lyric-bar,
#musicPlayerBox.collapsed #playerToggleBtn{
    display: none !important;
}
#musicPlayerBox.collapsed .album-cover{
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    border: none !important;
    box-shadow: none !important;
    border-radius: 50%;
}
#musicPlayerBox.collapsed .album-cover img{
    width: 100% !important;
    height: 100% !important;
    border-radius: 50%;
    object-fit: cover;
}
/* 封面旋转动画 */
.album-cover{
    width: 80px;
    height: 80px;
    border-radius: 50%;
    overflow: hidden;
    flex-shrink: 0;
    border: 3px solid rgba(255,255,255,0.1);
    box-shadow: 0 0 15px rgba(0,0,0,0.3);
}
.album-cover img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.album-cover.playing{
    animation: mp-rotate 10s linear infinite;
}
@keyframes mp-rotate{
    from{transform: rotate(0deg);}
    to{transform: rotate(360deg);}
}
/* 收起按钮 */
/*#playerToggleBtn{*/
/*    position: absolute;*/
/*    right: -1px;*/
/*    top: 22.5%;*/
/*    transform: translateY(-130%);*/
/*    width: 15px;*/
/*    height: 35px;*/
/*    background: rgb(93 88 94 / 42%);*/
/*    border-radius: 6px 0px 0px 6px;*/
/*    display: flex;*/
/*    align-items: center;*/
/*    justify-content: center;*/
/*    cursor: pointer;*/
/*    z-index: 10;*/
/*}*/
/*#playerToggleBtn .toggle-icon{*/
/*    font-size: 18px;*/
/*    font-weight: bold;*/
/*    transition: transform 0.3s;*/
/*}*/
/* 播放器基础定位 */
/*#musicPlayerBox {*/
/*    position: fixed;*/
/*    bottom: 25px;*/
/*    left: 0;*/
/*    z-index: 999;*/
/*    width: 240px;*/
/*    background: linear-gradient(135deg,#f8a0d8,#a0b8f8);*/
/*    border-radius: 0 10px 10px 0;*/
/*    padding: 12px;*/
/*    box-shadow: 0 2px 12px rgba(0,0,0,0.15);*/
    /* 滑动动画 */
/*    transition: transform 0.4s ease;*/
/*}*/
/* 收缩状态：整体向左滑出屏幕，只露出切换按钮 */
/*#musicPlayerBox.close {*/
/*    transform: translateX(-216px);*/
/*}*/
/* 伸缩切换按钮 放在播放器右侧边缘 */
/*#playerToggleBtn {*/
/*    position: absolute;*/
/*    right: -24px;*/
/*    top: 50%;*/
/*    transform: translateY(-50%);*/
/*    width: 24px;*/
/*    height: 70%;*/
/*    background: linear-gradient(135deg,#f8a0d8,#a0b8f8);*/
/*    border-radius: 0 6px 6px 0;*/
/*    display: flex;*/
/*    align-items: center;*/
/*    justify-content: center;*/
/*    cursor: pointer;*/
/*}*/
#playerToggleBtn .toggle-icon {
    font-size: 16px;
    color: #fff;
    font-weight: bold;
    display: inline-block;
    transition: transform 0.3s;
}
/* 收缩后箭头翻转方向 */
#musicPlayerBox.close #playerToggleBtn .toggle-icon {
    transform: rotate(180deg);
}
/* 内部播放区域自适应宽度，无需改动原有布局 */
.player-main,
.bottom-lyric-bar,
.playlist-panel {
    width: 100%;
}
#musicPlayerBox {
    position: fixed;
    bottom: 25px;
    left: 0;
    z-index: 999;
    width: 240px;
    background: linear-gradient(135deg,#f8a0d8,#a0b8f8);
    border-radius: 0 10px 10px 0;
    padding: 12px;
    box-shadow: 0 2px 12px rgba(0,0,0,0.15);
    transition: transform 0.4s ease;
}
/* 收缩类名统一 close，和JS匹配 */
#musicPlayerBox.close {
    transform: translateX(-216px);
}
#playerToggleBtn {
    position: absolute;
    right: -24px;
    top: 50%;
    transform: translateY(-50%);
    width: 24px;
    height: 70%;
    background: linear-gradient(135deg,#f8a0d8,#a0b8f8);
    border-radius: 0 6px 6px 0;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}
#playerToggleBtn .toggle-icon {
    font-size: 16px;
    color: #fff;
    font-weight: bold;
    display: inline-block;
    transition: transform 0.3s;
}
#musicPlayerBox.close #playerToggleBtn .toggle-icon {
    transform: rotate(180deg);
}
.player-main,.bottom-lyric-bar,.playlist-panel {
    width: 100%;
}
/* 封面旋转动画配套原有JS */
.album-cover.playing img {
    animation: rotateCover 10s linear infinite;
}
@keyframes rotateCover {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}
/* 歌词滚动动画 */
@keyframes lyricScroll {
    0%,100% { transform: translateX(0); }
    50% { transform: translateX(-30%); }
}
.lyric-line.active {
    color: #ff66aa;
    font-weight: bold;
}
.bottom-lyric-bar.hidden {
    display: none;
}
.playlist-panel {
    margin-top:8px;
    display:none;
}
.playlist-panel.show {
    display:block;
}
/* 播放器外层 */
#musicPlayerBox {
    position: fixed;
    bottom: 25px;
    left: 0;
    z-index: 999;
    width: 280px;
    background: linear-gradient(135deg,#f8a0d8,#a0b8f8);
    border-radius: 0 10px 10px 0;
    padding: 12px;
    box-shadow: 0 2px 12px rgba(0,0,0,0.15);
    transition: transform 0.4s ease;
    /* 关键：不隐藏溢出，保证侧边按钮可见 */
    overflow: visible !important;
}
/* 收缩状态左移 */
#musicPlayerBox.close {
    transform: translateX(-280px);
}
/* 伸缩按钮 强制显示在播放器右侧外侧 */
#playerToggleBtn {
    position: absolute;
    /* 向外突出盒子，不会被裁切 */
    right: -26px;
    top: 50%;
    transform: translateY(-50%);
    width: 26px;
    height: 80%;
    background: linear-gradient(135deg,#f8a0d8,#a0b8f8);
    border-radius: 0 6px 6px 0;
    display: flex !important;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 10;
}
/* 箭头图标样式 */
#playerToggleBtn .toggle-icon {
    font-size: 18px;
    color: #ffffff;
    font-weight: bold;
    display: inline-block;
    transition: transform 0.3s;
}
/* 收缩后箭头翻转 */
#musicPlayerBox.close #playerToggleBtn .toggle-icon {
    transform: rotate(180deg);
}
/* 内部内容自适应 */
.player-main,.bottom-lyric-bar,.playlist-panel {
    width: 100%;
}
/* 封面旋转动画 */
.album-cover.playing img {
    animation: rotateCover 10s linear infinite;
}
@keyframes rotateCover {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}
/* 歌词、面板配套样式 */
/*@keyframes lyricScroll {*/
/*    0%,100% { transform: translateX(0); }*/
/*    50% { transform: translateX(-30%); }*/
/*}*/
.lyric-line.active {
    color: #ff66aa;
    font-weight: bold;
}
.bottom-lyric-bar.hidden {
    display: none;
}
.playlist-panel {
    margin-top:8px;
    display:none;
}
.playlist-panel.show {
    display:block;
}