/* ==========================================================================
   配合博客园「自定义」皮肤使用：
   后台 → 设置 → 页面定制 CSS 代码 → 整段粘贴本文件 → 保存
   详细步骤见 README.md
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. 设计变量 —— 想换配色、圆角、栏宽，只改这一段
   -------------------------------------------------------------------------- */
:root {
    /* 版式 */
    --page-width: 1120px;
    --sidebar-width: 300px;
    --page-gutter: 20px;
    --page-gap: 28px;
    --header-height: 54px;
    --radius: 12px;
    --radius-md: 18px;
    --radius-lg: 24px;
    --radius-pill: 999px;

    /* 底色与玻璃面 */
    --page-bg: #f3f0e9;
    --entry: rgb(255 254 250 / 0.46);
    --entry-strong: rgb(253 251 245 / 0.68);
    --header-glass: rgb(250 248 241 / 0.62);
    --navbar-glass: rgb(249 247 240 / 0.74);

    /* 文字 */
    --primary: #47534b;
    --secondary: #6d776f;
    --tertiary: rgb(137 150 139 / 0.14);
    --content: #3f4942;
    --heading: #39443c;
    --link: #5c7566;
    --link-hover: #41594a;
    --accent: #6f8a79;
    --accent-strong: #5f7a69;
    --on-accent: #ffffff;

    /* 代码与描边 */
    --code-bg: rgb(234 231 220 / 0.58);
    --code-block-bg: #2d3330;
    --code-line: rgb(255 255 255 / 0.07);
    --border: rgb(110 122 112 / 0.18);
    --glass-line: rgb(255 255 255 / 0.66);
    --glass-shadow: rgb(93 104 95 / 0.12);
    --scroll-thumb: rgb(131 143 132 / 0.32);
    --selection: rgb(148 173 157 / 0.32);

    /* 弥散光 */
    --aurora-green: rgb(174 191 176 / 0.5);
    --aurora-blue: rgb(159 183 193 / 0.42);
    --aurora-rose: rgb(199 170 165 / 0.38);
    --aurora-sand: rgb(193 182 154 / 0.4);
    --aurora-lilac: rgb(179 170 190 / 0.32);

    /* 博客园自带目录浮层的配色 */
    --cnblogs-toc-bg-color: rgb(252 250 244 / 0.94);
    --cnblogs-toc-highlight-color: rgb(137 150 139 / 0.2);
    --cnblogs-toc-color: var(--heading);

    /* 博客园自带「合集」导航的配色 */
    --cnblogs-current-collection-bg-color: var(--entry-strong);
    --cnblogs-current-collection-highlight-color: rgb(111 138 121 / 0.13);
    --cnblogs-current-collection-hover-color: rgb(137 150 139 / 0.1);
    --cnblogs-current-collection-active-color: rgb(111 138 121 / 0.18);
    --cnblogs-current-collection-color: var(--heading);

    color-scheme: light;
}

/* --------------------------------------------------------------------------
   2. 基础
   -------------------------------------------------------------------------- */
html {
    background-color: var(--page-bg);
    scrollbar-color: var(--scroll-thumb) transparent;
}

body {
    min-height: 101%;
    margin: 0;
    color: var(--content);
    background: transparent !important;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
        "PingFang SC", "Hiragino Sans GB", "Source Han Sans SC",
        "Noto Sans CJK SC", "Noto Sans SC", "Microsoft YaHei UI",
        "Microsoft YaHei", sans-serif;
    font-size: 15px;
    line-height: 1.75;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* 弥散光：铺满视口的柔和色场 */
body::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -2;
    pointer-events: none;
    background:
        radial-gradient(46rem 46rem at 9% -8%, var(--aurora-green) 0%, transparent 62%),
        radial-gradient(40rem 40rem at 92% 2%, var(--aurora-blue) 0%, transparent 60%),
        radial-gradient(44rem 44rem at 16% 46%, var(--aurora-sand) 0%, transparent 64%),
        radial-gradient(50rem 50rem at 95% 48%, var(--aurora-rose) 0%, transparent 64%),
        radial-gradient(38rem 38rem at 34% 90%, var(--aurora-lilac) 0%, transparent 62%),
        radial-gradient(42rem 42rem at 76% 92%, var(--aurora-blue) 0%, transparent 62%);
}

/* 极淡噪点，避免大色块显得过于平滑 */
body::after {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    opacity: 0.05;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='0.55'/%3E%3C/svg%3E");
}

::selection {
    background: var(--selection);
}

::-webkit-scrollbar {
    width: 10px;
    height: 10px;
    background: transparent;
}

::-webkit-scrollbar-track {
    background: transparent;
}

::-webkit-scrollbar-thumb {
    background: var(--scroll-thumb);
    border: 2px solid transparent;
    background-clip: padding-box;
    border-radius: 8px;
}

::-webkit-scrollbar-thumb:hover {
    background: var(--secondary);
    background-clip: padding-box;
}

a:link,
a:visited {
    color: var(--link);
}

a:hover {
    color: var(--link-hover);
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
summary:focus-visible {
    outline: 2px solid var(--accent);
    outline-offset: 2px;
    border-radius: 6px;
}

[id] {
    scroll-margin-top: 88px;
}

/* --------------------------------------------------------------------------
   3. 博客园全局顶栏（保留，只做玻璃化）
   -------------------------------------------------------------------------- */
#top_nav.navbar {
    background: var(--navbar-glass);
    border-bottom: 1px solid var(--border);
    box-shadow: 0 12px 30px -26px var(--glass-shadow);
    -webkit-backdrop-filter: blur(18px) saturate(1.5);
    backdrop-filter: blur(18px) saturate(1.5);
}

#top_nav.navbar>nav {
    color: var(--secondary);
}

#top_nav.navbar a:link,
#top_nav.navbar a:visited,
#top_nav.navbar .navbar-list>li>a {
    color: var(--secondary);
    transition: color 0.2s ease;
}

#top_nav.navbar a:hover {
    color: var(--accent-strong);
}

#top_nav #zzk_search_input {
    background: var(--entry-strong);
    border: 1px solid var(--border);
    border-radius: var(--radius-pill);
    color: var(--content);
    padding-inline: 14px;
}

#top_nav #zzk_search_input::placeholder {
    color: var(--secondary);
}

#top_nav .dropdown-menu {
    background: var(--header-glass);
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    box-shadow: 0 22px 44px -28px var(--glass-shadow);
    -webkit-backdrop-filter: blur(22px) saturate(1.5);
    backdrop-filter: blur(22px) saturate(1.5);
}

/* --------------------------------------------------------------------------
   4. 页面容器与主布局
   -------------------------------------------------------------------------- */
/* 正文与页脚居中；外壳保持通栏，顶栏才能铺满左右两端 */
#main,
#footer {
    max-width: var(--page-width);
    margin-inline: auto;
    padding-inline: var(--page-gutter);
}

#main {
    display: flex;
    align-items: flex-start;
    gap: var(--page-gap);
    margin-block: 24px 0;
}

#mainContent {
    flex: 1 1 auto;
    min-width: 0;
}

#sideBar {
    flex: 0 0 var(--sidebar-width);
    width: var(--sidebar-width);
    min-width: 0;
    overflow-wrap: anywhere;
}

/* .clear 在 flex 容器里会变成多余的占位项 */
#main>.clear,
#home>.clear {
    display: none;
}

