/* ============================================================
   小小鱼ovo · 博客园自定义 CSS
   皮肤：SimpleMemory
   整理版 v2 —— 去重、加作用域、删除死代码，效果与 v1 完全一致
   ============================================================ */

/* ============================================================
   1. 设计变量
   ============================================================ */
:root {
    /* 玻璃 */
    --glass-bg:           rgba(255, 255, 255, .45);
    --glass-bg-soft:      rgba(255, 255, 255, .50);
    --glass-bg-hover:     rgba(255, 255, 255, .65);
    --glass-border:       rgba(255, 255, 255, .80);
    --glass-shadow:       0 8px 32px 0 rgba(31, 38, 135, .15),
                          inset 0 0 0 1px rgba(255, 255, 255, .30);
    --glass-shadow-hover: 0 15px 35px 0 rgba(31, 38, 135, .20),
                          inset 0 0 0 1px rgba(255, 255, 255, .50);
    --glass-blur:         blur(16px) saturate(160%);
    --radius:             16px;
    --radius-sm:          12px;

    /* 颜色 */
    --accent:             #0066cc;
    --accent-dark:        #0055aa;
    --ink:                #2f3542;
    --ink-2:              #4a5568;
    --ink-3:              #6b7684;
    --ink-4:              #8a94a3;

    /* 胶囊按钮 */
    --pill-bg:            rgba(255, 255, 255, .55);
    --pill-bg-hover:      rgba(255, 255, 255, .85);
    --pill-border:        rgba(255, 255, 255, .90);
    --pill-shadow:        0 4px 14px rgba(31, 38, 135, .10),
                          inset 0 0 0 1px rgba(255, 255, 255, .35);

    /* 行内图标（mask 用，颜色跟随 currentColor） */
    --ico-clock:   url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7v5l3 2'/%3E%3C/svg%3E");
    --ico-user:    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4 21c0-4 3.6-6 8-6s8 2 8 6'/%3E%3C/svg%3E");
    --ico-eye:     url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 12s3.5-7 10-7 10 7 10 7-3.5 7-10 7S2 12 2 12z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E");
    --ico-comment: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z'/%3E%3C/svg%3E");
    --ico-star:    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l2.8 5.7 6.2.9-4.5 4.4 1 6.2-5.5-2.9-5.5 2.9 1-6.2L3 9.6l6.2-.9z'/%3E%3C/svg%3E");
    --ico-flag:    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 21V4'/%3E%3Cpath d='M5 5h11l-2 3 2 3H5z'/%3E%3C/svg%3E");
    --ico-thumb:   url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 9V5a2 2 0 0 0-2-2l-4 7v11h9.3a2 2 0 0 0 2-1.7l1.4-6A2 2 0 0 0 18.7 9z'/%3E%3Cpath d='M8 21H5a2 2 0 0 1-2-2v-7a2 2 0 0 1 2-2h3'/%3E%3C/svg%3E");
    --ico-heart:   url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.8 6.6a5 5 0 0 0-7.1 0L12 8.3l-1.7-1.7a5 5 0 1 0-7.1 7.1L12 21l8.8-7.3a5 5 0 0 0 0-7.1z'/%3E%3C/svg%3E");
    --ico-chat:    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 11.5a8.4 8.4 0 0 1-8.5 8.5 9 9 0 0 1-3.8-.8L3 21l1.8-5.7A8.4 8.4 0 0 1 12.5 3 8.4 8.4 0 0 1 21 11.5z'/%3E%3C/svg%3E");
    --ico-tag:     url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.6 13.4l-7.2 7.2a2 2 0 0 1-2.8 0l-7.2-7.2A2 2 0 0 1 3 12V4a1 1 0 0 1 1-1h8a2 2 0 0 1 1.4.6l7.2 7.2a2 2 0 0 1 0 2.6z'/%3E%3Ccircle cx='7.5' cy='7.5' r='1.2'/%3E%3C/svg%3E");
}


/* ============================================================
   2. 基础
   ============================================================ */
html, body {
    background: linear-gradient(135deg, #f5f7fa 0%, #c3cfe2 100%) !important;
    background-attachment: fixed !important;
    font-family: -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif;
    color: #333;
    line-height: 1.7;
    margin: 0;
    padding: 0;
}
a { text-decoration: none; color: var(--accent); }
#home { max-width: 100%; padding: 0; margin: 0; background: transparent; }


/* ============================================================
   3. 顶部海报
   ============================================================ */
#blogTitle {
    display: flex !important;
    background: url('https://img2024.cnblogs.com/blog/3850623/202610/3850623-20261029112241425-722958497.jpg') no-repeat center top / cover;
    width: 100%;
    height: 380px;
    margin: 0 0 -120px 0;      /* -120 与 #main 的 padding-top:120 相互抵消，形成重叠 */
    padding: 0;
    position: relative;
    z-index: 0;
    -webkit-mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 1) 50%, rgba(0, 0, 0, 0) 100%);
    mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 1) 50%, rgba(0, 0, 0, 0) 100%);
}
#blogTitle h1 { display: none; }
#navigator, #main .forFlow > h3 { display: none; }


