/*!
*金星导航
 */

html{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}
body{width:100%;min-height:100vh;vertical-align:baseline;word-wrap:break-word;color:#282a2d;background:#f9f9f9;transition:background-color .3s}
body,input,button,select,optgroup,option,textarea,blockquote,dd,dl,figure,form,pre,.h1,.h2,.h3,.h4,.h5,.h6,h1,h2,h3,h4,h5,h6{font-family:"SF Pro SC","SF Pro Text","SF Pro Icons",PingFang SC,Lantinghei SC,Microsoft Yahei,Hiragino Sans GB,Microsoft Sans Serif,WenQuanYi Micro Hei,sans-serif;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}
body,html{height:100%;margin:0;padding:0;border:0}
a{color:#282a2d;outline:0!important;text-decoration:none}
a:hover{text-decoration:none;color:#f1404b}
p{color:#1d232b;margin:0;white-space:normal;word-break:break-all} 

/*--------------------------------------------------------------
## Basics style
--------------------------------------------------------------*/
.page-container{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-direction:row;-webkit-box-orient:horizontal;-webkit-box-direction:normal;flex-direction:row}
.page-container>.flex-fill{min-width:0}
.main-content{-ms-flex-direction:column;flex-direction:column;display:-ms-flexbox;display:flex}
.content-site{padding:0 15px;width:100%;margin-right:auto;margin-left:auto}
.down-content img,.site-content img,.apd img,.post-apd img,.panel-body img{max-width:100%;height:auto}
.nothing{padding:20px 0;text-align:center;color:#888;background:rgba(136,136,136,.2);border-radius:5px}
.sticky{position:-webkit-sticky;position:sticky;top:0;z-index:1080} 
.io{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:inline-block;font-style:normal;font-variant:normal;text-rendering:auto;line-height:1}
.avatar{background:#888;border-radius: 100%;-ms-flex-pack: center;justify-content: center;-ms-flex-align: center;align-items: center;-ms-flex-negative: 0;flex-shrink: 0;overflow: hidden;}
.disabled{pointer-events:none;filter:grayscale(100%);-webkit-filter:grayscale(100%);-moz-filter:grayscale(100%);-ms-filter:grayscale(100%);-o-filter:grayscale(100%);filter:url("data:image/svg+xml;utf8,#grayscale");filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);-webkit-filter:grayscale(1)}
@media (min-width:1920px){.content-site{max-width:1900px}
}
@media (min-width:768px){.content-site{padding:0 30px}
}
/*--------------------------------------------------------------
## WordPress Basics style
--------------------------------------------------------------*/
.alignnone{margin:5px 20px 20px 0}
.aligncenter,div.aligncenter{display:block;margin:5px auto 5px auto}
.alignright{float:right;margin:5px 0 20px 20px}
.alignleft{float:left;margin:5px 20px 20px 0}
a img.alignright{float:right;margin:5px 0 20px 20px}
a img.alignnone{margin:5px 20px 20px 0}
a img.alignleft{float:left;margin:5px 20px 20px 0}
a img.aligncenter{display:block;margin-left:auto;margin-right:auto}
.wp-caption{background:#fff;border:1px solid #f0f0f0;max-width:96%;padding:5px 3px 10px;text-align:center}
.wp-caption.alignnone{margin:5px 20px 20px 0}
.wp-caption.alignleft{margin:5px 20px 20px 0}
.wp-caption.alignright{margin:5px 0 20px 20px}
.wp-caption img{border:0 none;height:auto;margin:0;max-width:98.5%;padding:0;width:auto}
.wp-caption p.wp-caption-text{font-size:11px;line-height:17px;margin:0;padding:0 4px 5px}
.screen-reader-text{border:0;clip:rect(1px,1px,1px,1px);clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute!important;width:1px;word-wrap:normal!important}
.screen-reader-text:focus{background-color:#eee;clip:auto!important;clip-path:none;color:#444;display:block;font-size:1em;height:auto;left:5px;line-height:normal;padding:15px 23px 14px;text-decoration:none;top:5px;width:auto;z-index:100000}

.sidebar-nav .top-menu .sub-menu{background-color:rgba(136,136,136,.05)}
.sidebar-nav .top-menu .menu-item-has-children>a::after{content:'\e612';font-family:"iconfont";position:absolute;right:24px;-webkit-transform:scale(.6);transform:rotate(0deg) scale(.6);transition:transform .2s}
.sidebar-nav .top-menu>ul i{display:none}
.sidebar-nav.show .top-menu{display:inherit}

.sidebar-item li>a:hover,.sidebar-popup>div>ul>li>a:hover{color:#FFF;background:rgba(119,121,125,.15)}
/*--------------------------------------------------------------
## header menu
--------------------------------------------------------------*/
.navbar-collapse ul li{position:relative;list-style:none}
.navbar-collapse li>ul{-webkit-transform:translateY(15px);transform:translateY(15px)}
.navbar-collapse ul li ul{position:absolute;min-width:90px;opacity:0;overflow:hidden;visibility:hidden;background:#fff;border-radius:4px;box-shadow:0 5px 20px 0px rgba(0,0,0,.15);transition:.3s}
.navbar-collapse ul li.focus>ul,.navbar-collapse ul li:hover>ul{opacity:1;z-index:1;overflow:visible;visibility:visible;-webkit-transform:translateY(0);transform:translateY(0)}
.navbar-collapse ul li.menu-item-has-children:after{content:'\e612';font-family:"iconfont";position:absolute;top:14px;right:-2px;font-size:12px;-webkit-transform:scale(.6);transform:rotate(0deg) scale(.6);transition:transform .2s}
.navbar-collapse ul li.menu-item-has-children:hover:after{transform:rotate(45deg) scale(.6)}
.navbar .navbar-nav li>a{font-size:14px;padding:10px 15px;display:block;transition:color .2s}
.navbar .navbar-nav i{margin-right:2px!important}
.navbar-menu{-ms-flex-direction:row;flex-direction:row;margin-left:auto;-ms-align-items:center;align-items:center}
.navbar-collapse .weather{display:table}
.navbar-brand img{max-height:40px}
.nav-github{display:none;position:absolute;top:0;right:0;border:0}
.page-header{position:fixed;right:0;left:0;background:#fff;box-shadow:0px 0px 25px 5px rgba(10,10,10,.05);transition:background-color .3s}
.page-header ul{margin:0;padding:0}
.header-mini-btn{height:74px;width:40px}
.header-mini-btn svg{margin:0 -20px;height:74px}
.header-mini-btn input[type="checkbox"]{display:none}
.header-mini-btn path{fill:none;stroke:#888;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;--length:24;--offset:-38;stroke-dasharray:var(--length) var(--total-length);stroke-dashoffset:var(--offset);transition:all .8s cubic-bezier(.645,.045,.355,1)}
.header-mini-btn circle{fill:#fff3;opacity:0;transition:opacity .3s;cursor:pointer}
.header-mini-btn label{display:block;top:0;right:0}
.header-mini-btn label circle:hover{opacity:1}
.header-mini-btn input:checked+svg .line--1,.header-mini-btn input:checked+svg .line--3{--length:12.602325267}
.header-mini-btn .line--1,.header-mini-btn .line--3{--total-length:126.38166809082031}
.header-mini-btn .line--2{--total-length:80}
/*.header-mini-btn input:checked+svg .line--1,.header-mini-btn input:checked+svg .line--3{--offset:-105.1770175568}*/
.header-mini-btn label{cursor:pointer}
.header-mini-btn path{transition:all .5s cubic-bezier(.645,.045,.355,1),stroke .2s ease}
.header-mini-btn label:hover path{ stroke:#f1404b}
.bulletin{box-sizing:border-box;height:25px;line-height:25px;overflow:hidden}
.bulletin ul{margin:0;padding:0;list-style-type:none;font-size:14px}
@media (min-width:768px){.navbar{padding:0 1rem}

.sidebar-nav.animate-nav+.main-content{-webkit-transition:.2s;-o-transition:.2s;transition:.2s}
.sidebar-nav.animate-nav+.main-content .page-header{-webkit-transition:left .2s,color .3s,background-color .3s;-o-transition:left .2s,color .3s,background-color .3s;transition:left .2s,color .3s,background-color .3s}
.sidebar-nav.mini-sidebar+.main-content{margin-left:60px}
.sidebar-nav.mini-sidebar+.main-content .page-header{left:60px}
}
@media (max-width:767.98px){.nav-github{display:none}
}
/*--------------------------------------------------------------
## mobile menu
--------------------------------------------------------------*/
.navbar-menu a{color:#777} 
@media (min-width:768px){.sidebar-nav{display:block!important}
}
@media (max-width:767.98px){.sidebar-nav{background:transparent!important} 
.sidebar-nav{width:100%!important;height:100%!important;top:0!important;position:fixed;z-index:1090!important;display:none;padding-left:0!important}
.sidebar-nav.show>div{transform:translate3d(0,0,0)}
.sidebar-nav>*{position:fixed;height:100%;transition:.2s cubic-bezier(.25,.8,.25,1);transform:translate3d(-100%,0,0);width:17.5rem}
}
/*--------------------------------------------------------------
## Font Size style
--------------------------------------------------------------*/
.text-ss{font-size:.45rem!important}
.text-xs{font-size:.75rem!important}
.text-sm{font-size:.875rem!important}
.text-md{font-size:1rem!important}
.text-lg{font-size:1.125rem!important}
.text-xl{font-size:1.375rem!important}
.text-64{font-size:4rem!important}
.badge.text-ss{font-weight:normal}
@media (max-width:767.98px){.text-lg{font-size:1rem!important}
.text-xl{font-size:1.25rem!important}
.alert-body .text-md{font-size:.875rem!important}
}
/*--------------------------------------------------------------
## Font line height style
--------------------------------------------------------------*/
.text-height-xs{line-height:1!important}
.text-height-sm{line-height:1.2!important}
.text-height-md{line-height:1.4!important}
.text-height-lg{line-height:1.6!important}
.text-height-xl{line-height:2!important}

/*--------------------------------------------------------------
## URL box style
--------------------------------------------------------------*/
.text-gray{color:#555}
.overflowClip_1{overflow:hidden;-o-text-overflow:ellipsis;text-overflow:ellipsis;word-break:break-all;display:-webkit-box!important;-webkit-line-clamp:1;-webkit-box-orient:vertical}
.overflowClip_1{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block!important}
.overflowClip_2{overflow:hidden;-o-text-overflow:ellipsis;text-overflow:ellipsis;word-break:break-all;display:-webkit-box!important;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.url-card .url-body{transform:translateY(0px);-webkit-transform:translateY(0px);-moz-transform:translateY(0px);-webkit-transition:all 0.3s ease;-moz-transition:all 0.3s ease;-o-transition:all 0.3s ease;transition:all 0.3s ease}
.url-card .url-body:hover{transform:translateY(-6px);-webkit-transform:translateY(-6px);-moz-transform:translateY(-6px);box-shadow:0 26px 40px -24px rgba(0,36,100,.3);-webkit-box-shadow:0 26px 40px -24px rgba(0,36,100,.3);-moz-box-shadow:0 26px 40px -24px rgba(0,36,100,.3)}
.url-card .url-like{position:absolute;top:5px;right:10px;opacity:0;transition:opacity .3s}
.url-card .url-body:hover .url-like{opacity:1}
.url-card .url-info{overflow:hidden;padding-right:5px}
.url-card .url-goto-after{height:24px;border-top:1px solid rgba(136,136,136,.2)}
.url-card .url-goto{position:absolute;bottom:0;left:0px;right:0}
.url-card .card-body{padding:.938rem}
.url-card .url-img{width:40px;height:40px;-webkit-box-flex:0;-ms-flex:none;flex:none;background:rgba(255, 255, 255, 0);overflow:hidden}
.url-card .url-img>img{max-height:100%;vertical-align:unset}
.url-card .max .url-img{width:60px;height:60px}
.url-card .mini .url-img{width:25px;height:25px}
.url-card .post-min .url-img{width:20px;height:20px}
.url-card .post-min .url-img>img{vertical-align:unset}
.url-card.wechat a.card:after{content:'\e60d';position:absolute;display:inline-block;font-family:"iconfont";font-size:66px;color:#888;margin-left:10px;bottom:-15px;right:10px;opacity:.15}
.url-card.down a.card:after{content:'\e604';position:absolute;display:inline-block;font-family:"iconfont";font-size:60px;color:#888;margin-left:10px;bottom:-10px;right:10px;opacity:.15}
.url-card.down .mini a.card:after,.url-card.wechat .mini a.card:after{font-size:30px;margin-left:10px;bottom:-5px;right:10px}
.url-card.down .max a.card:after,.url-card.wechat .max a.card:after{font-size:30px;bottom:25px}
.url-card .mini a.togo,.url-card .default a.togo{position:absolute;top:20px;right:0;width:30px;height:30px;line-height:30px;opacity:.2;transition:opacity .3s} 
.url-card .mini a.togo{top:4px}
.url-card .url-body:hover a.togo{opacity:1}
.url-card .max a.togo{margin-left:auto}
.url-card .max .tga{width:calc(100% - 15px);overflow:hidden}
.url-card .max .tga a{font-size:75%;padding:.125rem .4rem;background:rgba(134,134,134,.1);color:#888;border-radius:10px;transition:.3s}
.url-card .max .tga a:not(.no-tag):hover{background:#f1404b;color:#fff}
.home-like{cursor:pointer}
.home-like:hover{color:#f1404b}
.home-like-hide{opacity:0!important;transform:scale(3) translateY(-25px)!important}
.url-card a.togo:hover i{text-shadow:0 0 5px} 
.panel-body .url-card.shortcode-url .card{background:rgba(136,136,136,.1)}
.url-card .remove-site,.url-card .remove-cm-site{position:absolute;top:-8px;right:0;font-size:20px;color:#f1404b;line-height:20px}
.url-card .mini .card-body{padding:0.4rem 0.5rem}
.edit .url-card.sortable{cursor:move}
.edit .url-card.sortable .url-body a{pointer-events:none}
.edit .url-card.sortable .url-body:hover{transform:initial;box-shadow:initial}
/*--------------------------------------------------------------
## app box style
--------------------------------------------------------------*/
.card-app.default .media,.card-app.card{transform:translateY(0);-webkit-transform:translateY(0);-moz-transform:translateY(0);-webkit-transition:all .3s ease;-moz-transition:all .3s ease;-o-transition:all .3s ease;transition:all .3s ease}
.app-rounded{border-radius:30%!important}
.card-app.default .media-content{background-color:transparent!important}
.card-app.default:hover .media,.card-app.card:hover{transform:translateY(-6px);-webkit-transform:translateY(-6px);-moz-transform:translateY(-6px);box-shadow:0 26px 40px -24px rgba(0,36,100,.3);-webkit-box-shadow:0 26px 40px -24px rgba(0,36,100,.3);-moz-box-shadow:0 26px 40px -24px rgba(0,36,100,.3);-webkit-transition:all .3s ease;-moz-transition:all .3s ease;-o-transition:all .3s ease;transition:all .3s ease}
.app-info .info-term{display:inline-block}
.app-content{overflow:hidden;align-items:center}
.app-content .app-ico img{width:128px}
.app-nature .badge i{font-weight:100}
.card-app.card .tga{overflow:hidden}
.card-app.card .tga a{font-size:75%;padding:.125rem .4rem;background:rgba(134,134,134,.1);color:#888;border-radius:10px;transition:.3s}
.card-app.card .tga a:not(.no-tag):hover{background:#f1404b;color:#fff}
.card-app.card .app-platform{position:absolute;top:3px;right:5px;opacity:0;transition:opacity .3s}
.card-app.card:hover .app-platform{opacity:.3}
.radius-50{border-radius:100px!important}
.historic .line-thead,.historic .line-tbody{position:relative;height:1px}
.historic .line-thead:before,.historic .line-tbody:before{content:'';position:absolute;height:1px;left:0;right:0;background-color:rgba(136,136,136,.4)}
.historic .line-tbody:before{background-color:rgba(136,136,136,.2)}
#app-down-modal .statement{border-radius:5px;border:2px dashed rgba(159, 255, 95, 0.7);background-color:rgba(159, 255, 95, 0.2)}
.screenshot-carousel{background-color:rgba(0,0,0,.1);overflow:hidden;box-shadow:0 0 50px 0 rgba(0,0,0,.1) inset}
.screenshot-carousel .img_wrapper{height:420px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}
.screenshot-carousel .img_wrapper a{display:contents;flex:1}
.screenshot-carousel .img_wrapper img{max-width:calc(100% - 20px);max-height:calc(100% - 20px);-webkit-box-shadow:0 10px 13px rgba(31,45,62,.35);box-shadow:0 10px 13px rgba(31,45,62,.35);border-radius:5px}
.screenshot-carousel .carousel-indicators li{width:8px;height:8px;border:0;border-radius:10px;transition:.3s}
.screenshot-carousel .carousel-indicators .active{width:20px;height:8px;border-radius:10px}
.carousel-control-next, .carousel-control-prev{opacity:0;width:60px;transition:all .3s}
.carousel-control-prev{transform:translateX(-50px)}
.carousel-control-next{transform:translateX(50px)}
.screenshot-carousel .carousel-control-prev:before,.screenshot-carousel .carousel-control-next:before{content:'';position:absolute;width:40px;height:40px;top:calc(50% - 20px);left:calc(50% - 20px);border-radius:20px;z-index:-1;background-color:rgba(0, 0, 0, 0.2)}
.screenshot-carousel:hover .carousel-control-next,.screenshot-carousel:hover .carousel-control-prev{opacity:.5;transform:translateX(0)}
.screenshot-carousel .carousel-control-next:hover,.screenshot-carousel .carousel-control-prev:hover{opacity:.9}
.screenshot-carousel .carousel-control-next:focus,.screenshot-carousel .carousel-control-prev:focus{opacity:.9}

/*--------------------------------------------------------------
## footer style
--------------------------------------------------------------*/
footer.main-footer{padding:20px 30px;margin-top:0px}
#footer-tools{position:fixed;bottom:20px;right:20px;display:flex;z-index:999;}
#footer-tools .btn{color:#777;background:#eee;width:40px;height:40px;font-size:1rem;text-align:center;line-height:40px;padding:unset;display:block;border:unset}
#footer-tools .go-up{display:none}
#footer-tools .btn:hover{color:#444}
#footer-tools [data-v-db6ccf64][data-v-41ba7e2c],#footer-tools [data-v-db6ccf64][data-v-6d083e75]{top:unset!important;bottom:0!important;right:44px!important}
#footer-tools .s-sticker-tmp{position:absolute!important;font-size:12px!important;top:-6px;left:18px;transform:scale(.82);padding:1px 5px;background:#f1404b;color:#ffffff!important;border-radius:50px;padding:1px 5px!important}
.friendlink a{position:relative;display:inline-block;margin:.25rem .5rem .25rem .25rem}
.friendlink a:before{content:'\2022';display:inline-block;position:relative;margin-right:5px}
@media (max-width:767.98px){footer.main-footer .footer-text{text-align:center;float:none}
#footer-tools{bottom:15px;right:10px}
}


/*--------------------------------------------------------------
## bootstrap custom style
--------------------------------------------------------------*/
.btn.focus,.btn:focus{outline:0;box-shadow:none}
.tooltip-inner img{margin:.25rem 0}
.tooltip-inner p{color:#fff}
.modal-backdrop{z-index:1089!important;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:rgba(0,0,0,.5)}
.modal-backdrop.show{opacity:1}
.modal{z-index:1090}
.modal-content,.modal-header,.modal-footer{border:0}
.btn:not(.go-up){border-radius:3px;white-space:normal;font-size:.875rem}
.carousel-blog li{width:10px;height:10px;border:0;border-radius:10px}
.carousel-blog{margin:10px;top:0;bottom:auto;left:unset}
.card,.block{background:#fff;border-width:0;margin-bottom:1rem;box-shadow:0px 0px 20px -5px rgba(158,158,158,.2);transition:background-color .3s}
.input-group-text{border:1px solid #e9ebef;background-color:#e9ebef}
.badge-danger{background-color:#F1404B}
.form-control{font-size:.875rem;color:#6d6e74;border:1px solid #f1f3f6;background-color:#f1f3f6}
.form-control:focus{border:1px solid #f1f3f6;background-color:#f1f3f6;box-shadow:none}
.form-control::-webkit-input-placeholder{color:#888a8f;opacity:1}
.form-control::-moz-placeholder{color:#888a8f;opacity:1}
.form-control:-ms-input-placeholder{color:#888a8f;opacity:1}
.form-control::-ms-input-placeholder{color:#888a8f;opacity:1}
.form-control::placeholder{color:#888a8f;opacity:1}
.form-control:disabled,.form-control[readonly]{background-color:#f1f3f6;opacity:1;color:#0d131b}
.btn-danger{color:#fff;background-color:#f1404b;border-color:#f1404b}
.btn-danger:hover{color:#fff;background-color:#14171b;border-color:#14171b}
.btn-danger:focus,.btn-danger.focus{color:#fff;background-color:#f1404b;border-color:#f1404b;box-shadow:none}
.btn-danger.disabled,.btn-danger:disabled{color:#fff;background-color:#f1404b;border-color:#f1404b}
.btn-danger:not(:disabled):not(.disabled):active,.btn-danger:not(:disabled):not(.disabled).active,.show>.btn-danger.dropdown-toggle{color:#fff;background-color:#f1404b;border-color:#f1404b}
.btn-danger:not(:disabled):not(.disabled):active:focus,.btn-danger:not(:disabled):not(.disabled).active:focus,.show>.btn-danger.dropdown-toggle:focus{box-shadow:none}
.btn-dark{color:#fff;background-color:#14171b;border-color:#14171b}
.btn-dark:hover{color:#fff;background-color:#f1404b;border-color:#f1404b}
.btn-dark:focus,.btn-dark.focus{color:#fff;background-color:#000;border-color:#000;box-shadow:none}
.btn-dark.disabled,.btn-dark:disabled{color:#fff;background-color:#222831;border-color:#222831}
.btn-dark:not(:disabled):not(.disabled):active,.btn-dark:not(:disabled):not(.disabled).active,.show>.btn-dark.dropdown-toggle{color:#fff;background-color:#000;border-color:#000}
.btn-dark:not(:disabled):not(.disabled):active:focus,.btn-dark:not(:disabled):not(.disabled).active:focus,.show>.btn-dark.dropdown-toggle:focus{box-shadow:none}
.btn-outline-danger{color:#f1404b;border-color:#f1404b}
.btn-outline-danger:hover{color:#fff;border-color:#f1404b;background-color:#f1404b}
.text-muted a{color:#6c757d}
.text-muted a:hover{color:#5c656d}
.custom-switch .custom-control-label::before{height:1.125rem;width:2rem;border-radius:.57rem;background-color:transparent}
.custom-switch .custom-control-label::after{width:calc(1.125rem - 4px);height:calc(1.125rem - 4px)}
.custom-control-input:not(:disabled):active~.custom-control-label::before{background-color:rgba(241,64,76,.15);border-color:rgba(241,64,76,.15)}
.custom-control-input:focus~.custom-control-label::before{box-shadow:0 0 0 .2rem rgba(241,64,76,.25)}
.custom-control-input:focus:not(:checked)~.custom-control-label::before{border-color:#f1404b}
.custom-switch .custom-control-input:checked~.custom-control-label::after{-webkit-transform:translateX(.85rem);transform:translateX(.85rem)}
.custom-control-input:checked~.custom-control-label::before{border-color:#f1404b;background-color:#f1404b}
.transparent{background:transparent!important;border-color:transparent!important;box-shadow:unset!important}
.dropdown-menu{border:unset;box-shadow:0 5px 20px 0px rgba(0,0,0,.15)}
.dropdown-item:hover{background-color:rgba(136,136,136,.1)}
.dropdown-item:active,.dropdown-item:focus{color:#333;background-color:rgba(136,136,136,.2)}
.dropdown-divider{border-color:rgba(136,136,136,.2);}
.carousel-vertical .carousel-inner .carousel-item-next.carousel-item-left,
.carousel-vertical .carousel-inner .carousel-item-prev.carousel-item-right{-webkit-transform:translateY(0);transform:translateY(0)}
.carousel-vertical .carousel-inner .active.carousel-item-left,
.carousel-vertical .carousel-inner .carousel-item-prev{-webkit-transform:translateY(-100%);transform:translateY(-100%)}
.carousel-vertical .carousel-inner .active.carousel-item-right,
.carousel-vertical .carousel-inner .carousel-item-next{-webkit-transform:translateY(100%);transform:translateY(100%)}
@media (min-width:992px){
.col-lg-5a{-ms-flex:0 0 20%;flex:0 0 20%;max-width:20%}
}
@media (min-width:1200px){
.col-xl-5a{flex:0 0 20%;max-width:20%}
.col-xl-6a{-ms-flex:0 0 16.666667%;flex:0 0 16.666667%;max-width:16.666667%}
.col-xl-7a{flex:0 0 14.285714%;max-width:14.285714%}
.col-xl-8a{flex:0 0 12.5%;max-width:12.5%}
}
@media (min-width:1400px){ 
.container-lg{max-width:1340px}
}
@media (min-width:1680px){
.d-xxl-block{display:block!important}
.col-xxl-auto{-ms-flex:0 0 auto;flex:0 0 auto;width:auto;max-width:100%}
.col-xxl-1{-ms-flex:0 0 8.333333%;flex:0 0 8.333333%;max-width:8.333333%}
.col-xxl-2{-ms-flex:0 0 16.666667%;flex:0 0 16.666667%;max-width:16.666667%}
.col-xxl-3{-ms-flex:0 0 25%;flex:0 0 25%;max-width:25%}
.col-xxl-4{-ms-flex:0 0 33.333333%;flex:0 0 33.333333%;max-width:33.333333%}
.col-xxl-5{-ms-flex:0 0 41.666667%;flex:0 0 41.666667%;max-width:41.666667%}
.col-xxl-6{-ms-flex:0 0 50%;flex:0 0 50%;max-width:50%}
.col-xxl-7{-ms-flex:0 0 58.333333%;flex:0 0 58.333333%;max-width:58.333333%}
.col-xxl-8{-ms-flex:0 0 66.666667%;flex:0 0 66.666667%;max-width:66.666667%}
.col-xxl-9{-ms-flex:0 0 75%;flex:0 0 75%;max-width:75%}
.col-xxl-10{-ms-flex:0 0 83.333333%;flex:0 0 83.333333%;max-width:83.333333%}
.col-xxl-11{-ms-flex:0 0 91.666667%;flex:0 0 91.666667%;max-width:91.666667%}
.col-xxl-12{-ms-flex:0 0 100%;flex:0 0 100%;max-width:100%}
.col-xxl-5a{flex:0 0 20%;max-width:20%}
.col-xxl-6a{-ms-flex:0 0 16.666667%;flex:0 0 16.666667%;max-width:16.666667%}
.col-xxl-7a{flex:0 0 14.285714%;max-width:14.285714%}
.col-xxl-8a{flex:0 0 12.5%;max-width:12.5%}
.col-xxl-10a{flex:0 0 10%;max-width:10%}
.mx-xxl-n5{margin-left:-5rem!important;margin-right:-5rem!important}
.container-lg{max-width:1400px}
}
.size-50{width:50px;height:50px}
.size-70{width:70px;height:70px}
/*--------------------------------------------------------------
## Grid
--------------------------------------------------------------*/
.row-lg{margin-left:-1rem;margin-right:-1rem}
.row-lg [class*="col-"],.row-lg .col{padding-left:1rem;padding-right:1rem}
.row-md{margin-left:-.75rem;margin-right:-.75rem}
.row-md [class*="col-"],.row-md .col{padding-left:.75rem;padding-right:.75rem}
.row-sm{margin-left:-.5rem!important;margin-right:-.5rem!important}
.row-sm [class*="col-"],.row-sm .col{padding-left:.5rem!important;padding-right:.5rem!important}
.row-xs{margin-left:-.25rem!important;margin-right:-.25rem!important}
.row-xs [class*="col-"],.row-xs .col{padding-left:.25rem!important;padding-right:.25rem!important}
.row-xs .card,.row-xs .block{margin-bottom:.5rem!important}
@media (min-width:768px) and (max-width:991.98px){.row{margin-right:-.75rem;margin-left:-.75rem}
.row.no-gutters{margin-right:0rem;margin-left:0rem}
}
@media (min-width:768px) and (max-width:991.98px){.row-md{margin-left:-.5rem;margin-right:-.5rem}
.row-md [class*="col-"],.row-md .col{padding-left:.5rem;padding-right:.5rem}
}
@media (max-width:991.98px){.padding{padding:1.5rem}
.row-lg{margin-left:-.5rem;margin-right:-.5rem}
.row-lg [class*="col-"],.row-lg .col{padding-left:.5rem;padding-right:.5rem}
}
@media (max-width:767.98px){.padding{padding:1rem}
.container{padding-right:.625rem;padding-left:.625rem}
.row{margin-right:-0.625rem;margin-left:-0.625rem}
.row>.col,.row>[class*="col-"]{padding-right:.625rem;padding-left:.625rem}
.row-md{margin-left:-.5rem;margin-right:-.5rem}
.row-md [class*="col-"],.row-md .col{padding-left:.5rem;padding-right:.5rem}
.no-gutters{margin-right:0;margin-left:0}
.no-gutters>.col,.no-gutters>[class*="col-"]{padding-right:0;padding-left:0}
}

/* load style */
#loading,#load-loading,.load-loading{-webkit-box-pack:center;justify-content:center;-webkit-box-align:center;align-items:center;display:-webkit-box;display:flex;position:fixed;top:0;left:0;width:100%;height:100%;z-index:9999999;background:#fff;-webkit-transition:ease-in-out .5s;transition:ease-in-out .5s}
.load-loading{position:absolute;background:transparent}
.load-loading .bg{position:absolute;width:100%;height:100%;background:#000;opacity:.2}
#load-loading{opacity:0}
#loading.close{opacity:0;visibility:hidden}
.io-black-mode #loading,.io-black-mode #load-loading{background:#111;}

/*--------------------------------------------------------------
## search style
--------------------------------------------------------------*/
#search{max-width:800px;position:relative}
#search form{position:relative}
#search-text{z-index:inherit;padding:9pt;height:50px;font-size:1pc;border:0;border-radius:3px;background-color:#fff;transition:.3s}
#search button{position:absolute;top:0;right:0;background:#313437;border:0;width:60px;height:36px;margin:7px 9pt 0;line-height:36px;border-radius:3px}
#search button:hover{background:#000;cursor:pointer}
#search button i{color:#fff;font-size:18px}
#search .search-select{height:50px;cursor:pointer;border:none;background-color:#fff;transition:.3s}
#search .input-group-prepend:not(.d-none)+.search-key{border-top-left-radius:0;border-bottom-left-radius:0}
.search-group{display:none;padding-left:75px}
.search-group-modal{display:none;padding-left:75px}
.s-current .search-type{padding-left:0;display:block}
.s-current{display:block}
#search-list{position:relative}
#search-list-modal{position:relative}
.s-type{position:absolute;top:0;left:0;z-index:23;width:75px}
.s-type:hover{height:auto}
.s-type>span{display:block;height:31px;width:75px}
.s-type-list{display:none;position:absolute;top:31px;padding:9pt 0;width:70px;background:#fff;border-radius:5px;box-shadow:0 9px 20px rgba(0,0,0,.16)}
.s-type-list:before{position:absolute;top:-1pc;left:20px;content:'';display:block;width:0;height:0;border:10px solid transparent;border-bottom-color:#fff}
.s-type-list label{display:block;font-size:15px;text-align:center;font-weight:normal;margin-bottom:0;padding:2px 0;cursor:pointer;transition:.3s}
.s-type-list label:hover{background:rgba(136,136,136,.1)}
.s-type-list .tile-lg{color:#fff;width:3pc;height:3pc;font-size:1.25rem;line-height:3rem;border-radius:.3rem;display:block;margin:auto}
.s-type:hover .s-type-list{display:block}
.type-text{position:absolute;left:0;width:75px;padding-left:9pt;font-size:1pc;line-height:31px}
.type-text:after{content:"\e793";font-family:"iconfont";font-size:12px;margin:0 0 0 10px}
.search-type{white-space:nowrap;margin:0}.search-type label{margin:0}
.search-type li{display:inline-block}
.search-type li label{display:inline-block;padding:0 11px;font-size:14px;line-height:31px;border-radius:3px 3px 0 0;cursor:pointer}
.search-type li.menu-item a{display:inline-block;font-size:14px;line-height:31px;border-radius:3px 3px 0 0}
.search-type input:checked+label,.search-type input:hover+label{background-color:#fff}
.set-check{margin-top:3px;font-size:9pt}.set-check label{margin-left:3px}
.set-check input,.set-check label{opacity:0;transition:all .3s ease}
.search-type li{list-style:none;display:inline-block}
.search-type{overflow:auto}
.search-smart-tips{position:absolute;z-index:20;width:100%;overflow:hidden}
.search-smart-tips ul{padding:10px 0;margin:0}
.search-smart-tips ul li{line-height:30px;font-size:14px;padding:0px 25px;cursor:pointer;list-style:none;transition:.3s}
.search-smart-tips ul li:hover,.search-smart-tips ul li.current{background-color:rgba(130,130,130,.5)}
@media screen and (max-width:767.98px){#search{margin:25px auto 15px}
.s-type-list label{padding:5px 0}
.search-list{height:30px;overflow-y:hidden;overflow-x:scroll;white-space:nowrap}
}
.search-modal #m_search-text{z-index:inherit;padding:9pt;height:50px;font-size:1pc;border:0;border-radius:3px;background-color:rgba(126, 126, 126, 0.1)}
.search-modal #search .search-select,.search-modal .search-type input:checked+label,.search-modal .search-type input:hover+label{background-color:rgba(126, 126, 126, 0.1)}
.search-modal li.menu-item{display:inline-block!important;margin:4px}
.search-modal li.menu-item a{font-size:12px;padding:.375rem .875rem;background:rgba(136,136,136,.1);border-radius:50px}
.btn-search{position:relative;background-color:rgba(150,150,150,.16);transition:.2s ease-out}
.btn-search:hover,.btn-search.current{color:#fff!important;background-color:#f1404b;box-shadow:0 5px 20px -3px rgba(249,100,90,.6)}
.btn-search.current:after{content:"";position:absolute;bottom:-17px;left:0;right:0;margin:0 auto;width:0;border:10px solid transparent;border-top-color:#f1404b}

/*--------------------------------------------------------------
## custom style
--------------------------------------------------------------*/
.text-break-all{word-break:break-all}
.posts-nav{font-size:14px;color:rgba(0,0,0,.44);padding:10px 0;text-align:center}
.posts-nav .page-numbers{position:relative;min-width:35px;height:35px;padding:0 5px;line-height:35px;display:inline-block;background-color:rgba(150,150,150,.16);margin:0 2px;border-radius:.2rem;-webkit-transition:.2s ease-out;transition:.2s ease-out}
.posts-nav .page-numbers.current,.posts-nav .page-numbers:not(.dots):hover{color:#fff!important;background-color:#f1404b;box-shadow:0px 5px 20px -3px rgba(249,100,90,.6)}
.posts-nav .page-numbers.dots{border-color:rgba(0,0,0,0)}
.ajax-loading{background:rgba(250,250,250,.7)!important}
#comments-navi>span,#comments-navi>a,.page-nav span:not(.current){position:relative;display:inline-block;background-color:rgba(150, 150, 150, 0.16);min-width:35px;height:35px;padding:0 5px;line-height:35px;margin:.2rem .1rem;font-size:0.75rem;border-radius:0.2rem;-webkit-transition:.2s ease-out;transition:.2s ease-out}
.page-nav span.all{width:auto;padding:0 10px}
#comments-navi>a:hover,#comments-navi>.current,.page-nav>a:hover span,.page-nav>.current span{color:#fff!important;background-color:#f1404b;box-shadow:0px 5px 20px -3px rgba(249, 100, 90, .6)}
.overflow-x-auto{overflow-x:auto;overflow-y:unset}
.overflow-y-auto{overflow-y:auto;overflow-x:unset}
.slider-menu-father{border-radius:100px;overflow:hidden}
.media-title-bg:before{content:"";position:absolute;left:0;height:80px;right:0;bottom:0;background-image:linear-gradient(to top,rgba(0,0,0,.5) 20%,transparent 80%)}
.external{padding-right:5px}
.external:after{content:"\e66c";font-family:"iconfont";font-size:75%}
.nav-login-user{position: relative;}
.nav-login-user .user-ico img{width:28px;height:28px;border-radius:100%}
.nav-login-user .header-user{position: absolute;opacity: 0;width: 400px;right: -30px;visibility: hidden;transition:.3s;}
.nav-login-user:hover .header-user{opacity:1;visibility: visible;}
.user-card-top img{width:46px;height:46px;border-radius:100%}
.nav-login-user .card-top{padding-bottom:10px;border-bottom:1px dashed #cecece}
.fancybox-slide--iframe .fancybox-content{max-width:1280px;margin:0}
.fancybox-slide--iframe.fancybox-slide{padding:44px 0}
.fancybox-toolbar{right:calc(50% - 22px);top:22px}
.big-header-banner .page-header{color:#fff;background:rgba(255,255,255,0);box-shadow:none;transition:color .3s,background-color .3s}
.big-header-banner.header-bg .page-header{color:initial;backdrop-filter: blur(10px);background:rgba(255,255,255,.7)}
.big-header-banner:not(.header-bg) .page-header .navbar-nav>li>a,.big-header-banner:not(.header-bg) .navbar-menu a:not(.dropdown-item){color:#eee;}
.big-header-banner:not(.header-bg) .header-mini-btn path{stroke:#eee}
.big-header-banner:not(.header-bg) .page-header .navbar-nav>li>a:hover,.big-header-banner:not(.header-bg) .navbar-menu a:not(.dropdown-item):hover{color:#fff;}
.big-header-banner:not(.header-bg) .header-mini-btn label:hover path{stroke:#fff}
.header-big{position:relative;margin-top:-75px;padding-top:30px;padding-bottom:60px}
.header-big.bg-gradual:before{content: "";position: absolute;left: 0;height: 80px;right: 0;bottom: 0;background-image: linear-gradient(to top,#f9f9f9 0%,transparent 80%);transition:.3s}
.header-big.css-img,.header-big.css-bing{background-color:#1b1d1f;background-size:cover;background-position:cover}
.header-big.canvas-fx{background-color:#1b1d1f}
.post-top{padding-bottom:10px}
.header-big.no-bg{padding-bottom:10px}
.header-big.css-color{background-size:400%;background-position:0% 100%;-webkit-animation:gradient 7.5s ease-in-out infinite;animation:gradient 7.5s ease-in-out infinite}
@-webkit-keyframes gradient{50%{background-position:100% 0}
}
@keyframes gradient{50%{background-position:100% 0}
}
.header-big .s-search,.header-big #bulletin_box{margin:0 15px}
.header-big #bulletin_box{background:transparent;box-shadow:none}
.header-big:not(.no-bg) #bulletin_box a{color:#fff}
.header-big .bulletin-big #bulletin_box{max-width:600px;margin:0 auto}
.header-big:not(.no-bg) #bulletin_box .card-body{color:#fff!important;background:rgba(0,0,0,.3);border-radius:50px}
.header-big .bulletin-close{opacity:.1;transition:opacity .3s}
.header-big .bulletin-big #bulletin_box:hover .bulletin-close{opacity:.7}
.header-big .search-group{padding:0;margin:0 auto}
.header-big #search-list{text-align:center}
.header-big .search-smart-tips{width:unset;left:20px;right:20px}
.header-big .search-type input:checked+label,.header-big .search-type input:hover+label{position:relative;background:transparent!important}
.header-big .search-type input:checked+label:before{content:'';border-width:8px 8px 0px 8px;border-style:solid;border-color:rgba(0,0,0,0.6) transparent transparent;position:absolute;left:50%;top:0;margin-left:-8px}
.header-big .search-type li label{padding-top:5px}
.header-big .s-type-list{position:relative!important;display:inline-table;overflow:auto;white-space:nowrap;text-align:center;position:inherit;top:inherit;padding:inherit;width:none;background:none!important;border-radius:inherit;box-shadow:none!important}
.header-big:not(.no-bg) .s-type-list{color:#fff}
.s-type:hover .s-type-list.big{display:inline-table}
.header-big .s-type-list .anchor{background:#888;border-radius:100px;width:10px;height:4px;bottom:5px;-webkit-transition:.25s;transition:.25s}
.header-big:not(.no-bg) .s-type-list .anchor{background:#fff}
.header-big .s-type-list label:hover{background:none}
.header-big .s-type-list:before{display:none}
.header-big .s-type{position:inherit;top:inherit;left:inherit;z-index:inherit;width:auto}
.header-big .s-type-list label{position:relative;display:inline-block}
.header-big .s-type-list label span{display:block;padding:10px 10px}
.header-big .s-type-list label:not(.active)::after{content:'';height:4px;width:4px;border-radius:2px;position:absolute;left:50%;bottom:5px;margin-left:-2px;background-color:rgba(255,255,255,0);transition:.3s}
.header-big .s-type-list label:not(.active):hover::after{background-color:#fff}
.header-big .s-type-list label:not(.active),.header-big:not(.no-bg) .search-type label{opacity:.5;transition:opacity .3s}
.header-big .s-type-list label:not(.active):hover,.header-big:not(.no-bg) .search-type label:hover{opacity:1}
.header-big .search-type input:checked+label{opacity:1}
.header-big #search-text{border-radius:50px;color:#fff;border:1px solid rgba(255,255,255,.05);padding:9px 20px;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background-color:rgba(0,0,0,0.6)!important}
.header-big #search button{position:absolute;top:0;right:0;background:transparent;border:0!important;width:unset;height:unset;margin:0 9px;line-height:50px;border-radius:3px}
.header-big #search button:active,.header-big #search button:focus{box-shadow:none;outline:none;border:0!important}
/*.header-big .search-smart-tips{top:100px}*/
.header-big .canvas-bg{position:absolute;top:0;width:100%;height:100%;border-width:0}
.header-big:not(.no-bg) .text-muted,.header-big:not(.no-bg) .search-type .menu-item a,.header-big:not(.no-bg) .big-title .h1{color:#fff!important} 
.header-big.no-bg #search-text{color:#fff;border:none;background-color:rgba(0,0,0,0.2)!important}
.header-big.no-bg .search-type input:checked+label:before{border-color:rgba(0,0,0,0.2) transparent transparent}
.header-big .search-type li.menu-item{padding:5px 10px 0px 10px}
@media screen and (min-width:768px){.header-big{padding-top:80px;padding-bottom:110px}
.post-top{padding-bottom:20px}
.header-big.no-bg{padding-bottom:20px}
.header-big .search-type li label,.header-big .search-type li.menu-item{padding:5px 20px}
.header-big .s-type-list label span{padding:10px 20px}
}
@media screen and (min-width:992px){.header-big .s-search{margin:0}
}
.io-black-mode .header-big.bg-gradual:before{background-image: linear-gradient(to top,#1b1d1f 0%,transparent 80%)} 
.io-black-mode .big-header-banner .page-header {background:transparent;box-shadow:none}
.io-black-mode .big-header-banner.header-bg .page-header{color:#fff;background:#2c2e2f;box-shadow:0 0 25px 5px rgba(10,10,10,.25)}
/* --- carousel --- */
.media-content{position:absolute;top:0;bottom:0;left:0;right:0;border:0;border-radius:inherit;background-size:cover;background-repeat:no-repeat;background-position:50% 50%;background-color:rgba(120,120,120,.1)}
.carousel-item.home-item:after{content:"";display:block;padding-top:300px}
.carousel-caption{ bottom:0;padding-top:10px;padding-bottom:10px}
.media{position:relative;display:block;overflow:hidden;padding:0;-ms-flex-negative:0;flex-shrink:0;border-top-left-radius:inherit;border-top-right-radius:inherit}
.media:after{content:'';display:block;padding-top:100%}
.media-title{position:absolute;bottom:0;left:0;right:0;margin:5px 10px;color:#fff}
.new-news{height:300px}
.new-news .news_title{background-color:rgba(0,0,0,.1);padding:8px 10px;border-radius:.20rem .20rem 0 0}
.new-news ul{overflow:auto;padding:0 20px;margin-bottom:10px}
.new-news ul li{position:relative;padding:0 10px 10px 20px;border-left:2px solid rgba(136,136,136,.2)}
.new-news ul li i{font-size:12px;top:3px;color:#888;position:absolute;padding:5px;left:-12px;background:#fff;transition:background-color .3s} 
.new-news .news_all_btn{position:absolute;right:4px;padding:8px 10px;transition:.3s}
.new-news .news_all_btn:hover{right:0px}
@media screen and (max-width:767.98px){.new-news{height:200px}
.big-title .h1{font-size:30px}
}
@media screen and (max-width:575.98px){.carousel-item.home-item:after{padding-top:250px}
.new-news{height:150px}
}
@media screen and (max-width:454.98px){.carousel-item.home-item:after{padding-top:180px}
.new-news{height:100px}
}
.overlay{width:100%;height:100%;background-color:rgba(0,0,0,.66);position:absolute;opacity:.22;top:0;left:0;-webkit-transition:opacity 0.3s ease-in-out;-moz-transition:opacity 0.3s ease-in-out;-o-transition:opacity 0.3s ease-in-out;transition:opacity 0.3s ease-in-out}
.article-list:after{padding-top:146px}
.media-21x9:after{padding-top:42.857143%}
.media-16x9:after{padding-top:56.25%}
.media-4x3:after{padding-top:75%}
.media-2x3:after{padding-top:150%}
.media-3x2:after{padding-top:66.66666%}
.media-3x4:after{padding-top:133.33333%}
.media-1x2:after{padding-top:200%}
.media-2x1:after{padding-top:50%}
.media-3x1:after{padding-top:33%}
.media-4x1:after{padding-top:25%}
.media-5x1:after{padding-top:20%}
.media-5x7:after{padding-top:141%}
.media-1-4:after{padding-top:25vh;min-height:10rem}
.media-1-3:after{padding-top:33vh;min-height:12.5rem}
.media-1-2:after{padding-top:50vh;min-height:15rem}
@media (max-width:767.98px){.post-cover .media-5x1:after{padding-top:30%}
}
@media (min-width:1200px){
.media-xl-16x9:after{padding-top:56.25%!important}
.media-xl-3x2:after{padding-top:66.66666%!important}
}
/* --- content --- */
blockquote{position:relative;padding:.9375rem 0 .9375rem 1.75rem;margin:1.5rem 0;border-left:5px solid rgba(136,136,136,.2);background-color:rgba(136,136,136,.1)}
blockquote p:last-of-type{margin:0;padding:0}
.tags i{color:#f1404b;margin-right:10px;vertical-align:middle}
.tags a{display:inline-block;margin:0 6px 12px 0;padding:3px 10px;color:#6d6d6d;font-size:10px;transition:.3s;background:rgba(148,149,158,.15);border-radius:15px}
.color-0{color:#F1404B!important;background-color:rgba(249,100,90,.15)!important}
.color-1,.color-5{color:#20a0ff!important;background-color:rgba(32,158,255,.15)!important}
.color-2,.color-6{color:#39c408!important;background-color:rgba(58,196,8,.15)!important}
.color-3,.color-7{color:#ff8400!important;background-color:rgba(255,131,0,.15)!important}
.color-4,.color-8{color:#837adc!important;background-color:rgba(132,122,220,.15)!important}
.color-d{color:#888}
.card.new-news li{list-style:none}
.tags a:focus,.tags a:hover{background-color:#232425!important;text-decoration:none;color:#fff!important}
pre{position:relative;overflow-y:auto;border:0;color:#777;border-radius:3px;padding:.75rem;margin:1.5rem 0;white-space:pre-wrap;word-wrap:break-word;background-color:rgba(0,0,0,.04)}
table{width:100%}
th,td{border:1px solid rgba(136,136,136,.3);padding:8px 12px}
.single-top-area{background:#fff}
.near-navigation{display:flex;background:#fff}
.near-navigation .nav{display:flex;flex-direction:column;justify-content:center;min-height:80px;padding:0 20px;position:relative;width:50%;word-break:break-word}
.near-navigation .next{align-items:flex-end;text-align:right;border-radius:0 5px 5px 0;overflow:hidden}
.near-navigation .previous{border-radius:5px 0 0 5px;overflow:hidden}
.near-navigation span{font-size:14px;font-weight:500;position:relative;text-transform:uppercase;z-index:2}
.near-navigation .near-title{font-size:12px;margin:5px 0 0;position:relative;z-index:2}
.near-navigation img{height:100%;left:0;-o-object-fit:cover;object-fit:cover;position:absolute;top:0;width:100%}
.near-navigation .none span,.near-navigation .none .near-title{color:#999}
.panel-header h1{line-height:1.5}
.panel-body p,.site-content p,.post-content figure{margin-bottom:1.25rem;font-size:1rem;line-height:2;word-wrap:break-word}
.panel-body h1,.panel-body h2,.panel-body h3,.panel-body h4,.panel-body h5,.panel-body h6{margin-bottom:1rem}
.panel-body h1{font-size:1.5rem}
.panel-body h2{font-size:1.25rem;border-left:3px solid #f1404b;padding:.25rem 0 .25rem 1.25rem;margin-left:-1.438rem}
.panel-body h3{font-size:1.125rem;border-left:3px solid #f1404b;padding-left:1.25rem;margin-left:-1.438rem}
.panel-body h4{font-size:1rem;padding-bottom:.5rem;border-bottom:1px solid rgba(136,136,136,.2)}
.panel-body h5,.panel-body h6{font-size:1rem}
.panel-body ul,.panel-body ol{font-size:.875rem}
.panel-body ul li,.panel-body ol li{margin:.5rem 0}
.transparent .panel-body h2,.transparent .panel-body h3{position:relative;margin-left:0}
@media (max-width:767.98px){blockquote{padding-left:1.25rem}
.panel-body p,.panel-body figure{font-size:0.9375rem}
.panel-header h3,.panel-header .h3{font-size:1.5rem}
}

/* --- site-body --- */
.siteico{background:#e6e8ed;position:relative;overflow:hidden;box-shadow:0 30px 20px -20px rgba(0,0,0,.15);border-radius:10px;transition:background-color .3s}
.siteico:before{content:'';display:block;padding-top:100%}
.tool-actions{position:absolute;left:0;bottom:0;right:0;padding:.625rem 0}
.tool-actions .btn-light{color:#424446!important;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background-color:rgba(250,250,250,.5)!important;border-color:transparent!important}
.tool-actions .btn-light:hover{background-color:rgba(255,255,255,.8)!important}
.customize-menu .btn-edit{color:#ddd;line-height:24px;background:#f1404b;padding:0 10px;margin:5px 0;border-radius:50px;white-space:nowrap}
.customize-menu .btn-edit:hover{color:#fff}
.blur{-moz-filter:blur(15px);-ms-filter:blur(15px);-webkit-filter:blur(15px);filter:blur(15px);filter:progid:DXImageTransform.Microsoft.Blur(PixelRadius=15,MakeShadow=false)}
.blur-layer{top:0;left:0;right:0;bottom:0;position:absolute;width:inherit;height:inherit;opacity:.2}
.img-cover{max-width:90%!important;min-width:72px!important;max-height:90%!important;position:absolute;top:0;bottom:0;left:0;right:0;margin:auto;border-radius:6px}
@keyframes rotate{0%{transform:rotate(0deg)}to{transform:rotate(360deg)}}
.site-body .btn{border-radius:6px;padding:7px 16px;background-color:rgba(138,138,138,.15);transition:.3s}
.site-body .btn:hover{color:#fff;background:#202224}
.site-body .btn:active{box-shadow:unset}
.site-body .site-go .btn{margin-bottom:10px}
.site-go-url{position:relative}
.site-go-url .spare-url{position:absolute;opacity:0;visibility:hidden;margin-top:0;transition:.3s}
.site-go-url .spare-url a{white-space:nowrap}
.site-go-url:hover .spare-url{opacity:1;visibility:visible;margin-top:-10px}
.card-post .flex-avatar{padding:2px!important}
.card-post .media,.card-book .media{box-shadow:0 0 20px -5px rgba(20,20,20,.2);-webkit-transition:all 0.3s ease;-moz-transition:all 0.3s ease;-o-transition:all 0.3s ease;transition:all 0.3s ease}
.card-post:hover .media,.card-book:hover .media{transform:translateY(-6px);-webkit-transform:translateY(-6px);-moz-transform:translateY(-6px);box-shadow:0 26px 40px -24px rgba(27,28,31,.3);-webkit-box-shadow:0 26px 40px -24px rgba(27,28,31,.3);-moz-box-shadow:0 26px 40px -24px rgba(27,28,31,.3)}
.card-post .list-content{padding-bottom:.5rem}
.btn-arrow{position:relative}
.btn-arrow span{padding-right:1.25rem;display:inline-block}
.btn-arrow i{position:absolute;font-size:18px;width:.8em;right:1rem;top:50%;opacity:.6;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%);-webkit-transition:all 200ms ease-out;-o-transition:all 200ms ease-out;transition:all 200ms ease-out;will-change:right,opacity}
.btn-arrow:hover i,.btn-arrow:focus i{opacity:1;right:.6rem}
.btn-cat{color:#fff!important;background:#f1404b;font-size:12px;padding:2px 5px;border-radius:4px;transition:.3s}
.btn-cat:hover{color:#fff;background:#212224}
.btn-icon{text-align:center;width:3.125rem;height:3.125rem;padding:0!important;position:relative}
.btn-icon span{position:absolute;width:100%;height:100%;top:0;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}
.country-piece{position:absolute;color:#fff;top:10px;right:10px;transition:.3s;padding:0 5px;background:#f1404b;border-radius:20px}
@media screen and (max-width:575.98px){.siteico:before{padding-top:60%}
.card-post .list-content{padding-top:.5rem}
}

/* --- down-body --- */
.down-content{margin-top:120px}
.down-content .card{border:0}
.down-content .card .card-header{position:relative;border-radius:6px;padding:.3rem;margin:0 15px;margin-top:-30px;border:0;background:linear-gradient(60deg,#f1404b,#f1417c);box-shadow:0 5px 20px 0 rgba(0,0,0,.2),0 13px 24px -11px rgba(176,39,62,.6)}
.down-content .card-header-img{margin-top:-100px;padding:8px;width:120px;height:120px;background:#ffffff;transition:background-color .3s}
.down-content .card-signup{border-radius:6px;margin:0 15px;box-shadow:0 16px 24px 2px rgba(0,0,0,.1),0 6px 30px 5px rgba(0,0,0,.08),0 8px 10px -5px rgba(0,0,0,.15)}
.down-content .down-info li{margin:5px 0}
.btn-danger{color:#fff;background-color:#f1404b;border-color:transparent}
.btn-danger.focus,.btn-danger:focus,.btn-danger:hover{color:#fff;box-shadow:0 0 0 0 transparent }
.down-content .apd-right{position:relative;background:rgba(34,34,34,.05);width:100%;height:100%;border-radius:6px;border:2px dashed rgba(0,0,0,.1)}
.down-content .statement{position:relative;margin:0 -1.25rem;border-bottom:2px dashed #eee;border-top:2px dashed #eee;background:rgba(0,0,0,.01);transition:.3s}
.down-content .statement:before{content:"";position:absolute;width:8px;height:8px;top:5px;left:5px;border-radius:50%;background:#eee;box-shadow:0 10px #eee,0 20px #eee;transition:.3s}
.down-content .card-nav-tabs:before{content:"\e604";position:absolute;bottom:-3px;right:5px;font-size:20px;color:rgba(129,129,129,.3);font-family:"iconfont"}
@media screen and (max-width:767.98px){.down-content .card-signup{border-radius:6px;margin:0 -10px}
.down-content{margin-top:90px}
.down-content .card .card-header{margin-left:5px;margin-right:5px}
.down-content .card-header-img{margin-top:-70px;padding:6px;width:90px;height:90px}
}

/* --- book-body --- */
.book-info ul{list-style:none;margin:0;padding:0}
.book-info .info-title{display:inline-block;width:70px;text-align:justify;text-justify:distribute-all-lines;-moz-text-align-last:justify;text-align-last:justify}

/* --- comment --- */
.v-avatar{width:32px;height:32px}
.profile img{width:48px;height:48px;border-radius:50%}
.children .profile img{width:40px;height:40px;border-radius:50%}
.comment-list .comment-text{border-bottom:1px solid rgba(135,135,135,.15);padding-bottom:1rem;margin-bottom:1rem}
.comment-list .children .comment_body,.comment-list .children .comment-respond{margin-left:3.875rem;padding:0 0 1rem}
.comment-list>.comment>.children .comment:last-child .comment-text{border-bottom:1px solid rgba(135,135,135,.15);padding-bottom:1rem;margin-bottom:0}
.comment-list>.comment:last-child .comment-text{border:0;padding-bottom:0}
.not-comment,.commclose{background-color:rgba(136,161,199,.3)!important}
.comment-list .is-author{opacity:.5;cursor:pointer;transition:opacity .3s}
.comment-list .rank{position:relative;color:#fff;cursor:pointer;font-size:.75rem;padding:1px 8px;margin:0 4px;background:#f1404b;border-radius:6px;transition:opacity .3s}
.comment-list .rank:after{content:"";position:absolute;width:8px;height:4px;top:50%;margin-top:-2px;left:-4px;border-radius:2px;background:#ffae00}
.comment-list .rank:before{content:"";position:absolute;width:5px;height:5px;top:50%;margin-top:-2.5px;left:0px;border-radius:3px;background:#fff}
.comment-list .rank:hover{color:#fff}
.comment-list .is-author:hover{opacity:1}
.comment-form .comment-form-cookies-consent label{display:inline}
input[type="radio"] + label,input[type="checkbox"] + label{font-weight:400}
.form-submit{text-align:right}
.comment-list,.comment-list .children{list-style:none;margin:0;padding:0}
.comment-body{color:#333;margin-bottom:4em}
.comment-body{margin-left:65px}
.comment-author{margin-bottom:.4em;position:relative;z-index:2}
.comment-author .avatar{height:50px;left:-65px;position:absolute;width:50px}
.comment-metadata{color:#767676;font-weight:800;letter-spacing:.1818em;text-transform:uppercase}
.comment-reply-link{font-weight:800;position:relative}
.btn-home{color:#fff;background:#f1404b;padding:10px 30px;transition:.3s}
.btn-home:hover{color:#fff;background:#333}
.iconfont{display:inline-block;font-size:inherit;font-variant:normal;text-rendering:auto;line-height:1}
.icon-lg{font-size:1.33333em;line-height:.75em;vertical-align:-.0667em}
.icon-2x{font-size:2em}
.icon-3x{font-size:3em}
.icon-4x{font-size:4em}
.icon-5x{font-size:5em}
.icon-8x{font-size:8em}
.icon-fw{text-align:center;width:1.25em}
.icon-spin{-webkit-animation:icon-spin 2s infinite linear;animation:icon-spin 2s infinite linear}
.hot-card .hot-body{height:200px}
.hot-card .hot-heat{white-space:nowrap}
.hot-rank{width:18px;border-radius:4px;background:rgba(124, 124, 124, 0.3);display:inline-block}
.hot-rank-1{color:#fff;background:#f1404b}
.hot-rank-2{color:#fff;background:#c56831}
.hot-rank-3{color:#fff;background:#b89e2c}
.hot-platform span{margin:0 5px;white-space:nowrap}
.hot-platform{border-radius:4px;display:inline-table;background:rgba(77, 77, 77, 0.3)}
.background-fx{position:absolute;left:60px;right:0;height:100vh;top:0;overflow:hidden;opacity:1;z-index:-1}
.shape-01{position:absolute;top:11%;right:42%;-webkit-animation:animationFramesTwo 13s linear infinite;animation:animationFramesTwo 13s linear infinite}
.shape-02{position:absolute;top:27%;left:17%;-webkit-animation:animationFramesFour 25s linear infinite alternate;animation:animationFramesFour 25s linear infinite alternate}
.shape-03{position:absolute;top:30%;left:50%;-webkit-animation:animationFramesThree 35s linear infinite alternate;animation:animationFramesThree 35s linear infinite alternate}
.shape-04{position:absolute;top:40%;right:23%;-webkit-animation:animationFramesFour 20s linear infinite alternate;animation:animationFramesFour 20s linear infinite alternate}
.shape-05{position:absolute;bottom:62%;right:28%;-webkit-animation:animationFramesOne 15s linear infinite;animation:animationFramesOne 15s linear infinite}
.shape-06{position:absolute;bottom:73%;left:38%;-webkit-animation:animationFramesFour 20s linear infinite alternate;animation:animationFramesFour 20s linear infinite alternate}
.shape-07{position:absolute;left:14%;bottom:54%;-webkit-animation:animationFramesOne 17s linear infinite;animation:animationFramesOne 17s linear infinite}
.shape-08{position:absolute;left:14%;top:60%;-webkit-animation:animationFramesOne 20s linear infinite alternate;animation:animationFramesOne 20s linear infinite alternate}
.shape-09{position:absolute;top:22%;left:41%;-webkit-animation:animationFramesOne 15s linear infinite;animation:animationFramesOne 15s linear infinite}
.shape-10{position:absolute;top:8%;right:6%;-webkit-animation:animationFramesOne 15s linear infinite;animation:animationFramesOne 15s linear infinite}
.shape-11{position:absolute;top:10%;right:8%;-webkit-animation:animationFramesOne 12s linear infinite;animation:animationFramesOne 12s linear infinite}
@keyframes animationFramesOne{0%{transform:translate(0) rotate(0deg)}
20%{transform:translate(73px,-1px) rotate(36deg)}
40%{transform:translate(141px,72px) rotate(72deg)}
60%{transform:translate(83px,122px) rotate(108deg)}
80%{transform:translate(-40px,72px) rotate(144deg)}
to{transform:translate(0) rotate(0deg)}
}@-webkit-keyframes animationFramesOne{0%{-webkit-transform:translate(0) rotate(0deg)}
20%{-webkit-transform:translate(73px,-1px) rotate(36deg)}
40%{-webkit-transform:translate(141px,72px) rotate(72deg)}
60%{-webkit-transform:translate(83px,122px) rotate(108deg)}
80%{-webkit-transform:translate(-40px,72px) rotate(144deg)}
to{-webkit-transform:translate(0) rotate(0deg)}
}@keyframes animationFramesTwo{0%{transform:translate(0) rotate(0deg) scale(1)}
20%{transform:translate(73px,-1px) rotate(36deg) scale(.9)}
40%{transform:translate(141px,72px) rotate(72deg) scale(1)}
60%{transform:translate(83px,122px) rotate(108deg) scale(1.2)}
80%{transform:translate(-40px,72px) rotate(144deg) scale(1.1)}
to{transform:translate(0) rotate(0deg) scale(1)}
}@-webkit-keyframes animationFramesTwo{0%{-webkit-transform:translate(0) rotate(0deg) scale(1)}
20%{-webkit-transform:translate(73px,-1px) rotate(36deg) scale(.9)}
40%{-webkit-transform:translate(141px,72px) rotate(72deg) scale(1)}
60%{-webkit-transform:translate(83px,122px) rotate(108deg) scale(1.2)}
80%{-webkit-transform:translate(-40px,72px) rotate(144deg) scale(1.1)}
to{-webkit-transform:translate(0) rotate(0deg) scale(1)}
}@keyframes animationFramesThree{0%{transform:translate(165px,-179px)}
to{transform:translate(-346px,617px)}
}@-webkit-keyframes animationFramesThree{0%{-webkit-transform:translate(165px,-179px)}
to{-webkit-transform:translate(-346px,617px)}
}@keyframes animationFramesFour{0%{transform:translate(-300px,151px) rotate(0deg)}
to{transform:translate(251px,-200px) rotate(180deg)}
}@-webkit-keyframes animationFramesFour{0%{-webkit-transform:translate(-300px,151px) rotate(0deg)}
to{-webkit-transform:translate(251px,-200px) rotate(180deg)}
}
@media screen and (max-width:1199.98px){
.hot-search{min-width:1164px}
}
@media screen and (max-width:575.98px){
.shape-10{right:12%;width:100px}
.shape-11{right:14%;width:100px}
.comment-list .children .comment_body,.comment-list .children .comment-respond{margin-left:1.875rem}
}

@-webkit-keyframes icon-spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}
100%{-webkit-transform:rotate(359deg);transform:rotate(359deg)}
}@keyframes icon-spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}
100%{-webkit-transform:rotate(359deg);transform:rotate(359deg)}
}
/* --- users --- */
.user-bg{height:269px;margin-top:-75px;position:relative;background-color:rgba(5,15,25,.2);background-repeat:no-repeat;background-size:cover;background-position:center center}
.user-bg::before{content:"";position:absolute;left:0;height:240px;right:0;bottom:0;background-image:linear-gradient(to top,#000000 0%,transparent 60%);transition:.3s}
.user-area .avatar-body{display:inline-block;min-height:112px;min-width:112px}
.user-area img{max-width:100%}
.bg-white,.border-light{transition:.3s}
.border-2w{border-width:2px!important}
.user-area .user-menu{margin-top:-169px}
.user-area .card-menu{margin-top:60px}
.user-area .author-avatar{margin-top:-75px}
.user-area ul{list-style:none;padding:0;margin:0;width:100%}
.user-nav li .user-tab{padding:8px 0;display:block;border-radius:4px}
.user-nav li .user-tab.active{background-color:rgba(136,136,136,.1)}
.user-area .local-avatar-label svg{display:none;width:38px;height:38px;position:absolute;top:0;left:0;color:#fff;background:rgba(0,0,0,.2);border-radius:50%;transform-origin:50% 50% 0;fill:rgba(255,255,255,.65);cursor:pointer}
.user-area .local-avatar-label:hover svg{display:block}
.user-area .avatar-picker{display:inline-block;width:38px;height:38px;position:absolute;left:0;top:0;cursor:pointer}
.user-area .avatar-picker input,.user-area .cover-picker input{border:1px solid #eee;border-radius:5px}
.user-area .user-cover{position:relative}
.user-area .io-cover-picker{display:inline-block;width:25px;height:25px;position:absolute;right:2px;top:2px;cursor:pointer}
.user-area .cover-picker::after{content:'\e634';color:#fff;font-family:"iconfont";position:absolute;font-size:25px;line-height:25px;opacity:.6}
.user-area .cover-picker:hover:after{opacity:1}
.user-area .author-meta-r{margin-top:-110px;}
.empty-content{font-size: 169px;opacity:.3;}
.terms-placeholder{border:2px dashed #4ecdff;background-color:transparent;min-height:42px;}
.admin-sites .overflow-auto{max-height:300px}
.manage-sites .sites-card,.sites-placeholder,.admin-sites .sites-card{padding:6px 8px;background-color:#eee}
.manage-sites .sites-card:not(.add){cursor:move;transition:box-shadow .3s;}
.sites-placeholder{border:2px dashed #4ecdff;background-color:transparent}
.manage-sites .sites-card:not(.add):hover,.admin-sites .sites-card:hover{box-shadow:0 6px 10px rgba(0, 0, 0,.15);}
.sites-hover .nav-link{background-color:rgba(136,136,136,.15);}
input.nav-link{display:block;width:100%;color:#495057;background-color:transparent;background-clip:padding-box;border:1px solid #ced4da;border-radius:0.25rem;transition:border-color 0.15s ease-in-out,box-shadow 0.15s ease-in-out}
input.nav-link::-ms-expand{background-color:transparent;border:0}
input.nav-link:-moz-focusring{color:transparent;text-shadow:0 0 0 #495057}
input.nav-link:focus{color:#495057;background-color:transparent;border-color:#80bdff;outline:0;box-shadow:0 0 0 0.2rem rgba(0,123,255,0.25)}
input.nav-link::-webkit-input-placeholder{color:#6c757d;opacity:1}
input.nav-link::-moz-placeholder{color:#6c757d;opacity:1}
input.nav-link:-ms-input-placeholder{color:#6c757d;opacity:1}
input.nav-link::-ms-input-placeholder{color:#6c757d;opacity:1}
input.nav-link::placeholder{color:#6c757d;opacity:1}
input.nav-link:disabled,input.nav-link[readonly]{background-color:transparent;opacity:1}
.sites-card .dropdown-menu{min-width:320px}
.nav-pills.sites-nav .nav-link{border:1px solid rgba(136,136,136,.1);}
.nav-pills.sites-nav .nav-link.active,.nav-pills.sites-nav .show>.nav-link{background-color:#f1404b;box-shadow:0px 5px 20px -3px rgba(241,64,75,.6)}
.sites-li{position:relative}
.sites-li .sites-setting{position:absolute;top:9px;right:5px;opacity:0;transition:opacity .3s;}
.sites-li.admin-li .sites-setting{top:15px}
.tab-pane .sites-li .sites-setting{top:6px}
.sites-li:hover .sites-setting{opacity:1}
.sites-li .active:not(.d-none)+.change-terms-name+.sites-setting a{color:#fff;}
.notifications-list li{position:relative}
.notifications-list li .notifi-time{position:absolute;top:-18px;left:0}
.drag-add-bookmarks{border:2px dashed rgb(235, 34, 34);opacity:.8}
#add-new-sites button.close{text-shadow:none}
#add-new-sites button.close:focus{outline:none}
@media screen and (min-width:768px){.sites-card .dropdown-menu{min-width:450px}
.admin-sites .overflow-auto{max-height:750px}
}
/* --- tougao --- */
.show_ico{float:left;width:64px;height:64px;line-height:60px;padding:2px;cursor:pointer}
.show_ico .remove-ico{position:absolute;cursor:pointer;top:1px;right:1px;font-size:20px;z-index:1;display:block;width:24px;height:24px;line-height:24px;background:rgba(34,34,34,.5);border-radius:50%}
.wechat .show_ico .remove-ico{font-size:25px;width:29px;height:29px;line-height:29px}
.show_ico .remove-ico:hover{color:#f1404b}
.upload_img{position:relative;display:table;color:white;background-color:rgba(136,136,136,.1);overflow:hidden;cursor:pointer;text-align:center;vertical-align:center;border-radius:5px;transition:.3s} 
.wechat .show_ico{width:138px;height:138px;line-height:128px}
.upload_img:not(.disabled):hover{background:#222324}
.upload_img input{position:absolute;cursor:pointer;opacity:0;left:0;right:0;top:0;bottom:0}
.postform{margin:5px}
.tougao-form img{max-width:100%} 
#alert_placeholder .alert{display:inline-block}
#tougaocategorg{padding-left:8px}
.slider_menu[sliderTab]{position:relative;display:inline-block}
.slider_menu[sliderTab]>.menu{position:relative;white-space:nowrap;margin:0;text-align:center;display:inline-block;background:rgba(0,0,0,.1);border-radius:100px;padding:5px}
.slider_menu[sliderTab] .anchor{background:#f1404b;border-radius:100px;width:60px;height:40px;opacity:0;-webkit-transition:.25s;transition:.25s}
.slider_menu[sliderTab]>.menu>li{display:inline-block;cursor:pointer}
.slider_menu[sliderTab]>.menu>li{display:inline-block;cursor:pointer}
.slider_menu[sliderTab]>.menu>li.next,.slider_menu[sliderTab]>.menu>li.prev,.slider_menu[sliderTab]>.menu>li>.sub-menu{display:none}
.slider_menu[sliderTab]>.menu>li>a{display:block;text-decoration:none;position:relative;color:#888;height:40px;line-height:40px;text-align:center;font-size:14px;padding:0 16px;-webkit-transition:.25s;transition:.25s}
.slider_menu[sliderTab]>.menu>li>a:hover{color:#fff}
.slider_menu[sliderTab]>.menu>li>a.active{color:#fff}
.slider_menu[sliderTab] ul:hover li:not(.hover) a.active{color:#888!important;/*background:#fff;border-radius:100px*/}
.slider_menu.mini_tab[sliderTab]>.menu>li>a{height:28px;line-height:28px;padding:0 12px}
.slider_menu.mini_tab[sliderTab]>.menu{padding:3px}
.nav-pills.menu .nav-link.active,.nav-pills.menu .show>.nav-link{background:none} 
.checkbox-custom{position:relative;padding:0 15px 0 25px;margin-bottom:7px;margin-top:0;display:inline-block}
.checkbox-custom input[type="checkbox"]{opacity:0;position:absolute;cursor:pointer;z-index:2;margin:-6px 0 0 0;top:50%;left:3px}
.checkbox-custom span:before{content:'';position:absolute;top:50%;left:0;margin-top:-9px;width:19px;height:18px;display:inline-block;border-radius:2px;border:1px solid rgba(132, 132, 132, 0.5)}
.checkbox-custom input[type="checkbox"]:checked +span:after{content:"";position:absolute;display:inline-block;top:50%;left:5px;margin-top:-5px;font-size:11px;line-height:1;width:10px;height:10px;border-radius:2px;background:#ff4242}
/*提示*/
.io-bomb,.io-bomb-overlay{width:100%;height:100%;top:0;left:0}
.io-bomb{position:fixed;display:-webkit-flex;display:flex;-webkit-align-items:center;align-items:center;-webkit-justify-content:center;justify-content:center;pointer-events:none}
.io-bomb{z-index:1099}
.io-bomb.tips-success i{color:#28a745}
.io-bomb.tips-error i{color:#ffc107}
.io-bomb-overlay{position:absolute;background:rgba(10, 10, 10, .4);opacity:0;-webkit-transition:opacity .3s;transition:opacity .3s;-webkit-backface-visibility:hidden;backface-visibility:hidden;-webkit-transition-duration:0.3s;transition-duration:0.3s}
.io-bomb-open .io-bomb-overlay{opacity:1;pointer-events:auto}
@supports (-webkit-backdrop-filter:blur(10px)) or (backdrop-filter:blur(10px)){
.io-bomb-open .io-bomb-overlay{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}}
.io-bomb-body{position:relative;opacity:0;max-width:340px;width:100%}
.io-bomb-open .io-bomb-body{pointer-events:auto}
.io-bomb-xl .io-bomb-body{width:100%;max-width:790px}
.io-bomb-lg .io-bomb-body{width:100%;max-width:790px}
.io-bomb-md .io-bomb-body{max-width:340px;width:100%}
.io-bomb-sm .io-bomb-body{max-width:300px;width:auto}
.io-bomb-reward .io-bomb-body{max-width:270px}
.io-bomb-content{position:relative;padding:1.25rem;overflow:hidden;border-radius:6px;box-shadow:0 10px 50px -5px rgba(6, 39, 67, 0.12);transition:.3s}
.io-bomb-xl .io-bomb-content{padding:0;border:0}
.io-bomb-lg .io-bomb-content{padding:0;border:0;border-radius:0}
.io-bomb-sm .io-bomb-content{padding:2rem;padding:1.75rem 2.5rem}
.io-bomb-nopd .io-bomb-content{padding:0;border:0}
@media (max-width:991.98px){
.io-bomb-xl .io-bomb-body{height:100%}
.io-bomb-xl .io-bomb-body .io-bomb-content{box-shadow:none;border-radius:0;height:100%}
}
.io-bomb-content .text-success i{color:#28a745}
.io-bomb-content .text-danger i{color:#ffc107}
.btn-close-bomb i{cursor:pointer;font-size:1.75rem;color:#fff;transition:.3s}
.btn-close-bomb i:hover{color:#F1404B}
.io-bomb.io-bomb-open .io-bomb-body,.io-bomb.io-bomb-close .io-bomb-body{-webkit-animation-duration:.3s;animation-duration:.3s;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards}
.io-bomb.io-bomb-open .io-bomb-body{-webkit-animation-name:tips-open;animation-name:tips-open}
.io-bomb.io-bomb-close .io-bomb-body{-webkit-animation-name:tips-close;animation-name:tips-close}
@-webkit-keyframes tips-open{
0%{opacity:0;-webkit-transform:translate3d(0, 50px, 0)}
100%{opacity:1;-webkit-transform:translate3d(0, 0, 0)}}
@keyframes tips-open{
0%{opacity:0;-webkit-transform:translate3d(0, 50px, 0);transform:translate3d(0, 50px, 0)}
100%{opacity:1;-webkit-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0)}}
@-webkit-keyframes tips-close{
0%{opacity:1;-webkit-transform:translate3d(0, 0, 0)}
100%{opacity:0;-webkit-transform:translate3d(0, 50px, 0)}}
@keyframes tips-close{
0%{opacity:1;-webkit-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0)}
100%{opacity:0;-webkit-transform:translate3d(0, 50px, 0);transform:translate3d(0, 50px, 0)}}
/*--------------------------------------------------------------
## sidebar style
--------------------------------------------------------------*/
.sidebar .card-header{position:relative;padding:.75rem 1.25rem;margin-bottom:0;background-color:transparent;border-bottom:none}
.sidebar .card-header:after{content:"";background-color:#f1404b;left:1.25rem;width:50px;height:2px;bottom:-2px;position:absolute;-webkit-transition:0.5s;-moz-transition:0.5s;-ms-transition:0.5s;-o-transition:0.5s;transition:0.5s}
.sidebar .card:hover .card-header:after{width:80px}
.sidebar .tags a{display:inline-block;margin:4px 2px;font-size:12px;background:rgba(148,149,158,.15);border-radius:5px}
.sidebar .card .searchform{flex:1 1 auto;padding:1.25rem}
.sidebar .card .searchform>div{position:relative;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-ms-flex-align:stretch;align-items:stretch;width:100%}
.sidebar .card .searchform input[type='text']{position:relative;display:block;-ms-flex:1 1 auto;flex:1 1 auto;width:1%;height:calc(1.5em + .75rem + 2px);padding:.375rem .75rem;margin-bottom:0;font-size:.875rem;font-weight:400;line-height:1.5;color:#6d6e74;background-color:#f1f3f6;background-clip:padding-box;border:1px solid #f1f3f6;border-radius:.25rem;transition:border-color .3s,background-color .3s;border-top-right-radius:0;border-bottom-right-radius:0}
.sidebar .card .searchform input[type="submit"]{margin-left:-1px;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;padding:.375rem 1.25rem;margin-bottom:0;font-size:.875rem;font-weight:400;line-height:1.5;color:#fff;text-align:center;white-space:nowrap;border:1px solid #f1404b;background-color:#f1404b;border-radius:.25rem;border-top-left-radius:0;border-bottom-left-radius:0;transition:.3s}
.sidebar .card .searchform input[type="submit"]:hover{border:1px solid #14171b;background-color:#14171b}
.sidebar .url-card .card{background:#f1f3f6;box-shadow:unset;border:1px solid #f1f3f6;transition:.3s}
.sidebar .url-card .card:hover{transform:unset;box-shadow:unset;border:1px solid #f1404b!important}
.sidebar .url-card.down a:after,.sidebar .url-card.wechat a:after{font-size:27px;bottom:-6px;right:5px}
.widget_author_meta{position:relative}
.widget-author-avatar{position:absolute;left:50%;top:0;-webkit-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}
.widget-author-meta{margin-top:2rem}
.widget-author-cover{position:relative;border-radius:3px 3px 0 0}
.widget-author-cover+.widget-author-meta{margin-top:2rem}
.widget-author-cover .widget-author-avatar{top:auto;bottom:0;-webkit-transform:translate(-50%,50%);-ms-transform:translate(-50%,50%);transform:translate(-50%,50%)}
.flex-avatar{position:relative;line-height:1;white-space:nowrap;font-weight:bold;border-radius:100%;padding:5px;display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;-ms-flex-negative:0;flex-shrink:0;background:#fff;transition:background-color .3s}
.flex-avatar img{border-radius:inherit}
.badge-outline-primary{color:#f1404b;border:#f1404b solid 1px}
.list-post>div{display:-ms-flexbox;display:flex}
.list-post>div>.list-item{-ms-flex-item-align:stretch;align-self:stretch;-ms-flex:1 1 auto;flex:1 1 auto}
.list{padding-left:0;padding-right:0}
.list-item{position:relative;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;min-width:0;word-wrap:break-word}
.list-content{padding:1rem 0;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex:1 1 auto;flex:1 1 auto;-ms-flex-pack:center;justify-content:center}
.list-item.block .list-content{padding:1rem}
.list-body{-ms-flex:1 1 auto;flex:1 1 auto}
.list-footer{margin-top:0.5rem}
.list-title{font-size:0.875rem;line-height:1.4285714286;display:block;color:inherit}
.list-title .badge{position:relative;top:-2px;font-size:.75rem;margin:0 .25rem 0 0}
.list-bulletin .list-item{position:relative;padding:0 10px 10px 20px;border-left:2px solid rgba(136,136,136,.2)}
.list-bulletin .list-item>i{font-size:12px;top:8px;color:#888;position:absolute;padding:5px;left:-12px;background:#fff;transition:background-color .3s} 
.bulletin-card{transform:translateY(0);transition:.3s}
.bulletin-card:hover{transform:translateY(-6px)}
@media (max-width:767.98px){.list-title{font-size:0.9375rem!important}
.list-title .badge{padding:.2em;margin:0 .25rem 0 0}
}
.list-grid .list-item{-ms-flex-direction:row;flex-direction:row}
.list-grid.list-grid-padding .list-item{padding:1.25rem}
.list-grid.list-grid-padding .list-content{padding:0 0 0 1rem}
.list-grid .list-item .media:first-child{border-radius:inherit}
.list-grid .list-item .media:last-child{border-radius:inherit}
.list-grid .flex-row-reverse .media:first-child{border-radius:0;border-top-right-radius:inherit;border-bottom-right-radius:inherit}
@media (max-width:767.98px){.list-grid.list-grid-padding .list-item{padding:.675rem .75rem;margin-bottom:.75rem}
.list-grid.list-grid-padding .list-item .media-3x2:after{padding-top:75%}
.list-grid.list-grid-padding .list-content{padding:0 0 0 .75rem}
}
/*--------------------------------------------------------------
## grey style
--------------------------------------------------------------*/
.io-grey-mode .sidebar-logo{background:#fff}
.io-grey-mode .page-header{box-shadow:none}
.io-grey-mode .sidebar-nav-inner{background:#fff}
.io-grey-mode .border-color{border-color:transparent!important}
.io-grey-mode .sidebar-nav .flex-bottom a,.io-grey-mode .sidebar-menu-inner a{color:#515C6B}
.io-grey-mode .sidebar-item ul{background:none}
.io-grey-mode .sidebar-show,.io-grey-mode .sidebar-item>a:hover{color:#f1404b;background:none}
.io-grey-mode .sidebar-popup div{background:#dadbdd}
.io-grey-mode .sidebar-popup::before{border-color:transparent #dadbdd transparent}
.io-grey-mode .sidebar-nav,.io-grey-mode .sidebar-popup.sidebar-menu-inner ul li{background:#f0f2f4}
.io-grey-mode .sidebar-item li>a:hover,.io-grey-mode .sidebar-popup>div>ul>li>a:hover{color:#f1404b;background:none}

/*--------------------------------------------------------------
## black style
--------------------------------------------------------------*/
.io-black-mode{background-color:#1b1d1f}
.io-black-mode .logo-light{display:none!important}
.io-black-mode .logo-dark{display:initial!important}
.io-black-mode .btn-move{color:#989da1!important}
.io-black-mode #add-new-sites button.close{color:#989da1}
.io-black-mode .bg-light,.io-black-mode .manage-sites .sites-card,.io-black-mode .admin-sites .sites-card{background:#363738!important}
.io-black-mode .border-light{border-color:#363738!important}
.io-black-mode .bg-white{background:#2c2e2f!important}
.io-black-mode .sidebar-nav .top-menu .sub-menu{background-color:rgba(3,4,6,.1)}
.io-black-mode,.io-black-mode a:not(.btn),.io-black-mode .button>a{color:#c6c9cf}
.io-black-mode p,.io-black-mode input.nav-link{color:#bbb}
.io-black-mode .ajax-loading{background:rgba(27,29,31,.7)!important}
.io-black-mode .card,.io-black-mode .block{box-shadow:none}
.io-black-mode .tpwthwidt .text_235ileA,.io-black-mode .tpwthwidt .title_2Cea4o9{color:#bbb}
.io-black-mode .text-gray,.io-black-mode .comment-body{color:#888}
.io-black-mode .down-content .card-header-img,.io-black-mode .modal-content,.io-black-mode .flex-avatar,.io-black-mode .card,.io-black-mode .near-navigation,.io-black-mode .single-top-area,.io-black-mode .new-news,.io-black-mode .new-news ul li i,.io-black-mode .list-bulletin .list-item>i,.io-black-mode #search-text,.io-black-mode .search-type input:checked+label,.io-black-mode .search-type input:hover+label{background-color:#2c2e2f}
.io-black-mode .admin-sites .card{background-color:#363738}
.io-black-mode .s-type-list{background-color:#1f2123;box-shadow:0 9px 20px rgba(0,0,0,.3)}
.io-black-mode #search .search-select{background-color:#2c2e2f;border-color:#2c2e2f}
.io-black-mode .s-type-list:before{border-bottom-color:#1f2123}
.io-black-mode .url-card .url-body:hover,.io-black-mode .card-app.default:hover .media{box-shadow:0 26px 40px -24px rgba(2,4,6,.3);-webkit-box-shadow:0 26px 40px -24px rgba(2,4,6,.3);-moz-box-shadow:0 26px 40px -24px rgba(2,4,6,.3)}
.io-black-mode .page-header{background:#2c2e2f;box-shadow:0 0 25px 5px rgba(10,10,10,.25)}
.io-black-mode textarea,.io-black-mode .form-control,.io-black-mode .sidebar .card .searchform input[type='text']{color:#aaa;background:#363738;border:1px solid #363738}
.io-black-mode .sidebar .url-card .card{background:#363738;border-color:#363738}
.io-black-mode .site-body .btn{color:#ddd}
.io-black-mode .siteico{background:#222}
.io-black-mode .search-modal #search .search-select,.io-black-mode .search-modal .search-type input:checked+label,.io-black-mode .search-modal .search-type input:hover+label{background-color:#363738;border:none}
.io-black-mode .posts-nav{color:rgba(221,221,221,.2)}
.io-black-mode .input-group-text{color:#ddd;background:#26282a;border-color:#26282a}
.io-black-mode #footer-tools .btn{color:#aaa;background:#363738}
.io-black-mode #footer-tools .btn:hover{color:#fff}
.io-black-mode a:not(.btn):hover{color:#fff}
.io-black-mode .down-content .statement:before{background:#1b1d1f;box-shadow:0 10px #1b1d1f,0 20px #1b1d1f}
.io-black-mode .down-content .statement{border-color:#1b1d1f;background:rgba(0,0,0,.1)}
.io-black-mode .navbar-collapse ul li ul,.io-black-mode .dropdown-menu{background:#3D4044;box-shadow:0 10px 30px -10px rgba(0,0,0,.5)}
.io-black-mode .down-content .card-signup{box-shadow:0 16px 24px 2px rgba(0,0,0,.14),0 6px 30px 5px rgba(0,0,0,.12),0 8px 10px -5px rgba(0,0,0,.2)}
.io-black-mode .btn-light{color:#b2b8be!important;background-color:#363738!important;border-color:transparent!important}
.io-black-mode .btn-light:hover{background-color:#313234!important}
.io-black-mode .tool-actions .btn-light{color:#b2b8be!important;background-color:rgba(24,25,26,.5)!important;border-color:transparent!important}
.io-black-mode .tool-actions .btn-light:hover{background-color:rgba(14,15,16,.8)!important}
.io-black-mode .background-fx{opacity:.3}
.io-black-mode .background-fx .shape-11{opacity:.5}
.io-black-mode .background-fx .shape-10{opacity:.1}
.io-black-mode .ioch-code-highlight{background-color:#151619;border:0}
.io-black-mode :not(pre) > code[class*="language-"],.io-black-mode pre[class*="language-"]{background-color:rgba(0,0,0,.15)}
.io-black-mode .ioch-code-highlight .io-btn-copy{border:1px solid rgba(255,255,255,.5)}
/*--------------------------------------------------------------
## webkit scrollbar style
--------------------------------------------------------------*/
@media only screen and (min-device-width:768px){
::-webkit-scrollbar-thumb{background-color:rgba(130,130,130,.1);-webkit-border-radius:4px;border-radius:4px}
::-webkit-scrollbar-thumb:hover{background-color:#f1404b;-webkit-border-radius:4px;border-radius:4px}
::-webkit-scrollbar{width:5px;height:5px} 
::-webkit-scrollbar-thumb:active{background-color:#f1404b;-webkit-border-radius:4px;border-radius:4px}
::-webkit-scrollbar-corner{background:rgba(0,0,0,0);border-radius:0 0 8px 0}
::-webkit-scrollbar-button{background-color:rgba(0,0,0,0);height:2px;width:2px}
}
/* 广告位样式 - 优化版（已删除文字广告，保留大小图广告）【已修复夜间切换抖动】 */
.unique-ad-outer-wrap {
  width: 100%;
  margin-top: 12px;
  margin-bottom: 14px;
}

.nad-container {
  width: 100%;
  max-width: 100vw;
  margin: 16px auto 10px auto;
  padding: 0 4px;
}
.nad-container.nad-large-zone {
  margin: 10px 0 8px 0;
  padding: 0;
}
.nad-small-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 6px;
  width: 100%;
  margin-bottom: 10px;
}
.nad-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 6px;
  width: 100%;
}

.nad-banner,
.nad-small-banner {
  position: relative;
  border-radius: 8px;
  overflow: hidden;
  cursor: pointer;
  background: #fff;
  /* 👇 固定高度、统一内边距、禁止动画导致抖动 */
  box-sizing: border-box;
  border: 1px solid transparent;
  box-shadow: none;
  transition: background-color 0.3s ease;
}
.nad-banner:hover,
.nad-small-banner:hover {
  transform: scale(1.02);
}
.nad-image {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
}

.nad-corner-icon {
  position: absolute;
  top: 0;
  right: 0;
  background: transparent;
  border: 1px solid rgba(136,136,136,0.2);
  color: #888;
  font-size: 9px;
  padding: 2px 4px;
  border-radius: 0 0 0 4px;
  z-index: 10;
  white-space: nowrap;
  pointer-events: none;
}

.jj-modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(50, 50, 50, 0.7);
  backdrop-filter: blur(6px);
  display: none;
  align-items: center;
  justify-content: center;
  z-index: 9999;
  overflow-y: auto;
}
.jj-modal-container {
  width: 92%;
  max-width: 600px;
  background: #f9f9f9;
  border: 1px solid #ddd;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 12px 40px rgba(0,0,0,0.3);
  animation: jjModalFadeIn 0.4s ease-out;
}
.jj-modal-scroll {
  max-height: 60vh;
  overflow-y: auto;
  padding: 15px;
  scrollbar-width: thin;
}
.jj-modal-scroll::-webkit-scrollbar { width: 6px; }
.jj-modal-scroll::-webkit-scrollbar-thumb { background: #999; border-radius: 3px; }
.jj-modal-scroll::-webkit-scrollbar-track { background: #eee; }

.jj-modal-header img {
  width: 100%;
  height: auto;
  display: block;
}
.jj-modal-content {
  color: #444;
}
.jj-modal-content h3 {
  font-size: 20px;
  margin-bottom: 16px;
  color: #333;
  text-align: center;
  font-weight: 60;
}
.jj-modal-content p {
  line-height: 1.6;
  margin-bottom: 8px;
  font-size: 14px;
}
.jj-modal-footer {
  padding: 10px 15px;
  background: #e9e9e9;
  border-top: 1px solid #ddd;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: center;
}
.jj-modal-btn {
  padding: 6px 12px;
  border: none;
  border-radius: 4px;
  background: #f1f3f6;
  color: #282a2d;
  cursor: pointer;
  font-size: 12px;
  transition: all 0.3s ease;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.jj-modal-btn:hover {
  background: #f1404b;
  color: #fff;
}
.jj-modal-close, .jj-modal-query {
  width: 120px;
  height: 40px;
  line-height: 40px;
  text-align: center;
  border: none;
  border-radius: 8px;
  cursor: pointer;
  font-size: 16px;
  transition: all 0.3s ease;
  text-decoration: none;
}
.jj-modal-close { background: #999; color: #fff; }
.jj-modal-close:hover { background: #777; }
.jj-modal-query { background: #555; color: #fff; }
.jj-modal-query:hover { background: #333; }

#jjNewYearModal .jj-modal-container {
  max-width: 600px;
  background: linear-gradient(135deg, #fff5f5 0%, #ffffff 100%);
  border: 4px solid #FFD700;
  box-shadow: 0 0 30px rgba(255,59,48,0.2);
  position: relative;
  border-radius: 16px;
}
#jjNewYearModal .jj-modal-container::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 8px;
  background: #D62400;
  z-index: 1;
  border-radius: 12px 12px 0 0;
}
#jjNewYearModal .jj-modal-header img {
  border-bottom: 4px solid #FFD700;
}
#jjNewYearModal .jj-modal-content::after {
  content: '2026';
  position: absolute;
  top: 10px;
  right: 10px;
  font-size: 60px;
  color: rgba(255,215,0,0.08);
  font-weight: 900;
  z-index: 0;
}
#jjNewYearModal .jj-modal-content h3 {
  color: #D62400;
  font-size: 24px;
  font-weight: 800;
  letter-spacing: 4px;
  text-shadow: 1px 1px 0 #FFD700;
}
#jjNewYearModal .jj-modal-footer {
  background: linear-gradient(135deg, #D62400, #B91C1C);
  border-top: 3px solid #FFD700;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
#jjNewYearModal .jj-modal-btn {
  height: 45px;
  line-height: 45px;
  font-size: 14px;
  font-weight: bold;
  border-radius: 10px;
}

@keyframes jjModalFadeIn {
  from { opacity: 0; transform: translateY(-20px) scale(0.98); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

@media (min-width: 768px) {
  .nad-small-grid { grid-template-columns: repeat(4, 1fr); gap: 8px; }
  .nad-grid { grid-template-columns: repeat(2, 1fr); gap: 8px; }
}

/* 深色模式 */
.io-black-mode .nad-banner,
.io-black-mode .nad-small-banner {
  background: #2c2e2f;
  border-color: #363738;
}
.io-black-mode .nad-corner-icon {
  background: transparent;
  border-color: rgba(255,255,255,0.15);
  color: #ccc;
}

.io-black-mode .jj-modal-overlay {
  background: rgba(0,0,0,.8);
}
.io-black-mode .jj-modal-container {
  background: #2c2e2f;
  border-color: #363738;
}
.io-black-mode .jj-modal-content h3,
.io-black-mode .jj-modal-content p {
  color: #c9cdd4;
}
.io-black-mode .jj-modal-footer {
  background: #363738;
  border-top-color: #444;
}
.io-black-mode .jj-modal-btn {
  background: #444;
  color: #fff;
}

.io-black-mode #jjNewYearModal .jj-modal-container {
  background: linear-gradient(135deg, #2c2e2f 0%, #363738 100%);
  border-color: #FF8C00;
}
.io-black-mode #jjNewYearModal .jj-modal-container::before {
  background: #A52A2A;
}
.io-black-mode #jjNewYearModal .jj-modal-content h3 {
  color: #FF8C00;
  text-shadow: 1px 1px 0 #363738;
}
.io-black-mode #jjNewYearModal .jj-modal-footer {
  background: linear-gradient(135deg, #A52A2A, #8B0000);
  border-top-color: #FF8C00;
}

/* 灰色模式 */
.io-grey-mode .nad-banner,
.io-grey-mode .nad-small-banner {
  border-color: transparent;
}
.io-grey-mode .nad-corner-icon {
  background: transparent;
  border-color: rgba(136,136,136,0.15);
  color:  #777;
}


/* 每日一言模块 - 电脑端隐藏+适配主站黑白模式 */
.quote-container {
    display: none; /* 电脑端默认隐藏 */
    width: 100%;
    max-width: 1200px;
    margin: 10px auto 0;
    padding: 0 15px;
    box-sizing: border-box;
}
/* 仅移动端（767px及以下）显示模块 */
@media (max-width: 767px) {
    .quote-container {
        display: block;
    }
    .header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-bottom: -2px;
    }
    .header-title, .time-display {
        font-weight: 500;
        background-color: #fff;
        display: inline-block;
        box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.06);
        border-radius: 8px 8px 0 0;
    }
    .header-title {
        font-size: 0.9rem;
        color: #555;
        padding: 4px 10px;
    }
    .time-display {
        font-size: 0.7rem;
        color: #888;
        padding: 4px 8px;
        border-radius: 0 8px 0 0;
    }
    .quote-box {
        padding: 12px 15px;
        background: #fff;
        border-radius: 0 0 12px 12px;
        box-shadow: 0 3px 10px rgba(0, 0, 0, 0.06);
        text-align: center;
    }
    .quote-text {
        margin: 0;
        color: #333;
        font-size: 0.85rem;
        line-height: 1.6;
    }
    /* 小屏移动端（320px及以下）适配 */
    @media (max-width: 320px) {
        .header-title { font-size: 0.8rem; padding: 3px 8px; }
        .time-display { font-size: 0.6rem; padding: 3px 6px; }
        .quote-box { padding: 10px 12px; }
        .quote-text { font-size: 0.8rem; }
    }
}

/* 主站夜间模式（io-black-mode）适配 - 仅移动端生效 */
.io-black-mode .quote-container .header-title,
.io-black-mode .quote-container .time-display,
.io-black-mode .quote-container .quote-box {
    background-color: #2c2e2f;
    box-shadow: none;
}
.io-black-mode .quote-container .header-title {
    color: #c6c9cf;
}
.io-black-mode .quote-container .time-display {
    color: #a0a0a0;
}
.io-black-mode .quote-container .quote-text {
    color: #c9cdd4;
}

/* 主站灰色模式（io-grey-mode）适配 - 仅移动端生效 */
.io-grey-mode .quote-container .header-title,
.io-grey-mode .quote-container .time-display,
.io-grey-mode .quote-container .quote-box {
    background-color: #fff;
    box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.06);
}
.io-grey-mode .quote-container .header-title {
    color: #515C6B;
}
.io-grey-mode .quote-container .time-display {
    color: #777;
}
.io-grey-mode .quote-container .quote-text {
    color: #333;
}
/* 短剧模块 - 适配主站黑白模式 */
.duanju-module * {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: 'Segoe UI', Roboto, sans-serif;
}
.duanju-list {
    display: flex;
    flex-wrap: wrap;
    gap: 18px;
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px 15px;
}
.duanju-card {
    text-decoration: none;
    width: calc(50% - 9px);
    display: block;
    transition: transform 0.25s ease, box-shadow 0.25s ease;
    border-radius: 10px;
    overflow: hidden;
}
.duanju-card.long-press-hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.12);
}
.duanju-img-box {
    width: 100%;
    aspect-ratio: 2/3;
    border-radius: 10px 10px 0 0;
    overflow: hidden;
    position: relative;
    cursor: pointer;
}
.duanju-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.3s ease;
}
.duanju-card:hover .duanju-img {
    transform: scale(1.03);
}
.duanju-desc {
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    padding: 15px;
    padding-top: 38px;
    background-color: rgba(15, 23, 42, 0.9);
    color: #fff;
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    pointer-events: auto;
}
.desc-tip {
    position: absolute;
    top: 8px;
    right: 8px;
    padding: 3px 10px;
    background-color: rgba(255, 255, 255, 0.25);
    color: #fff;
    font-size: 11px;
    font-weight: 500;
    border-radius: 6px;
    z-index: 1;
    pointer-events: none;
}
.desc-heading {
    font-size: 18px;
    font-weight: 600;
    color: #38bdf8;
    margin-bottom: 10px;
    padding-bottom: 6px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.desc-content {
    font-size: 14px;
    line-height: 1.6;
    color: #e0e7ff;
}
.duanju-title {
    padding: 12px 15px;
    background-color: #fff;
    color: #1e293b;
    font-size: 16px;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    border-radius: 0 0 10px 10px;
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.08);
    cursor: pointer;
    transition: background-color 0.2s ease;
}
.duanju-title:hover {
    background-color: #f8fafc;
}
.duanju-desc::-webkit-scrollbar {
    width: 5px;
}
.duanju-desc::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0.08);
    border-radius: 3px;
}
.duanju-desc::-webkit-scrollbar-thumb {
    background: #38bdf8;
    border-radius: 3px;
}
.duanju-desc::-webkit-scrollbar-thumb:hover {
    background: #0ea5e9;
}

/* 响应式适配 */
@media (min-width: 768px) {
    .duanju-card { width: calc(33.333% - 12px); }
}
@media (min-width: 1024px) {
    .duanju-card { width: calc(25% - 13.5px); }
    .duanju-img-box:hover .duanju-desc {
        display: block;
    }
    .duanju-card:hover {
        transform: translateY(-5px);
        box-shadow: 0 8px 16px rgba(0, 0, 0, 0.12);
    }
}

/* 主站夜间模式（io-black-mode）适配 */
.io-black-mode .duanju-title {
    background-color: #2c2e2f;
    color: #c6c9cf;
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.3);
}
.io-black-mode .duanju-title:hover {
    background-color: #363738;
}
.io-black-mode .duanju-desc {
    background-color: rgba(10, 14, 23, 0.95);
}
.io-black-mode .desc-tip {
    background-color: rgba(255, 255, 255, 0.15);
}
.io-black-mode .desc-heading {
    color: #7dd3fc;
    border-bottom-color: rgba(255, 255, 255, 0.05);
}
.io-black-mode .desc-content {
    color: #cbd5e1;
}
.io-black-mode .duanju-card.long-press-hover,
.io-black-mode .duanju-card:hover {
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.4);
}
.io-black-mode .duanju-desc::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0.05);
}

/* 主站灰色模式（io-grey-mode）适配 */
.io-grey-mode .duanju-title {
    background-color: #fff;
    color: #515C6B;
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.08);
}
.io-grey-mode .duanju-title:hover {
    background-color: #f0f2f4;
}
.io-grey-mode .duanju-desc {
    background-color: rgba(15, 23, 42, 0.9);
}
.io-grey-mode .desc-tip {
    background-color: rgba(255, 255, 255, 0.25);
}
.io-grey-mode .desc-heading {
    color: #38bdf8;
    border-bottom-color: rgba(255, 255, 255, 0.1);
}
.io-grey-mode .desc-content {
    color: #e0e7ff;
}
.io-grey-mode .duanju-card.long-press-hover,
.io-grey-mode .duanju-card:hover {
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.12);
}
.io-grey-mode .duanju-desc::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0.08);
}

/* 福利中心模块 - 适配主站黑白模式 | 美化增强版 */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

.welfare-container {
  width: 100%;
  margin: 15px 0;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}

/* 按钮列表 */
.welfare-btn-list {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  padding: 0 20px;
}

/* 福利按钮 - 美化增强 */
.welfare-btn {
  flex: 1;
  min-width: 110px;
  padding: 14px 10px;
  border: 1px solid rgba(136, 136, 136, 0.15);
  border-radius: 12px;
  background: linear-gradient(180deg, #ffffff 0%, #fafafa 100%);
  cursor: pointer;
  transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}

.welfare-btn-icon {
  width: 28px;
  height: 28px;
  line-height: 28px;
  text-align: center;
  border-radius: 50%;
  background: linear-gradient(135deg, #f1f3f6 0%, #e8ebf0 100%);
  color: #1d2129;
  font-size: 15px;
  font-weight: 600;
  transition: inherit;
}

.welfare-btn-text {
  color: #1d2129;
  font-size: 15px;
  font-weight: 500;
  transition: inherit;
}

/* 按钮hover/active效果 */
.welfare-btn:hover {
  border-color: #f1404b;
  background: linear-gradient(180deg, #fff5f5 0%, #fff0f0 100%);
  transform: translateY(-2px);
  box-shadow: 0 6px 16px rgba(241, 64, 75, 0.12);
}

.welfare-btn:active {
  transform: translateY(0);
  box-shadow: 0 2px 6px rgba(241, 64, 75, 0.08);
}

.welfare-btn:hover .welfare-btn-icon {
  background: linear-gradient(135deg, #f1404b 0%, #e63946 100%);
  color: #fff;
  transform: scale(1.05);
}

.welfare-btn:hover .welfare-btn-text {
  color: #f1404b;
}

/* 福利弹窗核心样式 - 美化增强 */
.welfare-modal {
  display: none;
  position: fixed;
  inset: 0;
  background-color: rgba(0, 0, 0, 0.35);
  z-index: 9999;
  align-items: center;
  justify-content: center;
  padding: 20px;
  box-sizing: border-box;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

.welfare-modal-wrap {
  width: 100%;
  max-width: 480px;
  background-color: rgba(255, 255, 255, 0.98);
  border: 1px solid rgba(0, 0, 0, 0.06);
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  animation: welfareFadeIn 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

/* 弹窗入场动画增强 */
@keyframes welfareFadeIn {
  from {
    opacity: 0;
    transform: translateY(20px) scale(0.96);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

.welfare-modal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 18px 22px;
  background: transparent;
  border-bottom: 1px solid rgba(136, 136, 136, 0.1);
}

.welfare-modal-title {
  margin: 0;
  color: #1d2129;
  font-size: 19px;
  font-weight: 700;
}

.welfare-modal-close {
  width: 34px;
  height: 34px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: none;
  background: rgba(0, 0, 0, 0.05);
  font-size: 21px;
  color: #86909c;
  cursor: pointer;
  border-radius: 50%;
  transition: all 0.2s;
  outline: none;
  -webkit-tap-highlight-color: transparent;
}

.welfare-modal-close:hover,
.welfare-modal-close:focus {
  background: rgba(241, 64, 75, 0.1);
  color: #f1404b;
  transform: rotate(90deg);
}

.welfare-modal-body {
  padding: 24px;
  max-height: 70vh;
  overflow-y: auto;
}

.welfare-modal-desc {
  margin: 0 0 20px 0;
  color: #1d2129;
  font-weight: 600;
  font-size: 17px;
  text-align: center;
}

.welfare-modal-list {
  margin: 0 0 28px 0;
  padding-left: 22px;
}

.welfare-modal-list li {
  margin-bottom: 10px;
  color: #4e5969;
  font-size: 15px;
  line-height: 1.7;
}

/* 弹窗按钮美化增强 */
.welfare-modal-btn {
  width: 100%;
  padding: 15px 0;
  background: linear-gradient(135deg, #f1404b 0%, #e63946 100%);
  color: #fff;
  border: none;
  border-radius: 10px;
  font-size: 17px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
  outline: none;
  box-shadow: 0 4px 12px rgba(241, 64, 75, 0.2);
  user-select: none;
  -webkit-tap-highlight-color: transparent;
}

.welfare-modal-btn:hover,
.welfare-modal-btn:focus {
  background: linear-gradient(135deg, #d83038 0%, #c62828 100%);
  transform: translateY(-1px);
  box-shadow: 0 8px 20px rgba(241, 64, 75, 0.3);
}

.welfare-modal-btn:active {
  transform: translateY(0);
  box-shadow: 0 2px 8px rgba(241, 64, 75, 0.2);
}

.welfare-modal-img {
  width: 100%;
  height: auto !important;
  max-height: none !important;
  object-fit: contain !important;
  display: block;
  border-radius: 10px;
  margin-bottom: 20px;
  border: 1px solid rgba(136, 136, 136, 0.1);
  background: rgba(0, 0, 0, 0.02);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}

/* 滚动条优化增强 */
.welfare-modal-body::-webkit-scrollbar {
  width: 6px;
}

.welfare-modal-body::-webkit-scrollbar-track {
  background: transparent;
}

.welfare-modal-body::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, 0.12);
  border-radius: 3px;
}

.welfare-modal-body::-webkit-scrollbar-thumb:hover {
  background: rgba(0, 0, 0, 0.2);
}

/* 主站夜间模式（io-black-mode）适配增强 */
.io-black-mode .welfare-btn {
  background: linear-gradient(180deg, #2c2e2f 0%, #27292a 100%);
  border-color: #363738;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
}

.io-black-mode .welfare-btn:hover {
  background: linear-gradient(180deg, #363738 0%, #313233 100%);
  border-color: #f1404b;
}

.io-black-mode .welfare-btn-text {
  color: #c9cdd4;
}

.io-black-mode .welfare-btn-icon {
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.05) 0%, rgba(255, 255, 255, 0.08) 100%);
  color: #c9cdd4;
}

.io-black-mode .welfare-btn:hover .welfare-btn-icon {
  background: linear-gradient(135deg, #f1404b 0%, #e63946 100%);
  color: #fff;
}

.io-black-mode .welfare-btn:hover .welfare-btn-text {
  color: #f1404b;
}

.io-black-mode .welfare-modal {
  background-color: rgba(0, 0, 0, 0.85);
}

.io-black-mode .welfare-modal-wrap {
  background-color: rgba(29, 33, 41, 0.98);
  border-color: #363738;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.4);
}

.io-black-mode .welfare-modal-header {
  border-bottom-color: #363738;
}

.io-black-mode .welfare-modal-title,
.io-black-mode .welfare-modal-desc {
  color: #c6c9cf;
}

.io-black-mode .welfare-modal-close {
  background: rgba(255, 255, 255, 0.05);
  color: #86909c;
}

.io-black-mode .welfare-modal-close:hover {
  background: rgba(241, 64, 75, 0.1);
  color: #f1404b;
}

.io-black-mode .welfare-modal-list li {
  color: #c9cdd4;
}

.io-black-mode .welfare-modal-img {
  border-color: rgba(255, 255, 255, 0.05);
  background: rgba(255, 255, 255, 0.02);
}

.io-black-mode .welfare-modal-body::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.15);
}

.io-black-mode .welfare-modal-body::-webkit-scrollbar-thumb:hover {
  background: rgba(255, 255, 255, 0.25);
}

/* 主站灰色模式（io-grey-mode）适配增强 */
.io-grey-mode .welfare-btn {
  border-color: transparent;
  filter: grayscale(100%);
}

.io-grey-mode .welfare-btn-text,
.io-grey-mode .welfare-modal-list li {
  color: #515C6B;
}

.io-grey-mode .welfare-modal-close {
  background: #f0f2f4;
  color: #777;
}

.io-grey-mode .welfare-modal-btn {
  filter: grayscale(100%);
}

/* 移动端适配增强 */
@media (max-width: 375px) {
  .welfare-btn-list {
    gap: 10px;
    padding: 0 16px;
  }
  
  .welfare-btn {
    min-width: 100px;
    padding: 12px 8px;
  }
  
  .welfare-btn-icon {
    width: 26px;
    height: 26px;
    line-height: 26px;
    font-size: 14px;
  }
  
  .welfare-btn-text {
    font-size: 14px;
  }
  
  .welfare-modal {
    padding: 16px;
  }
  
  .welfare-modal-body {
    padding: 20px;
  }
  
  .welfare-modal-header {
    padding: 16px 20px;
  }
}

/* ====================== 彩色版弹窗样式 ====================== */
.yct-popover {
  --yct-primary: #1677ff;
  --yct-danger: #ff4d4f;
  --yct-warning: #faad14;
  --yct-success: #52c41a;
  --yct-bg: #ffffff;
  --yct-header-bg: #f0f7ff;
  --yct-border: #d0e2ff;
  --yct-text-primary: #222222;
  --yct-text-secondary: #555555;
  --yct-text-muted: #888888;
  --yct-scrollbar: #a8d1ff;

  font-family: inherit;
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0, 0, 0, 0.3);
  backdrop-filter: blur(2px);
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease, visibility 0.3s ease;
  touch-action: none;
  padding: 16px;
  box-sizing: border-box;
}

.yct-popover.active {
  opacity: 1;
  visibility: visible;
}

.yct-popup {
  width: 100%;
  max-width: 520px;
  background: var(--yct-bg);
  border-radius: 12px;
  box-shadow: 0 6px 30px rgba(22, 119, 255, 0.12);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  transform: scale(0.95);
  transition: transform 0.3s ease-out;
}

.yct-popover.active .yct-popup {
  transform: scale(1);
}

.yct-header {
  padding: 18px 24px;
  background: var(--yct-header-bg);
  border-bottom: 1px solid var(--yct-border);
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.yct-header h2 {
  margin: 0;
  font-size: 18px;
  font-weight: 600;
  color: var(--yct-primary);
}

.yct-header-tip {
  background: var(--yct-primary);
  color: #fff;
  font-size: 12px;
  padding: 3px 10px;
  border-radius: 12px;
  animation: pulse 2s infinite;
}

.yct-close-btn {
  font-size: 22px;
  color: var(--yct-primary);
  border: none;
  background: transparent;
  cursor: pointer;
}

.yct-content-wrap {
  padding: 24px;
  max-height: 70vh;
  overflow-y: auto;
}

.yct-content {
  line-height: 1.75;
  color: var(--yct-text-secondary);
}

.yct-highlight-tip {
  color: var(--yct-primary);
  font-weight: 600;
  padding: 10px 14px;
  background: rgba(22, 119, 255, 0.08);
  border-radius: 8px;
  margin-bottom: 16px;
}

.yct-highlight { color: #1677ff; font-weight: 600; }
.yct-highlight-red { color: #ff4d4f; font-weight: 600; }
.yct-highlight-yellow { color: #faad14; font-weight: 600; }
.yct-highlight-green { color: #52c41a; font-weight: 600; }

.yct-btn {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 12px 16px;
  border: 1px solid var(--yct-border);
  border-radius: 8px;
  background: #fafcff;
  color: #1677ff;
  margin-bottom: 8px;
  transition: all 0.2s;
}

.yct-btn:hover {
  background: #e6f2ff;
  border-color: #adc6ff;
}

.yct-actions {
  padding: 16px 24px;
  border-top: 1px solid var(--yct-border);
  display: flex;
  justify-content: flex-end;
  gap: 12px;
}

.yct-close {
  background: #f0f7ff;
  color: #1677ff;
  border: none;
  padding: 10px 20px;
  border-radius: 8px;
  cursor: pointer;
}

.yct-primary-btn {
  background: #1677ff;
  color: #fff;
  border: none;
  padding: 10px 20px;
  border-radius: 8px;
  cursor: pointer;
}

/* 夜间模式（彩色柔和版）*/
.io-black-mode .yct-popover {
  --yct-bg: #1f2937;
  --yct-header-bg: #2e3a4a;
  --yct-border: #374151;
  --yct-text-primary: #e0efff;
  --yct-text-secondary: #cbd5e1;
}

.io-black-mode .yct-highlight { color: #7dd3fc; }
.io-black-mode .yct-highlight-red { color: #fca5a5; }
.io-black-mode .yct-highlight-yellow { color: #fcd34d; }
.io-black-mode .yct-btn { background: #2e3a4a; color: #7dd3fc; border-color: #475569; }
.io-black-mode .yct-btn:hover { background: #374151; }

/* 禁止滚动 */
.yct-body-no-scroll {
  overflow: hidden !important;
}

/* 动画 */
@keyframes pulse {
  0%,100%{opacity:1;}50%{opacity:0.8;}
}

/* 网站推荐 - 极致精简美化版 */
:root {
  --tag-font: 8px;
  --tag-padding: 0.5px 3px;
  --tag-radius: 1.5px;
  --tag-gap: 2px;
  --corner-size: 20px;
  --corner-opacity: 0.75;
}

/* 标签组位置 */
.tag-group-left-top,
.tag-group-right-top,
.tag-group-right-bottom,
.tag-bottom-scroll {
  position: absolute;
  display: flex;
  gap: var(--tag-gap);
  z-index: 1;
}
.tag-group-left-top { top: 1px; left: 1px; }
.tag-group-right-top { top: 1px; right: 1px; }
.tag-group-right-bottom { bottom: 1px; right: 1px; }
.tag-bottom-scroll {
  bottom: 1px; left: 1px; right: 1px;
  padding: 0;
  overflow-x: auto;
  -ms-overflow-style: none;
  scrollbar-width: none;
}
.tag-bottom-scroll::-webkit-scrollbar { display: none; }

/* 所有标签公共样式 */
[class*="recommend-tag"] {
  padding: var(--tag-padding);
  border-radius: var(--tag-radius);
  font-size: var(--tag-font);
  font-weight: 500;
  box-shadow: 0 0.5px 1.5px rgba(0,0,0,0.1), inset 0 0.3px 0.8px rgba(255,255,255,0.12);
  white-space: nowrap;
  opacity: 0.82;
  transition: all 0.18s ease;
  letter-spacing: 0;
  border: 0.3px solid rgba(255,255,255,0.08);
  background-size: 200% 100%;
}

/* 图标标签 */
.recommend-tag10 {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.recommend-tag10 i {
  font-size: var(--tag-font);
  margin-right: 1.5px;
}

/* 标签配色（微渐变提升质感） */
.recommend-tag { background: linear-gradient(135deg, #E63946, #D62828); color: white; }
.recommend-tag1 { background: linear-gradient(135deg, #FBBF24, #F59E0B); color: #1D2939; }
.recommend-tag2 { background: linear-gradient(135deg, #3B82F6, #2563EB); color: white; }
.recommend-tag3 { background: linear-gradient(135deg, #6B7280, #4B5563); color: white; }
.recommend-tag4 { background: linear-gradient(135deg, #FF9500, #EA580C); color: white; }
.recommend-tag6 { background: linear-gradient(135deg, #8B5CF6, #7C3AED); color: white; }
.recommend-tag7 { background: linear-gradient(135deg, #10B981, #059669); color: white; }
.recommend-tag8 { background: linear-gradient(135deg, #93C5FD, #60A5FA); color: #1D2939; }
.recommend-tag9 { background: linear-gradient(135deg, #FB923C, #F97316); color: white; }
.recommend-tag10 { background: linear-gradient(135deg, #6366F1, #4F46E5); color: white; }

/* 标签hover效果 */
[class*="recommend-tag"]:hover {
  opacity: 1;
  transform: scale(1.05);
  box-shadow: 0 1px 2.5px rgba(0,0,0,0.15), inset 0 0.3px 0.8px rgba(255,255,255,0.18);
  background-position: 100% 0;
}

/* 彻底移除原圆形推标签 */
.tag-group-left-top .recommend-tag5 { display: none !important; }

/* 迷你半透明三角推角标 */
.corner-push-tag {
  position: absolute;
  top: 0; left: 0;
  width: var(--corner-size);
  height: var(--corner-size);
  z-index: 10;
  pointer-events: none;
  overflow: hidden;
}
.corner-push-tag::before {
  content: '';
  position: absolute;
  top: 0; left: 0;
  border-style: solid;
  border-width: var(--corner-size) var(--corner-size) 0 0;
  border-color: rgba(241,64,75,var(--corner-opacity)) transparent transparent transparent;
  box-shadow: 0.5px 0.5px 1.5px rgba(0,0,0,0.08);
  transition: all 0.18s ease;
}
.corner-push-tag::after {
  content: '推';
  position: absolute;
  top: 0; left: 0;
  font-size: 8px;
  font-weight: 700;
  color: #fff;
  transform: rotate(-45deg);
  text-shadow: 0 0 0.5px rgba(0,0,0,0.2);
}

/* 角标hover效果 */
.url-body:hover .corner-push-tag::before {
  border-width: calc(var(--corner-size) + 2px) calc(var(--corner-size) + 2px) 0 0;
  top: -1px; left: -1px;
  border-color: rgba(241,64,75,0.95) transparent transparent transparent;
}

/* 多主题适配 */
.io-black-mode .corner-push-tag::before { border-color: rgba(255,107,107,var(--corner-opacity)) transparent transparent transparent; }
.io-black-mode .url-body:hover .corner-push-tag::before { border-color: rgba(255,107,107,0.95) transparent transparent transparent; }
.io-grey-mode .corner-push-tag::before { border-color: rgba(241,64,75,var(--corner-opacity)) transparent transparent transparent; }
.io-grey-mode .url-body:hover .corner-push-tag::before { border-color: rgba(241,64,75,0.95) transparent transparent transparent; }

/* 不同尺寸卡片适配 */
.url-body.max .corner-push-tag { --corner-size: 24px; }
.url-body.max .corner-push-tag::after { font-size: 9px; top: 0.5px; left: 0.5px; }
.url-body.mini .corner-push-tag { --corner-size: 16px; }
.url-body.mini .corner-push-tag::after { font-size: 7px; top: -0.5px; left: -0.5px; }



/*轮番图代码开始*/


   .slider-container {
      width: 100%;
      position: relative;
      overflow: hidden;
    }

   .slider {
      display: flex;
      width: 100%;
    }

   .slider img {
      width: 100%;
      height: auto;
      display: none;
      cursor: pointer;
      flex-shrink: 0;
    }

   .slider img.active {
      display: block;
    }

   .arrow {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      font-size: 20px;
      cursor: pointer;
      color: #007BFF;
      background-color: rgba(255, 255, 255, 0.3);
      padding: 5px 10px;
      border-radius: 5px;
      transition: opacity 0.3s ease;
      opacity: 0.7;
    }

   .arrow:hover {
      opacity: 1;
    }

   .prev {
      left: 10px;
    }

   .next {
      right: 10px;
    }
    /*轮番图代码结束*/
    /* 给最外层容器设置宽度和水平滚动属性 */
        #search-list-menu {
            width: 100%;
            overflow-x: auto;
            -webkit-overflow-scrolling: touch; /* 优化移动端滚动体验 */
        }

       .hide-type-list {
            /* 可以根据需要设置其他样式，这里先不添加以免影响原样式 */
        }

       .s-type {
            text-align: center;
        }

       .s-type-list.big {
            /* 可以根据需要设置其他样式，这里先不添加以免影响原样式 */
        }

       .anchor {
            position: absolute;
            left: 50%;
            opacity: 0;
        }

       .s-type-list label {
            display: inline-block;
            /* 原样式中的其他属性 */
        }
  
  
  
  


    
    
    .colorful-text {

      background: linear-gradient(45deg, #ff00a9, #fffb00, #00ff7f, #0088ff);

      -webkit-background-clip: text;

      -webkit-text-fill-color: transparent;

      animation: rainbow 5s linear infinite;

    }
    
    
        #footer-tools [data-v-db6ccf64][data-v-41ba7e2c] {
            top: unset !important;
            bottom: 0 !important;
            right: 44px !important
        }

        .io.icon-fw,
        .iconfont.icon-fw {
            width: 1.15em;
        }

        .io.icon-lg,
        .iconfont.icon-lg {
            font-size: 1.5em;
            line-height: .75em;
            vertical-align: -.125em;
        }

        .screenshot-carousel .img_wrapper a {
            display: contents
        }

        .fancybox-slide--iframe .fancybox-content {
            max-width: 1280px;
            margin: 0
        }

        .fancybox-slide--iframe.fancybox-slide {
            padding: 44px 0
        }

        .navbar-nav .menu-item-286 a {
            background: #ff8116;
            border-radius: 50px !important;
            padding: 5px 10px !important;
            margin: 5px 0 !important;
            color: #fff !important;
        }

        .navbar-nav .menu-item-286 a i {
            position: absolute;
            top: 0;
            right: -10px;
            color: #f13522;
        }

        .io-black-mode .navbar-nav .menu-item-286 a {
            background: #ce9412;
        }

        .io-black-mode .navbar-nav .menu-item-286 a i {
            color: #fff;
        }
        /*悬浮按钮*/
        #jumpButton {
      position: fixed;
      right: 10px;
      top: 50%;
      transform: translateY(-50%);
      width: 30px;
      height: 30px;
      background-color: #007BFF;
      color: white;
      font-size: 12px;
      border: none;
      border-radius: 5px;
      box-shadow: 0 3px 5px rgba(0, 0, 0, 0.2);
      cursor: pointer;
      transition: background-color 0.3s ease;
    }

    #jumpButton:hover {
      background-color: #0056b3;
    }
    
 /* 底部卡片增强样式 */
.footer-card {
  background: #ffffff;
  border-radius: 16px;
  padding: clamp(20px, 4vw, 30px);
  margin: 20px 0;
  box-shadow: 0 0 20px -5px rgba(158,158,158,0.15);
  text-align: center;
  width: 100%;
  box-sizing: border-box;
}
.io-black-mode .footer-card {
  background: #1e1e1e !important;
  color: #e0e0e0 !important;
}

.footer-btns {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 8px;
  margin: 20px 0;
}
.footer-btn {
  padding: 5px 12px;
  border-radius: 6px;
  font-size: 14px;
  background: #f5f5f5;
  color: #333 !important;
  text-decoration: none;
  white-space: nowrap;
}
.io-black-mode .footer-btn {
  background: #2d2d2d !important;
  color: #f0f0f0 !important;
}

.footer-qrcode {
  display: flex;
  justify-content: center;
  gap: clamp(15px, 4vw, 25px);
  flex-wrap: wrap;
  margin: 20px 0;
}
.footer-qrcode img {
  width: clamp(90px, 18vw, 110px);
  height: clamp(90px, 18vw, 110px);
  border-radius: 8px;
}
.footer-qrcode div {
  font-size: 12px;
  margin-top: 6px;
}

.footer-scroll-wrap {
  width: 100%;
  overflow: hidden;
  white-space: nowrap;
  margin: 10px 0;
}
.footer-scroll {
  display: inline-block;
  animation: scrollLeft 40s linear infinite;
}

@keyframes scrollLeft {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

.run-time {
  font-size: 14px;
  margin: 10px 0;
  color: #555;
}
.io-black-mode .run-time {
  color: #ccc !important;
}

.domain-row {
  margin: 15px 0;
}
   
/* 全网热榜 - 官方样式适配版 | 无标题 | 零冲突 */
.hotboard-wrapper {
    margin-bottom: 25px;
}

.hotboard-tabs {
    display: flex;
    gap: 6px;
    overflow-x: auto;
    padding-bottom: 8px;
    margin-bottom: 10px;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}

.hotboard-tabs::-webkit-scrollbar {
    display: none;
}

.hotboard-tab {
    flex-shrink: 0;
    padding: 4px 12px;
    border: none;
    background: #f8f9fa;
    border-radius: 14px;
    font-size: 12px;
    cursor: pointer;
    transition: all 0.2s ease;
    color: #6c757d;
    white-space: nowrap;
    font-family: inherit;
}

.hotboard-tab:hover {
    background: #e9ecef;
}

.hotboard-tab.active {
    background: #82c91e;
    color: white;
}

.hotboard-scroll-container {
    position: relative;
    overflow: hidden;
}

.hotboard-scroll {
    display: flex;
    gap: 10px;
    overflow-x: auto;
    padding: 2px 0 10px;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x mandatory;
    scrollbar-width: thin;
    scrollbar-color: #f0f0f0 transparent;
}

.hotboard-scroll::-webkit-scrollbar {
    height: 4px;
}

.hotboard-scroll::-webkit-scrollbar-thumb {
    background: #f0f0f0;
    border-radius: 2px;
}

.hotboard-item {
    flex-shrink: 0;
    width: 280px;
    scroll-snap-align: start;
    background: white;
    border-radius: 8px;
    padding: 10px 12px;
    box-shadow: 0 1px 4px rgba(0,0,0,0.08);
    cursor: pointer;
    transition: all 0.2s ease;
    display: flex;
    align-items: flex-start;
    gap: 10px;
}

.hotboard-item:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
    background: #f8f9fa;
}

.hotboard-cover {
    width: 48px;
    height: 48px;
    border-radius: 6px;
    object-fit: cover;
    flex-shrink: 0;
}

.hotboard-main {
    flex: 1;
    overflow: hidden;
}

.hotboard-rank {
    width: 22px;
    text-align: center;
    font-weight: 700;
    font-size: 13px;
    line-height: 1.4;
    flex-shrink: 0;
}

.hotboard-rank.rank-1 { color: #ff4500; }
.hotboard-rank.rank-2 { color: #ff8c00; }
.hotboard-rank.rank-3 { color: #ffd700; }
.hotboard-rank.rank-normal { color: #6c757d; }

.hotboard-title {
    font-size: 13px;
    color: #212529;
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin-bottom: 4px;
}

.hotboard-meta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 11px;
    color: #6c757d;
}

.hotboard-tag {
    display: inline-block;
    padding: 1px 3px;
    font-size: 10px;
    border-radius: 2px;
    margin-left: 4px;
    vertical-align: middle;
}

.hotboard-tag.hot { background: #fff1f0; color: #f5222d; }
.hotboard-tag.new { background: #e6f7ff; color: #1890ff; }
.hotboard-tag.boom { background: #fff7e6; color: #fa8c16; }

.hotboard-empty {
    width: 100%;
    text-align: center;
    padding: 20px;
    color: #6c757d;
    font-size: 13px;
}

/* 夜间模式适配 - 完全匹配网站io-black-mode */
.io-black-mode .hotboard-tab {
    background: #2d2d2d;
    color: #999;
}

.io-black-mode .hotboard-tab:hover {
    background: #383838;
}

.io-black-mode .hotboard-item {
    background: #2c2e2f;
    box-shadow: 0 1px 4px rgba(0,0,0,0.3);
}

.io-black-mode .hotboard-item:hover {
    background: #383838;
}

.io-black-mode .hotboard-title {
    color: #e0e0e0;
}

.io-black-mode .hotboard-meta,
.io-black-mode .hotboard-rank.rank-normal,
.io-black-mode .hotboard-empty {
    color: #999;
}

.io-black-mode .hotboard-scroll::-webkit-scrollbar-thumb {
    background: #2d2d2d;
}

/* 灰色模式适配 */
.io-grey-mode .hotboard-tab {
    background: #f0f2f4;
    color: #515C6B;
}

.io-grey-mode .hotboard-tab:hover {
    background: #e5e7eb;
}

/* 响应式自适应 */
@media (max-width: 768px) {
    .hotboard-item {
        width: 240px;
    }
}

@media (max-width: 480px) {
    .hotboard-item {
        width: 200px;
        padding: 8px 10px;
        gap: 8px;
    }
    
    .hotboard-cover {
        width: 40px;
        height: 40px;
    }
    
    .hotboard-title {
        font-size: 12px;
    }
}