/* --------------------------------------------------------------------------
   5. 顶部玻璃导航栏（贴着页面最上沿、通栏，内容与正文栏对齐）
   -------------------------------------------------------------------------- */
#header {
    position: sticky;
    top: 0;
    z-index: 60;
    display: flex;
    align-items: center;
    gap: 14px;
    min-height: var(--header-height);
    margin: 0;
    /* 左右 padding = 正文栏距视口边缘的偏移，保证内部内容与正文左右对齐 */
    padding-block: 8px;
    padding-inline: max(var(--page-gutter), calc(50% - var(--page-width) / 2));
    background: var(--header-glass);
    border: 0;
    border-bottom: 1px solid var(--border);
    border-radius: 0;
    box-shadow: 0 12px 30px -28px var(--glass-shadow);
    -webkit-backdrop-filter: blur(24px) saturate(1.55);
    backdrop-filter: blur(24px) saturate(1.55);
}

/* 其他皮肤下博客园会显示一条固定顶栏，为它让出位置 */
body.has-navbar {
    margin-top: 52px;
}

body.has-navbar #header {
    top: 52px;
}

/* 左侧：logo + 主标题 + 副标题（内容全部读取页面自身，主题不写死任何文字） */
#blogTitle {
    display: flex;
    align-items: center;
    gap: 10px;
    flex: 0 1 auto;
    min-width: 0;
    overflow: hidden;
}

#lnkBlogLogo {
    display: inline-flex;
    flex: 0 0 auto;
    line-height: 0;
}

#blogLogo {
    display: block;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    object-fit: cover;
    background: var(--entry-strong);
    border: 1px solid var(--glass-line);
    box-shadow: 0 6px 14px -10px var(--glass-shadow);
}

#blogTitle.mg-no-logo #lnkBlogLogo,
#lnkBlogLogo.mg-no-logo {
    display: none;
}

#blogTitle h1 {
    margin: 0;
    font-size: 20px;
    font-weight: 650;
    line-height: 1.3;
    letter-spacing: 0.01em;
    white-space: nowrap;
}

#blogTitle h1 a:link,
#blogTitle h1 a:visited,
#blogTitle h1 a:hover {
    color: var(--heading);
    text-decoration: none;
}

#blogTitle h1 a:hover {
    color: var(--accent-strong);
}

#blogTitle h2 {
    margin: 0 0 0 2px;
    padding: 0 0 0 12px;
    border-inline-start: 1px solid var(--border);
    font-size: 13px;
    font-weight: 400;
    line-height: 1.3;
    color: var(--secondary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

#blogTitle.mg-no-sub h2 {
    display: none;
}

/* 右侧：导航 */
#navigator {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    flex: 1 1 auto;
    min-width: 0;
}

#navList {
    display: flex;
    align-items: center;
    gap: 2px;
    margin: 0;
    padding: 0;
    list-style: none;
}

#navList li {
    line-height: normal;
    list-style: none;
}

#navList a {
    display: block;
    padding: 8px 13px;
    border: 0;
    border-radius: var(--radius-pill);
    background: transparent;
    text-align: center;
    text-shadow: none;
    font-size: 14.5px;
    line-height: 1.2;
    text-decoration: none;
    transition: color 0.2s ease, background-color 0.2s ease;
}

#navList a:link,
#navList a:visited,
#navList a:active {
    color: var(--secondary);
}

#navList a:hover {
    color: var(--primary);
    background: var(--tertiary);
    text-decoration: none;
}

#navList a.mg-current {
    color: var(--accent-strong);
    font-weight: 600;
}

#navigator .blogStats {
    float: none;
    margin: 0 0 0 2px;
    padding: 0 0 0 12px;
    border-inline-start: 1px solid var(--border);
    color: var(--secondary);
    font-size: 12px;
    line-height: 1.4;
    text-align: right;
    white-space: nowrap;
    opacity: 0.85;
}

/* 移动端汉堡按钮 */
.mg-menu-toggle {
    display: none;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 40px;
    height: 40px;
    margin-inline-start: auto;
    padding: 0;
    color: var(--primary);
    background: var(--entry);
    border: 1px solid var(--border);
    border-radius: 50%;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    transition: color 0.2s ease, background-color 0.2s ease;
}

.mg-menu-toggle:hover {
    color: var(--accent-strong);
    background: var(--tertiary);
}

.mg-menu-toggle svg {
    width: 18px;
    height: 18px;
}

/* --------------------------------------------------------------------------
   6. 玻璃卡片系统
   --------------------------------------------------------------------------
   卡片背后只有固定的弥散光（本身就是平滑渐变），再叠 backdrop-filter 几乎
   看不出差别，却会让整页多出十几个合成层。所以模糊只留给会与内容重叠的
   顶部导航栏和返回顶部按钮，卡片靠半透明底色出效果。
   -------------------------------------------------------------------------- */
.day,
#topics,
#sideBarMain .newsItem,
#sideBarMain .sidebar-block,
#comment_form,
#blog-comments-placeholder {
    background: var(--entry);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    box-shadow: 0 24px 48px -30px var(--glass-shadow),
        inset 0 1px 0 var(--glass-line);
}

/* --------------------------------------------------------------------------
   7. 首页 / 列表页：按天合并成一张卡片
   -------------------------------------------------------------------------- */
.day {
    margin: 0 0 20px;
    padding: clamp(1.15rem, 3vw, 1.7rem);
    transition: transform 0.28s cubic-bezier(0.22, 0.61, 0.36, 1),
        box-shadow 0.28s ease, border-color 0.28s ease;
}

.day:hover {
    transform: translateY(-3px);
    border-color: rgb(111 138 121 / 0.38);
    box-shadow: 0 30px 60px -30px var(--glass-shadow),
        inset 0 1px 0 var(--glass-line);
}

/* 日期分组标题隐藏：同一天的多篇随笔合并进同一张卡片 */
.dayTitle {
    display: none;
}

.postSeparator {
    height: 0;
    margin: 18px 0;
    border-top: 1px solid var(--border);
}

.day .postTitle {
    margin: 0 0 10px;
    font-size: 23px;
    font-weight: 650;
    line-height: 1.45;
}

.day .postTitle2 {
    color: var(--heading);
    text-decoration: none;
}

.day .postTitle2:hover {
    color: var(--accent-strong);
    text-decoration: none;
}

.c_b_p_desc {
    color: var(--secondary);
    font-size: 14.5px;
    line-height: 1.8;
}

.c_b_p_desc_readmore {
    margin-inline-start: 6px;
    color: var(--link);
    white-space: nowrap;
}

.c_b_p_desc_readmore:hover {
    color: var(--link-hover);
}

.day .postDesc,
#topics .postDesc {
    margin-top: 12px;
    color: var(--secondary);
    font-size: 13px;
    line-height: 1.7;
    text-align: left;
}

.day .postDesc a,
#topics .postDesc a {
    color: var(--secondary);
}

.day .postDesc a:hover,
#topics .postDesc a:hover {
    color: var(--accent-strong);
}

/* 列表分页 */
.topicListFooter {
    display: flex;
    justify-content: center;
    margin: 26px 0 8px;
}

#nav_next_page {
    display: flex;
    gap: 10px;
}