/* ============================================================
   4. 主布局
   ============================================================ */
#main {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 120px 20px 20px;
    box-sizing: border-box;
    display: flex;
    align-items: flex-start;
    gap: 20px;
    position: relative;
    z-index: 1;
}
#mainContent {
    flex: 1 1 auto;
    min-width: 0;
    width: auto;
    float: none;
    margin-right: 0;
    padding: 0;
}


/* ============================================================
   5. 首页文章卡片
   ============================================================ */
#mainContent .day {
    display: block;
    background: var(--glass-bg);
    backdrop-filter: var(--glass-blur);
    -webkit-backdrop-filter: var(--glass-blur);
    border-radius: var(--radius);
    border: 1px solid var(--glass-border);
    box-shadow: var(--glass-shadow);
    width: 100%;
    box-sizing: border-box;
    position: relative;
    transition: transform .3s cubic-bezier(.25, .8, .25, 1),
                box-shadow .3s ease,
                background .3s ease;
    padding: 30px 35px;
    margin-bottom: 25px;
}
#mainContent .day:hover {
    transform: translateY(-4px);
    background: var(--glass-bg-hover);
    box-shadow: var(--glass-shadow-hover);
}


/* ============================================================
   6. 文章详情页：整列一张卡
   只在存在 #topics 的页面生效，首页不受影响
   ============================================================ */
#mainContent:has(#topics) {
    background: var(--glass-bg);
    backdrop-filter: var(--glass-blur);
    -webkit-backdrop-filter: var(--glass-blur);
    border-radius: var(--radius);
    border: 1px solid var(--glass-border);
    box-shadow: var(--glass-shadow);
    padding: 34px 40px 30px;
    box-sizing: border-box;
    margin-bottom: 25px;
}
#topics, #topics .post, #topics .postBody { background: transparent !important; }

/* 作者信息 + 互动按钮 */
#blog_post_info {
    display: flex;
    flex-direction: column;
    gap: 14px;
    margin-top: 18px;
    padding: 16px 18px;
    background: var(--glass-bg-soft);
    border: 1px solid rgba(255, 255, 255, .7);
    border-radius: var(--radius-sm);
}
#blog_post_info a { color: var(--accent) !important; }

/* 「好文要顶」那排：挪到作者信息下方并横排 */
#blog_post_info #green_channel {
    order: 3;
    width: auto !important;
    max-width: 100%;
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    text-align: left;
    justify-content: center;
}

/* 四个动作按钮：统一成玻璃胶囊（颜色覆盖 + 图标都在这里一次写完） */
#green_channel a {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: auto !important;
    padding: 8px 16px !important;
    border-radius: 8px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.5 !important;
    text-shadow: none !important;
    background: var(--pill-bg) !important;
    backdrop-filter: blur(10px) saturate(160%);
    -webkit-backdrop-filter: blur(10px) saturate(160%);
    border: none !important;
    box-shadow: var(--pill-shadow) !important;
    color: var(--ink-2) !important;
    transition: background .2s, color .2s, transform .2s, border-color .2s;
}
/* 四个动作按钮保持同色（东家按 ID 给了不同底色，这里统一压掉） */
#green_channel #green_channel_digg,
#green_channel #green_channel_follow,
#green_channel #green_channel_favorite,
#green_channel #green_channel_wechat {
    background: var(--pill-bg) !important;
    color: var(--ink-2) !important;
}
#green_channel a:hover {
    background: var(--pill-bg-hover) !important;
    border-color: rgba(0, 102, 204, .35) !important;
    color: var(--accent) !important;
    transform: translateY(-1px);
}
#green_channel a::before {
    content: "";
    width: 14px;
    height: 14px;
    flex: 0 0 14px;
    background-color: currentColor;
    opacity: .85;
    -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
    -webkit-mask-position: center;  mask-position: center;
    -webkit-mask-size: contain;     mask-size: contain;
}
#green_channel_digg::before     { -webkit-mask-image: var(--ico-thumb); mask-image: var(--ico-thumb); }
#green_channel_follow::before   { -webkit-mask-image: var(--ico-heart); mask-image: var(--ico-heart); }
#green_channel_favorite::before { -webkit-mask-image: var(--ico-star);  mask-image: var(--ico-star); }
#green_channel_wechat::before   { -webkit-mask-image: var(--ico-chat);  mask-image: var(--ico-chat); }
#green_channel #green_channel_weibo { background: transparent !important; }
#green_channel #green_channel_weibo::before { display: none; }
#green_channel #green_channel_weibo img { box-shadow: none !important; vertical-align: middle; }

/* 「推荐 / 反对」的汉字是背景图、改不了色，且与「好文要顶」重复 → 隐藏 */
#div_digg { display: none !important; }

/* ---- 作者卡：头像 + 名字 + 粉丝/关注，横排铺满 ----
   东家结构：#author_profile > #author_profile_info > (头像 img + 详情 div)
   详情里是「名字 / 粉丝 - 4 / 关注 - 5 / +加关注」，全是默认蓝链接、12px、挤成两行。
   这里改成：头像圆角方形、名字 15px 深色、粉丝关注做成玻璃小胶囊、+加关注做成描边按钮。 */
