/*
    引入字体
*/
@import url('result.css');

/*
 * 深浅色定义变量
 */

 :root,[data-color-mode=light] {

    /*全局颜色*/
    --color-text-normal: rgb(0 0 0);
    --color-text-light: rgb(37 37 37);
    --color-text-link: rgb(37 37 37);
    --color-text-link-hover:rgb(216 132 60);
    --color-text-link-visited: rgb(0 0 0);
    --color-text-blockquote:#555555;
    --color-text-blockquote-bg:#dddddd44;
    --color-text-blockquote-shadow:0 4px 11px 0 #252c6117,0 1px 3px 0 #5d64940f;
    --color-text-p-tip:#555555;
    --color-text-p-tip-bg:rgb(66 185 131 / 10%);
    --color-text-p-warn:#555555;
    --color-text-p-warn-bg:rgb(255 102 102 / 10%);
    --color-text-code-inline:#d83b64;
    --color-text-code-inline-bg:#f9f2f4;

    --color-border-heavy: rgb(0 0 0);
    --color-border-normal:rgb(85 85 85);
    --color-border-medium: grey;
    --color-border-light:rgb(229, 231, 235);

    --color-bg-light: rgb(255 255 255);
    --color-bg-normal: rgb(252, 252, 252);
    --color-bg-heavy: rgb(251, 251, 251);

    --color-logo-img: url("../image/logo_light.svg");
}
[data-color-mode=dark] {

    /*全局颜色*/
    --color-text-normal: rgb(233 233 233);
    --color-text-light: rgb(233 233 233);
    --color-text-link: rgb(233 233 233);
    --color-text-link-hover:rgb(255 255 255);
    --color-text-link-visited: rgb(233 233 233);
    --color-text-blockquote:#dddddd87;
    --color-text-blockquote-bg:#222222;
    --color-text-blockquote-shadow:0 4px 11px 0 rgb(0 0 0/20%),0 1px 3px 0 rgb(0 0 0/20%);
    --color-text-p-tip:#dddddd87;
    --color-text-p-tip-bg:rgba(66,185,131,.1);
    --color-text-p-warn:#dddddd87;
    --color-text-p-warn-bg:hsla(0,100%,70%,.1);
    --color-text-code-inline:#f9267287;
    --color-text-code-inline-bg:#282c34;

    --color-border-light: #333333;
    --color-border-normal: #444444;
    --color-border-medium: grey;
    --color-border-heavy: #555555;

    --color-bg-light: #000000;
    --color-bg-normal: #111111;
    --color-bg-heavy: #222222;
    --color-logo-img: url("../image/logo_dark.jpg");
}

/*全局*/

/*字体大小*/
:root{
    font-size: min(16px, max(14px, calc((16 / 1024) * 100vw)));
}

/*深色模式*/
:root,[data-color-mode=light] {
    color-scheme: light
}
[data-color-mode=dark] {
    color-scheme: dark
}

body {

    background-color: var(--color-bg-normal);

    /* 去除外边距 */
    margin: 0px;
    
    /*字体：字体颜色、思源宋体*/
    color: var(--color-text-normal);
    font-family: 'Noto Serif SC', serif;

}

/* 超链接 */
a {
    text-decoration: none;
    color: var(--color-text-link);
}

/* 超链接单击 */
a:link {
    opacity: 1;
    -webkit-transition: .2s;
    -moz-transition: .2s;
    -ms-transition: .2s;
    -o-transition: .2s;
    transition: .2s;
    color: var(--color-text-link);
}

a:visited {
    opacity: 1;
    -webkit-transition: .2s;
    -moz-transition: .2s;
    -ms-transition: .2s;
    -o-transition: .2s;
    transition: .2s;
    color: var(--color-text-link-visited);
}

/* 超链接悬停 */
a:active,a:hover {
    color: var(--color-text-link-hover);
    border-color: var(--color-text-link-hover);
}

/* 灰度滤镜 */
.grey{
    filter: grayscale(1);
}

