// HTML
html {
    background-color: #f5f5f5;
    color: #1f1f1f;
}

// 滚动条
html::-webkit-scrollbar-thumb {
    background-color: #0000000d;
}

html::-webkit-scrollbar-thumb:hover {
    background-color: #00000026;
}

::selection {
    background: #0095ff1a;
}

// Body
body {
    display: flex;
    flex-wrap: nowrap;
    flex-direction: column;
    align-items: center;
}

// Header 头部
.header {

    // 站点标题
    .title {

        a {
            span {
                color: rgb(0, 0, 0);

                &:hover {
                    color: rgba(0, 0, 0, 0.65);
                }
            }
        }
    }

    // 二级标题
    .description {
        color: rgba(0, 0, 0, 0.65);

        .socials {
            a {
                color: rgba(0, 0, 0, 0.65);

                &:hover {
                    color: rgba(0, 0, 0, 0.85);
                }
            }
        }
    }

}

// main 主体
main {
    background: #ffffff;
    box-shadow: 0 0.375rem 1rem -0.5rem rgba(0, 0, 0, 0.08);

    .post {
        h1 {
            a {
                color: rgba(0, 0, 0, 1);

            }
        }

        p {
            color: rgba(0, 0, 0, 0.85);
        }

        .info {
            border-bottom: 1px solid #f3f3f3;

            span {
                color: rgb(0, 0, 0, 0.65);
            }

            a {
                color: rgb(0, 0, 0, 0.65);
            }

            .date,
            .tag {
                i {
                    color: rgb(0, 0, 0, 0.85);
                }

            }
        }
    }

    .pagenav {
        border-bottom: 1px solid #f2f2f2;

        a {
            color: rgb(0, 0, 0);

            &:hover {
                color: rgb(0, 0, 0, 0.65);
            }
        }
    }
}

// 脚注

footer {
    .copyright {
        a {
            color: rgb(0, 0, 0, 0.25);
            &:hover {
                color: rgb(0, 0, 0, 0.85);
            }

        }
    }
}