#blog_post_info #author_profile {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px 16px;
    margin: 0 !important;
    width: 100%;
}

#blog_post_info #author_profile_info {
    display: flex;
    align-items: center;
    gap: 14px;
    flex: 1 1 auto;
    min-width: 0;
}

/* 头像：圆形、统一尺寸、加白边和柔光 */
#blog_post_info #author_profile_info > a:first-child {
    flex: 0 0 auto;
    display: block;
    line-height: 0;
}
#blog_post_info .author_avatar {
    width: 56px !important;
    height: 56px !important;
    border-radius: 50% !important;
    object-fit: cover;
    border: 2px solid rgba(255, 255, 255, .9);
    box-shadow: 0 4px 14px rgba(31, 38, 135, .15);
    margin: 0 !important;
    display: block;
}

/* 详情区：名字一行、粉丝关注一行 */
#blog_post_info #author_profile_detail {
    display: flex !important;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px 10px;
    min-width: 0;
    line-height: 1.6 !important;
    font-size: 13px !important;
}
#blog_post_info #author_profile_detail br { display: none; }
#blog_post_info #author_profile_detail > a:first-child {
    flex: 0 0 100%;
    font-size: 15px !important;
    font-weight: 600 !important;
    color: #1a1a1a !important;
    letter-spacing: .2px;
    line-height: 1.5;
}

/* 粉丝 / 关注：玻璃小胶囊 */
#blog_post_info #author_profile_detail a[href*="followers"],
#blog_post_info #author_profile_detail a[href*="followees"] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 2px 10px;
    border-radius: 999px;
    font-size: 12px !important;
    color: var(--ink-3) !important;
    background: rgba(255, 255, 255, .6);
    border: 1px solid rgba(255, 255, 255, .9);
    transition: all .2s;
}
#blog_post_info #author_profile_detail a[href*="followers"]:hover,
#blog_post_info #author_profile_detail a[href*="followees"]:hover {
    color: var(--accent) !important;
    background: #fff;
    border-color: rgba(0, 102, 204, .3);
}
#blog_post_info #author_profile_detail .follower-count,
#blog_post_info #author_profile_detail .following-count {
    font-weight: 600;
    color: var(--accent);
    font-size: 12px;
}

/* 「+加关注」：做成描边小按钮，靠右 */
#blog_post_info #author_profile_follow {
    flex: 0 0 auto;
    margin: 0 !important;
    line-height: 1 !important;
}
#blog_post_info #author_profile_follow a {
    display: inline-flex;
    align-items: center;
    height: 30px;
    padding: 0 14px;
    border-radius: 999px;
    font-size: 12.5px !important;
    color: var(--accent) !important;
    background: rgba(255, 255, 255, .7);
    border: 1px solid rgba(0, 102, 204, .28);
    transition: all .2s;
    white-space: nowrap;
}
#blog_post_info #author_profile_follow a:hover {
    background: var(--accent);
    color: #fff !important;
    border-color: var(--accent);
}
#blog_post_info #author_profile_honor:empty,
#blog_post_info #author_profile .clear { display: none; }

/* 推荐 / 关注：按钮状态切换
   点一下变「已推荐 / 已关注」（实心蓝底），再点一下取消。
   博客园会在点击后往容器里塞一个 <span style="color:red">提示，
   这些裸 span 直接隐藏，不参与布局、也不显示。 */
#blog_post_info > span:not([class]),
#green_channel > span:not([class]) {
    display: none !important;
}

/* 注意：按钮底色原本由 `#green_channel #green_channel_digg`（2 个 id）设置，
   所以这里必须同样带上 id，否则 !important 也压不过 */
#green_channel a.qm-on,
#green_channel #green_channel_digg.qm-on,
#green_channel #green_channel_follow.qm-on {
    background: var(--accent) !important;
    border-color: var(--accent) !important;
    color: #fff !important;
    box-shadow: 0 4px 14px rgba(0, 102, 204, .28) !important;
}
#green_channel a.qm-on:hover,
#green_channel #green_channel_digg.qm-on:hover,
#green_channel #green_channel_follow.qm-on:hover {
    background: var(--accent-dark) !important;
    border-color: var(--accent-dark) !important;
    color: #fff !important;
    transform: translateY(-1px);
}


/* ============================================================
   7. 文章页头部版式
   标题居中 → 元信息一行（图标 + 数字）→ 细线 → 正文
   ============================================================ */

/* .postDesc 在东家 DOM 里排在末尾，用 flex 提到标题下面 */
#topics .post { display: flex; flex-direction: column; }
#topics .postTitle { order: 1; }
#topics .postDesc  { order: 2; }
#topics .postBody  { order: 3; }
#topics .post > .clear { display: none; }

/* 标题 */
#topics .postTitle {
    text-align: center;
    border-left: none;
    padding-left: 0;
    margin: 4px 0 10px;
}
#topics .postTitle a {
    font-size: 26px;
    font-weight: 600;
    line-height: 1.45;
    color: #1a1a1a;
    letter-spacing: .2px;
}