.color_filter{
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    -o-filter: grayscale(100%);
    filter: grayscale(100%);
    filter: gray;
    transition-property: filter, opacity;
    transition-duration: 0.5s;
    transition-timing-function: ease;
}

.color_filter:hover{
    filter: none;
}

/* 背景左过渡（Sweep To Left） */
.hvr-sweep-to-left {
    display: inline-block;
    vertical-align: middle;
    -webkit-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    box-shadow: 0 0 1px rgba(0, 0, 0, 0);
    position: relative;
    -webkit-transition-property: color;
    transition-property: color;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
}

.hvr-sweep-to-left:before {
    content: "";
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: var(--color-bg-heavy);
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transform-origin: 100% 50%;
    transform-origin: 100% 50%;
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
}

.hvr-active-search .hvr-sweep-to-left:before {
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
}

.hvr-negative-search .hvr-sweep-to-left:before {
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
}

/* 导航栏 */
.navbar{
    position: sticky;
    top: 0;
    border-bottom: 1px solid var(--color-border-light);
    backdrop-filter: blur(8px);
    background-color: var(--color-bg-light);
    display: flex;
    z-index: 10;
}
    @media screen and (max-width:450px) {
        .navbar{
            height: 60px;
            padding: 0 calc(30 / 1024 * 100vw) 0 calc(30 / 1024 * 100vw);
        }
        .navbar_img{
            height: 48px;
            width: 48px;
        }
    }
    @media screen and (min-width:451px) and (max-width:1023px) {
        .navbar{
            height: 80px;
            padding: 0 calc(30 / 1024 * 100vw) 0 calc(30 / 1024 * 100vw);
        }
        .navbar_img{
            height: 48px;
            width: 48px;
        }
    }
    @media screen and (min-width:1024px) {
        .navbar{
            height: 80px;
            padding: 0px calc((100vw - 1024px) / 2);
        }
        .navbar_img{
            height: 64px;
            width: 64px;
        }
    }

.navbar_img{
    content:var(--color-logo-img);
}

.navbar_sitename{
    font-family: 'Huiwen-mincho';
}

.navbar_item{
    margin: 0;
    padding: 0;
    list-style: none;
    box-sizing: border-box;
    column-gap: 0.75rem;
    align-items:center;
    justify-content: center;
    display: flex;
}
    @media screen and (max-width:450px) {
        .navbar_item{
            height: 60px;
            font-size: 16px;
        }
    }
    @media screen and (min-width:451px) and (max-width:1023px) {
        .navbar_item{
            height: 80px;
            font-size: 20px;
        }
    }
    @media screen and (min-width:1024px) {
        .navbar_item{
            height: 80px;
            font-size: 24px;
        }
    }

#search_frame{
    display: none;
    flex: 9;
}

#search_li, #search {
    width: 100%;
}

#search_return{
    display: none;
}

.hvr-active-search .navbar_item::after{
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    z-index: -1;
    width: 5px;
    height: 100%;
    background-color: var(--color-text-normal);
}

.navbar .flex_box{
    flex: 1;
}

.navbar .flex_right{
    justify-content: right!important;
}

.navbar .flex_left{
    justify-content: left!important;
}

.navbar_item svg{
    width: 18px;
    height: 18px;
    color: var(--color-text-normal);
    fill: var(--color-text-normal);
}

.navbar_item .flex{
    display: flex;
}

.navbar_item li{
    display: flex;
}

.navbar_item button{
    background-color: transparent;
    border-width: 0;
    cursor: pointer;
}

.navbar_item #search_box {
    padding: 0px 15px;
    margin: 0 20px;
    border: 2px solid var(--color-border-normal);
    background: transparent;
    outline: none;
    transition: opacity 0.5s;
    display: inline-block;
    width: 100%;
    font-size: 1.5rem;
    font-family: "Noto Serif SC";
    border-radius: 255px 15px 225px 15px/15px 225px 15px 255px;
}

.navbar_item #search_box:focus{
    border: 2px solid var(--color-border-heavy);
}

