:root{
    --theme-color:#343639;
    --font-color:#333;
    --main-color:#EA3D4E;
}
*{-webkit-tap-highlight-color:transparent;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;-o-box-sizing:border-box;-ms-box-sizing:border-box;box-sizing:border-box;}
*:before,*:after{box-sizing:border-box;}
@media (min-width:1025px){
    ::-webkit-scrollbar{width:0.06rem;height:0.12rem;background-color:#18181b;}
    ::-webkit-scrollbar-thumb{background-color:#4ade80border-radius:0.2rem;}
}
html{-webkit-text-size-adjust:none;font-size:calc(100vw/19.2);scroll-behavior:initial;}
@media only screen and (max-width:1900px){

    /*1900px*/
    html{font-size:100px;}
}
@media only screen and (max-width:1706px){

    /*1706px*/
    html{font-size:calc(100vw/17.6);}
}
@media only screen and (max-width:1280px){

    /*1280px*/
    html{font-size:calc(100vw/12.8);}
}
@media only screen and (max-width:1024px){

    /*1024px*/
    html{font-size:calc(100vw/10.24);}
}
@media only screen and (max-width:750px){
    html { font-size: calc(100vw / 7.5); }
}

article,aside,details,figcaption,figure,footer,header,main,nav,section{display:block;}
html,body,div,pre,code,form,fieldset,legend,input,textarea,blockquote,th,td,button,article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section,main,.nmp,.nmp p,.nmp dt,.nmp dd,.nmp li,.nmp ul,.mmp ol{margin:0;padding:0;}
body{background-color:#121212;color:#eee;font:0.16rem/1.875em "Microsoft Yahei",Arial;overflow-x:hidden;word-wrap:break-word;overflow-wrap:break-word;hyphens:auto;}

/*table*/
table{background-color:transparent;border-spacing:0;border-collapse:collapse;width:100%;border-top:1px solid #ddd;border-left:1px solid #ddd;box-sizing:border-box;}
table th{background-color:#f8f8f8;text-align:center;box-sizing:border-box;}
table td,table th{padding:0.1rem;border:1px solid #ddd;box-sizing:border-box;}

/*a*/
a{text-decoration:none;outline:none;color:#eee;}
a:focus{outline:none;-moz-outline:none;}
a:hover{color:#4ade80}
a img{border:none;}

/*li*/
.nmp li{list-style:none;}

/*img*/
img,video{vertical-align:middle;max-width:100%;}

/*form*/
select,input,textarea,button{border-radius:0;-webkit-border-radius:0;background:none;border:none;margin:0;padding:0;outline:none;font-family:inherit;font-size:1em;}
textarea{resize:none;}
input:focus{outline:none;}
input::-moz-placeholder{opacity:1;color:#ccc;}
input:-moz-placeholder{opacity:1;color:#ccc;}
input::-webkit-input-placeholder{opacity:1;color:#ccc;}
input:-ms-input-placeholder{opacity:1;color:#ccc;}
textarea::-moz-placeholder{opacity:1;color:#ccc;}
textarea:-moz-placeholder{opacity:1;color:#ccc;}
textarea::-webkit-input-placeholder{opacity:1;color:#ccc;}
textarea:-ms-input-placeholder{opacity:1;color:#ccc;}

/*rows*/
[class*=rows_]{display:-webkit-box;-webkit-box-orient:vertical;text-overflow:ellipsis;overflow:hidden;}
.rows_1{display:block;white-space:nowrap;}
.rows_2{line-clamp:2;-webkit-line-clamp:2;}
.rows_3{line-clamp:3;-webkit-line-clamp:3;}
.rows_4{line-clamp:4;-webkit-line-clamp:4;}
.rows_5{line-clamp:5;-webkit-line-clamp:5;}

/*flex*/
.flex{display:-webkit-box;display:-moz-box;display:-webkit-flex;display:-moz-flex;display:-ms-flexbox;display:flex;--align:center;align-items:var(--align);--justify:space-between;justify-content:var(--justify);--wrap:wrap;flex-wrap:var(--wrap);}

/*mza-box*/
.mza-box{background-color:#18181b;overflow:hidden;position:relative;margin-bottom:0.2rem;}

/*mza-name*/
.mza-name{font-size:0.18rem;line-height:1.35em;border-bottom:1px solid #eee;margin:0;padding:0.2rem;position:relative;}
.mza-name:before{width:0.112em;height:1.125em;background-color:#4ade80content:'';display:block;position:absolute;left:0;top:50%;transform:translateY(-50%);}

/*inner*/
.inner{width:93.75%;max-width:16rem;margin:0 auto;}

/*clearfix*/
.clearfix{clear:both;overflow:hidden;width:100%;}
.clearfix:after{display:block;content:'';width:100%;clear:both;overflow:hidden;}

/*delay*/
.delay{--property:all;--delay:0.3s;transition:var(--property) var(--delay);}

/*thumbnail*/
.thumbnail{position:relative;overflow:hidden;}
.thumbnail:after{display:block;content:'';padding-bottom:75%;}
.thumbnail a,.thumbnail img{display:block;position:absolute;left:0;top:0;width:100%;height:100%;transition:all 0.3s;}
.thumbnail img{object-fit:cover;}
.thumbnail:hover img{transform:scale(1.05);}

/*warning*/
.warning{font-size:0.13rem;color:#999;line-height:2em;}

/*banner*/
.banner{clear:both;overflow:hidden; width: 100%;}
.banner img{width:100%;height:auto;display:block;}
.banner a{display:block;overflow:hidden;}

/*header*/
#header{background-color:#1b1718;width:100%;position:sticky;top:0;z-index:9;}
#header > .inner{display:table;table-layout:fixed;position:relative;z-index:2;}

/*logo*/
#logo{width:2.2rem;display:table-cell;vertical-align:middle;position:relative;z-index:8;}
#logo a{display:block;background:no-repeat left center;background-size:contain;padding-bottom:22.5%;overflow:hidden;position:relative;}
#logo i{display:block;position:absolute;left:0;top:0;width:100%;height:100%;text-indent:-9999em;overflow:hidden;}

/*button*/
#button{display:table-cell;vertical-align:middle;width:1.5rem;}
#button ul{border-left:1px solid #000;--align:flex-start;--wrap:nowrap;}
#button li{line-height:0.8rem;color:#fff;position:relative;flex-grow:1;cursor:pointer;width:50%;text-align:center;}
#button li:last-child {border-right:none;}
#button li:nth-child(2) {border-right-width:0;}
#button .active{box-shadow:0px 0px 0.07rem #000;}
#button .navbtn{display:none;}
#button .drop{position:absolute;top:100%;right:-2px;z-index:-1;min-width:100%;white-space:nowrap;background-color:#18181b;border:1px solid #E9E9E9;padding:0.1rem 0.2rem;display:none;}
#button .drop a{display:block;color:#eee;line-height:2em;font-size:0.14rem;padding:0.05rem 0;background:no-repeat left center;padding-left:1.43em;background-size:1.143em auto;}
#button .drop a:hover{color:#4ade80}
#button .drop .wb{background-image:url(images/icon_wb.png);}
#button .drop .wx{background-image:url(images/icon_wx.png);}
#button .drop .qq{background-image:url(images/icon_qq.png);}

/*share*/
#share{position:fixed;left:0;top:0;width:100%;height:100%;background-color:#333;z-index:10;display:none;}
#share .wrap{width:100%;height:100%;flex-direction:column;--justify:center;}
#share .qrcode{background-color:#18181b;padding:0.2rem;margin-bottom:0.3rem;}
#share img{display:block;width:100%;height:auto;}
#share .text{text-align:center;font-size:0.2rem;line-height:1.5em;color:#fff;}

/*searchbar*/
#searchbar{background-color:#F5F5F5;width:100%;padding:0.2rem 0;position:absolute;left:0;top:100%;display:none;}

/*search*/
#search{width:46%;}
#search form{display:block;position:relative;padding-right:3em;}
#search .text{background-color:#18181b;border:1px solid #ddd;height:2.5em;line-height:1.5em;padding:0.5em 1em;width:100%;display:block;border-radius:3px;}
#search button{border:none;background-color:var(--theme-color);color:#fff;cursor:pointer;border-radius:3px;position:absolute;right:0;top:0;height:100%;width:2.5em;}

/*quick*/
#quick{width:50%;line-height:2em;font-size:0.875em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding:0.05rem 0;color:#888;}
#quick a {margin-right:0.75em;}
#quick a:not(:hover){color:#eee;}

/*nav*/
#nav{display:table-cell;vertical-align:middle;position:relative;z-index:8;}
#nav .menu{--justify:flex-end;}
#nav .menu > li{line-height:0.8rem;color:#fff;border-right: 1px solid #282828;
    border-left: 1px solid #282828;position:relative;}
#nav .menu > li:first-child:before{border-left:1px solid #000;display:block;height:100%;content:'';position:absolute;right:100%;top:0;margin-right:1px;}
#nav .menu > li:last-child{border-right:none;}
#nav a{color:#fff;padding:0 0.2rem;display:block;}
#nav a:hover,#nav .on > a{background-color:#4ade80}
#nav li ul{position:absolute;left:50%;top:100%;min-width:100%;transform:translateX(-50%);border-radius:0 0 0.03rem 0.03rem;background-color:var(--theme-color);overflow:hidden;border-top:1px solid #000;z-index:9;display:none;}
#nav li li{line-height:1.5em;font-size:0.875em;text-align:center;border-bottom:1px solid #000;border-top:1px solid #444;}
#nav li li a{padding:0.1rem 1em;white-space:nowrap;}
#nav li em{display:none;}

/*404*/
.error404{background:#fff url(images/bg404.png) repeat left top;overflow:hidden;flex-direction:column;min-height:calc(100vh - 1.58rem);padding:5vh 0;--justify:center;}
.error404 .figure{margin-bottom:0.5rem;}
.error404 .figure img{width:3rem;max-width:100%;height:auto;display:block;}
.error404 .tips{text-align:center;}
.error404 .title{font-size:0.28rem;color:#4ade80line-height:1.5em;margin-bottom:0.3rem;}

/*container*/
#container{padding:0.2rem 0; min-height:calc(100vh - 1.45rem);}
#container .inner{--align:flex-start;}

/*breadcrumb*/
.breadcrumb{font-size:0.14rem;color:#666;padding:0.2rem;border-bottom:1px solid #eee;position:relative;line-height:1.7357em;}
.breadcrumb:before{width:0.03rem;height:0.2rem;background-color:#4ade80position:absolute;left:0;top:50%;transform:translateY(-50%);display:block;content:'';}

/*main*/
#main{width:calc(73% - 0.2rem);}
.mainbox{--align:flex-start;}

/*focus*/
#slides{width:calc(50% - 0.1rem);position:relative;}
#slides .info{display:block;overflow:hidden;padding-bottom:100%;background:no-repeat center center;background-size:cover;position:relative;}
#slides .title{position:absolute;width:100%;padding:0.5em 0.8rem 0.5em 0.2rem;left:0;bottom:0;background-color:rgba(0,0,0,.5);color:#fff;text-shadow:0 -1px 0 rgba(0,0,0,.3);font-size:0.15rem;line-height:2em;font-weight:normal;}
#slides .swiper-pagination{right:0.2rem;bottom:0;z-index:5;height:0.45rem;color:rgba(255,255,255,0.5);}

/*istop*/
#istop{width:calc(50% - 0.1rem);}
#istop ul{padding:0 0.2rem;}
#istop li{border-top:1px solid #eee;padding:0.2rem 0;}
#istop li:first-child{border-top:none;}
#istop .title{font-size:0.18rem;line-height:1.35em;margin-bottom:0.1062rem;}
#istop p{font-size:0.14rem;line-height:1.75em;height:3.5em;color:#eee;}

/*section*/
.blogItem{padding:0.2rem;overflow:hidden;border-bottom:1px solid #eee;}
.blogItem .title{font-size:0.22rem;line-height:1.5em;margin-bottom:0.1rem;}
.blogItem .title strong{color:#f00;}
.blogItem .thumbnail{width:2.8rem;}
.blogItem .thumbnail span{position:absolute;left:0;top:0;padding:0 5px;font-size:0.12rem;background-color:rgba(71,150,216,.7);color:#fff;}
.blogItem .info{width:calc(100% - 3rem);}
.blogItem .meta{border-bottom:1px solid #eee;padding-bottom:0.1rem;margin-bottom:0.1rem;color:#999;--justify:flex-start;}
.blogItem .meta span{font-size:0.13rem;line-height:2em;display:block;margin-right:0.2rem;}
.blogItem .meta span:last-child{margin-right:0;}
.blogItem .excerpt{color:#eee;height:7.5em;}

/*post*/
.post{padding:0.35rem 0.2rem;overflow:hidden;}
.post .box{border-top:1px solid #eee;padding:0.2rem 0;}
.post .name{border:none;font-size:0.18rem;line-height:1.35em;color:#eee;padding-left:0.3rem;position:relative;margin-bottom:0.15rem;}
.post .name i{position:absolute;left:0;top:0;}

/*postTitle*/
.postname{font-size:0.28rem;line-height:1.5em;margin-bottom:0.2rem;}
.postname.center{text-align:center;}

/*postmeta*/
.postmeta{margin-bottom:0.2rem;border-bottom:1px solid #efefef;padding-bottom:0.1rem;--justify:flex-start;}
.postmeta span{font-size:0.14rem;line-height:2em;color:#666;margin-right:0.2rem;display:block;}
.postmeta span:last-child{margin-right:0;}

/*entry*/
.entry{overflow:hidden;margin-bottom:0.2rem;}
.entry *{line-height:1.875em;}
.entry h1,.entry h2,.entry h3,.entry h4,.entry h5,.entry h6{border-left:0.03rem solid #4ade80padding-left:0.15rem;}
.entry blockquote{overflow:hidden;border:1px solid #eee;border-left:0.04rem solid #eee;background-color:#F5F5F5;color:#777;padding:1em;overflow:hidden;margin:1em 2em;border-radius:0.04rem;}
.entry a{color:#4ade80}
.entry a:hover{text-decoration:underline;}
.entry img,.entry video{height:auto!important;}
.entry hr{clear:both;border:none;border-bottom:1px solid #eee;}

/*posttags*/
.posttags{font-size:0.14rem;color:#888;line-height:2em;margin-bottom:0.2rem;}
.posttags a{color:#888;margin-right:0.2rem;}
.posttags a:last-child{margin-right:0;}
.posttags a:hover{color:#4ade80}

/*postnavi*/
.postnavi{margin-bottom:0.2rem;font-size:0.15rem;line-height:2em;}
.postnavi > div{max-width:47%;}
.postnavi .next{text-align:right;}
.postnavi i{font-style:normal;font-family:'宋体';}
.postnavi a{color:#eee;}
.postnavi a:hover{color:#4ade80}

/*morepost*/
.morepost li{line-height:1.875em;font-size:0.15rem;margin-bottom:0.1rem;}
.morepost li:last-child{margin-bottom:0;}
.morepost time{display:block;position:absolute;right:0;top:0;font-size:0.875em;color:#888;}
.morepost a{position:relative;padding-right:6em;}
.morepost a:hover time{color:#4ade80}

/*related-pic*/
.related ul{overflow:hidden;width:calc(100% + 0.2rem);}
.related li{width:25%;padding-right:0.2rem;}
.related li:nth-child(n+5){margin-top:0.2rem;}
.related .title{text-align:center;font-size:0.15rem;line-height:1.75em;font-weight:normal;margin-top:0.1rem;}

/*commentslist*/
.commentslist li{margin-bottom:0.2rem;border:1px solid #eee;padding:0.15rem;border-radius:0.03rem;background-color:#fefefe;}
.commentslist li .wrap{position:relative;}
.commentslist .gravatar{float:left;width:0.5rem;height:0.5rem;border-radius:0.03rem;overflow:hidden;}
.commentslist .gravatar img{width:100%;height:100%;display:block;object-fit:cover;}
.commentslist .info{margin-left:0.65rem;overflow:hidden;}
.commentslist .author{font-size:0.15rem;line-height:1.5em;font-weight:bold;}
.commentslist .meta{font-size:0.13rem;color:#888;margin-bottom:0.05rem;}
.commentslist li li{margin-top:0.15rem;background-color:#18181b;}
.commentslist #divcommentpost{margin-top:0.2rem;}

/*comment-form*/
#divcommentpost .item{margin-bottom:0.15rem;overflow:hidden;}
#divcommentpost label{color:#eee;display:block;float:left;line-height:2.5em;}
#divcommentpost .input{overflow:hidden;margin-left:3em;position:relative;}
#divcommentpost .text{padding:0.5em 1em;width:100%;height:2.5em;line-height:1.5em;display:block;border:1px solid #dedede;border-radius:0.03rem;}
#divcommentpost .text:focus{outline:none;}
#divcommentpost textarea.text{height:7.5em;resize:vertical;}
#divcommentpost .verify img{display:block;position:absolute;right:0.05rem;top:50%;transform:translateY(-50%);height:0.3rem;width:auto;cursor:pointer;}
#divcommentpost .verify .text{padding-right:1rem;}
#divcommentpost .button{padding:0.2rem 0 0.2rem 0.48rem;--justify:flex-end;}
#divcommentpost .btn{display:block;border-radius:0.03rem;cursor:pointer;font-size:0.18rem;padding:0 1.5em;height:2.5em;line-height:2.5em;}
#divcommentpost .submit{background-color:#4ade80color:#fff;}
#divcommentpost #cancel-reply{background-color:#f6f6f6;color:#666;margin-left:0.05rem;display:none;}
#divcommentpost .warning{color:#888;margin-bottom:1.5em;text-align:center;}

/*pagenavi*/
.pagenavi{text-align:center;padding:0.2rem;font-size:0.15rem;}
.pagenavi a,.pagenavi span.now-page{background-color:#18181b;border:1px solid #eee;padding:0 0.2em;color:#eee;margin:0.02rem;height:2.24em;line-height:2.24em;min-width:2.24em;box-sizing:border-box;display:inline-block;vertical-align:middle;}
.pagenavi a:hover{color:#4ade80}
.pagenavi span.now-page{background-color:#4ade80color:#fff;border-color:#4ade80}

/*sidebar*/
#sidebar{width:27%;}

/*textwidget*/
.textwidget{padding:0.2rem;overflow:hidden;}
.textwidget img{width:100%;height:auto; display: block;}

/*widget*/
.widget ul{padding:0.2rem;}

/*widget_mza_latest_posts*/
.widget_mza_rand_posts li,
.widget_mza_latest_posts li{margin-bottom:0.15rem;border-bottom:1px dashed #ccc;padding-bottom:0.15rem;}
.widget_mza_rand_posts li:last-child,
.widget_mza_latest_posts li:last-child{margin-bottom:0;border-bottom:none;padding-bottom:0;}
.widget_mza_rand_posts .thumbnail,
.widget_mza_latest_posts .thumbnail{width:1.1rem;}
.widget_mza_rand_posts .text,
.widget_mza_latest_posts .text{width:calc(100% - 1.25rem);}
.widget_mza_rand_posts .title,
.widget_mza_latest_posts .title{font-weight:normal;font-size:0.16rem;line-height:1.75em;max-height:3.5em;margin-bottom:0.09rem;}
.widget_mza_rand_posts .meta
.widget_mza_latest_posts .meta{font-size:0.13rem;line-height:1.5em;color:#888;}

/*widget_mza_popular_posts*/
.widget_mza_popular_posts li{font-size:0.15rem;line-height:2em;margin-bottom:0.1rem;}
.widget_mza_popular_posts li:last-child{margin-bottom:0;}
.widget_mza_popular_posts i{font-style:normal;font-size:0.875em;background-color:#eee;color:#888;border-radius:0.03rem;display:block;position:absolute;left:0;top:50%;transform:translateY(-50%);width:1.829em;height:1.829em;text-align:center;line-height:1.829em;}
.widget_mza_popular_posts li:nth-child(1) i{background-color:#4ade80color:#fff;}
.widget_mza_popular_posts li:nth-child(2) i{background-color:#FD6440;color:#fff;}
.widget_mza_popular_posts li:nth-child(3) i{background-color:#4796D8;color:#fff;}
.widget_mza_popular_posts li a{display:inline-block;max-width:100%;position:relative;padding-left:2.2em;vertical-align:middle;}

/*widget_mza_review_posts*/
.widget_mza_review_posts li{margin-bottom:0.12rem;}
.widget_mza_review_posts li:last-child{margin-bottom:0;}
.widget_mza_review_posts .title{font-size:0.15rem;line-height:1.875em;position:relative;padding-left:2.2em;font-weight:normal;}
.widget_mza_review_posts i{font-style:normal;font-size:1em;background-color:#eee;color:#888;border-radius:0.03rem;display:block;position:absolute;left:0;top:50%;transform:translateY(-50%);width:1.5em;height:1.5em;text-align:center;line-height:1.5em;}
.widget_mza_review_posts .thumbnail{width:1rem;display:none;border-radius:0.05rem;}
.widget_mza_review_posts a{--wrap:nowrap;}
.widget_mza_review_posts .cur .thumbnail{display:block;}
.widget_mza_review_posts .cur .title{width:calc(100% - 1.15rem);padding-left:0;display:-webkit-box;max-height:4.4em;-webkit-line-clamp:2;line-clamp:2;white-space:normal;font-size:0.16rem;}
.widget_mza_review_posts .cur .title i{display:none;}

/*widget_mza_follow*/
.widget_mza_follow .item{margin-bottom:0.15rem;}
.widget_mza_follow .qrcode{width:1.5rem;}
.widget_mza_follow .qrcode img{display:block;width:100%;height:auto;}
.widget_mza_follow .text{width:calc(100% - 1.8rem);color:#666;}
.widget_mza_follow .name{font-size:0.2rem;font-weight:bold;line-height:1.875em;color:#333;margin-bottom:0.1rem;}
.widget_mza_follow .tips{color:#666;font-size:0.15rem;line-height:2em;width: 100%; text-align: center;}

/*divComments*/
.divComments li{margin-bottom:0.15rem;border-bottom:1px dashed #ccc;padding-bottom:0.15rem;}
.divComments li:last-child{margin-bottom:0;border-bottom:none;padding-bottom:0;}
.divComments img{width:0.45rem;height:0.45rem;position:absolute;left:0;top:50%;transform:translateY(-50%);border-radius:0.05rem;object-fit:cover;display:block;}
.divComments span{display:block;font-size:0.15rem;line-height:1.35em;font-weight:bold;color:#333;margin-bottom:0.05rem;}
.divComments a{color:#eee;position:relative;padding-left:0.55rem;font-size:0.14rem;line-height:1.35em;}

/*divSearchPanel*/
.divSearchPanel form{overflow:hidden;position:relative;padding-right:3.5em;}
.divSearchPanel input{float:left;}
.divSearchPanel input[type="text"]{border:1px solid #ddd;width:100%;height:2.5em;line-height:1.5em;padding:0.5em 1em;display:block;border-right:none;border-radius:0.05rem 0 0 0.05rem;}
.divSearchPanel input[type="submit"]{background-color:#13a59e;color:#fff;cursor:pointer;height:100%;position:absolute;right:0;top:0;width:3.5em;font-weight:bold;border-radius:0 0.05rem 0.05rem 0;}

/*divTags*/
.divTags ul{display:flex;flex-wrap:wrap;}
.divTags a{display:block;font-size:0.14rem;background-color:#E1474D;padding:0 0.75em;border-radius:0.03rem;margin:0.025rem 0.05rem 0.025rem 0;color:#fff;line-height:2em;}
.divTags .tag-count{font-size:0.75em;}
.divTags a:hover{opacity:0.9;}
.divTags li:nth-child(8n-7) a{background-color:#8A9B0F;}
.divTags li:nth-child(8n-6) a{background-color:#EB6841;}
.divTags li:nth-child(8n-5) a{background-color:#3FB8AF;}
.divTags li:nth-child(8n-4) a{background-color:#FE4365;}
.divTags li:nth-child(8n-3) a{background-color:#FC9D9A;}
.divTags li:nth-child(8n-2) a{background-color:#EDC951;}
.divTags li:nth-child(8n-1) a{background-color:#C8C8A9;}
.divTags li:nth-child(8n) a{background-color:#83AF9B;}
.divTags li:first-child a{background-color:#E1474D;}
.divTags li:last-child a{background-color:#3299BB;}

/*divArchives*/
.divFavorites ul,.divArchives ul{display:flex;flex-wrap:wrap;justify-content:space-between;}
.divFavorites li,.divArchives li{width:calc(50% - 0.075rem);}
.divFavorites li:nth-child(n+3),.divArchives li:nth-child(n+3){margin-top:0.15rem;}
.divFavorites li a,.divArchives li a{display:block;background-color:#121212;color:#eee;border-radius:0.05rem;padding:0.25em 1em;line-height:2.25em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}

/*divCalendar*/
.divCalendar table{text-align:center;}
.divCalendar caption{margin-bottom:0.2rem;font-size:0.2rem;font-weight:bold;line-height:2em;}
.divCalendar table a{color:#4ade80font-weight:bold;}

/*divPrevious*/
.divPrevious li{border-bottom:1px dashed #ccc;padding-bottom:0.15rem;margin-bottom:0.15rem;line-height:1.75em;}
.divPrevious li:last-child{border-bottom:none;padding-bottom:0;margin-bottom:0;}

/*divStatistics*/
.divStatistics li{position:relative;padding-left:1em;margin-bottom:0.1rem;}
.divStatistics li:last-child{margin-bottom:0;}
.divStatistics li:before{width:0.35em;height:0.35em;border-radius:50%;background-color:#ccc;position:absolute;left:0;top:0.7625em;display:block;content:'';}

/*divAuthors*/
.divAuthors li a{display:flex;justify-content:space-between;flex-wrap:wrap;}
.divAuthors li span{font-size:0.75em;color:#999;}

/*divLinkage*/
.divLinkage li a{display:block;position:relative;padding-right:1em;}
.divLinkage li a:after{display:block;position:absolute;right:0;top:50%;transform:translateY(-50%);content:'»';}

/*divCatalog*/
.divCatalog li,.divNavBar li{border-bottom:1px solid #eee;padding-bottom:0.1rem;margin-bottom:0.1rem;}
.divCatalog li:last-child,.divNavBar li:last-child{border-bottom:none;margin-bottom:0;padding-bottom:0;}
.divCatalog li ul,.divNavBar li ul{padding:0;margin-left:2em;margin-top:0.1rem;padding-top:0.1rem;border-top:1px dashed #ccc;}
.divCatalog li li,.divNavBar li li{font-size:0.875em;border-bottom-style:dashed;border-bottom-color:#ccc;}

/*friendlinks*/
#friendlinks{margin-bottom:0.2rem;}
#friendlinks .inner{background-color:#18181b;}
#friendlinks .top{border-bottom:1px solid #eee;padding:0.15rem 0.2rem;}
#friendlinks .name{font-weight:normal;font-size:0.18rem;line-height:1.35em;padding:0.05rem 0;position:relative;}
#friendlinks .name:before{width:0.112em;height:1.125em;background-color:#4ade80content:'';display:block;position:absolute;left:-0.2rem;top:50%;transform:translateY(-50%);margin-right:0.2rem;}
#friendlinks span{font-size:0.14rem;line-height:1.5em;color:#666;display:block;padding:0.05rem 0;}
#friendlinks ul{--justify:flex-start;padding:0.1rem 0.15rem;}
#friendlinks li{padding:0.05rem;font-size:0.15rem;line-height:2em;}
#friendlinks li a{color:#eee;}
#friendlinks li a:hover{color:#4ade80}

/*back*/
#back{position:fixed;right:0.2rem;top:70%;z-index:8;transform:translateY(-50%);background-color:var(--theme-color);color:#fff;font-size:2em;width:1.5em;height:1.5em;text-align:center;cursor:pointer;--justify:center;padding-bottom:0.15em;border-radius:0.05rem;}
#back i{display:block;line-height:1em;}
#back:hover{opacity: 0.8;}

/*footer*/
#footer{background-color:var(--theme-color);color:#888;padding:0.2rem 0;font-size:0.14rem;line-height:2em;}
#footer a{color:#888;display:inline-block;}
#footer a:hover{color:#fff;}
#footer img{display:inline-block;vertical-align:middle;width:auto;height:1.2857em;margin-top:-0.21428em;}

/*recommend*/
.recommend ul{padding:0.1rem;}
.recommend li{width:50%;padding:0.1rem;}
.recommend .thumbnail{width:1.35rem;}
.recommend .info{width:calc(100% - 1.5rem);}
.recommend .title{font-size:0.16rem;line-height:1.45em;margin-bottom:0.05rem;}
.recommend p{font-size:0.14rem;line-height:1.75em;height:5.25em;overflow:hidden;color:#666;text-align:justify;}

/*screen width*/
@media only screen and (max-width:1280px){

    /*1280*/
    #logo{width:1.9rem;}

    /*1280*/
    #button{width:1.3rem;}
    #button li{line-height:0.7rem;}

    /*1280*/
    #nav .menu > li{line-height:0.7rem;}

    /*1280*/
    .blogItem .thumbnail{width:2.2rem;}
    .blogItem .info{width:calc(100% - 2.4rem);}
    .blogItem .title{margin-bottom:0.05rem;}
    .blogItem .meta{padding-bottom:0.05rem;margin-bottom:0.05rem;}
    .blogItem .excerpt{-webkit-line-clamp:3;line-clamp:3;height:5.625em;}

    /*1280*/
    #istop li{padding:0.1764rem 0;}
    #istop li:nth-child(4){display:none;}
    #istop .title{margin-bottom:0.08rem;}

    /*1280*/
    .error404{min-height:calc(100vh - 1.48rem);}
}
@media only screen and (max-width:1024px){

    /*1024*/
    #header > .inner{display:flex;justify-content:space-between;align-items:center;}

    /*1024*/
    #logo{display:block;}

    /*1024*/
    #button{width:2rem;display:block;}
    #button li{width:33.333%;}
    #button li:nth-child(2) {border-right-width:1px;}
    #button .navbtn{display:block;}

    /*1024*/
    #search{width:100%;}

    /*1024*/
    #quick{display:none;}

    /*1024*/
    #nav{position:fixed;left:0;top:0.7rem;background-color:var(--theme-color);width:100%;height:calc(100% - 0.7rem);z-index:9;overflow-y:auto;-webkit-overflow-scrolling:touch;border-top:1px solid #222;transform:translateX(110%);transition:transform .3s;padding:0 3.125%; box-shadow: 0 0 0.05rem var(--theme-color);}
    #nav.active{transform:translateX(0);}
    #nav .menu{display:block;}
    #nav .menu > li{border-left:none;border-right:none;border-bottom:1px solid rgba(0,0,0,.2);line-height:0.6rem;}
    #nav .menu > li:first-child:before{display:none;}
    #nav li ul{position:static;min-width:0;transform:none;border-top:none;background-color:transparent;}
    #nav li li{text-align:left;line-height:0.5rem;border-bottom:none;border-top:1px solid rgba(0,0,0,.2);}
    #nav li li a{padding:0 0 0 3em;}
    #nav li em{width:0.6rem;height:0.6rem;position:absolute;right:0;top:0;z-index:2;cursor:pointer;display:block;}
    #nav li em:after{content:'';display:block;width:0.07rem;height:0.07rem;border-right:1px solid #eee;border-bottom:1px solid #eee;position:absolute;left:50%;top:50%;transform:rotate(45deg);margin:-0.06rem 0 0 -0.04rem;transition:all .3s;}
    #nav a{padding:0 1em;}
    #nav a:hover,#nav .on > a{background-color:transparent;}

    /*1024*/
    #main,#sidebar{width:100%;}

    /*1024*/
    #istop{width:calc(43% - 0.1rem);}
    #istop li{padding:0.17808rem 0;}
    #istop li:nth-child(4){display:block;}

    /*1024*/
    #slides{width:calc(57% - 0.1rem);}

    /*1024*/
    .divFavorites li,.divArchives li{width:calc(25% - 0.075rem);}
    .divFavorites li:nth-child(n+3),.divArchives li:nth-child(n+3){margin-top:0;}
    .divFavorites li:nth-child(n+5),.divArchives li:nth-child(n+5){margin-top:0.15rem;}
}
@media only screen and (max-width:750px){

    /*750*/
    #logo{width:1.7rem;}

    /*750*/
    #button{width:1.6rem;}
    #button li{line-height:0.6rem;}

    /*750*/
    #nav{top:0.6rem;height:calc(100% - 0.6rem);}

    /*750*/
    #footer .inner{flex-direction:column;--align:center;text-align:center;}

    /*750*/
    .recommend .thumbnail{width:100%;margin-bottom:0.1rem;}
    .recommend .info{width:100%;}
    .recommend .title{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;margin-bottom:0;line-height:1.5em;max-height:3em;}
    .recommend p{display:none;}

    /*750*/
    .postname{font-size:0.22rem;}

    /*750*/
    .postmeta span{margin-right:0.15rem;}

    /*750*/
    .blogItem .thumbnail{width:1.2rem;}
    .blogItem .info{width:calc(100% - 1.4rem);}
    .blogItem .title{white-space:normal;display:-webkit-box;font-size:0.18rem;max-height:3em;-webkit-line-clamp:2;line-clamp:2;margin-bottom:0.09rem;}
    .blogItem .meta{margin-bottom:0;padding-bottom:0;border-bottom:none;}
    .blogItem .meta span,.blogItem .excerpt{display:none;}
    .blogItem .meta .date{display:block;}

    /*750*/
    #istop{width:100%;}
    #istop li{padding:0.2rem 0;}

    /*750*/
    #slides{width:100%;}

    /*750*/
    .postnavi > div{max-width:none;width:100%;}

    /*750*/
    #divcommentpost label{float:none;line-height:1.5em;margin-bottom:0.25em;}
    #divcommentpost .input{margin-left:0;}

    /*750*/
    .commentslist .gravatar {width:0.3rem; height:0.3rem;}
    .commentslist .info {margin-left:0.42rem;}
    .commentslist .meta {margin-bottom: 0;}

    /*750*/
    .related li{width:50%;}
    .related li:nth-child(n+3){margin-top:0.2rem;}
    .related .title {display: -webkit-box; white-space: normal; height: 3.5em; -webkit-line-clamp: 2;line-clamp: 2;}

    /*750*/
    .error404{min-height:calc(100vh - 1.84rem);}

    /*750*/
    #back{display:none;}

    /*750*/
    .divFavorites li,.divArchives li{width:calc(50% - 0.075rem);}
    .divFavorites li:nth-child(n+3),.divArchives li:nth-child(n+3){margin-top:0.15rem;}
}
/* 替换样式 */



/* =============================================
   ⚡ DJ25 - Cyber Matrix Neon Theme
   ============================================= */

:root {
  --bg1: #050510;
  --bg2: #0b0f1f;
  --text-main: #e8ecf7;
  --text-sub: #8b90a5;
  --neon1: #00ffe0;
  --neon2: #c77dff;
  --border: rgba(255,255,255,0.1);
  --glass: rgba(255,255,255,0.05);
}

/* 背景：深空渐变 + 微光 */
body {
  background: radial-gradient(circle at 30% 20%, var(--bg1), var(--bg2) 80%);
  color: var(--text-main);
  font-family: "Inter", "Microsoft Yahei", Arial, sans-serif;
  overflow-x: hidden;
}

/* 全局文字柔化 */
body, a, span, p {
  text-shadow: 0 0 3px rgba(0,0,0,0.4);
}

/* 滚动条：霓虹流光 */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
::-webkit-scrollbar-track {
  background: rgba(20,20,30,0.8);
}
::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, var(--neon1), var(--neon2));
  border-radius: 8px;
  box-shadow: 0 0 10px rgba(0,255,200,0.4);
}
::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(180deg, var(--neon2), var(--neon1));
}

/* 顶部导航栏：流光渐变底 + 悬浮发光边 */
#header {
  background: linear-gradient(90deg, rgba(5,5,10,0.85) 0%, rgba(10,10,20,0.85) 50%, rgba(5,5,10,0.85) 100%);
  backdrop-filter: blur(20px);
  border-bottom: 1px solid var(--border);
  box-shadow: 0 0 30px rgba(0,255,200,0.08);
  position: sticky;
  top: 0;
  z-index: 100;
  animation: headerGlow 10s infinite linear;
}
@keyframes headerGlow {
  0% { box-shadow: 0 0 15px rgba(0,255,200,0.3); }
  50% { box-shadow: 0 0 25px rgba(199,125,255,0.3); }
  100% { box-shadow: 0 0 15px rgba(0,255,200,0.3); }
}

/* 导航菜单：hover 流光线条 */
#nav a {
  color: var(--text-main);
  position: relative;
  font-weight: 500;
  letter-spacing: 0.5px;
  transition: color 0.3s ease;
}
#nav a::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  width: 0%;
  height: 2px;
  background: linear-gradient(90deg, var(--neon1), var(--neon2));
  transform: translateX(-50%);
  border-radius: 2px;
  transition: width 0.4s ease;
  box-shadow: 0 0 8px rgba(0,255,200,0.4);
}
#nav a:hover {
  color: var(--neon1);
}
#nav a:hover::after {
  width: 80%;
}

/* 卡片 / 区块 */
.mza-box,
.widget,
.blogItem,
#friendlinks .inner {
  background: var(--glass);
  border: 1px solid var(--border);
  border-radius: 10px;
  backdrop-filter: blur(10px);
  box-shadow:
    0 0 20px rgba(0,0,0,0.4),
    inset 0 0 5px rgba(255,255,255,0.03);
  transition: all 0.4s ease;
}
.mza-box:hover,
.widget:hover,
.blogItem:hover {
  transform: translateY(-4px);
  box-shadow:
    0 0 25px rgba(0,255,200,0.2),
    0 0 45px rgba(199,125,255,0.15);
}

/* 标题渐变发光 */
.mza-name,
.blogItem .title,
#friendlinks .name {
  background: linear-gradient(90deg, var(--neon1), var(--neon2));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  font-weight: 600;
  letter-spacing: 0.5px;
  text-shadow: 0 0 10px rgba(0,255,200,0.2);
}

/* 按钮渐变 + 霓虹阴影 */
button,
#search button,
#divcommentpost .submit {
  background: linear-gradient(135deg, var(--neon1), var(--neon2));
  color: #fff;
  border: none;
  border-radius: 6px;
  padding: 0.4em 1.2em;
  font-weight: 600;
  box-shadow: 0 0 15px rgba(0,255,200,0.4);
  transition: all 0.3s ease;
}
button:hover,
#search button:hover {
  transform: scale(1.05);
  box-shadow: 0 0 25px rgba(199,125,255,0.5);
}

/* 搜索框 */
#search .text {
  background: rgba(255,255,255,0.06);
  border: 1px solid var(--border);
  color: var(--text-main);
  border-radius: 6px;
  padding-left: 1em;
}

/* 返回顶部按钮：脉冲霓虹 */
#back {
  background: linear-gradient(135deg, var(--neon1), var(--neon2));
  box-shadow: 0 0 20px rgba(0,255,200,0.5);
  border-radius: 50%;
  color: #fff;
  animation: pulseGlow 3s infinite ease-in-out;
}
@keyframes pulseGlow {
  0%, 100% { box-shadow: 0 0 15px rgba(0,255,200,0.4); }
  50% { box-shadow: 0 0 25px rgba(199,125,255,0.6); }
}

/* 图片 hover 光影 */
.thumbnail img {
  filter: brightness(0.9) contrast(1.05);
  transition: all 0.6s ease;
}
.thumbnail:hover img {
  filter: brightness(1.2) saturate(1.3);
  transform: scale(1.05);
}

/* 页脚星光 */
#footer {
  background: linear-gradient(180deg, rgba(10,10,20,0.95), rgba(5,5,10,1));
  color: var(--text-sub);
  text-align: center;
  padding: 2em 0;
  border-top: 1px solid var(--border);
  box-shadow: 0 -5px 30px rgba(0,255,200,0.08);
}
#footer a:hover {
  color: var(--neon1);
  text-shadow: 0 0 6px var(--neon1);
}
/* 搜索框文本可读性优化 + 焦点发光 */
#search .text,
.divSearchPanel input[type="text"],
input[type="text"],
textarea {
  color: #e8ecf7; /* 亮白文字 */
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 6px;
  padding-left: 1em;
  transition: all 0.3s ease;
}

/* 焦点状态下的发光 */
#search .text:focus,
.divSearchPanel input[type="text"]:focus,
input[type="text"]:focus,
textarea:focus {
  border-color: #00ffe0;
  box-shadow: 0 0 10px rgba(0,255,224,0.4);
  outline: none;
}

/* 占位符颜色调整为淡灰白 */
#search .text::placeholder,
.divSearchPanel input[type="text"]::placeholder,
input::placeholder,
textarea::placeholder {
  color: #9fa4ba;
  opacity: 1;
}
/* =============================
   🔍 暗色赛博风搜索栏优化
   ============================= */

#searchbar {
  background: rgba(10, 12, 20, 0.9);
  backdrop-filter: blur(20px);
  border-bottom: 1px solid rgba(255,255,255,0.1);
  box-shadow: 0 0 25px rgba(0,255,224,0.1);
  padding: 0.4rem 0;
  animation: searchBarGlow 8s infinite ease-in-out;
}

@keyframes searchBarGlow {
  0%   { box-shadow: 0 0 20px rgba(0,255,224,0.15); }
  50%  { box-shadow: 0 0 30px rgba(199,125,255,0.2); }
  100% { box-shadow: 0 0 20px rgba(0,255,224,0.15); }
}

/* 搜索输入框 */
#searchbar .text {
  background: rgba(255,255,255,0.08);
  border: 1px solid rgba(255,255,255,0.1);
  color: #e8ecf7;
  border-radius: 6px;
  padding: 0.6em 1em;
  width: 100%;
  transition: all 0.3s ease;
}
#searchbar .text:focus {
  border-color: #00ffe0;
  box-shadow: 0 0 12px rgba(0,255,224,0.4);
  outline: none;
}

/* 占位符 */
#searchbar .text::placeholder {
  color: #9fa4ba;
  opacity: 1;
}

/* 搜索按钮霓虹 */
#searchbar button {
  background: linear-gradient(135deg, #00ffe0, #c77dff);
  border: none;
  color: #fff;
  border-radius: 6px;
  font-weight: 600;
  padding: 0 1em;
  margin-left: 0.4em;
  box-shadow: 0 0 15px rgba(0,255,224,0.3);
  transition: all 0.3s ease;
}
#searchbar button:hover {
  transform: scale(1.05);
  box-shadow: 0 0 25px rgba(199,125,255,0.5);
}

/* 快捷搜索区域 */
#quick {
  color: #9fa4ba;
}
#quick span {
  color: #8b90a5;
}
#quick a {
  color: #e8ecf7;
  margin-right: 0.6em;
  transition: all 0.3s ease;
}
#quick a:hover {
  color: #00ffe0;
  text-shadow: 0 0 6px #00ffe0;
}

/* ============================================================
   💫 导航选中（当前页面）高亮炫彩特效
   ============================================================ */
#nav .on > a {
  position: relative;
  color: #fff;
  background: linear-gradient(90deg, var(--neon1), var(--neon2), var(--neon1));
  background-size: 300%;
  animation: navActiveFlow 6s linear infinite;
  border-radius: 4px;
  box-shadow:
    0 0 15px rgba(0,255,224,0.4),
    inset 0 0 10px rgba(199,125,255,0.3),
    0 0 30px rgba(0,255,224,0.2);
  text-shadow: 0 0 6px rgba(255,255,255,0.6);
  transition: all 0.4s ease;
}

/* 流光动画：渐变左右滑动 */
@keyframes navActiveFlow {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

/* 为选中项增加下划线辉光 */
#nav .on > a::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  width: 80%;
  height: 2px;
  transform: translateX(-50%);
  background: linear-gradient(90deg, var(--neon1), var(--neon2));
  box-shadow: 0 0 10px var(--neon1), 0 0 20px var(--neon2);
  border-radius: 2px;
  opacity: 0.9;
}

/* 悬停时叠加发光呼吸效果 */
#nav a:hover,
#nav .on > a:hover {
  color: #fff;
  box-shadow:
    0 0 25px rgba(0,255,224,0.6),
    0 0 50px rgba(199,125,255,0.3);
  text-shadow: 0 0 12px var(--neon1);
}
/* ============================================================
   💫 导航 hover + 选中 炫彩流光特效
   ============================================================ */
#nav a {
  position: relative;
  color: #e8ecf7;
  font-weight: 500;
  transition: all 0.3s ease;
  border-radius: 6px;
  overflow: hidden;
}

/* hover & active 统一为炫彩渐变 */
#nav a:hover,
#nav .on > a {
  color: #fff;
  background: none;
  background-size: 300% 300%;
  animation: navGlowFlow 6s ease infinite;
  box-shadow:
    0 0 12px rgba(0,255,224,0.4),
    0 0 24px rgba(199,125,255,0.25),
    inset 0 0 10px rgba(255,255,255,0.08);
  text-shadow: 0 0 8px rgba(255,255,255,0.7);
}

/* 流光动效动画 */
@keyframes navGlowFlow {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

/* hover 或选中下的底部发光条 */
#nav a:hover::after,
#nav .on > a::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 80%;
  height: 2px;
  background: linear-gradient(90deg, #00ffe0, #c77dff, #00ffe0);
  border-radius: 2px;
  box-shadow:
    0 0 8px #00ffe0,
    0 0 16px #c77dff;
  animation: navUnderlinePulse 3s ease-in-out infinite;
}

@keyframes navUnderlinePulse {
  0%,100% { opacity: 0.7; transform: translateX(-50%) scaleX(1); }
  50% { opacity: 1; transform: translateX(-50%) scaleX(1.05); }
}



/* ======= 🧩 恢复菜单和模块即时显示 ======= */

/* 1. 菜单立即显示响应 */
#nav {
  transition: transform .3s !important;
  transform: translateX(110%) !important;
}
#nav.active {
  transform: translateX(0) !important;
}

/* 2. 禁用模块进入延迟动画 */
.mza-box,
.blogItem,
.widget,
#friendlinks .inner {
  transition: none !important;
  animation: none !important;
  opacity: 1 !important;
  transform: none !important;
  visibility: visible !important;
}

/* 3. 禁止 header 动画干扰布局 */
#header {
  animation: none !important;
}

/* 4. 立即显示所有隐藏内容（防止滚动触发） */
[class*="fade"],
[class*="animate"],
[class*="wow"],
[class*="aos"],
[class*="scroll"],
[class*="hidden"] {
  opacity: 1 !important;
  transform: none !important;
  transition: none !important;
  visibility: visible !important;
}

/* 🧩 修复移动端菜单层级和点击问题 */
#nav {
  z-index: 9999 !important;
}

#button .navbtn {
  position: relative;
  z-index: 10000 !important;
  cursor: pointer;
}


/* ================================
   ✅ 移动端菜单完全覆盖修复
   ================================ */

/* 让菜单浮在所有元素之上 */
#nav {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  background-color: rgba(27, 23, 24, 0.98) !important; /* 深色遮罩背景 */
  z-index: 999999 !important;
  transform: translateX(110%) !important;
  transition: transform .3s ease-out !important;
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch !important;
}

/* 菜单展开状态 */
#nav.active {
  transform: translateX(0) !important;
}

/* 菜单内链接正常可点击 */
#nav a {
  color: #fff !important;
  pointer-events: auto !important;
}

/* header 降低层级，避免压住菜单 */
#header {
  z-index: 1 !important;
  position: relative !important;
}

/* 菜单按钮在最上层以确保点击可用 */
#button .navbtn {
  display: block !important;
  position: relative !important;
  z-index: 1000000 !important;
  cursor: pointer !important;
}


/* ================================
   💻 桌面端导航恢复正常显示
   ================================ */
@media (min-width: 1025px) {
  #nav {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    width: auto !important;
    height: auto !important;
    background: none !important;
    transform: none !important;
    transition: none !important;
    overflow: visible !important;
    z-index: 8 !important;
  }

  #nav .menu {
    display: flex !important;
    justify-content: flex-end !important;
    align-items: center !important;
  }

  #header {
    position: sticky !important;
    z-index: 9 !important;
  }

  #button .navbtn {
    display: none !important;
  }
}
/* === Mobile nav: 最顶层覆盖 + 恢复按钮位置 === */
@media (max-width: 1024px) {
  /* 1) 头部恢复 sticky（按钮位置回归），但层级不要压过菜单 */
  #header {
    position: sticky !important;  /* 恢复原本布局 */
    top: 0 !important;
    z-index: 100 !important;      /* 够用即可，别压过菜单 */
  }

  /* 2) 菜单真正全屏 + 绝对顶层（不受任何祖先影响） */
  #nav {
    position: fixed !important;
    inset: 0 !important;                  /* top/left/right/bottom:0 */
    width: 100vw !important;
    height: 100dvh !important;            /* 兼容移动端地址栏收起 */
    background: rgba(27, 23, 24, 0.98) !important;
    transform: translateX(110%) !important;
    transition: transform .3s ease-out !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
    z-index: 2147483647 !important;       /* 直接拉满，确保最顶层 */
    pointer-events: auto !important;      /* 自己接管点击 */
  }
  #nav.active { transform: translateX(0) !important; }

  /* 3) 防止祖先创建的新层叠上下文影响菜单（仅限导航容器这一层） */
  #nav, #nav * {
    transform: none !important;
    filter: none !important;
    perspective: none !important;
  }

  /* 4) 菜单内部样式：沿用你原本的移动端结构，不改变按钮布局 */
  #nav .menu { display: block !important; }
  #nav .menu > li { line-height: 0.6rem !important; }
  #nav li ul {
    position: static !important;
    min-width: 0 !important;
    transform: none !important;
    border-top: none !important;
    background: transparent !important;
  }

  /* 5) 不再强行改动 navbtn 的定位，避免图标“跑位” */
  #button .navbtn {
    position: static !important;   /* 恢复随文流（或你主题默认） */
    z-index: 10001 !important;     /* 足够在 header 内部置顶，仍低于 #nav */
    display: block !important;
    cursor: pointer !important;
  }
}

/* ✅ 移动端菜单：默认隐藏，只有加 .active 时才展开 */
@media (max-width: 1024px) {
  #nav {
    transform: translateX(110%) !important; /* 默认隐藏 */
    opacity: 0 !important;
    pointer-events: none !important;
  }

  #nav.active {
    transform: translateX(0) !important;   /* 展开 */
    opacity: 1 !important;
    pointer-events: auto !important;
    transition: transform 0.3s ease, opacity 0.3s ease !important;
  }
}
html, body {
  overflow-x: hidden !important;
}

body * {
  max-width: 100vw !important;
  box-sizing: border-box;
}