/* 元信息行：font-size:0 压掉「posted @」「阅读(」这些裸文本，再用图标 + 数字补回 */
#topics .postDesc {
    font-size: 0 !important;
    text-align: center;
    color: #666;
    line-height: 1.9;
    margin: 0 0 30px !important;
    padding: 0 0 22px !important;
    border: none !important;
    border-bottom: 1px solid rgba(0, 0, 0, .08) !important;
}
#topics .postDesc > * {
    font-size: 13px !important;
    color: #666 !important;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    margin: 0 10px !important;
    vertical-align: middle;
    transition: color .2s;
}
#topics .postDesc a { color: #666 !important; }
#topics .postDesc a:hover { color: var(--accent) !important; }
#topics .postDesc > *::before {
    content: "";
    width: 13px; height: 13px; flex: 0 0 13px;
    background-color: currentColor;
    opacity: .8;
    -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
    -webkit-mask-position: center;  mask-position: center;
    -webkit-mask-size: contain;     mask-size: contain;
}
#post-date::before                                           { -webkit-mask-image: var(--ico-clock);   mask-image: var(--ico-clock); }
/* 作者链接：指向博客首页的那个（收藏是 javascript:，举报是 report.cnblogs.com） */
#topics .postDesc a[href^="https://www.cnblogs.com/"]::before   { -webkit-mask-image: var(--ico-user);    mask-image: var(--ico-user); }
#post_view_count::before                                     { -webkit-mask-image: var(--ico-eye);     mask-image: var(--ico-eye); }
#post_comment_count::before                                  { -webkit-mask-image: var(--ico-comment); mask-image: var(--ico-comment); }
#topics .postDesc a[href^="javascript"]::before              { -webkit-mask-image: var(--ico-star);    mask-image: var(--ico-star); }
#topics .postDesc a[href*="report.cnblogs.com"]::before      { -webkit-mask-image: var(--ico-flag);    mask-image: var(--ico-flag); }

/* 上一篇 / 下一篇：只给标题做胶囊，「«」保持普通链接 */
#post_next_prev {
    display: block !important;
    text-align: center;
    font-size: 13px !important;
    color: #666;
    line-height: 1.9;
    margin-top: 20px !important;
    padding-top: 0 !important;
    border-top: none !important;
}
#post_next_prev a { color: var(--accent) !important; }
#post_next_prev .post_next_prev_date { color: var(--ink-4); }
#post_next_prev a:not(.p_n_p_prefix) {
    display: inline-flex;
    align-items: center;
    max-width: 100%;
    padding: 3px 12px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .45);
    border: 1px solid rgba(255, 255, 255, .8);
    transition: all .2s;
}
#post_next_prev a:not(.p_n_p_prefix):hover { background: var(--pill-bg-hover); }

/* 分类 / 标签：玻璃胶囊（#EntryTag 里同时装着免责声明，只处理其中的 a） */
#EntryTag {
    margin: 22px 0 8px !important;
    font-size: 12px;
    color: var(--ink-4);
    line-height: 2.4;
}
#EntryTag .post-meta-disclaimer { font-size: 12px; color: var(--ink-4); }
#EntryTag a {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 12.5px !important;
    color: var(--ink-2) !important;
    padding: 4px 13px;
    margin-right: 8px;
    border-radius: 999px;
    background: var(--pill-bg);
    backdrop-filter: blur(10px) saturate(160%);
    -webkit-backdrop-filter: blur(10px) saturate(160%);
    border: 1px solid var(--pill-border);
    box-shadow: 0 3px 10px rgba(31, 38, 135, .08);
    transition: all .2s;
}
#EntryTag a::before {
    content: "";
    width: 12px; height: 12px; flex: 0 0 12px;
    background-color: currentColor;
    opacity: .7;
    -webkit-mask: var(--ico-tag) center / contain no-repeat;
    mask: var(--ico-tag) center / contain no-repeat;
}
#EntryTag a:hover {
    color: var(--accent) !important;
    background: var(--pill-bg-hover);
    border-color: rgba(0, 102, 204, .3);
    transform: translateY(-1px);
}

/* 文章下面博客园塞进来的推荐 / 广告块 → 次级白块 */
#mainContent:has(#topics) .under-post-card,
#mainContent:has(#topics) .below-post-card,
#mainContent:has(#topics) .c_ad_block,
#mainContent:has(#topics) #blog_c1,
#mainContent:has(#topics) #under_post_card1,
#mainContent:has(#topics) #under_post_card2,
#mainContent:has(#topics) #related_posts_card,
#mainContent:has(#topics) #HistoryToday,
#mainContent:has(#topics) #cnblogs_ch,
#mainContent:has(#topics) #opt_under_post {
    max-width: none !important;
    white-space: normal !important;
    overflow: visible !important;
    font-size: 13px;
    line-height: 2;
    color: #666;
    margin-top: 16px !important;
    padding: 16px 18px;
    background: var(--glass-bg-soft);
    border: 1px solid rgba(255, 255, 255, .7);
    border-radius: var(--radius-sm);
    box-sizing: border-box;
}
#mainContent:has(#topics) .below-post-card header {
    font-weight: 600 !important;
    color: #333;
    font-size: 13px;
    margin: 0 0 6px !important;
}
#mainContent:has(#topics) .below-post-card ul { padding-left: 0 !important; }
#mainContent:has(#topics) .below-post-card ul li { list-style: none !important; }
#mainContent:has(#topics) .below-post-card a,
#mainContent:has(#topics) .under-post-card a { color: var(--accent) !important; }