@media screen and (max-width: 450px) {
    .navbar_item #search_box {
        height: 35px;
    }
}
@media screen and (min-width: 451px) {
    .navbar_item #search_box {
        height: 50px;
    }
}

/*横幅*/

.banner{
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 30px 20px;	
}

.banner_image{
    width: 900px;
    height: 320px;
    object-fit: cover;
    border-radius: 2px;
    border: 3px solid var(--color-border-heavy);
}
    @media screen and (max-width:450px) {
        .banner_image{
            height: 220px;
        }
    }
    @media screen and (min-width:451px) and (max-width:1023px) {
        .banner_image{
            height: calc(320 / 1024 * 100vw);
        }
    }
    @media screen and (min-width:1024px) {
        .banner_image{
            height: 320px;
        }
    }

.banner_text{
    position: absolute;
    right: calc((100vw - 1024px) / 2);
    top: 360px;
    background: var(--color-text-light);
    width: 190px;
    height: 60px;
    padding: 20px;
    vertical-align: middle;
    border: 1px solid var(--color-border-heavy);
}
    @media screen and (max-width: 1023px) {
        .banner_text{
            display: none;
        }

    }

.banner_text_main{
    font-size: 2.25em;
    line-height: 1em;
    color: var(--color-bg-normal);
    margin: 0;
    font-weight: 700;
}

.banner_text_sub{
    margin: 0;
    color: var(--color-bg-normal);
    font-weight: 700;
}

/*主题*/
.body_index {
    margin: auto;
    background-color: var(--color-bg-normal);
}
    @media screen and (max-width: 1023px) {
        .body_index {
            padding: 0 calc(50 / 1024 * 100vw) 0 calc(50 / 1024 * 100vw);
        }
    }
    @media screen and (min-width: 1024px) {
        .body_index {
            width: 1024px;
        }
    }

.frame_title{
    font-size: 2em;
    font-weight: 700;
    border-bottom: 3px solid var(--color-border-heavy);
    padding-bottom: 5px;
}

.post_frame{
    padding-top: 20px;
    padding-bottom: 20px;
    display: flex;
}
    @media screen and (max-width: 1023px) {
        .post_frame {
            display: block;
        }
    }
    @media screen and (min-width: 1024px) {
        .post_frame {
            display: flex;
        }
    }

.post_frame_left{
    width: 50%;
    margin: 0px 20px 0px 0px;
}
    @media screen and (max-width: 1023px) {
        .post_frame_left {
            width: 100%;
            padding-bottom: 20px;
        }
    }

.post_frame_right{
    width: 50%;
    margin: 0px 0px 0px 20px;
}
    @media screen and (max-width: 1023px) {
        .post_frame_right {
            display: none;
        }
    }

.main_post{
    border-bottom: 1px solid var(--color-border-normal);
    margin-bottom: 20px;
}

.main_post_title {
    display: inline;
    flex: 5;
    margin: 0;
    position: relative;
    font-weight: 700;
    padding-left: 30px;
    font-size: 1.5em;
    padding-bottom: 5px;
}

.main_post_title::before {
    content: "";
    position: absolute;
    width: 20px;
    height: 20px;
    background: var(--color-text-normal);
    left: 0;
    top: 10px;
    border-radius: 2px;
}
    @media screen and (max-width: 1023px) {
        .main_post_title::before {
            top: 8px;
        }
    }

.main_post_main{
    text-align: justify;
}

.sub_post{
    border-bottom: 1px solid var(--color-border-normal);
    margin-bottom: 20px;
}

.sub_border_none{
    border-bottom: none!important;
}

.sub_post_title {
    display: inline;
    flex: 5;
    margin: 0;
    position: relative;
    font-weight: 700;
    padding-left: 20px;
    font-size: 1.2em;
    padding-bottom: 5px;
}