#nav_next_page a {
    display: inline-block;
    padding: 9px 24px;
    color: var(--secondary);
    background: var(--entry);
    border: 1px solid var(--border);
    border-radius: var(--radius-pill);
    box-shadow: 0 12px 26px -20px var(--glass-shadow),
        inset 0 1px 0 var(--glass-line);
    font-size: 14px;
    text-decoration: none;
    transition: color 0.2s ease, background-color 0.2s ease,
        border-color 0.2s ease, transform 0.2s ease;
}

#nav_next_page a:hover {
    color: var(--on-accent);
    background: var(--accent);
    border-color: transparent;
    text-decoration: none;
    transform: translateY(-1px);
}

/* --------------------------------------------------------------------------
   8. 文章页
   -------------------------------------------------------------------------- */
#topics {
    padding: clamp(1.35rem, 4.5vw, 2.6rem);
    background: var(--entry-strong);
}

#topics .postTitle {
    margin: 0 0 14px;
    color: var(--heading);
    font-size: clamp(1.55rem, 3.4vw, 2.05rem);
    font-weight: 700;
    line-height: 1.45;
    letter-spacing: 0.01em;
}

#topics .postTitle a:link,
#topics .postTitle a:visited {
    color: var(--heading) !important;
    text-decoration: none;
}

.postBody {
    color: var(--content);
    font-size: 16px;
    line-height: 1.9;
}

#cnblogs_post_body {
    font-size: 17.5px;
    line-height: 1.9;
    color: var(--content);
    overflow-wrap: anywhere;
    word-break: normal;
}

#cnblogs_post_body p,
#cnblogs_post_body li {
    letter-spacing: 0.005em;
}

#cnblogs_post_body p {
    margin: 0 0 1.15em;
}

#cnblogs_post_body h1,
#cnblogs_post_body h2,
#cnblogs_post_body h3,
#cnblogs_post_body h4,
#cnblogs_post_body h5,
#cnblogs_post_body h6 {
    color: var(--heading);
    font-weight: 650;
    line-height: 1.5;
    margin: 1.9em 0 0.7em;
}

#cnblogs_post_body h2 {
    font-size: 1.42em;
}

#cnblogs_post_body h3 {
    font-size: 1.22em;
}

#cnblogs_post_body h4 {
    font-size: 1.08em;
}

#cnblogs_post_body a:link,
#cnblogs_post_body a:visited {
    color: var(--link);
    text-decoration: none;
    box-shadow: 0 1px 0 rgb(111 138 121 / 0.45);
    transition: color 0.2s ease, box-shadow 0.2s ease;
}

#cnblogs_post_body a:hover {
    color: var(--link-hover);
    box-shadow: 0 2px 0 var(--link);
}

#cnblogs_post_body blockquote {
    margin: 1.4em 0;
    padding: 14px 20px;
    color: var(--secondary);
    background: var(--tertiary);
    background-image: none;
    border: 0;
    border-inline-start: 3px solid var(--accent);
    border-radius: 0 var(--radius-md) var(--radius-md) 0;
}

#cnblogs_post_body blockquote p:last-child {
    margin-bottom: 0;
}

#cnblogs_post_body hr {
    height: 1px;
    margin: 2.2em 0;
    border: 0;
    background: linear-gradient(90deg, transparent, var(--border), transparent);
}

#cnblogs_post_body img {
    max-width: 100%;
    height: auto;
    border-radius: var(--radius-md);
}

#cnblogs_post_body ul,
#cnblogs_post_body ol {
    padding-inline-start: 1.5em;
    word-break: normal;
}

#cnblogs_post_body li {
    margin: 0.35em 0;
}

/* 表格（排除代码块里的行号表） */
#cnblogs_post_body table:not(.lntable):not(.highlighttable):not(.hljs-ln) {
    display: table;
    width: 100%;
    margin: 1.4em 0;
    border: 1px solid var(--border);
    border-collapse: separate;
    border-spacing: 0;
    border-radius: var(--radius-md);
    overflow: hidden;
    font-size: 15px;
}

#cnblogs_post_body table:not(.lntable):not(.highlighttable):not(.hljs-ln) th,
#cnblogs_post_body table:not(.lntable):not(.highlighttable):not(.hljs-ln) td {
    padding: 10px 14px;
    border-bottom: 1px solid var(--border);
}

#cnblogs_post_body table:not(.lntable):not(.highlighttable):not(.hljs-ln) th {
    color: var(--heading);
    font-weight: 650;
    background: var(--tertiary);
}

#cnblogs_post_body table:not(.lntable):not(.highlighttable):not(.hljs-ln) tr:nth-child(even) td {
    background: var(--tertiary);
}

#cnblogs_post_body table:not(.lntable):not(.highlighttable):not(.hljs-ln) tr:last-child td {
    border-bottom: 0;
}

/* --------------------------------------------------------------------------
   8.1 文章开头的「合集」导航
   -------------------------------------------------------------------------- */
#cnblogs_post_body .current-collection {
    max-width: none;
    margin: 0 0 1.9em;
    background: var(--entry-strong);
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    box-shadow: 0 16px 34px -28px var(--glass-shadow),
        inset 0 1px 0 var(--glass-line);
    overflow: hidden;
}

#cnblogs_post_body .current-collection-title {
    padding: 12px 16px;
    color: var(--heading);
    border-bottom: 1px solid var(--border);
    font-size: 15px;
    font-weight: 650;
    line-height: 1.5;
}

#cnblogs_post_body .current-collection-title .title-link,
#cnblogs_post_body .current-collection-title .title-link:link,
#cnblogs_post_body .current-collection-title .title-link:visited {
    color: var(--heading);
    box-shadow: none;
    text-decoration: none;
}

#cnblogs_post_body .current-collection-title .title-link:hover {
    color: var(--accent-strong);
}

#cnblogs_post_body .current-collection .icon-button {
    width: 26px;
    height: 26px;
    border-radius: 50%;
    opacity: 0.45;
    transition: opacity 0.2s ease, background-color 0.2s ease;
}

#cnblogs_post_body .current-collection .icon-button:hover {
    opacity: 1;
    background: var(--code-bg);
}

#cnblogs_post_body .current-collection-links {
    max-height: 340px;
    padding: 4px 0;
}

#cnblogs_post_body .current-collection-links>.current-collection-item {
    padding: 9px 16px;
    color: var(--secondary);
    border-top: 1px solid var(--border);
    font-size: 14.5px;
    line-height: 1.65;
    transition: background-color 0.2s ease, color 0.2s ease;
}

#cnblogs_post_body .current-collection-links>.current-collection-item:first-child {
    border-top: 0;
}

#cnblogs_post_body .current-collection-links .current-collection-link,
#cnblogs_post_body .current-collection-links .current-collection-link:link,
#cnblogs_post_body .current-collection-links .current-collection-link:visited {
    color: var(--secondary);
    box-shadow: none;
}

#cnblogs_post_body .current-collection-links .current-collection-link:hover {
    color: var(--accent-strong);
    background: var(--tertiary);
}

/* 当前阅读的这篇 */
#cnblogs_post_body .current-collection-links>.current-collection-item.current {
    color: var(--heading);
    background: rgb(111 138 121 / 0.13);
    font-weight: 650;
}

#cnblogs_post_body .current-collection-item-serial {
    margin-right: 8px;
    color: var(--secondary);
    opacity: 0.75;
    font-variant-numeric: tabular-nums;
}