/* 空容器不占位。
   :empty 命中不了含空白文本的节点，所以用 :not(:has(...)) 判断「没有任何可见内容」。
   #related_posts_card 是「相关文章」卡片：文章少于一则时它完全为空，
   但带着 12px 圆角 + 白底 + 16px 内边距，看起来像一条加载失败的空横条。 */
#mainContent:has(#topics) #under_post_card1:not(:has(*:not(script))),
#mainContent:has(#topics) #under_post_card2:not(:has(*:not(script))),
#mainContent:has(#topics) #related_posts_card:not(:has(*:not(script))),
#mainContent:has(#topics) #HistoryToday:not(:has(*:not(script))),
#mainContent:has(#topics) #opt_under_post:not(:has(*:not(script))),
#mainContent:has(#topics) #cnblogs_ch:not(:has(*:not(script))),
#mainContent:has(#topics) .below-post-card:not(:has(*:not(script))),
#mainContent:has(#topics) .under-post-card:not(:has(*:not(script))) {
    display: none !important;
}
/* 兜底：任何标签为空、但被套了背景/圆角的块，一律不显示 */
#mainContent:has(#topics) :is(.under-post-card, .below-post-card):empty {
    display: none !important;
}

/* 广告图：外层收窄，别撑成一条白带（图片尺寸是内联 !important，改不了） */
#mainContent:has(#topics) #blog_c1 { width: fit-content !important; height: auto !important; }

/* 登录后才能评论 之类的小字 */
#comment_form_container p, #divCommentShow { color: var(--ink-3); font-size: 13px; }
#comment_form_container a { color: var(--accent); }

/* 「刷新页面 / 返回顶部」这行游离链接，和版式不搭 */
#comment_nav { display: none !important; }


/* ============================================================
   8. 文章文字排版
   字阶：26px 标题 / 15px 正文 / 13px 次要 / 12px 极小
   字重：只用 400 和 600
   ============================================================ */
.postCon, .post, .postBody, .postText, .c_b_p_desc, .postTitle {
    display: block;
    background: transparent;
    border: none;
    padding: 0;
}
.dayTitle { display: none; }
.postTitle { border-left: 4px solid var(--accent); padding-left: 12px; margin-bottom: 15px; }
.postTitle a { color: #1a1a1a; font-size: 1.35rem; font-weight: 600; }
.c_b_p_desc { color: #444; font-size: 13px; }
.c_b_p_desc_readmore { font-size: 13px; }

/* 首页列表的 posted 行（加作用域，避免影响文章页头部版式） */
#mainContent > .forFlow .day .postDesc {
    color: #666;
    font-size: 13px;
    display: block;
    line-height: 1.9;
    margin-top: 15px;
    padding-top: 15px;
    border-top: 1px dashed rgba(0, 0, 0, .15);
}
#mainContent > .forFlow .day .postDesc > * { margin-right: 10px; white-space: nowrap; }
#mainContent > .forFlow .day .postDesc > *:last-child { margin-right: 0; }

.postBody img { max-width: 100%; height: auto; }
.postBody pre { overflow-x: auto; }
.postBody { overflow-wrap: anywhere; }

#cnblogs_post_body { font-size: 15px; line-height: 1.9; color: #333; }
#cnblogs_post_body p { margin: 0 0 1.1em; }
#cnblogs_post_body h2 {
    font-size: 18px;
    font-weight: 600;
    margin: 1.6em 0 .7em;
    padding-left: 12px;
    border-left: 4px solid var(--accent);
    line-height: 1.45;
}
#cnblogs_post_body h3 { font-size: 16px; font-weight: 600; margin: 1.4em 0 .6em; }
#cnblogs_post_body strong, #cnblogs_post_body b { font-weight: 600; }
#cnblogs_post_body blockquote {
    margin: 1.2em 0;
    padding: 12px 18px;
    border-left: 3px solid #b9c6d8;
    background: rgba(255, 255, 255, .55);
    background-image: none;
    border-radius: 0 8px 8px 0;
    color: var(--ink-2);
}
#cnblogs_post_body code {
    background: rgba(0, 0, 0, .06);
    padding: 2px 6px;
    border-radius: 4px;
    font-size: .9em;
}
/* 代码块：浅色底
   注意博客园的 hljs 高亮配色本来就是浅色主题（蓝关键字、深红字符串），
   配深色背景会看不清，所以这里用浅底 + 细边框。 */