.sub_post_title::before {
    content: "";
    position: absolute;
    width: 15px;
    height: 15px;
    background: var(--color-text-normal);
    left: 0;
    top: 8px;
    border-radius: 2px;
}
    @media screen and (max-width: 1023px) {
        .sub_post_title::before {
            top: 6px;
        }
    }

.sub_post_main{
    text-align: justify;
}

.see_more{
    padding: 20px;
    position: relative;
    font-weight: 700;
    font-size: 1.5em;
    border: 2px solid var(--color-border-heavy);
    transition: 0.2s;
}
.see_more:hover{
    border-color: var(--color-text-link-hover);
}

/* 分类 */
.category_frame{
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
}

@media screen and (max-width: 1023px){
    .category_information:nth-child(1n){
        margin-left: 0;
    }
}

@media screen and (min-width: 1024px){
    .category_information:nth-child(2n-1){
        margin-left: 0;
    }
}

.category_information{
    box-sizing: border-box;
    margin-left: 10%;
    margin-top: 20px;
    margin-bottom: 20px;
    padding: 20px;
    border: 2px solid var(--color-border-heavy);
}
    @media screen and (max-width: 1023px) {
        .category_information {
            flex: 100%;
        }
    }
    @media screen and (min-width: 1024px) {
        .category_information {
            flex: 45%;
        }
    }

.category_name{
    font-size: 1.5em;
    font-weight: 700;
    padding-bottom: 5px;
    border-bottom: 1px dashed var(--color-border-normal);
    margin-bottom: 5px;
}

a:hover .category_name{
    border-color: var(--color-text-link-hover);
}

.category_description{
    text-align: justify;
}

.links_frame{
    margin: 5px 0px 15px 0;
    display: flex;
    padding-bottom: 20px;
}

.links{
    border: 2px solid var(--color-border-heavy);
    padding: 5px 15px 5px 10px;
    margin: 10px;
    font-weight: 700;
}

.links:hover{
    border-color: var(--color-text-link-hover);
}

/*首页_页脚*/

.footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 0.8rem;
    background: var(--color-bg-light);
    border-top: 1px solid var(--color-border-light);
}
    @media screen and (max-width:450px) {
        .footer{
            display: block;
            text-align: center;
            padding: 20px calc(30 / 1024 * 100vw) 10px calc(30 / 1024 * 100vw);
        }
    }
    @media screen and (min-width:451px) and (max-width:1023px) {
        .footer{
            padding: 20px calc(30 / 1024 * 100vw) 10px calc(30 / 1024 * 100vw);
        }
    }
    @media screen and (min-width:1024px) {
        .footer{

            padding: 20px calc((100vw - 1024px) / 2) 10px calc((100vw - 1024px) / 2);
        }
    }

.footer_left .site_info{
    display: flex;
    align-items: center;
}
    @media screen and (max-width:450px) {
        .footer_left .site_info{
            display: flex;
            justify-content: center;
        }
    }

.footer_left .site_info img{
    height: 48px;
    width:48px;
    padding-right:10px;
}

.footer_left .site_info .site_name{
    font-size:2em;
    font-family: "Huiwen-mincho";
}

.footer_left .site_description{
    font-size: 1em;
    font-family: "Huiwen-mincho";
}

.footer_icon{
    flex: 4;
    display: flex;
    justify-content: left;
    position: relative;
}
    @media screen and (max-width:600px) {
        .footer_icon{
            justify-content: center;
            border-bottom: 1px solid var(--color-border-normal);
        }
    }

.footer_icon_button{
    margin: 10px;
    cursor: pointer;
    border: none;
    color: var(--color-text-link);
    background: transparent;
}

.footer_icon_button i{
    font-size:1.2em;
}

#footer_icon_button_rss{
    padding-left:0;
    margin-left:0;
}

.copyright {
    display: inline-block;
    color: var(--color-text-light);
    line-height: 1.4rem;
    word-spacing: 1px;
    text-align: right;
    flex: 6;
    position: relative;
    font-family: "Noto Sans SC";
}
    @media screen and (max-width:451px) {
        .copyright{
            text-align: center;
        }
    }