#cnblogs_post_body .current-collection-publish-date {
    margin-left: 12px;
    color: var(--secondary);
    opacity: 0.75;
    font-size: 13px;
    font-variant-numeric: tabular-nums;
}

#cnblogs_post_body .current-collection-footer {
    padding: 9px 16px;
    border-top: 1px solid var(--border);
}

#cnblogs_post_body .current-collection-collapse-button {
    color: var(--secondary);
    border-radius: var(--radius);
    font-size: 13.5px;
    transition: color 0.2s ease;
}

#cnblogs_post_body .current-collection-collapse-button:hover {
    color: var(--accent-strong);
}

#cnblogs_post_body .current-collection-arrow {
    width: 1.6em;
    height: 1.6em;
    opacity: 0.5;
}

/* --------------------------------------------------------------------------
   9. 代码块：行内浅底、围栏深底（与 Hugo 主题一致）
   -------------------------------------------------------------------------- */
#cnblogs_post_body code {
    padding: 0.15em 0.42em;
    color: var(--heading);
    background: var(--code-bg);
    border: 1px solid rgb(110 122 112 / 0.1);
    border-radius: 6px;
    /* 沿用博客园后台选择等宽字体 */
    font-family: var(--code-font, ui-monospace, SFMono-Regular, "SF Mono",
            Menlo, Consolas, "Liberation Mono", monospace);
    font-size: 0.9em;
}

#cnblogs_post_body pre,
#cnblogs_post_body div.highlight,
#cnblogs_post_body .cnblogs_code {
    position: relative;
    margin: 1.5em 0;
    background: var(--code-block-bg) !important;
    border: 1px solid var(--code-line);
    border-radius: var(--radius-md);
    box-shadow: 0 16px 30px -24px var(--glass-shadow);
    overflow: auto;
}

/* 内边距必须留在 pre 上：Prism 把行号列绝对定位在 code 的定位框左侧 3.8em，
   一旦把边距挪到 code 上，行号就会和代码错行 */
#cnblogs_post_body pre {
    padding: 18px 20px;
    /* 字体也要放在 pre 上，行号列继承同一套字体才不会基线错位 */
    font-family: var(--code-font, ui-monospace, SFMono-Regular, "SF Mono",
            Menlo, Consolas, "Liberation Mono", monospace);
    font-size: 14px;
    line-height: 1.75;
}

#cnblogs_post_body div.highlight,
#cnblogs_post_body .cnblogs_code {
    padding: 0;
}

#cnblogs_post_body div.highlight pre,
#cnblogs_post_body .cnblogs_code pre {
    margin: 0;
    border: 0;
    border-radius: 0;
    box-shadow: none;
}

#cnblogs_post_body pre code {
    display: block;
    padding: 0;
    color: #dfe4e0;
    background: transparent !important;
    border: 0;
    border-radius: 0;
    font-family: var(--code-font, ui-monospace, SFMono-Regular, "SF Mono",
            Menlo, Consolas, "Liberation Mono", monospace);
    font-size: 14px;
    line-height: 1.75;
    tab-size: 4;
}

/* 行号列 */
#cnblogs_post_body pre.line-numbers {
    padding-left: 4.6em;
}

#cnblogs_post_body pre.line-numbers .line-numbers-rows {
    border-inline-end: 1px solid var(--code-line);
    color: rgb(255 255 255 / 0.3);
}

#cnblogs_post_body pre.line-numbers .line-numbers-rows>span::before {
    color: rgb(255 255 255 / 0.3);
}

#cnblogs_post_body pre.line-numbers .line-numbers-rows>span {
    padding-right: 0;
}

#cnblogs_post_body pre.line-numbers code span {
    font-family: inherit;
}

.cnblogs_code_toolbar {
    margin: 0 12px 8px;
    color: rgb(255 255 255 / 0.55);
    font-size: 12px;
}

.cnblogs_code_toolbar a:link,
.cnblogs_code_toolbar a:visited {
    color: rgb(255 255 255 / 0.55);
}

.cnblogs_code_toolbar a:hover {
    color: rgb(255 255 255 / 0.9);
}

/* 复制按钮（Prism 插件 / 博客园自绘两种形态都兼容） */
#cnblogs_post_body .code-toolbar>.toolbar {
    margin: 8px;
}

#cnblogs_post_body .toolbar-item>button,
#cnblogs_post_body button.copy-to-clipboard-button {
    padding: 4px 12px;
    color: rgb(255 255 255 / 0.65);
    background: rgb(255 255 255 / 0.07);
    border: 1px solid var(--code-line);
    border-radius: var(--radius-pill);
    font-size: 12px;
    cursor: pointer;
    transition: color 0.2s ease, background-color 0.2s ease;
}

#cnblogs_post_body .toolbar-item>button:hover,
#cnblogs_post_body button.copy-to-clipboard-button:hover {
    color: #ffffff;
    background: rgb(255 255 255 / 0.14);
}

/* 语法高亮：自带一套莫兰迪暗色 token，
   不受博客园「跟随系统切换高亮主题」影响 */
#cnblogs_post_body .token.comment,
#cnblogs_post_body .token.prolog,
#cnblogs_post_body .token.doctype,
#cnblogs_post_body .token.cdata {
    color: #7f8d85;
    font-style: italic;
}

#cnblogs_post_body .token.punctuation {
    color: #a9b3ad;
}

#cnblogs_post_body .token.property,
#cnblogs_post_body .token.attr-name,
#cnblogs_post_body .token.selector {
    color: #c9b7cf;
}

#cnblogs_post_body .token.tag {
    color: #c98f8f;
}

#cnblogs_post_body .token.boolean,
#cnblogs_post_body .token.number,
#cnblogs_post_body .token.constant,
#cnblogs_post_body .token.symbol,
#cnblogs_post_body .token.builtin {
    color: #d9b98a;
}

#cnblogs_post_body .token.string,
#cnblogs_post_body .token.char,
#cnblogs_post_body .token.attr-value,
#cnblogs_post_body .token.inserted {
    color: #b5c99a;
}

#cnblogs_post_body .token.operator,
#cnblogs_post_body .token.entity,
#cnblogs_post_body .token.url {
    color: #9db8d2;
}

#cnblogs_post_body .token.atrule,
#cnblogs_post_body .token.keyword {
    color: #9db8d2;
}

#cnblogs_post_body .token.function,
#cnblogs_post_body .token.class-name {
    color: #a8c8b8;
}

#cnblogs_post_body .token.regex,
#cnblogs_post_body .token.important,
#cnblogs_post_body .token.variable,
#cnblogs_post_body .token.deleted {
    color: #c98f8f;
}

#cnblogs_post_body pre ::selection,
#cnblogs_post_body .cnblogs_code ::selection {
    background: rgb(148 173 157 / 0.35);
}

/* --------------------------------------------------------------------------
   10. 文章页脚：签名、分类标签、作者、推荐、上下篇
   -------------------------------------------------------------------------- */
#MySignature {
    margin-top: 24px;
    padding: 14px 16px;
    color: var(--secondary);
    background: var(--code-bg);
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    font-size: 13px;
    line-height: 1.8;
}

#MySignature p {
    margin: 0;
}

#MySignature a {
    color: var(--link);
}

#blog_post_info_block {
    margin-top: 22px;
    padding-top: 20px;
    border-top: 1px solid var(--border);
}