#cnblogs_post_body pre {
    background: rgba(255, 255, 255, .72);
    color: #24292f;
    padding: 16px 18px;
    border: 1px solid rgba(0, 0, 0, .08);
    border-radius: 10px;
    overflow-x: auto;
    line-height: 1.7;
    font-size: 13.5px;
}
#cnblogs_post_body pre code {
    background: transparent;
    padding: 0;
    color: inherit;
    font-size: inherit;
}
/* 极少数情况下博客园用的是自带深色主题，这里兜一层，保证正文可读 */
#cnblogs_post_body pre .hljs,
#cnblogs_post_body pre code.hljs {
    background: transparent !important;
    color: #24292f;
}
/* 行内代码 */
#cnblogs_post_body :not(pre) > code {
    background: rgba(0, 0, 0, .06);
    color: #b3395b;
    padding: 2px 6px;
    border-radius: 4px;
    font-size: .92em;
}
#cnblogs_post_body table { width: 100%; border-collapse: collapse; margin: 1.2em 0; }
#cnblogs_post_body th, #cnblogs_post_body td {
    border: 1px solid rgba(0, 0, 0, .1);
    padding: 8px 12px;
}
#cnblogs_post_body img { max-width: 100%; border-radius: 10px; }

/* 次要信息统一 13px / #666 */
#MySignature,
#blog_post_info .post_item_foot,
#comment_form_container,
#divCommentShow {
    font-size: 13px;
    color: #666;
    line-height: 1.9;
}


/* ============================================================
   9. 侧边栏
   ============================================================ */
#sideBar {
    flex: 0 0 300px;
    width: 300px;
    float: none;
    padding: 0;
    margin: 0;
    background: transparent;
    border: none;
    box-shadow: none;
}
#sideBarMain {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

/* 公告 / 日历 这类直接子卡（排除会被拆卡的容器） */
#sideBarMain > div:not(#leftcontentcontainer),
#sideBarMain .newsItem {
    background: var(--glass-bg);
    backdrop-filter: var(--glass-blur);
    -webkit-backdrop-filter: var(--glass-blur);
    border-radius: var(--radius);
    border: 1px solid var(--glass-border);
    box-shadow: var(--glass-shadow);
    padding: 20px;
    box-sizing: border-box;
    width: 100%;
    margin: 0 !important;
    transition: background .3s ease;
}
#sideBarMain > div:not(#leftcontentcontainer):hover { background: var(--glass-bg-hover); }

/* 容器本身透明，里面每个模块各自成卡 */
#sideBarMain #leftcontentcontainer,
#sideBarMain #blog-sidecolumn {
    background: transparent !important;
    background-image: none !important;
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    padding: 0 !important;
    width: 100% !important;
    box-sizing: border-box;
    display: flex !important;
    flex-direction: column;
    gap: 20px;
}

/* #sidebar_categories 没有 sidebar-block 类，是「随笔档案」的包装层，单独处理 */
#sideBarMain #blog-sidecolumn .sidebar-block,
#sideBarMain #blog-sidecolumn > #sidebar_categories {
    background: var(--glass-bg);
    backdrop-filter: var(--glass-blur);
    -webkit-backdrop-filter: var(--glass-blur);
    border-radius: var(--radius);
    border: 1px solid var(--glass-border);
    box-shadow: var(--glass-shadow);
    padding: 20px;
    margin: 0;
    box-sizing: border-box;
    width: 100%;
    order: 10;                 /* 默认靠后，空块自然沉底 */
}
/* 包装层内部的块不再叠卡 */
#sideBarMain #blog-sidecolumn #sidebar_categories .sidebar-block {
    background: transparent;
    border: none;
    box-shadow: none;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    padding: 0;
}
/* 完全没有内容的块不显示 */
#sideBarMain #blog-sidecolumn .sidebar-block:not(:has(a)):not(:has(input)):not(:has(table)):not(:has(img)) {
    display: none !important;
}

/* 顺序：搜索 → 常用链接 → 随笔档案 → 阅读排行榜 */
#sideBarMain #sidebar_search         { order: 1; }
#sideBarMain #sidebar_shortcut       { order: 2; }
#sideBarMain #sidebar_categories     { order: 3; }
#sideBarMain #sidebar_postarchive    { order: 0; }
#sideBarMain #sidebar_topviewedposts { order: 4; }

/* 卡片小标题 */
#sideBar .catListTitle,
#sideBarMain #blog-sidecolumn .sidebar-block h3,
#sideBarMain #blog-sidecolumn .sidebar-block .catListTitle,
#sideBarMain #blog-sidecolumn > #sidebar_categories h3,
#sideBarMain #blog-sidecolumn > #sidebar_categories .catListTitle {
    display: block;
    font-size: 15px;
    font-weight: 600;
    color: #333;
    margin: 0 0 15px 0;
    padding-bottom: 10px;
    border-bottom: 1px dashed rgba(0, 0, 0, .15);
}

#sideBar ul { padding-left: 0; list-style: none; margin: 0; }
#sideBar ul li { margin-bottom: 12px; font-size: 13px; }
#sideBar ul li a { font-size: 13px; }
#sideBar ul li:last-child { margin-bottom: 0; }