/*文章页面*/
.post_content {
    letter-spacing: 2px;
    line-height: 2em;
    margin-bottom: 1.5em;
    text-align: justify;
    font-family: 'Noto Serif SC', serif;
}

.post_content a {
    position: relative;
    text-decoration: none;
    word-break: break-all;
    border-bottom: 1px dashed var(--color-border-normal);
    transition: 1s;
}

.post_content a:hover{
    border-bottom: 1px dashed var(--color-text-link-hover);
}

/* 文章翻页器 */
.post_navigator{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin: 40px 0;
}
    @media screen and (max-width:450px) {
        .post_navigator_prev{
            width: 100%;
            margin-bottom: 20px;
        }
        .post_navigator_next{
            width: 100%;
        }
    }

.post_navigator_prev{
    padding: 20px;
    border: 2px solid var(--color-border-heavy);
    border-radius: 1px;
}

.post_navigator_prev_title{
    font-size: 1.5em;
    font-weight: 700;
}

.post_navigator_prev_link{
    font-size: 1.2em;
    font-weight: 700;
}

.post_navigator_next{
    padding: 20px;
    border: 2px solid var(--color-border-heavy);
    border-radius: 1px;
}

.post_navigator_next_title{
    font-size: 1.5em;
    font-weight: 700;
}

.post_navigator_next_link{
    font-size: 1.2em;
    font-weight: 700;
}

/* 马克凼：字体颜色、段落 */
.markdown {
    color: var(--color-text-normal);
}

.markdown p {
    letter-spacing: 1px;
    margin: 1em 0
}

/* 马克凼：标题 */
.markdown h1, .markdown h2, .markdown h3, .markdown h4, .markdown h5, .markdown h6 {
    text-rendering: optimizeLegibility;
    line-height: 1;
    color: var(--color-text-normal);
    font-family: 'Noto Serif SC', serif;
    letter-spacing: normal;
    position: relative;
    text-indent: 1em;
}

.markdown h1::before, .markdown h2::before, .markdown h3::before, .markdown h4::before, .markdown h5::before, .markdown h6::before {
    content: '';
    left: -0.5em;
    top: 50%;
    height: 1em;
    width: 1em;
    background-color: var(--color-border-heavy);
    position: absolute;
    opacity: 0.77;
    -webkit-transform: translate(0%, -50%);
    -ms-transform: translate(0%, -50%);
    transform: translate(0%, -50%);
    box-shadow: 3px 3px var(--color-border-medium);
}

.markdown h1 {
    font-size: 1.6em;
    line-height: 1.6em;
    margin: 1em 0 1em 15px;
}

.markdown h2 {
    font-size: 1.5em;
    line-height: 1.5em;
    margin: 1em 0 1em 15px;
}

.markdown h3 {
    font-size: 1.4em;
    line-height: 1.4em;
    margin: 1em 0 1em 15px;
}

.markdown h4 {
    line-height: 1.3em;
    font-size: 1.3em;
    margin: 1em 0 1em 15px;
}

.markdown h5 {
    line-height: 1.2em;
    font-size: 1.2em;
    margin: 1em 0 1em 15px;
}

.markdown h6 {
    font-size: 1em;
    margin: 1em 0 1em 15px;
}

