@charset "utf-8";

/* Sidebar */
.sidebar-nav{display:table-cell;font-size:var(--font-size-sm);width:220px;height:100vh;z-index:1081;opacity:1!important}
.sidebar-nav-inner{width:inherit;margin:0;max-width:260px;background:var(--color-bg-dark);pointer-events:inherit;display:flex;flex-direction:column;transition:background-color var(--transition-normal)}
.sidebar-logo{height:74px;transition:background-color var(--transition-fast);display:flex;align-items:center;justify-content:center}
.sidebar-logo img{max-height:40px;width:auto;object-fit:contain}
.logo{display:flex;align-items:center;justify-content:center;width:100%}
.logo .logo-expanded{display:block}
.logo .logo-collapsed{display:none}
.sidebar-menu{transition:all var(--transition-normal)}
.sidebar-menu-inner a,.flex-bottom a{display:block;overflow:hidden;padding-left:var(--space-xl);line-height:48px;max-height:48px;color:#b2b8be;transition:all var(--transition-normal)}
.sidebar-menu-link,.sidebar-menu-link span{line-height:50px;max-height:50px}
.sidebar-item{position:relative}
.sidebar-item.sidebar-show{border-bottom:none}
.sidebar-submenu{display:none;background:rgba(0,0,0,.1)}
.sidebar-item.sidebar-show .sidebar-submenu{display:block}
.sidebar-more,.sidebar-item .label-primary{float:right;margin-right:24px}
.sidebar-more{line-height:50px!important;transition:transform var(--transition-normal)}
.sidebar-more-icon{transform:scale(.8)}
.sidebar-show .sidebar-more-icon{transform:scale(.8) rotate(90deg)}
.sidebar-show,.sidebar-item>a:hover{color:var(--color-bg-white);background:rgba(0,0,0,.2)}
.sidebar-nav-inner .flex-fill{overflow:auto;-webkit-overflow-scrolling:touch}
.border-color,.border-t{border-color:rgba(129,129,129,.15)!important}
.mini-sidebar .logo .logo-expanded{display:none}
.mini-sidebar .logo .logo-collapsed{display:block}
.mini-sidebar .sidebar-menu{width:60px}
.sidebar-nav ul{margin:0;padding:0}
.mini-sidebar .sidebar-menu-inner .sidebar-item a span{display:none}
.mini-sidebar .sidebar-menu-inner .sidebar-submenu{display:none}

/* Sidebar Popup */
.sidebar-popup{display:block;position:absolute;position:fixed;border:3px solid rgba(60,71,76,0)}
.sidebar-popup-content{background:var(--color-bg-darkest);border-radius:var(--radius-xl)}
.sidebar-popup.second{left:60px}
.sidebar-popup i,.sidiebar-popup .label-primary{display:none}
.sidebar-popup .sidebar-menu-inner a span{margin-left:0}
.sidebar-popup .sidebar-submenu{position:absolute;top:0;left:180px;width:180px;z-index:99}
.sidebar-popup .sidebar-menu-inner ul,.sidebar-popup .sidebar-menu-inner ul li{width:180px}
.sidebar-popup .sidebar-menu-inner ul li:last-child,.sidebar-popup .sidebar-menu-item:last-child>a{border-radius:0 0 var(--radius-xl) var(--radius-xl)}
.sidebar-popup a{padding-right:16px}
.sidebar-popup::before{content:'';border-width:5px 5px 5px 0;border-style:solid;border-color:transparent var(--color-bg-darkest) transparent;position:absolute;top:14px;left:-4px}
.sidebar-popup ul{margin:0;padding:0}
.sidebar-nav,.sidebar-popup .sidebar-menu-item{background:var(--color-bg-dark);list-style:none}
.sidebar-submenu-item>a:hover,.sidebar-popup-menu-item:hover{color:var(--color-bg-white);background:rgba(119,121,125,.15)}

/* Header Menu */
.navbar-menu-item{position:relative;list-style:none}
.navbar-dropdown{transform:translateY(15px)}
.navbar-dropdown{position:absolute;min-width:160px;opacity:0;overflow:hidden;visibility:hidden;background:var(--color-bg-white);border-radius:var(--radius-xl);box-shadow:var(--shadow-sm);transition:var(--transition-normal)}
.navbar-menu-item.focus .navbar-dropdown,.navbar-menu-item:hover .navbar-dropdown{opacity:1;z-index:1;overflow:visible;visibility:visible;transform:translateY(0)}
.navbar-menu-item.has-children:after{content:'\e612';font-family:"iconfont";position:absolute;top:14px;right:-2px;font-size:12px;transform:rotate(0) scale(.6);transition:transform var(--transition-fast)}
.navbar-menu-item.has-children:hover:after{transform:rotate(45deg) scale(.6)}
.navbar-nav-item{font-size:14px;padding:var(--space-3) var(--space-4);display:block;transition:color var(--transition-fast)}
.navbar-nav-icon{margin-right:2px!important}
.navbar-menu{flex-direction:row;margin-left:auto;align-items:center}
.navbar-brand img{max-height:40px}
.nav-github{display:none;position:absolute;top:0;right:0;border:0}
.page-header{background:var(--color-bg-white);box-shadow:var(--shadow-sm);transition:background-color var(--transition-normal)}
.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 var(--transition-fast);cursor:pointer}
.header-mini-btn label{display:block;top:0;right:0;cursor:pointer}
.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 path{transition:all .5s cubic-bezier(.645,.045,.355,1),stroke var(--transition-fast)}
.header-mini-btn label:hover path{stroke:var(--color-primary)}
.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}