/* ---- 搜索：输入框与按钮同高（36px） ---- */
#sideBarMain #sidebar_search .mySearch { padding: 0 !important; }
/* 搜索框与按钮间距（原 #sidebar_search_box 的 gap 是死代码，这里才是实际生效的位置） */
/* 东家给 #widget_my_zzk 加了 5px 上下外边距，这里显式保留，以免卡片高度变化 */
#sideBarMain #sidebar_search #widget_my_zzk,
#widget_my_zzk { gap: 0; margin: 5px 0; }
#sideBarMain #sidebar_search #sidebar_search_box { display: flex; gap: 0; }
#sideBarMain #sidebar_search #widget_my_zzk {
    display: flex !important;
    gap: 10px;
    flex-wrap: nowrap;
    align-items: center;
    width: 100% !important;
    box-sizing: border-box;
}
#sideBarMain #sidebar_search #q {
    flex: 1 1 auto;
    min-width: 0;
    height: 36px !important;
    line-height: 34px !important;
    padding: 0 12px !important;
    font-size: 13px !important;
    box-sizing: border-box !important;
    border: 1px solid rgba(0, 0, 0, .14);
    border-radius: 8px;
    background: rgba(255, 255, 255, .92);
    color: #333;
    outline: none;
    transition: all .2s;
}
#sideBarMain #sidebar_search #q:focus {
    background: #fff;
    border-color: var(--accent);
}
#sideBarMain #sidebar_search #btnZzk {
    flex: 0 0 auto;
    height: 36px !important;
    line-height: 34px !important;
    padding: 0 18px !important;
    font-size: 13px !important;
    box-sizing: border-box !important;
    border: 1px solid transparent !important;
    border-radius: 8px !important;
    background: var(--accent) !important;
    background-image: none !important;
    color: #fff;
    cursor: pointer;
    text-align: center !important;
    white-space: nowrap;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    transition: background-color .2s;
}
#sideBarMain #sidebar_search #btnZzk:hover { background: var(--accent-dark) !important; }

/* ---- 日历 ---- */
#blog-calendar { margin: 0; }
#sideBarMain #blog-calendar { padding: 20px; }
#blog-calendar table { width: 100%; border-collapse: collapse; table-layout: fixed; }
#blog-calendar th { color: #555; padding: 10px 0; font-size: 12px; font-weight: normal; }
#blog-calendar td {
    text-align: center;
    padding: 8px 0;
    color: #444;
    font-size: 13px;
    border-radius: 6px;
    transition: all .2s;
}
#blog-calendar td:hover { background: rgba(0, 102, 204, .15); color: var(--accent); }
.CalTitle td, .CalTitle td:hover, .CalTitle a {
    background: transparent;
    font-weight: 600;
    color: #333;
    font-size: 15px;
}
#sideBarMain #blog-calendar .CalTitle { margin-bottom: 6px; }
/* 页面上有两个 id="blog-calendar"，空的那个不占位（搬 DOM 靠页脚脚本） */
#sideBarMain > #blog-calendar:empty,
#sidebar_news_container #blog-calendar:empty { display: none !important; }

#profile_block, #blog-news h3 { display: none; }
.my-glass-card { padding: 0; }


/* ============================================================
   10. 固定胶囊导航
   ============================================================ */
.custom-fixed-nav {
    position: fixed;
    top: 20px;
    left: 50%;
    transform: translateX(-50%);
    width: calc(100% - 40px);
    max-width: 1160px;
    height: 60px;
    background: rgba(255, 255, 255, .4);
    backdrop-filter: blur(25px) saturate(180%);
    -webkit-backdrop-filter: blur(25px) saturate(180%);
    border-radius: 50px;
    border: 1px solid rgba(255, 255, 255, .7);
    box-shadow: 0 10px 30px rgba(0, 0, 0, .15);
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 30px;
    z-index: 9999;
    box-sizing: border-box;
    font-family: -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif;
    transition: transform .4s cubic-bezier(.25, 1, .5, 1);
}
.custom-fixed-nav .nav-links { display: flex; gap: 25px; list-style: none; margin: 0; padding: 0; }
.custom-fixed-nav .nav-links li a {
    color: #222;
    text-decoration: none;
    font-weight: 600;
    font-size: 15px;
    transition: color .2s;
}
.custom-fixed-nav .nav-links li a:hover { color: var(--accent); }
.custom-fixed-nav .nav-stats { color: #333; font-weight: 500; font-size: 13px; }


/* ============================================================
   11. 页脚
   （皮肤有 *{margin:0;padding:0}，不处理会贴在屏幕最左边）
   ============================================================ */
#footer {
    max-width: 1200px;
    margin: 0 auto;
    padding: 28px 20px 40px;
    text-align: center;
    color: var(--ink-3);
    font-size: 13px;
    line-height: 2;
}
#footer a { color: var(--ink-3); }
#footer a:hover { color: var(--accent); }
#footer img { vertical-align: middle; }


/* ============================================================
   12. 左下角播放器：与正文保持距离
   ============================================================ */
#qm .qm-panel {
    bottom: 78px;
    max-width: 300px;
}


/* ============================================================
   13. 移动端
   ============================================================ */