.markdown hr {
    border: 0;
    background: repeating-linear-gradient(135deg, #a2a9b6 0px, #a2a9b6 1px, transparent 1px, transparent 6px);
    padding: 3px;
}

/* 马克凼：引用快、提示块、警告块 */
.markdown blockquote {
    background-color:var(--color-text-blockquote-bg);
    box-shadow: var(--color-text-blockquote-shadow);
    color: var(--color-text-blockquote);
    border-left:3px solid var(--color-text-light);
    --text-opacity:1;
    margin:10px 8px;
    padding:15px;
}

.markdown blockquote p{
    margin: 0.5em 0;
    text-indent: 1em;
}

.markdown p.tip {
    text-indent: 0;
    border-left: 4px solid #42b983;
    padding: 15px !important;
    background-color: var(--color-text-p-tip-bg);
    --text-opacity: 1 !important;
    color: var(--color-text-p-tip);
    box-shadow: 0 4px 11px 0 rgb(37 44 97 / 9%), 0 1px 3px 0 rgb(93 100 148 / 6%) !important;
    margin: 10px 8px !important;
}

.markdown p.warn {
    position: relative;
    border-left: 4px solid #f66;
    padding: 15px !important;
    background-color: var(--color-text-p-warn-bg);
    --text-opacity: 1 !important;
    color: var(--color-text-p-warn);
    box-shadow: 0 4px 11px 0 rgb(37 44 97 / 9%), 0 1px 3px 0 rgb(93 100 148 / 6%) !important;
    margin: 10px 8px !important;
    text-indent: 0;
}

.markdown p.warn:before {
    background-color: #f66;
    border-radius: 100%;
    color: #fff;
    content: '!';
    font-family: Dosis, Source Sans Pro, Helvetica Neue, Arial, sans-serif;
    font-size: 14px;
    font-weight: 700;
    left: -12px;
    line-height: 20px;
    position: absolute;
    height: 20px;
    width: 20px;
    text-align: center;
    top: 14px;
}

.markdown img {
    margin: auto;
    max-width: 50%;
    display: block;
    border-radius: 3px;
    border: 3px solid var(--color-border-heavy);
    padding: 3px;
}

/* 马克凼：折叠内容 */
.markdown details {
    margin: 1.5rem 0;
    padding: 0.5rem 1rem;
    background: var(--color-text-blockquote-bg);
    border: 1px solid #55555555;
    box-shadow: var(--color-text-blockquote-shadow);
    border-radius: 3px;
}

.markdown summary {
    display: block;
    outline: none;
    cursor: pointer;
}

.markdown details > summary:before {
    font-family: 'iconfont' !important;
    font-style: normal !important;
    left: 0.6rem;
    color: #55555555;
    font-size: 1em;
    font-weight: bold;
    content: '\e68c';
}

/* 马克凼：代码高亮 */

/* 行内代码样式 */
.markdown code:not([class]){
    background-color:var(--color-text-code-inline-bg);
    border:0;
    border-radius:3px;
    bottom:1px;
    color:var(--color-text-code-inline);
    display:inline;
    font-weight:700;
    padding:2px 4px;
    position:relative
}

/* 代码块样式 */
.markdown pre {
    padding: 10px;
    white-space: pre;
    overflow: auto;
    margin: 0;
    border-radius: 0 0 4px 4px !important;
    border: 0 !important;
    word-break: break-all;
    word-wrap: break-word;
    counter-reset: itemcounter;
    font-weight: 400;
}

.markdown code {
    font-size: 14px;
    font-family: Source Code Pro,Consolas,Menlo,Monaco,Courier New,monospace!important;
    line-height: 1.4;
}

.markdown pre:not(.hljs) {
    color: #23263b;
}

.markdown pre .line-numbers-rows {
    counter-increment: itemcounter;
    position: absolute;
    left: 1px;
    width: 34px;
    text-align: center;
    color: #999;
}

/* 行号盒子、代码盒子 */
.code-pre-line,
code-box {
    position: relative;
    display: block;
}

code-box {
    margin: 5px;
    border-radius: 4px;
    -webkit-box-shadow: 0 4px 11px -2px rgb(37 44 97 / 15%), 0 1px 3px 0 rgb(93 100 148 / 6%);
    box-shadow: 0 4px 11px -2px rgb(37 44 97 / 15%), 0 1px 3px 0 rgb(93 100 148 / 6%);
}

/* 代码类型 */
.code-hljs-len {
    display: inline-block;
    position: absolute;
    top: 6px;
    left: 73px;
    height: 22px;
    line-height: 22px;
    padding: 0 6px;
    border-radius: 2px;
    color: #999;
    font-size: 12px;
    background-color: hsla(0, 0%, 90.2%, 0.1);
    visibility: hidden;
}

/* 代码盒子工具 */
code-box .code-tools {
    position: relative;
    display: flex;
    -webkit-box-align: center;
    -moz-box-align: center;
    -o-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
    overflow: hidden;
    min-height: 1.2rem;
    color: rgba(238, 255, 255, 0.8);
    font-size: 14px;
    border-radius: 4px 4px 0 0;
    height: 16px;
    padding: 6px;
    box-sizing: content-box;
}

/* 代码盒子样式：红绿灯样式 */
code-box .code-tools:after {
    position: absolute;
    left: 12px;
    top: 11px;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #fc625d;
    -webkit-box-shadow: 20px 0 #fdbc40, 40px 0 #35cd4b;
    box-shadow: 20px 0 #fdbc40, 40px 0 #35cd4b;
    content: ' ';
}

/* 行号 */
pre .line-numbers-rows:before {
    content: counter(itemcounter);
}

/* 行号块 */
.code-pre-line {
    padding-left: 44px !important;
}

/* 复制按钮 */
.code-copay-btn {
    position: absolute;
    top: 6px;
    right: 8px;
    justify-content: center;
    align-items: center;
    width: 26px;
    height: 24px;
    display: flex;
    cursor: pointer;
    text-align: center;
    font-size: 14px;
    padding: 1px 0 0 2px;
    border: none;
    border-radius: 6px;
    color: #999;
    opacity: 0;
    visibility: hidden;
    background-color: hsla(0, 0%, 90.2%, 0.2);
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    transition: opacity 0.2s ease-in-out, visibility 0.2s ease-in-out;
    z-index: 1;
}

/*独立页面*/
.page_thumb {
    height: 450px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    -webkit-transition: .2s;
    -moz-transition: .2s;
    -ms-transition: .2s;
    -o-transition: .2s;
    transition: .2s;
}

.page_thumb h1 {
    color: var(--color-text-index-subtitle);
    font-size: 26px;
    letter-spacing: 2px;
    font-weight: 600;
    text-shadow: 0px 1px 4px #000;
    -webkit-transition: all .2s ease;
    -moz-transition: all .2s ease;
    transition: all .2s ease;
    backdrop-filter: blur(1px)
}

.post_frame_block{
    padding: 20px 1em 0 1em;
}

.post_friendship-links_block{
    padding: 20px 1em 1em 1em;
    display: flex;
}

.post_body_block{
    padding: 20px;
    border: 2px solid var(--color-border-heavy);
    margin-bottom: 20px;
}

.post_body_block:hover{
    border-color: var(--color-text-link-hover);
}

.post_title_block{
    position: relative;
    font-size: 1.5em;
    font-weight: 700;
}

.pagination {
    padding: 20px 0 30px 0;
}

.pagination .pre {
    float: left
}

.pagination .next {
    float: right
}

/*归档页面*/
.post-list {
    padding: 0;
    border-bottom: 1px dashed var(--color-border-normal);
}



.post-list .post-item {
    list-style-type: none;
    margin-left: 0;
    margin-bottom: 1rem
}

.post-list .post-item .meta {
    font-size: 14px;
    color: #999;
    float: right;
}

#wrappe {
    margin-bottom: 50px;
    background-color: var(--color-bg-normal);
}

#wrappe h3{
    border-bottom: 4px solid var(--color-border-heavy);
    display: inline-block;
    padding: 10px 10px 5px 0px;
}

/*分类页面*/
.category_info {
    text-align: center;
}

/* 打印样式 */
@media print{
    :root{
        font-size: 16px;
    }
    .navbar, .color_toggle, .index_subtitle, .pagination, .prev-next, .meta, .post_thumb .post_category, .banner_text{
        display: none;
    }
    .header_index, .body_index, .main, .footer, body, .main_frame, .post_page, .post_content img{
        background: #fff !important;
        border: none;
        box-shadow: none;
    }
    .post_thumb, .post_eof{
        padding: 20px;
    }
}