/* 合集 / 分类 / 标签：统一成「标签文字 + 胶囊」的一行 */
.post-meta-item {
    color: var(--secondary);
    font-size: 13.5px;
}

#BlogCollection,
#BlogPostCategory,
#EntryTag .post-meta-tags {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0 0 10px;
}

#BlogCollection a,
#BlogPostCategory a,
#EntryTag .post-meta-tags a {
    display: inline-flex;
    align-items: center;
    padding: 4px 13px;
    color: var(--secondary);
    background: var(--code-bg);
    border: 1px solid var(--border);
    border-radius: var(--radius-pill);
    box-shadow: none;
    font-size: 13px;
    line-height: 1.7;
    text-decoration: none;
    transition: color 0.2s ease, background-color 0.2s ease,
        border-color 0.2s ease, transform 0.2s ease;
}

#BlogCollection a:hover,
#BlogPostCategory a:hover,
#EntryTag .post-meta-tags a:hover {
    color: var(--on-accent);
    background: var(--accent);
    border-color: transparent;
    transform: translateY(-1px);
}

.post-meta-disclaimer {
    color: var(--secondary);
    font-size: 12.5px;
    line-height: 1.7;
    opacity: 0.75;
    filter: none;
}

/* 作者信息 */
#author_profile {
    margin-top: 20px;
}

#author_profile_info {
    display: flex;
    align-items: center;
    gap: 12px;
}

img.author_avatar {
    width: 44px;
    height: 44px;
    background: var(--entry);
    border: 1px solid var(--glass-line);
    border-radius: 50%;
    object-fit: cover;
}

#author_profile_detail {
    color: var(--secondary);
    font-size: 13px;
    line-height: 1.8;
}

#author_profile_detail a {
    color: var(--heading);
    text-decoration: none;
}

#author_profile_detail a:hover {
    color: var(--accent-strong);
}

/* 作者附加信息（荣誉 / +加关注），与头像右侧的文字对齐 */
#author_profile_honor:not(:empty),
#author_profile_follow,
#p_b_follow {
    margin-top: 10px;
    padding-left: 56px;
    color: var(--secondary);
    font-size: 13px;
}

#author_profile_honor a,
#author_profile_follow a,
#p_b_follow a {
    color: var(--secondary);
    text-decoration: none;
}

#author_profile_honor a:hover,
#author_profile_follow a:hover,
#p_b_follow a:hover {
    color: var(--accent-strong);
}

/* 好文要顶 / 关注我 / 收藏该文 / 微信分享 */
#green_channel {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    width: auto;
    margin: 22px 0 0;
    padding: 0;
    border: 0;
    text-align: left;
}

#green_channel a {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 18px;
    background: var(--code-bg) !important;
    border: 1px solid rgb(110 122 112 / 0.28);
    border-radius: var(--radius-pill);
    /* 覆盖博客园自带的文字阴影、深色投影与加粗 */
    text-shadow: none;
    box-shadow: none;
    font-size: 13.5px;
    font-weight: normal;
    line-height: 1.6;
    text-decoration: none;
    transition: color 0.2s ease, background-color 0.2s ease,
        border-color 0.2s ease, transform 0.2s ease;
}

#green_channel a:link,
#green_channel a:visited,
#green_channel a:active {
    color: var(--primary) !important;
}

#green_channel a:hover {
    color: var(--on-accent) !important;
    background: var(--accent) !important;
    border-color: transparent;
    transform: translateY(-1px);
}

#green_channel img {
    box-shadow: none;
}

/* 推荐 / 反对：去掉博客园的贴图背景，改成与全站一致的小胶囊。
   贴图本身自带「推荐 / 反对」文字，这里用伪元素补回来。 */
#div_digg {
    display: flex;
    float: right;
    align-items: center;
    gap: 12px;
    width: auto;
    margin: 24px 0 0 20px;
    padding: 0;
    border: 0;
    font-size: 13px;
}

#div_digg>.clear {
    display: none;
}

#div_digg .diggit,
#div_digg .buryit {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    float: none;
    width: auto;
    height: auto;
    margin: 0;
    padding: 7px 18px;
    color: var(--primary);
    background: var(--code-bg);
    background-image: none;
    border: 1px solid rgb(110 122 112 / 0.28);
    border-radius: var(--radius-pill);
    cursor: pointer;
    transition: color 0.2s ease, background-color 0.2s ease,
        border-color 0.2s ease, transform 0.2s ease;
}

#div_digg .diggit::after {
    content: "推荐";
}

#div_digg .buryit::after {
    content: "反对";
}

#div_digg .diggit:hover {
    color: var(--on-accent);
    background: var(--accent);
    border-color: transparent;
    transform: translateY(-1px);
}

#div_digg .buryit:hover {
    color: var(--primary);
    background: var(--tertiary);
    transform: translateY(-1px);
}

#div_digg .diggnum,
#div_digg .burynum {
    color: var(--heading) !important;
    line-height: 1 !important;
    font-weight: 650;
}

#div_digg .diggword {
    color: var(--secondary);
    font-size: 12.5px;
}

/* 上一篇 / 下一篇 */
#post_next_prev {
    margin-top: 18px;
    padding-top: 18px;
    border-top: 1px solid var(--border);
    color: var(--secondary);
    font-size: 13.5px;
    line-height: 1.9;
}

#post_next_prev a {
    color: var(--link);
}

#post_next_prev a:hover {
    color: var(--link-hover);
}

#post_next_prev .p_n_p_prefix {
    color: var(--secondary);
}

#post_next_prev .post_next_prev_date {
    color: var(--secondary);
    opacity: 0.8;
}

/* --------------------------------------------------------------------------
   11. 侧边栏（保留全部模块，改造成玻璃卡片）
   -------------------------------------------------------------------------- */
#sideBarMain .newsItem,
#sideBarMain .sidebar-block {
    margin: 0 0 16px;
    padding: 16px 18px;
}

#sideBarMain .newsItem {
    padding-top: 16px;
}

/* 侧边栏卡片标题：博客园默认只给了一行弱样式，这里统一成小节标题 */
#sideBarMain .catListTitle,
#sideBarMain .newsItem .catListTitle {
    display: block;
    margin: 0 0 12px;
    padding: 0 0 10px;
    color: var(--heading);
    background: none;
    border: 0;
    border-bottom: 1px solid var(--border);
    text-align: left;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.5;
}

#sideBarMain .catListTitle a {
    color: var(--heading);
}

#sideBarMain .catListTitle a:hover {
    color: var(--accent-strong);
}

#sideBarMain ul {
    margin: 0;
    padding: 0;
    list-style: none;
    line-height: 1.7;
}

#sideBarMain li {
    margin: 0;
    list-style: none;
}

#sideBarMain li a {
    color: var(--secondary);
    text-decoration: none;
    transition: color 0.2s ease, background-color 0.2s ease;
}

#sideBarMain li a:hover {
    color: var(--accent-strong);
    text-decoration: none;
}

#sideBarMain .sidebar-category-item-count,
#sideBarMain .tag-count {
    color: var(--secondary);
    opacity: 0.7;
    font-size: 0.9em;
}

/* 公告 */
#sidebar_news_container {
    color: var(--secondary);
    font-size: 13.5px;
    line-height: 1.85;
}

#sidebar_news_container a {
    color: var(--link);
}