@media screen and (max-width: 992px) {
    #blogTitle { height: 250px; margin-bottom: -80px; }
    #main { display: block; padding-top: 90px; }
    #mainContent { width: 100%; float: none; margin-right: 0; }
    #mainContent:has(#topics) { padding: 22px 18px 20px; border-radius: 14px; }
    #blog_post_info { padding: 14px; }

    #topics .postTitle a { font-size: 22px; }
    #topics .postDesc > * { margin: 0 7px !important; }
    #topics .postDesc { margin-bottom: 22px !important; padding-bottom: 16px !important; }
    #green_channel a { padding: 7px 13px !important; font-size: 12.5px !important; }

    /* 侧栏与正文左对齐，消除 12px 横向滚动 */
    #sideBar { width: 100% !important; float: none; margin-top: 20px; padding: 0 !important; }
    #sideBarMain { width: 100% !important; padding: 0 10px !important; box-sizing: border-box; }
    #sideBarMain > * { width: 100% !important; box-sizing: border-box; }

    .custom-fixed-nav { padding: 0 16px; font-size: 13px; }
    .custom-fixed-nav .nav-links { gap: 12px; }
    .custom-fixed-nav .nav-stats { display: none; }

    #qm .qm-panel { width: min(80vw, 300px); }
}

/* 博客园移动皮肤会把正文盖回 14px，这里锁住 */
@media screen and (max-width: 767px) {
    #cnblogs_post_body { font-size: 15px !important; }
}

/* 320px 左右导航会挤 */
@media screen and (max-width: 420px) {
    .custom-fixed-nav .nav-links { gap: 8px; }
    .custom-fixed-nav .nav-links li a { font-size: 12px; }
}


/* ============================================================
   14. 可选：想把「推荐 / 反对」留下来，删掉上面
       #div_digg { display:none } 并取消下面注释
   ============================================================
#div_digg { float: none !important; width: auto !important; display: flex; gap: 10px; text-align: left; }
#div_digg .diggit, #div_digg .buryit {
    background: rgba(255, 255, 255, .85) !important;
    border: 1px solid rgba(0, 0, 0, .12) !important;
    border-radius: 10px; width: 62px; padding: 6px 0; text-align: center;
    color: var(--ink-3); font-size: 12px; line-height: 1.6;
}
#div_digg .diggit::after { content: "推荐"; display: block; font-size: 12px; color: var(--ink-3); }
#div_digg .buryit::after { content: "反对"; display: block; font-size: 12px; color: var(--ink-4); }
#div_digg .diggnum, #div_digg .burynum { font-family: inherit !important; font-size: 15px !important; display: block; }
#div_digg .diggnum { color: var(--accent) !important; }
#div_digg .burynum { color: var(--ink-4) !important; }
*/

/* ============================================================
   15. 订阅弹窗
   点导航「订阅」不再直接打开 RSS 源（浏览器会把 XML 当网页显示），
   改成弹一个小窗：显示地址 + 一键复制 + 阅读器入口。
   ============================================================ */
.qm-sub-mask {
    position: fixed;
    inset: 0;
    z-index: 10000;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(15, 23, 42, .28);
    -webkit-backdrop-filter: blur(3px);
    backdrop-filter: blur(3px);
    opacity: 0;
    transition: opacity .2s ease;
}
.qm-sub-mask.show { opacity: 1; }

.qm-sub {
    width: min(92vw, 380px);
    box-sizing: border-box;
    padding: 22px;
    border-radius: 16px;
    background: rgba(255, 255, 255, .96);
    border: 1px solid rgba(255, 255, 255, .9);
    box-shadow: 0 20px 50px rgba(31, 38, 135, .25);
    font-family: -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif;
    transform: translateY(8px) scale(.98);
    transition: transform .22s cubic-bezier(.2, .9, .3, 1);
}
.qm-sub-mask.show .qm-sub { transform: none; }
.qm-sub h4 {
    margin: 0 0 6px;
    font-size: 15px;
    font-weight: 600;
    color: #1a1a1a;
}
.qm-sub p {
    margin: 0 0 14px;
    font-size: 12.5px;
    line-height: 1.6;
    color: #6b7684;
}
.qm-sub .qm-sub-row { display: flex; gap: 8px; }
.qm-sub input {
    flex: 1 1 auto;
    min-width: 0;
    height: 36px;
    padding: 0 11px;
    font-size: 12.5px;
    color: #333;
    background: #fff;
    border: 1px solid rgba(0, 0, 0, .12);
    border-radius: 8px;
    outline: none;
}
.qm-sub input:focus { border-color: #0066cc; }
.qm-sub .qm-sub-btn {
    flex: 0 0 auto;
    height: 36px;
    padding: 0 16px;
    border: none;
    border-radius: 8px;
    background: #0066cc;
    color: #fff;
    font-size: 12.5px;
    font-family: inherit;
    cursor: pointer;
    white-space: nowrap;
    transition: background .2s;
}
.qm-sub .qm-sub-btn:hover { background: #0055aa; }
.qm-sub .qm-sub-btn.done { background: #1a7f37; }
.qm-sub .qm-sub-links {
    margin-top: 14px;
    padding-top: 12px;
    border-top: 1px dashed rgba(0, 0, 0, .1);
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    font-size: 12.5px;
}
.qm-sub .qm-sub-links a { color: #0066cc; }
.qm-sub .qm-sub-links a:hover { text-decoration: underline; }