/* Mobile Menu */
.mobile-menu a{color:#777}
@media (min-width:768px){.navbar{padding:0 1rem}.sidebar-nav{display:block!important}}
@media (max-width:767.98px){
.nav-github{display:none}
.sidebar-nav{background:transparent!important;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:var(--transition-fast);transform:translate3d(-100%,0,0);width:17.5rem}
.row,.row-lg,.row-md,.row-sm,.row-xs{margin-right:0;margin-left:0}
.row > [class*="col-"],.row-lg > [class*="col-"],.row-md > [class*="col-"],.row-sm > [class*="col-"],.row-xs > [class*="col-"]{padding-right:var(--space-2);padding-left:var(--space-2)}
.container,.container-lg{padding-right:var(--space-4);padding-left:var(--space-4)}
.card,.block{overflow-x:hidden}
.url-card .card-body{overflow-x:hidden}
.header-big{padding-left:var(--space-4);padding-right:var(--space-4)}
.page-header{padding-left:var(--space-3);padding-right:var(--space-3)}
input,textarea,select,button{max-width:100%}
}

/* URL Card */
.url-card .url-body{transform:translateY(0);transition:all var(--transition-normal)}
.url-card .url-body:hover{transform:translateY(var(--card-hover-y));box-shadow:var(--shadow-md)}
.url-card .url-info{overflow:hidden;padding-right:var(--space-2)}
.url-card .url-goto-after{height:24px;border-top:1px solid var(--color-border-light)}
.url-card .url-goto{position:absolute;bottom:0;left:0;right:0}
.url-card .card-body{padding:.9375rem}
.url-card .url-img{width:40px;height:40px;flex:none;background:rgba(128,128,128,.1);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,.url-card.down a.card:after{position:absolute;display:inline-block;font-family:"iconfont";color:#888;margin-left:10px;opacity:.15}
.url-card.wechat a.card:after{content:'\e60d';font-size:66px;bottom:-15px;right:10px}
.url-card.down a.card:after{content:'\e604';font-size:60px;bottom:-10px;right:10px}
.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 var(--transition-normal)}
.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:var(--radius-pill);transition:var(--transition-normal)}
.url-card .max .tga a:not(.no-tag):hover{background:var(--color-primary);color:var(--color-bg-white)}
.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{position:absolute;top:-8px;right:0;font-size:20px;color:var(--color-primary);line-height:20px}
.url-card .mini .card-body{padding:.4rem .5rem}

/* Bulletin Card */
.bulletin-card{transform:translateY(0);transition:all var(--transition-normal)}
.bulletin-card:hover{transform:translateY(var(--card-hover-y));box-shadow:var(--shadow-md)}

/* Footer */
.footer-tools{position:fixed;bottom:20px;right:20px;display:flex;z-index:var(--z-footer-tools)}
.footer-tools .btn{color:#777;background:#eee;width:var(--size-sm);height:var(--size-sm);font-size:var(--font-size-md);text-align:center;line-height:40px;padding:unset;display:flex;align-items:center;justify-content:center;border:unset;border-radius:var(--radius-full)!important}
.footer-tools .go-up{display:none}
.footer-tools .btn:hover{color:#444}
.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:var(--color-primary);color:var(--color-bg-white)!important;border-radius:var(--radius-pill)!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}
}

/* Slider Menu */
.slider-menu{position:relative;display:inline-block}
.slider-menu-list{position:relative;white-space:nowrap;margin:0;text-align:center;display:inline-block;background:rgba(0,0,0,.1);border-radius:var(--radius-pill);padding:5px}
.slider-menu-anchor{background:var(--color-primary);border-radius:var(--radius-pill);width:60px;height:40px;opacity:0;transition:var(--transition-normal)}
.slider-menu-item{display:inline-block;cursor:pointer}
.slider-menu-item-hidden{display:none}
.slider-menu-link{display:block;text-decoration:none;position:relative;color:#888;height:40px;line-height:40px;text-align:center;font-size:14px;padding:0 16px;transition:var(--transition-normal)}
.slider-menu-link:hover,.slider-menu-link.active{color:var(--color-bg-white)}
.slider-menu-list:hover .slider-menu-item:not(.hover) .slider-menu-link.active{color:#888}
.slider-menu-mini .slider-menu-link{height:28px;line-height:28px;padding:0 12px}
.slider-menu-mini .slider-menu-list{padding:3px}
.nav-pills .nav-link.active,.nav-pills .show>.nav-link{background:unset}
.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;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:var(--radius-md);border:1px solid rgba(132,132,132,.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:var(--radius-md);background:#ff4242}

/* Sidebar Components */
.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:var(--color-primary);left:1.25rem;width:50px;height:2px;bottom:-2px;position:absolute;transition:var(--transition-slow)}
.sidebar-card:hover .sidebar-card-header:after{width:80px}
.sidebar-tag-link{display:inline-block;margin:4px 2px;font-size:12px;background:rgba(148,149,158,.15);border-radius:var(--radius-xl)}
.sidebar-url-card{background:var(--color-bg-light);box-shadow:unset;border:1px solid var(--color-bg-light);transition:var(--transition-normal)}
.sidebar-url-card:hover{transform:unset;box-shadow:unset;border:1px solid var(--color-primary)}
.sidebar-url-card-special:after{font-size:27px;bottom:-6px;right:5px}



/* Header Big */
.page-header.big{backdrop-filter:blur(10px);background:rgba(255,255,255,.7)}
.header-big{position:relative;margin-top:-75px;padding-top:100px;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,var(--color-bg) 0,transparent 80%);transition:var(--transition-normal)}
.header-big.css-img,.header-big.css-bing,.header-big.canvas-fx{background-color:var(--color-bg-darker)}
.header-big.css-img,.header-big.css-bing{background-size:cover;background-position:cover}
.post-top{padding-bottom:120px}
.header-big.css-color{background-size:400%;background-position:0 100%;animation:gradient 7.5s ease-in-out infinite}
@keyframes gradient{50%{background-position:100% 0}}
.header-big .bulletin-container{background:transparent;box-shadow:none}
.header-big:not(.no-bg) .bulletin-container a{color:var(--color-bg-white)}
.header-big .bulletin-big .bulletin-container{max-width:600px;margin:0 auto}
.header-big:not(.no-bg) .bulletin-container .card-body{color:var(--color-bg-white)!important;background:rgba(0,0,0,.3);border-radius:var(--radius-pill)}
.header-big .bulletin-close{opacity:.1;transition:opacity var(--transition-normal)}
.header-big .bulletin-big .bulletin-container:hover .bulletin-close{opacity:.7}
.header-big:not(.no-bg) .text-muted{color:var(--color-bg-white)!important}
.content-site.customize-site.big{margin-top:-80px}
@media screen and (min-width:768px){.header-big{padding-top:170px;padding-bottom:110px}.post-top{padding-bottom:180px}}

/* Content / Post (保留基础样式) */
blockquote{position:relative;padding:.9375rem 0 .9375rem 1.75rem;margin:1.5rem 0;border-left:5px solid var(--color-border-light);background-color:rgba(136,136,136,.1)}
blockquote p:last-of-type{margin:0;padding:0}
pre{position:relative;overflow-y:auto;border:0;color:#777;border-radius:var(--radius-xl);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}

/* Site Body */
.siteico{background:#e6e8ed;position:relative;overflow:hidden;box-shadow:var(--shadow-xl);border-radius:var(--radius-2xl);transition:background-color var(--transition-normal)}
.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;backdrop-filter:blur(5px);background-color:rgba(250,250,250,.5)!important;border-color:transparent!important}
.tool-actions .btn-light:hover{background-color:rgba(250,250,250,.8)!important}
.customize-menu .btn-edit{color:#ddd;line-height:24px;background:var(--color-primary);padding:0 10px;margin:5px 0;border-radius:var(--radius-pill)}
.customize-menu .btn-edit:hover{color:var(--color-bg-white)}
.blur{filter:blur(15px)}
.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:var(--radius-xl)}
.site-body .btn{border-radius:var(--radius-xl);padding:7px 16px;background-color:rgba(138,138,138,.15);transition:var(--transition-normal)}
.site-body .btn:hover{color:var(--color-bg-white);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:var(--transition-normal)}
.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}
@media screen and (max-width:575.98px){.siteico:before{padding-top:60%}}

/* Grey Mode */
.io-grey-mode .sidebar-logo{background:var(--color-bg-white)}
.io-grey-mode .page-header{box-shadow:none}
.io-grey-mode .sidebar-nav-inner{background:var(--color-bg)}
.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:var(--color-primary);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:var(--color-bg-gray)}
.io-grey-mode .sidebar-item li>a:hover,.io-grey-mode .sidebar-popup>div>ul>li>a:hover{color:var(--color-primary);background:none}

/* Dark Mode */
.io-black-mode{background-color:var(--color-bg-darker)}
.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 .bg-light{background:var(--color-bg-darkgray)!important}
.io-black-mode,.io-black-mode a:not(.btn),.io-black-mode .button>a{color:#c6c9cf}
.io-black-mode p{color:#bbb}
.io-black-mode .card,.io-black-mode .block{box-shadow:var(--shadow-sm)}
.io-black-mode .card:hover,.io-black-mode .block:hover{box-shadow:var(--shadow-md)}
.io-black-mode .text-gray{color:#888}
.io-black-mode .modal-content,.io-black-mode .flex-avatar,.io-black-mode .card{background-color:var(--color-bg-dark)}
.io-black-mode .url-body:hover{box-shadow:var(--shadow-md)}
.io-black-mode .page-header{background:var(--color-bg-dark);box-shadow:var(--shadow-md)}
.io-black-mode .border-color{border-color:transparent!important}
.io-black-mode .sidebar-nav-inner{background:var(--color-bg-dark)}
.io-black-mode .sidebar-nav .flex-bottom a,.io-black-mode .sidebar-menu-inner a{color:#b2b8be}
.io-black-mode .sidebar-item ul{background:none}
.io-black-mode .sidebar-show,.io-black-mode .sidebar-item>a:hover{color:var(--color-primary);background:none}
.io-black-mode .sidebar-popup div{background:var(--color-bg-darkest)}
.io-black-mode .sidebar-popup::before{border-color:transparent var(--color-bg-darkest) transparent}
.io-black-mode .sidebar-nav,.io-black-mode .sidebar-popup.sidebar-menu-inner ul li{background:var(--color-bg-dark)}
.io-black-mode .sidebar-item li>a:hover,.io-black-mode .sidebar-popup>div>ul>li>a:hover{color:var(--color-primary);background:none}
.io-black-mode .footer-tools .btn{color:#aaa;background:var(--color-bg-darkgray)}
.io-black-mode .footer-tools .btn:hover{color:var(--color-bg-white)}
.io-black-mode .switch-dark-mode .mode-ico{color:#aaa}
.io-black-mode .switch-dark-mode:hover .mode-ico{color:var(--color-bg-white)}
.switch-dark-mode .mode-ico{color:#777}
.switch-dark-mode:hover .mode-ico{color:#444}

/* Sites Page */
.site-content .url-card .url-body:hover{transform:none!important;box-shadow:none!important}
.site-content .card:hover,.site-content .block:hover{transform:none!important;box-shadow:var(--shadow-sm)!important}
.no-hover-card:hover,.no-hover-card.card:hover{transform:none!important;box-shadow:var(--shadow-sm)!important}
.io-black-mode .site-content .card:hover,.io-black-mode .site-content .block:hover,.io-black-mode .site-content .url-body:hover{transform:none!important;box-shadow:var(--shadow-sm)!important}