#sidebar_news_container img {
    max-width: 100%;
    height: auto;
    border-radius: var(--radius-md);
}

/* 公告为空时整块收起 */
#sidebar_news.mg-empty {
    display: none;
}

/* 搜索 */
#sidebar_search .div_my_zzk {
    display: flex;
    align-items: center;
    gap: 8px;
}

#q.input_my_zzk {
    flex: 1 1 auto;
    min-width: 0;
    height: 38px;
    padding: 0 14px;
    color: var(--content);
    background: var(--entry-strong);
    border: 1px solid var(--border);
    border-radius: var(--radius-pill);
    font-size: 14px;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

#q.input_my_zzk:focus {
    border-color: var(--accent);
    box-shadow: 0 0 0 3px var(--tertiary);
    outline: none;
}

#btnZzk {
    flex: 0 0 auto;
    height: 38px;
    padding: 0 18px;
    color: var(--on-accent);
    background: var(--accent);
    border: 1px solid transparent;
    border-radius: var(--radius-pill);
    font-size: 14px;
    cursor: pointer;
    transition: background-color 0.2s ease, transform 0.2s ease;
}

#btnZzk:hover {
    background: var(--accent-strong);
    transform: translateY(-1px);
}

/* 常用链接 / 分类 / 合集：行式列表 */
#sidebar_shortcut ul li a,
#sidebar_postcategory ul li a,
#sidebar_links0 ul li a {
    display: block;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 14px;
}

#sidebar_shortcut ul li a:hover,
#sidebar_postcategory ul li a:hover,
#sidebar_links0 ul li a:hover {
    color: var(--primary);
    background: var(--tertiary);
}

/* 我的标签：胶囊 */
#sidebar_toptags ul {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

#sidebar_toptags li a {
    display: inline-flex;
    align-items: baseline;
    gap: 4px;
    padding: 5px 13px;
    color: var(--secondary);
    background: var(--code-bg);
    border: 1px solid var(--border);
    border-radius: var(--radius-pill);
    font-size: 13px;
    line-height: 1.6;
    transition: color 0.2s ease, background-color 0.2s ease,
        border-color 0.2s ease, transform 0.2s ease;
}

#sidebar_toptags li a:hover {
    color: var(--on-accent);
    background: var(--accent);
    border-color: transparent;
    transform: translateY(-2px);
}

/* 日历（博客园默认折叠，展开后同样保持玻璃观感） */
#calendar {
    color: var(--secondary);
    font-size: 13px;
}

#calendar .CalTitle,
#calendar .CalDayHeader {
    color: var(--heading);
    background: none;
}

#calendar table {
    width: 100%;
    border-collapse: collapse;
}

#calendar table td,
#calendar table th {
    padding: 3px 0;
    text-align: center;
}

#calendar table a:link,
#calendar table a:visited {
    color: var(--secondary);
}

#calendar table a:hover,
#calendar .CalTodayDay {
    color: var(--accent-strong);
}

/* --------------------------------------------------------------------------
   12. 评论
   -------------------------------------------------------------------------- */
#comment_form,
#blog-comments-placeholder {
    margin-top: 22px;
    padding: clamp(1rem, 3vw, 1.6rem);
}

#comment_form {
    margin-bottom: 22px;
}

#comment_nav {
    color: var(--secondary);
    font-size: 13px;
}

#comment_nav a {
    color: var(--secondary);
}

#comment_nav a:hover {
    color: var(--accent-strong);
}

/* 「发表评论」标题 */
#commentform_title {
    margin: 0 0 14px;
    padding: 0 0 0 26px;
    color: var(--heading);
    font-size: 16px;
    font-weight: 600;
    line-height: 1.7;
    background-position: 0 center;
    background-size: 18px 18px;
}

#commentform_title a {
    margin-left: 12px;
    color: var(--secondary);
    font-size: 14px;
    font-weight: 400;
}

#commentform_title a:hover {
    color: var(--accent-strong);
}

/* 编辑器整体是一张玻璃卡 */
.comment_textarea,
.commentTextBox {
    width: 100%;
    max-width: 100%;
    height: auto;
    padding: 0;
    background: var(--entry-strong);
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    overflow: hidden;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.comment_textarea:focus-within {
    border-color: var(--accent);
    box-shadow: 0 0 0 3px var(--tertiary);
}

/* 卡片顶部的「编辑 / 预览」与工具栏 */
.commentbox_title {
    width: 100%;
    padding: 8px 14px 0;
    border-bottom: 1px solid var(--border);
}

.commentbox_title_left,
.commentbox_title_right {
    align-items: center;
    color: var(--secondary);
}

.commentbox_tab {
    margin: 0 16px 0 0;
    padding: 4px 2px 10px;
    color: var(--secondary);
    border-bottom: 2px solid transparent;
    font-size: 14px;
    letter-spacing: 0;
    line-height: 1.4;
    transition: color 0.2s ease, border-color 0.2s ease;
}

.commentbox_tab.active,
.commentbox_tab:hover {
    color: var(--accent-strong);
    border-bottom-color: var(--accent);
}

.comment_option {
    margin-bottom: 0;
    color: var(--secondary);
    fill: var(--secondary);
    opacity: 0.75;
    transition: opacity 0.2s ease;
}

.comment_option:hover {
    color: var(--accent-strong);
    fill: var(--accent-strong);
    opacity: 1;
}

.comment_icon {
    margin-left: 16px;
}

.comment_svg {
    width: 17px;
    height: 17px;
    fill: currentColor;
}

#comment_form_container input[type="text"],
#comment_form_container input[type="email"],
#comment_form_container input[type="url"],
#comment_form_container input:not([type]) {
    height: 34px;
    padding: 0 12px;
    color: var(--content);
    background: var(--entry-strong);
    border: 1px solid var(--border);
    border-radius: var(--radius-pill);
    font-family: inherit;
    font-size: 14px;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

#comment_form_container input:focus {
    border-color: var(--accent);
    box-shadow: 0 0 0 3px var(--tertiary);
    outline: none;
}

#comment_form_container,
#comment_form_container * {
    box-sizing: border-box;
}

/* 输入区留在卡片内部，不再自成一框 */
textarea#tbCommentBody,
#tbCommentBodyPreview,
.comment_preview {
    display: block;
    width: 100%;
    min-height: 170px;
    padding: 14px 16px;
    color: var(--content);
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    font-family: inherit;
    font-size: 15px;
    line-height: 1.85;
    resize: vertical;
}

textarea#tbCommentBody:focus {
    outline: none;
}

textarea#tbCommentBody::placeholder {
    color: var(--secondary);
    opacity: 0.7;
}

.comment_btn {
    width: auto;
    height: auto;
    padding: 9px 26px;
    color: var(--on-accent);
    background: var(--accent);
    border: 1px solid transparent;
    border-radius: var(--radius-pill);
    font-size: 14px;
    line-height: 1.5;
    cursor: pointer;
    transition: background-color 0.2s ease, transform 0.2s ease;
}

.comment_btn:hover {
    background: var(--accent-strong);
    transform: translateY(-1px);
}

.commentbox_footer {
    padding: 10px 14px;
    color: var(--secondary);
    border-top: 1px solid var(--border);
    font-size: 13px;
}

.comment_actions a {
    color: var(--secondary);
}

.comment_actions a:hover {
    color: var(--accent-strong);
}

