.sys-item-13 {
    background-image: url("../img/sys-item-13.png");
    margin-top: 10px;
    height: 40px;
    line-height: 40px;
    font-size: 14px;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    background-size: auto 100%;
    background-repeat: no-repeat;
    background-position: center;
    font-weight: 500;
}


@media (max-width: 767px){
.mobile-navbar.show,.mobile-navbar.left{
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    cursor: pointer;
    background-image:linear-gradient(rgba(255, 255,255,0),rgba(255,255,255, 0.3)),url(https://oss.zibll.com/zibll.com/2024/06/20240620110731160-bg-3.svg);}
  .mobile-nav-widget .box-body {
    background: var(--muted-border-color) !important;}
}

/*隐藏用户页*/
.but.c-cyan {
    display: none;
}

/*文章列表字体*/
.website-source-text {
    position: relative; /* 相对定位，以便基于自身原始位置进行偏移 */
    top: 4px; /* 向下移动5px，可根据需要调整数值 */
    left: 10px; /* 向右移动10px，可根据需要调整数值 */
}

/*过渡*/
.swiper-slide:not(.notice-slide):not(.swiper-slide-duplicate):not(.swiper-slide-next):not(.swiper-slide-duplicate-prev):not(.swiper-slide-active):not(.mr10)::before {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    top: 75%;
    right: 0;
    bottom: 0;
    -ms-transform: scale(1);
    transform: scale(1);
   background: linear-gradient(180deg, rgba(252, 252, 252, 0) 0%, rgba(252, 252, 252, 0.05) 10%, rgba(252, 252, 252, 0.1) 20%, rgba(252, 252, 252, 0.2) 30%, rgba(252, 252, 252, 0.5) 50%, rgba(252, 252, 252, 0.8) 70%, #f5f6f7 100%);
    z-index: 1;
}

/*首页文章特色图片鼠标悬停效果开始*/
.item-thumbnail:before {content: '';position: absolute;top: 0;left: 0;right: 0;bottom: 0;background: rgba(0,0,0,0);transition: background .35s;border-radius: 8px;z-index: 2;max-width: 765px;margin: 0 auto;pointer-events:none;}
.item-thumbnail:after {content: '';position: absolute;top: 50%;left: 50%;width: 50px;height: 50px;margin: -25px 0 0 -25px;background:url(https://www.daixb.top/wp-content/uploads/2024/06/swshpk.ico);background-repeat: no-repeat;background-size: 100% 100%;z-index: 3;-webkit-transform: scale(2);transform: scale(2);transition: opacity .35s,-webkit-transform .35s;transition: transform .35s,opacity .35s;transition: transform .35s,opacity .35s,-webkit-transform .35s;opacity: 0;pointer-events:none;}
.item-thumbnail:hover:before{background:rgba(0,0,0,.5)}
.item-thumbnail:hover:after{-webkit-transform:scale(1);transform:scale(1);opacity:1}
/*首页文章特色图片鼠标悬停效果结束*/



/*粉色细节优化*/
.hot-top{
background: linear-gradient(180deg, #ecf2ff, var(--main-bg-color));

    transition: all 0.2s;
}
.header-content{
   background: linear-gradient(180deg, #ecf2ff, var(--main-bg-color));
    border: 1.5px solid var(--main-bg-color);
    box-shadow: 6px 6px 15px 0 rgb(136 167 225 / 21%), -6px -6px 15px 0 var(--main-bg-color);
    transition: all 0.2s;
}

.posts-item.card{
   background: linear-gradient(180deg, #ecf2ff, var(--main-bg-color));
    border: 1px solid var(--main-bg-color);
} 
.article{
background: linear-gradient(180deg, #ecf2ff, var(--main-bg-color));
    border: 1px solid var(--main-bg-color);
    box-shadow: 6px 6px 15px 0 rgb(136 167 225 / 21%), -6px -6px 15px 0 var(--main-bg-color);
    transition: all 0.2s;
}
.no_webshot{
background: linear-gradient(180deg, #ecf2ff, var(--main-bg-color));
    border: 1px solid var(--main-bg-color);
    box-shadow: 6px 6px 15px 0 rgb(136 167 225 / 21%), -6px -6px 15px 0 var(--main-bg-color);
    transition: all 0.2s;
}

.zib-widget{
background: linear-gradient(180deg, #ecf2ff, var(--main-bg-color));

    transition: all 0.2s;
}


.ranking-item{
background: linear-gradient(180deg, #ecf2ff, var(--main-bg-color));
    
   
    transition: all 0.2s;
}


/*超链接下波浪线*/
.wp-posts-content a:hover {color:#ff4500;text-decoration:none;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 4'%3E%3Cpath fill='none' stroke='%23FF4500' d='M0 3.5c5 0 5-3 10-3s5 3 10 3 5-3 10-3 5 3 10 3'/%3E%3C/svg%3E")repeat-x 0 100%;background-size:20px auto;animation:waveMove 1s infinite linear}
@keyframes waveMove{from{background-position:0 100%}
to{background-position:-20px 100%}
}
/*超链接下波浪线结束*/


/*文章卡片下载按钮*/
a.down {
    display: inline-block;
    width: 100%;
    height: 30px;
    line-height: 30px;
    border-radius: 15px;
    background: linear-gradient(to right, #4f6dee, #67bdf9);
    color: #fff;
    text-align: center;
    cursor: pointer;
    text-shadow: none;
    border: none;
    outline: none;
    box-shadow: none;
    padding: 0;
    margin: 0;
}



/* 单行文章列表美化——开始 */

.sec-wrapper {
margin-bottom: 10px;
}

.training-camp__wrapper {
--green-1: #cff0fb;
--green-2: #cbf4e4;
--green-3: #22ab80;
--gray-1: #667280;
--white-1: #fff;
--white-2: #f5f7fa;
background-image: linear-gradient(150deg,var(--green-1) 20%,var(--green-2) 40%);
padding: 0 12px 12px;
border-radius: 16px;
}

button.button---AUM5ZP.text---pn4pHz.medium---OGt5iw.header__btn {
background: #ffffff00;
border: 1px solid #fc3c2d00;
border-radius: 0px;
}

.training-camp__wrapper .training-camp__header {
padding: 24px 0 24px 12px;
display: -webkit-flex;
display: flex;
gap: 18px;
background: url(../../../../img/kuangwenlu.png) 100% 0/433px 126px no-repeat;
}

.training-camp__wrapper .header__title-wrapper {
display: -webkit-flex;
display: flex;
-webkit-align-items: center;
align-items: center;
gap: 0px;
}

.training-camp__wrapper .title__img-wrapper {
height: 20px;
}

.training-camp__wrapper .header__btn-wrapper {
margin-left: auto;
display: -webkit-flex;
display: flex;
}


.training-camp__wrapper .header__btn-wrapper button[class*=button---] {
height: 20px;
line-height: 20px;
padding: 0 12px;
}

.training-camp__wrapper .header__btn {
display: -webkit-flex;
display: flex;
-webkit-align-items: center;
align-items: center;
font-size: 14px;
color: var(--green-3);
}
.medium---OGt5iw {
height: 36px;
padding: 8px 24px;
font-size: 14px;
}
.outlined---BKvHAe, .text---pn4pHz {
background-color: initial;
color: #3e454d;
}
.button---AUM5ZP {
position: relative;
display: inline-block;
height: 36px;
padding: 8px 24px;
border-radius: 22px;
cursor: pointer;
border: unset;
font-size: 14px;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}

.ke-icon---zeGrGg+i {
display: inline-block;
vertical-align: middle;
}

.training-camp__wrapper>div.sec-bd {
background-color: var(--white-1);
gap: 12px;
}

.sec-wrapper .sec-bd {
position: relative;
display: -webkit-flex;
display: flex;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
gap: 24px;
}
.training-camp__wrapper .sec-bd {
padding: 12px;
border-radius: 16px;
}


img.title-macyingyong {
/* width: 120px; */
height: 50px;
}

/* 单行文章列表美化——结束 */

/*悬浮按钮*/
.gotop {
  position: fixed;
    bottom: 20%;
    right: 1%;
    z-index: 999;
}
.gotop-box{
    box-shadow: 0 4px 23px rgba(0, 0, 0, 0.08);
    border-radius: 8px;
    background: #fff;
}
.gotop .gotop-item{
    color: rgba(23,23,24,0.8);
    text-align: center;
    cursor: pointer;
    width: 54px;
    padding-bottom: 10px;
    box-sizing: initial;
    align-items: center;
    display: block;
}
.gotop .gotop-item i{
  font-size: 22px!important;
    z-index: 2;
    position: relative;
    color: #171718;
}
.gotop .gotop-item a{
    color: rgba(23,23,24,0.8);
    font-size: 12px;
  text-decoration: none;
}
.gotop .gotop-item a:hover{
    color: var(--primary-color)!important;
}
.gotop .gotop-item img{
    width: 24px;
}
.gotop .gotop-item p.text{
    font-size: 12px;
    margin-top: 5px;
}
.gotop .gotop-item:hover p.text{
    color: var(--primary-color)!important;
}
.gotop .gotop-item.gotops{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    position: relative;
}
.ceo-pt-wx{
    width: 300px;
}
.ceo-pt-wx img{
    height: 200px;
}
.gotop .activity{
    background: transparent;
    position: relative;
    height: 128px;
    padding-bottom: 0;
}
.gotop .activity a{
    display: block;
}
.gotop .activity .a1{
    width: 100%;
    height: 100%;
    border-radius: 7px 7px 0px 0px;
}
.gotop .activity .a2{
    position: absolute;
    bottom: 10px;
    left: 10px;
    width: 33px;
    height: 43px;
    animation: red-envelope-shake 0.8s linear infinite;
    transition: all .3s;
}
@keyframes red-envelope-shake {
    0% { transform: rotate(-7deg) }
    50%  { transform: rotate(7deg) }
    100% {transform: rotate(-7deg) }
}
@keyframes turnX{
    0%{transform:rotateX(0deg);}
    100%{transform:rotateX(360deg);}
}
.gotop .activity .popover {
    position: absolute;
    width: 251px;
    height: 128px;
    right: 0;
    left: -196px;
    bottom: 0;
    display: none;
}
.gotop .activity:hover .popover {
    display: block;
}
.gotop-box .gotop-vip{
    background: linear-gradient(10deg,#fedd92,#fef6e1);
    color: #803300;
    padding-top: 10px;
    margin-bottom: 10px;
}
.gotop-box .gotop-vip a{
    color: #803300!important;
}
.gotop-box .gotop-vip:hover p.text{
    color: #803300!important;
    font-weight: 600;
}
.gotop-service{
    position: relative;
}
.gotop-service:hover .gotop-service-box {
  display: block;
  transition: all .3s;
}
.gotop-service-box {
    display: none;
    position: absolute;
    z-index: 999;
    right: 55px;
    bottom: 0px;
    width: 150px;
    padding: 20px;
    text-align: center;
    border-radius: 4px;
    -webkit-box-shadow: 0 0 3px 1px rgba(0,0,0,.05);
    box-shadow: 0 0 3px 1px rgba(0,0,0,.05);
    transition: all .3s;
    background: #fff;
}
.gotop-service-box .tops{
    text-align: center;
    margin-bottom: 15px;
    padding-bottom: 10px;
    border-bottom: 1px solid #edf1f2;
}
.gotop-service-box .tops img{
}
.gotop-service-box .tops a{
    display: block;
    height: 26px;
    line-height: 26px;
    margin: 15px auto 10px auto;
    border: 1px solid #b5b9bc;
    font-size: 12px;
    border-radius: 4px;
}
.gotop-service-box .tops a:hover{
    background:#fff0;
    color: var(--primary-color)!important;
    border: 1px solid var(--primary-color)!important;
}
.gotop-service-box .tops p{
    font-size: 13px;
}
.gotop-service-box .btms{
    text-align: center;
}
.gotop-service-box .btms em{
    font-size: 14px;
    color: #5f6575;
    font-weight: 500;
    margin-bottom: 10px;
    height: 20px;
    line-height: 20px;
    display: block;
}
.gotop-service-box .btms p{
    height: 25px;
    font-weight: 500;
    line-height: 25px;
    font-size: 18px;
    color: #4775FF;
    margin-bottom: 10px;
    display: inline-block;
}
.gotop-service-box .btms span{
    height: 25px;
    line-height: 25px;
    overflow: hidden;
    font-size: 12px;
    color: #FF5151;
    margin-bottom: 10px;
}
.gotop-wx-box {
    margin-bottom: 15px;
}
.gotop-wx-box .boxs p{
    font-size: 14px;
    color: #5f6575;
    font-weight: 500;
    margin-bottom: 10px;
    height: 20px;
    line-height: 20px;
}
.gotop-wx-box .boxs img {
    width: 100%;
    height: 100%;
    display: block;
    margin-top: 10px;
    padding: 5px;
    border: 1px solid var(--border-color);
    margin: 10px auto 0px auto;
}
.gotop-ma{
    position: relative;
}
.gotop-ma:hover .gotop-ma-box {
  display: block;
  transition: all .3s;
}
.gotop-ma-box {
    display: none;
    position: absolute;
    z-index: 999;
    right: 54px;
    bottom: 0px;
    width: 170px;
    padding: 10px;
    text-align: center;
    border-radius: 4px;
    -webkit-box-shadow: 0 0 3px 1px rgba(0,0,0,.05);
    box-shadow: 0 0 3px 1px rgba(0,0,0,.05);
    transition: all .3s;
    background: var(--primary-color);
}
.gotop-ma-box i{
    display: block;
    width: 31px;
    height: 5px;
    margin: 0 auto 10px;
    border-radius: 2px;
    background: #6f96ff;
}
.gotop-ma-box em{
    display: block;
    margin: 10px auto 0;
    width: 20px;
    height: 20px;
    border-radius: 100%;
    background: #6f96ff;
}
.gotop-ma-box .tops{
    padding: 10px;
    background: #fff;
    border-radius: 4px;
    text-align: center;
}
.gotop-ma-box .tops p{
    font-size: 12px;
    color: #5f6575;
    overflow: hidden;
    height: 23px;
    line-height: 23px;
}
.gotop-ma-box .tops img {
    width: 100%;
    height: 100%;
    display: block;
    margin-top: 10px;
    margin: 10px auto 0px auto;
}
@media screen and (max-width: 767px) {
    .gotop {
        display: none !important;
    }
}



/*底部统计拟态*/
.mizhi-llzs-item  {
   background: linear-gradient(180deg, #ecf2ff, var(--main-bg-color));
    border: 1.5px solid var(--main-bg-color);
    box-shadow: 6px 6px 15px 0 rgb(136 167 225 / 21%), -6px -6px 15px 0 var(--main-bg-color);
    transition: all 0.2s;
}

 .mizhi-sjcs-item {
   background: linear-gradient(180deg, #ecf2ff, var(--main-bg-color));
    border: 1.5px solid var(--main-bg-color);
    box-shadow: 6px 6px 15px 0 rgb(136 167 225 / 21%), -6px -6px 15px 0 var(--main-bg-color);
    transition: all 0.2s;
}

.mizhi-yxsj-item {
   background: linear-gradient(180deg, #ecf2ff, var(--main-bg-color));
    border: 1.5px solid var(--main-bg-color);
    box-shadow: 6px 6px 15px 0 rgb(136 167 225 / 21%), -6px -6px 15px 0 var(--main-bg-color);
    transition: all 0.2s;
}

.mizhi-yhzs-item{
   background: linear-gradient(180deg, #ecf2ff, var(--main-bg-color));
    border: 1.5px solid var(--main-bg-color);
    box-shadow: 6px 6px 15px 0 rgb(136 167 225 / 21%), -6px -6px 15px 0 var(--main-bg-color);
    transition: all 0.2s;
}

.mizhi-jrfb-item{
   background: linear-gradient(180deg, #ecf2ff, var(--main-bg-color));
    border: 1.5px solid var(--main-bg-color);
    box-shadow: 6px 6px 15px 0 rgb(136 167 225 / 21%), -6px -6px 15px 0 var(--main-bg-color);
    transition: all 0.2s;
}

.mizhi-wzzs-item {
   background: linear-gradient(180deg, #ecf2ff, var(--main-bg-color));
    border: 1.5px solid var(--main-bg-color);
    box-shadow: 6px 6px 15px 0 rgb(136 167 225 / 21%), -6px -6px 15px 0 var(--main-bg-color);
    transition: all 0.2s;
}

.mizhi-sjcs-item2{
   background: linear-gradient(180deg, #ecf2ff, var(--main-bg-color));
    border: 1.5px solid var(--main-bg-color);
    box-shadow: 6px 6px 15px 0 rgb(136 167 225 / 21%), -6px -6px 15px 0 var(--main-bg-color);
    transition: all 0.2s;
}

/*侧边评论背景图*/
.posts-mini {
    background-size: cover;
    margin-bottom: 5px;
    padding: 15px;
}

/* 排行榜小工具：限制样式作用域，避免污染文章列表和其他小工具。 */
.hss-ranking-widget,
.hss-category-ranking-widget {
    box-sizing: border-box;
    width: 100%;
}

.hss-ranking-widget *,
.hss-category-ranking-widget * {
    box-sizing: border-box;
}

.hss-ranking-widget .hss-ranking-heading {
    margin: 0 0 24px;
    text-align: center;
}

.hss-ranking-widget .hss-ranking-heading img {
    display: block;
    width: min(180px, 30%);
    height: auto;
    margin: 0 auto;
    user-select: none;
    pointer-events: none;
}

.hss-ranking-widget .hss-ranking-grid,
.hss-category-ranking-widget {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
    align-items: start;
}

.hss-ranking-widget .hss-ranking-card,
.hss-category-ranking-widget .ranking-item {
    position: relative;
    min-width: 0;
    margin: 0;
    padding: 20px 16px 16px;
    overflow: hidden;
    background: var(--main-bg-color);
    border-radius: var(--main-radius);
    box-shadow: 0 0 10px var(--main-shadow);
}

.hss-ranking-widget .hss-ranking-title,
.hss-category-ranking-widget .top-icon {
    position: static;
    display: block;
    width: auto;
    height: auto;
    margin: 0 0 18px;
    padding: 0;
    color: var(--header-color);
    background: none;
    font-size: 18px;
    font-weight: 600;
    line-height: 1.4;
    text-align: center;
}

.hss-ranking-widget .class-box,
.hss-category-ranking-widget .class-box {
    margin: 0;
    padding: 0;
    background: none;
}

.hss-ranking-widget a.class-item.js-rank,
.hss-category-ranking-widget a.class-item.js-rank {
    display: flex;
    width: 100%;
    min-height: 64px;
    height: auto;
    align-items: center;
    margin: 0;
    padding: 8px 0;
    text-decoration: none;
}

.hss-ranking-widget .class-info,
.hss-category-ranking-widget .class-info {
    width: auto;
    min-width: 0;
    flex: 1;
}

.hss-ranking-widget .name,
.hss-category-ranking-widget .name {
    margin: 0 0 4px;
    color: var(--main-color);
    font-size: 14px;
    line-height: 1.45;
}

.hss-ranking-widget .class-pic,
.hss-category-ranking-widget .class-pic,
.hss-category-ranking-widget .syphimg img {
    display: block;
    width: 72px;
    height: 48px;
    flex: none;
    object-fit: cover;
    margin-right: 8px;
    border-radius: 6px;
}

.hss-ranking-widget .num-icon,
.hss-category-ranking-widget .num-icon {
    flex: none;
    margin: 0 8px 0 0;
}

.hss-ranking-widget .hss-ranking-card .badg,
.hss-category-ranking-widget .ranking-item .badg {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.hss-ranking-widget .bottom-link,
.hss-category-ranking-widget .bottom-link {
    display: flex;
    width: 140px;
    height: 30px;
    align-items: center;
    justify-content: center;
    margin: 16px auto 0;
    border-radius: 15px;
}

@media (max-width: 900px) {
    .hss-ranking-widget .hss-ranking-grid,
    .hss-category-ranking-widget {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 768px) {
    .hss-ranking-widget .hss-ranking-grid,
    .hss-category-ranking-widget {
        display: block;
    }

    .hss-ranking-widget .hss-ranking-card,
    .hss-category-ranking-widget .ranking-item {
        margin-bottom: 16px;
    }
}


/** 首页排行榜列表 **/
@media (min-width: 768px) and (max-width: 1200px) {
  .ranking-item {
        width: 100%!important;
    }
}
@media (max-width: 768px) {
  .ranking-item,
  .syphimg,
  .class-box,
  .class-item.js-rank,
  .num-icon,
  .class-info,
  .bottom-link.js-rank-bottom {
        display: none!important;
    }
}
.syphimg{
    width: 90px;
    height:60px;
    margin-right: 5px;
}
.syphimg img{
       border-radius: 8px;
}
.list.clearfix {
  display: flex;
  justify-content: space-between;
    flex-wrap: wrap;
}

.ranking-item {
    margin:0 auto;
    position: relative;
    width: calc(33.333% - 10px );
    background: var(--main-bg-color);
    box-shadow: 0 0 10px var(--main-shadow);
    border-radius: var(--main-radius);
    margin-bottom: 20px;
}

a.top-icon.js-rank-bottom1 {
    display: block;
    width: 129px;
    height: 43px;
    line-height: 32px;
    position: absolute;
    left: 150px;
    top: -7px;
    background: url(../../../../pic/ranking1.png) no-repeat center/100%;
    font-size: 18px;
    color: #fff;
    font-weight: 600;
    text-align: center;
}

a.top-icon.js-rank-bottom2 {
    display: block;
    width: 129px;
    height: 43px;
    line-height: 32px;
    position: absolute;
    left: 150px;
    top: -7px;
    background: url(../../../../pic/ranking2.png) no-repeat center/100%;
    font-size: 18px;
    color: #fff;
    font-weight: 600;
    text-align: center;
}

a.top-icon.js-rank-bottom3 {
    display: block;
    width: 129px;
    height: 43px;
    line-height: 32px;
    position: absolute;
    left: 150px;
    top: -7px;
    background: url(../../../../pic/ranking3.png) no-repeat center/100%;
    font-size: 18px;
    color: #fff;
    font-weight: 600;
    text-align: center;
}
.class-box {
    margin-top: 60px;
}

a.class-item.js-rank {
    display: block;
    width: 100%;
    height: 80px;
    display: flex;
    align-items: center;
    margin-bottom: 20px;
}

.num-icon.num-icon1 {
    width: 40px;
    height: 22px;
    background: url(../../../../pic/top1.png) no-repeat center/50%;
    margin: 0 12px 0 15px;
}

img.class-pic {
    width: 90px;
    border-radius: 8px;
    margin-right: 5px;
}

.class-info {
    width: 190px;
    font-size: 12px;
}

.name {
    color: var(--main-color);
    line-height: 20px;
    font-weight: 400;
    margin-bottom: 2px;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    overflow: hidden;
    -webkit-box-orient: vertical;
}

.price {
    color: #f01414;
    font-weight: 600;
    margin-bottom: 2px;
}

.study-num {
    color: #9199a1;
    font-weight: 400;
}

.num-icon.num-icon2 {
    background: url(../../../../pic/top2.png) no-repeat center/50%;
    margin: 0 12px 0 15px;
    width: 40px;
    height: 22px;
}

.num-icon.num-icon3 {
    background: url(../../../../pic/top3.png) no-repeat center/50%;
    margin: 0 12px 0 15px;
    width: 40px;
    height: 22px;
}

.num-icon.num-icon4 {
    background: url(../../../../pic/top4.png) no-repeat center/70%;
    margin: 0 12px 0 15px;
    width: 40px;
    height: 22px;
}

.num-icon.num-icon5 {
    background: url(../../../../pic/top5.png) no-repeat center/70%;
    margin: 0 12px 0 15px;
    width: 40px;
    height: 22px;
}

.num-icon.num-icon6 {
    background: url(../../../../pic/top6.png) no-repeat center/70%;
    margin: 0 12px 0 15px;
    width: 19px;
    height: 22px;
}

a.bottom-link.js-rank-bottom {
    width: 120px;
    height: 24px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
    font-size: 12px;
    color: #fff;
    line-height: 12px;
    font-weight: 500;
    background-image: linear-gradient(270deg,#ff4f39 0,#fd6400 100%);
    border-radius: 12px;
    margin-bottom: 20px;
}

/** 首页排行榜列表结束 **/
/*最新通知*/
.zhankr-zx {
  position: relative;
  margin-bottom: 18px;
  display: flex;
  -webkit-box-align: center;
  align-items: center;
  -webkit-box-pack: center;
  justify-content: center;
  line-height: 1;
}
.zhankr-zx:before {
  margin-right: 10px;
}
.zhankr-zx:after {
  margin-left: 10px
}.zhankr-zx:before, .zhankr-zx:after {
  content: "";
  display: inline-block;
  width: 8px;
  height: 8px;
  background: linear-gradient(-125deg, #f95491 0%, #2953fd 100%);
  border-radius: 50%;
}
.zhankr-zx span {
  font-family: Futura;
  background: linear-gradient(-125deg, #f95491 0%, #2953fd 100%);
  -webkit-background-clip: text;
  color: transparent;
  font-size: 49px;
  letter-spacing: 5px;
  display: inline-block;
  font-weight: 700;
}.zhankr-zx .zhankr-zx-n {
  font-size: 20px;
}
.zhankr-zx .zhankr-zx-n strong {
  display: block;
  font-size: 20px;
  background: linear-gradient(-125deg, #f95491 0%, #2953fd 100%);
  -webkit-background-clip: text;
  color: transparent;
}
.HhcatboxDes {
  position: absolute;
  opacity: 0;
  z-index: 1;
  align-items: center;
  display: flex;
  font-size: 16px;
  height: 180px;
  justify-content: center;
  width: 100%;color: #fff;
  font-weight: 600;
  background: #f95491;
  -webkit-transition: all 0.35s ease-in-out;
  -moz-transition: all 0.35s ease-in-out;
  transition: all 0.35s ease-in-out;
  -webkit-transform: translateY(100%);
  -webkit-transform: translateY(100%);
  -moz-transform: translateY(100%);
  -ms-transform: translateY(100%);
  -o-transform: translateY(100%);
  transform: translateY(100%);
}
.HhCooltitle {
  margin-top: 10px;
  }




/*灵动岛*/
.dynamic-island:hover img {
    width: 30px; /* 鼠标悬停时，图片宽度也增大 */
    height: 30px; /* 鼠标悬停时，图片高度增大 */
}

.bars {
  display: flex;
  align-items: center; /* 垂直居中 */
  justify-content: flex-end; /* 向右对齐 */
  gap: 3px;
}

.bar {
  width: 2px;
  height: 13px;
  background-color: green;
  animation: bounce 1s infinite ease-in-out;
  animation-direction: alternate;
}

/* 增加更多的条形波动并调整动画时间 */
.bar:nth-child(1) { animation-duration: 1s; }
.bar:nth-child(2) { animation-duration: 0.9s; }
.bar:nth-child(3) { animation-duration: 0.8s; }
.bar:nth-child(4) { animation-duration: 0.7s; }
.bar:nth-child(5) { animation-duration: 0.6s; }
.bar:nth-child(6) { animation-duration: 0.9s; }
.bar:nth-child(7) { animation-duration: 0.7s; }

.dynamic-island {
    position: fixed;
    top: 80px;
    left: 50%;
    transform: translateX(-50%) scale(0); /* 初始状态缩小为0 */
    transform-origin: center;
    width: auto;
    max-width:80%;
    height: 40px;
    background-color: #000;
    border-radius: 25px; /* 与默认高度一致的圆角半径 */
    color: white;
    display: flex;
    align-items: center;
    justify-content: space-between; /* 图片和文字之间自动分配空间 */
    transition: transform 0.4s ease-in-out, height 0.6s ease-in-out, border-radius 0.6s ease-in-out, box-shadow 0.5s ease-in-out, opacity 0.5s ease-in-out;
    overflow: visible; /* 允许溢出，避免图片被遮挡 */
    z-index: 1000;
    padding-left: 35px; /* 确保内容不贴边 */
    padding-right: 20px; /* 确保内容不贴边 */
    opacity: 0;
    box-shadow: 0 0px 10px rgba(0, 0, 0, 0.45); /* 添加黑色阴影 */
}

.dynamic-island.active {
    transform: translateX(-50%) scale(1); /* 激活状态放大为正常大小 */
    opacity: 1;
}

.dynamic-island.inactive {
    transform: translateX(-50%) scale(0); /* 关闭状态缩小 */
    opacity: 0;
}
.island-content {
    opacity: 0;
    transition: opacity 0.9s ease-in-out, filter 0.8s ease-in-out; /* 使内容加粗并从模糊到清晰 */
    font-weight: bold; /* 使文字加粗 */
    flex-grow: 1; /* 使内容区占满剩余空间 */
    text-align: right; /* 文字内容右对齐 */
    width:100%;
}

.dynamic-island.active .island-content {
    opacity: 1;
}

/* 图片样式 */
.dynamic-island img {
    position: absolute;
    left: 10px; /* 保持与灵动岛左边10px的距离 */
    width: 20px; /* 图片宽度 */
    height: 20px; /* 图片高度 */
    /* border-radius: 50%;  为圆形 */
    object-fit: cover; /* 保证图片内容充满容器 */
    transition: height 0.8s ease-in-out, width 0.8s ease-in-out, filter 0.8s ease-in-out;
}
.dynamic-island:hover {
    height: 60px;
    border-radius: 50px;
}
   @keyframes bounce {
            0% {
                transform: scaleY(0.3);
                background-color: green;
            }
            50% {
                transform: scaleY(1);
                background-color: orange;
            }
            100% {
                transform: scaleY(0.3);
                background-color: green;
            }
        }


/**彩色滚动条样式开始*/
::-webkit-scrollbar {
  width: 10px;  
  height: 1px;
}
::-webkit-scrollbar-thumb {
  background-color: #12b7f5;
  background-image: -webkit-linear-gradient(45deg, rgba(255, 93, 143, 1) 25%, transparent 25%, transparent 50%, rgba(255, 93, 143, 1) 50%, rgba(255, 93, 143, 1) 75%, transparent 75%, transparent);
}
::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
    background: #f6f6f6;
}
/**彩色滚动条样式结束*/



.tengfei-title-badge {
    color: #fff;
    position: relative;
    overflow: hidden;
    display: inline-flex;
    border: 1.5px solid #ccc;
    align-items: center;
    border-radius: 5px;
    padding: 0px 4px;
    margin-right: 3px;
    height: 19px;
    font-size: 12px;
    margin-top: 0px;
    top: -1px;
}
.tengfei-title-badge:after {
  position:absolute;
  content:" ";
  display:block;
  left:-100%;
  top:-5px;
  width:15px;
  height:145%;
  background-image:linear-gradient(90deg,rgba(255,255,255,0),rgba(255,255,255,0.5),rgba(255,255,255,0));
  animation:sweepTitle 3s ease-in-out infinite;
  transform:rotate(28deg);
}
@keyframes sweepTitle {
  0% {
  left:-100%;
}
100% {
  left:100%;
}
}


.meta-pay.but.jb-yellow{
background: linear-gradient(43deg, #ff6ac34a 0%, #82e1ff 46%, #ff6ac34a 100%);
}

/* 排行榜小工具最终覆盖：放在旧版通用规则之后，确保布局不被覆盖。 */
.hss-ranking-widget .hss-ranking-grid,
.hss-category-ranking-widget {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
    align-items: start;
}

.hss-ranking-widget .class-box,
.hss-category-ranking-widget .class-box {
    display: block;
    margin: 0;
    padding: 0;
    background: none;
}

.hss-ranking-widget a.class-item.js-rank,
.hss-category-ranking-widget a.class-item.js-rank {
    display: flex;
    height: auto;
    min-height: 64px;
    margin: 0;
}

@media (max-width: 900px) {
    .hss-ranking-widget .hss-ranking-grid,
    .hss-category-ranking-widget {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 768px) {
    .hss-ranking-widget .hss-ranking-grid,
    .hss-category-ranking-widget {
        display: block;
    }

    .hss-ranking-widget .class-box,
    .hss-category-ranking-widget .class-box,
    .hss-ranking-widget a.class-item.js-rank,
    .hss-category-ranking-widget a.class-item.js-rank {
        display: block !important;
    }
}

/* 缩略图函数会生成额外的包裹节点，必须限制整个槽位而不只是 img 本身。 */
.hss-ranking-widget .class-item > .class-pic,
.hss-ranking-widget .class-item > .item-thumbnail,
.hss-ranking-widget .class-item > .thumbnail,
.hss-ranking-widget .class-item > .syphimg,
.hss-category-ranking-widget .class-item > .class-pic,
.hss-category-ranking-widget .class-item > .item-thumbnail,
.hss-category-ranking-widget .class-item > .thumbnail,
.hss-category-ranking-widget .class-item > .syphimg {
    display: block !important;
    width: 72px !important;
    height: 48px !important;
    flex: 0 0 72px !important;
    min-width: 72px !important;
    min-height: 48px !important;
    overflow: hidden !important;
    margin: 0 8px 0 0 !important;
}

.hss-ranking-widget .class-item > .class-pic img,
.hss-ranking-widget .class-item > .item-thumbnail img,
.hss-ranking-widget .class-item > .thumbnail img,
.hss-ranking-widget .class-item > .syphimg img,
.hss-ranking-widget .class-item > img.class-pic,
.hss-category-ranking-widget .class-item > .class-pic img,
.hss-category-ranking-widget .class-item > .item-thumbnail img,
.hss-category-ranking-widget .class-item > .thumbnail img,
.hss-category-ranking-widget .class-item > .syphimg img,
.hss-category-ranking-widget .class-item > img.class-pic {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    object-fit: cover !important;
}

.hss-ranking-widget .class-item > img.class-pic,
.hss-category-ranking-widget .class-item > img.class-pic {
    object-fit: cover !important;
}

.hss-ranking-widget .class-info,
.hss-category-ranking-widget .class-info {
    min-width: 0 !important;
    max-width: calc(100% - 112px) !important;
    overflow: hidden !important;
}