.feedback_area_title,
.pfl_feedback_area_title {
    margin: 0 0 12px;
    padding: 0 0 10px;
    color: var(--heading);
    background: none;
    border: 0;
    border-bottom: 1px solid var(--border);
    text-align: left;
    font-size: 15px;
    font-weight: 600;
}

/* ---------- 评论列表 ----------
   评论一多就容易糊成一片，所以每条评论：左侧固定头像列、上方一行元信息、
   正文独立成块，评论之间用分隔线断开；楼中楼往里缩一级并带一道竖线。 */
.feedbackItem {
    position: relative;
    padding: 18px 0 18px 58px;
    color: var(--content);
    border-top: 1px solid var(--border);
    font-size: 14.5px;
    line-height: 1.8;
}

.feedbackItem:first-of-type {
    border-top: 0;
    padding-top: 4px;
}

.feedbackAvatar {
    position: absolute;
    top: 18px;
    left: 0;
    line-height: 0;
}

.feedbackItem:first-of-type>.feedbackAvatar {
    top: 4px;
}

.feedbackAvatar img {
    width: 40px;
    height: 40px;
    background: var(--entry);
    border: 1px solid var(--glass-line);
    border-radius: 50%;
    object-fit: cover;
}

/* 元信息行：楼层 / 昵称 / 博主标记 / 时间 / 支持反对 / 回复 */
.feedbackListSubtitle {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px 10px;
    min-height: 0;
    color: var(--secondary);
    font-size: 13px;
    line-height: 1.6;
}

.feedbackListSubtitle a:link,
.feedbackListSubtitle a:visited,
.feedbackListSubtitle a:active {
    color: var(--secondary);
    text-decoration: none;
}

.feedbackListSubtitle a:hover {
    color: var(--accent-strong);
}

.feedbackListSubtitle b,
.feedbackListSubtitle strong {
    color: var(--heading);
}

.feedbackListSubtitle .layer {
    color: var(--secondary);
    opacity: 0.7;
}

/* 博主标记（博客园会加 .louzhu 或 .feedbackListSubtitle-louzhu） */
.louzhu,
.feedbackListSubtitle-louzhu .louzhu {
    padding: 1px 8px;
    color: var(--accent-strong);
    background: rgb(111 138 121 / 0.14);
    border-radius: var(--radius-pill);
    font-size: 12px;
}

/* 回复 / 编辑 / 删除，靠右对齐 */
.feedbackManage {
    float: none;
    width: auto;
    margin-left: auto;
    color: var(--secondary);
    text-align: right;
    font-size: 12.5px;
}

.comment_actions a {
    padding: 0 0 0 10px;
    color: var(--secondary);
}

.comment_actions a:hover {
    color: var(--accent-strong);
}

/* 正文 */
.feedbackCon {
    margin-top: 8px;
    padding: 12px 16px;
    color: var(--content);
    background: var(--code-bg);
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    min-height: 0;
    font-size: 14.5px;
    line-height: 1.85;
    word-break: normal;
    overflow-wrap: anywhere;
}

.blog_comment_body {
    word-break: normal;
    overflow-wrap: anywhere;
}

.blog_comment_body img {
    max-width: 100%;
    height: auto;
    border-radius: var(--radius);
}

.blog_comment_body a:link,
.blog_comment_body a:visited {
    color: var(--link);
}

.blog_comment_body a:hover {
    color: var(--link-hover);
}

.blog_comment_body p:last-child {
    margin-bottom: 0;
}

/* 楼中楼：缩进一级 + 一道竖线，和主楼区分开 */
.feedbackCon .feedbackItem {
    padding: 14px 0 0 0;
    border-top: 1px solid var(--border);
    font-size: 14px;
}

.feedbackCon .feedbackItem:first-of-type {
    padding-top: 0;
    border-top: 0;
}

.feedbackCon .feedbackAvatar {
    display: none;
}

.feedbackCon .feedbackCon {
    margin-top: 6px;
    padding: 6px 0 6px 14px;
    background: transparent;
    border: 0;
    border-inline-start: 2px solid var(--border);
    border-radius: 0;
}

/* 引用别人的回复 */
.comment_quote {
    margin: 0 0 10px;
    padding: 10px 14px;
    color: var(--secondary);
    background: var(--entry);
    border: 0;
    border-inline-start: 3px solid var(--accent);
    border-radius: 0 var(--radius) var(--radius) 0;
    font-size: 13.5px;
    line-height: 1.8;
}

.comment_quote legend {
    color: var(--secondary);
    font-size: 12.5px;
}

/* 每条评论下的 支持 / 反对 */
.comment_vote {
    padding: 0;
    color: var(--secondary);
    text-align: right;
    font-size: 12.5px;
}

.comment_vote a {
    padding-left: 12px;
    color: var(--secondary) !important;
    text-decoration: none !important;
}

.comment_vote a:hover {
    color: var(--accent-strong) !important;
}

/* 评论排序与分页 */
.comment-sort {
    float: none;
    margin-left: auto;
    color: var(--secondary);
    font-size: 12.5px;
    align-items: center;
}

.comment-order-tab .active {
    color: var(--accent-strong);
}

.comment_pager {
    padding: 0 0 14px;
    color: var(--secondary);
    font-size: 13px;
}

.comment_pager a {
    display: inline-block;
    min-width: 28px;
    padding: 3px 10px;
    color: var(--secondary);
    background: var(--code-bg);
    border: 1px solid var(--border);
    border-radius: var(--radius-pill);
    text-align: center;
    text-decoration: none;
}

.comment_pager a:hover {
    color: var(--on-accent);
    background: var(--accent);
    border-color: transparent;
}

.comment_pager_current {
    color: var(--on-accent);
    background: var(--accent);
    border-color: transparent;
}

img.commenter-vip-logo {
    height: 14px;
    vertical-align: middle;
}

.ad_text_commentbox {
    color: var(--secondary);
    font-size: 13px;
}

.ad_text_commentbox a {
    color: var(--secondary);
}

/* --------------------------------------------------------------------------
   13. 博客园植入的广告卡 / 推荐位（全部保留，只统一圆角与间距）
   -------------------------------------------------------------------------- */
#blog_c1,
#under_post_card1,
#under_post_card2,
#related_posts_card,
#HistoryToday {
    margin-top: 20px;
}

#blog_c1:not(:empty),
#under_post_card1:not(:empty),
#under_post_card2:not(:empty),
#related_posts_card:not(:empty),
#HistoryToday:not(:empty) {
    padding: 14px;
    background: var(--entry);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    box-shadow: 0 24px 48px -30px var(--glass-shadow),
        inset 0 1px 0 var(--glass-line);
    overflow: hidden;
}

#blog_c1 img,
#under_post_card1 img,
#under_post_card2 img,
#related_posts_card img,
#HistoryToday img {
    max-width: 100%;
    height: auto;
    border-radius: var(--radius-md);
}

/* 推荐位里的模块标题 */
#under_post_card1 .catListTitle,
#under_post_card2 .catListTitle,
#related_posts_card .catListTitle,
#HistoryToday .catListTitle {
    margin: 0 0 12px;
    padding: 0 0 10px;
    color: var(--heading);
    background: none;
    border: 0;
    border-bottom: 1px solid var(--border);
    text-align: left;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.5;
}

#under_post_card1 ul,
#under_post_card2 ul,
#related_posts_card ul,
#HistoryToday ul {
    margin: 0;
    padding: 0;
    list-style: none;
    line-height: 1.9;
}

#under_post_card1 li a,
#under_post_card2 li a,
#related_posts_card li a,
#HistoryToday li a {
    color: var(--secondary);
}

#under_post_card1 li a:hover,
#under_post_card2 li a:hover,
#related_posts_card li a:hover,
#HistoryToday li a:hover {
    color: var(--accent-strong);
}

/* --------------------------------------------------------------------------
   14. 目录、页脚与杂项
   -------------------------------------------------------------------------- */
.cnblogs-toc>.cnblogs-toc-title {
    padding-inline: 14px;
    color: var(--heading);
}

.cnblogs-toc>.cnblogs-toc-item {
    padding-inline: 16px;
}

.cnblogs-toc>.cnblogs-toc-item:hover {
    border-radius: var(--radius);
}

#footer {
    margin-block: 0;
    padding: 30px 20px 36px;
    color: var(--secondary);
    border: 0;
    font-size: 13px;
    line-height: 2;
    text-align: center;
}

#footer a:link,
#footer a:visited {
    color: var(--secondary);
}

#footer a:hover {
    color: var(--accent-strong);
}

#footer .footer-icp img {
    vertical-align: -2px;
}

/* 返回顶部（部分皮肤自带，此处保证观感一致） */
#goto-top {
    right: 26px;
    bottom: 58px;
    box-sizing: border-box;
    width: 46px;
    height: 46px;
    padding: 0;
    align-items: center;
    justify-content: center;
    background: var(--entry);
    border: 1px solid var(--border);
    border-radius: 50%;
    box-shadow: 0 12px 26px -18px var(--glass-shadow),
        inset 0 1px 0 var(--glass-line);
    -webkit-backdrop-filter: blur(16px) saturate(1.4);
    backdrop-filter: blur(16px) saturate(1.4);
    transition: color 0.2s ease, transform 0.25s ease, opacity 0.25s ease;
}

#goto-top:hover {
    color: var(--accent-strong);
    transform: translateY(-3px);
    background-image: none;
}

/* 主题自绘的返回顶部按钮（博客园未提供时由 morandi-glass.js 注入） */
.mg-top-btn {
    position: fixed;
    z-index: 70;
    display: none;
    align-items: center;
    justify-content: center;
    color: var(--primary);
    line-height: 0;
    cursor: pointer;
}

.mg-top-btn.mg-show {
    display: flex;
}

.mg-top-btn svg {
    width: 20px;
    height: 20px;
}

/* 归档 / 随笔列表等页面 */
.entrylistTitle,
.PostListTitle,
.thumbTitle {
    margin: 0 0 14px;
    padding: 0 0 10px;
    color: var(--heading);
    background: none;
    border: 0;
    border-bottom: 1px solid var(--border);
    text-align: left;
    font-size: 16px;
    font-weight: 600;
}

.entrylistDescription {
    padding: 0 0 10px;
    color: var(--secondary);
    text-align: left;
    font-size: 13.5px;
}

.entrylistItem {
    width: auto;
    min-height: 0;
    margin: 0;
    padding: 18px 0;
    border-bottom: 1px solid var(--border);
}

.entrylistItem:last-child {
    border-bottom: 0;
}

.entrylistPosttitle a:link,
.entrylistPosttitle a:visited {
    color: var(--heading);
    text-decoration: none;
}

.entrylistPosttitle {
    width: auto;
    padding: 0;
    border: 0;
    text-align: left;
    font-size: 17px;
    font-weight: 650;
    line-height: 1.5;
}

.entrylistPosttitle a:hover {
    color: var(--accent-strong);
}

.entrylistPostSummary,
.entrylistItemPostDesc {
    margin: 6px 0 0;
    padding: 0;
    color: var(--secondary);
    font-size: 13.5px;
    line-height: 1.7;
    text-align: left;
}

.entrylistItemPostDesc a:link,
.entrylistItemPostDesc a:visited {
    color: var(--secondary);
}

.entrylistItemPostDesc a:hover {
    color: var(--accent-strong);
}

/* 随笔列表页 */
.PostList {
    min-height: 0;
    margin: 0;
    padding: 12px 0;
    border: 0;
    border-bottom: 1px solid var(--border);
}

.postTitl2 {
    float: none;
}

.postDesc2,
.postText2 {
    float: none;
    color: var(--secondary);
    font-size: 13.5px;
}

/* --------------------------------------------------------------------------
   15. 响应式
   -------------------------------------------------------------------------- */
@media screen and (max-width: 1120px) {
    #navigator .blogStats {
        display: none;
    }
}

@media screen and (max-width: 980px) {
    #main {
        flex-direction: column;
        align-items: stretch;
        gap: 20px;
    }

    #sideBar {
        flex: 1 1 auto;
        width: auto;
        order: 2;
    }

    /* 侧边栏各模块在中等屏幕上并排成两列 */
    #sideBarMain {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
        gap: 16px;
        align-items: start;
    }

    #sideBarMain .newsItem,
    #sideBarMain .sidebar-block {
        margin: 0;
    }

    #leftcontentcontainer {
        grid-column: 1 / -1;
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
        gap: 16px;
        align-items: start;
    }

    #blog-sidecolumn {
        display: contents;
    }
}

@media screen and (max-width: 900px) {
    #blogTitle h2 {
        display: none;
    }
}

@media screen and (max-width: 820px) {
    #main,
    #footer,
    #header {
        padding-inline: 14px;
    }

    #header {
        flex-wrap: wrap;
        gap: 10px;
        padding-block: 8px;
    }

    #blogTitle {
        flex: 1 1 auto;
    }

    #blogTitle h1 {
        font-size: 18px;
    }

    .mg-menu-toggle {
        display: inline-flex;
        order: 2;
    }

    /* 导航折叠进汉堡菜单 */
    #navigator {
        order: 3;
        display: none;
        flex: 1 0 100%;
        width: 100%;
        justify-content: flex-start;
    }

    #header.mg-nav-open {
        background: var(--header-glass);
        box-shadow: 0 20px 44px -24px var(--glass-shadow),
            inset 0 1px 0 var(--glass-line);
    }

    #header.mg-nav-open #navigator {
        display: flex;
    }

    #navList {
        flex-direction: column;
        align-items: stretch;
        gap: 2px;
        width: 100%;
    }

    #navList li {
        width: 100%;
    }

    #navList a {
        padding: 11px 14px;
        border-radius: 14px;
        font-size: 15px;
        text-align: left;
    }

    #mainContent .forFlow {
        margin-left: 0;
    }
}

@media screen and (max-width: 640px) {
    #sideBarMain,
    #leftcontentcontainer {
        grid-template-columns: 1fr;
    }

    .day,
    #topics,
    #comment_form,
    #blog-comments-placeholder {
        border-radius: var(--radius-md);
    }

    #topics {
        padding: 1.2rem 1.1rem;
    }

    #cnblogs_post_body {
        font-size: 16.5px;
    }

    #cnblogs_post_body table:not(.lntable):not(.highlighttable):not(.hljs-ln) {
        display: block;
        overflow-x: auto;
    }

    #div_digg {
        gap: 22px;
    }
}

@media (prefers-reduced-motion: reduce) {

    *,
    *::before,
    *::after {
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
    }
}