/* ==========================================================================
   主题色变量
   - 默认值 = 本文件原先各处硬编码的颜色（亮色模式外观不变）
   - 文件末尾的 prefers-color-scheme: dark 块给出夜间模式取值
   - 新增/修改配色时请走变量，不要再写死颜色，否则夜间模式又会露白
   ========================================================================== */
:root {
    /* 强调色（站点主色：玫红） */
    --art-accent: #eb4a6a;
    --art-accent-strong: #c92b4b;
    --art-accent-soft: rgba(235, 74, 106, 0.12);
    --art-pink-2: #ff8fb1;

    /* 卡片 / 列表条目 */
    --art-card-bg: #ffffff;
    --art-card-border: rgba(128, 128, 128, 0.5);
    --art-card-border-weak: rgba(128, 128, 128, 0.3);
    --art-rule: rgba(128, 128, 128, 0.35);
    --art-thumb-bg: #f3f3f3;
    --art-thumb-placeholder: #f2f7fb;
    --art-title: #363636;
    --art-meta: #9a9a9a;
    --art-caption: #9d9d9d;
    --art-meta-dim: #a0a0a0;
    --art-desc: #7a7a7a;
    --art-sub: #8a8a8a;
    --art-sep: #cfcfcf;

    /* 正文 */
    --art-body-text: #333333;
    --art-heading: #2b2b2b;
    --art-strong: #222222;

    /* 淡色板块（上一页/下一页、文档提示） */
    --art-soft-bg: rgba(235, 74, 106, 0.05);
    --art-note-bg: rgba(235, 74, 106, 0.07);
    --art-note-color: #6a6a6a;

    /* 跳转卡片 / 提及（B 站蓝） */
    --art-panel-bg: #f7fbfd;
    --art-panel-cover: #eef3f7;
    --art-panel-border: rgba(0, 174, 236, 0.35);
    --art-panel-ink: #0077a3;
    --art-mention: #00aeec;

    /* 行内公式 */
    --art-math-bg: rgba(0, 174, 236, 0.09);
    --art-math-fg: #1a5fb4;

    /* 按钮 / 图片边框 */
    --art-btn-bg: #ffffff;
    --art-img-border: rgba(0, 0, 0, 0.12);
}

/* ==========================================================================
   文章（专栏移植）样式
   - 首页/列表页卡片：A4 纸比例（1 : 1.414），上 1:1 头图，下标题
   - 文章列表页条目：横向，左 1:1 头图，右标题
   - 阅读页：B 站专栏正文排版
   ========================================================================== */

/* ---------- A4 比例卡片（首页一排） ---------- */
.article-card {
    display: flex;
    flex-direction: column;
    /* A4 纸长宽比 */
    aspect-ratio: 1 / 1.4142;
    border: 1px solid var(--art-card-border);
    border-radius: 0.6rem;
    overflow: hidden;
    background-color: var(--art-card-bg);
    color: inherit;
    text-decoration: none;
    transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
}

.article-card:hover {
    transform: translateY(-3px);
    border-color: var(--art-accent);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.18);
}

.article-card:hover .art-title {
    color: var(--art-accent);
}

/* 上边：1:1 头图 */
.article-card .art-thumb {
    width: 100%;
    aspect-ratio: 1 / 1;
    flex: 0 0 auto;
    overflow: hidden;
    background-color: var(--art-thumb-bg);
}

.article-card .art-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* 下边：标题 */
.article-card .art-body {
    flex: 1 1 auto;
    min-height: 0;
    padding: 0.7rem 0.85rem 0.8rem;
    border-top: 1px solid var(--art-card-border-weak);
    display: flex;
    flex-direction: column;
}

.article-card .art-title {
    font-weight: 700;
    font-size: 1rem;
    line-height: 1.4;
    color: var(--art-title);
    /* 最多 3 行，超出省略 */
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.article-card .art-meta {
    margin-top: auto;
    padding-top: 0.4rem;
    font-size: 0.78rem;
    color: var(--art-meta);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ---------- 文章列表页：横向条目（左 1:1 头图，右标题） ---------- */
.article-row {
    display: flex;
    align-items: stretch;
    gap: 1rem;
    padding: 0.75rem;
    border: 1px solid var(--art-card-border);
    border-radius: 0.6rem;
    background-color: var(--art-card-bg);
    color: inherit;
    text-decoration: none;
    transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
}

.article-row + .article-row {
    margin-top: 1rem;
}

.article-row:hover {
    transform: translateX(3px);
    border-color: var(--art-accent);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
}

.article-row:hover .art-title {
    color: var(--art-accent);
}

.article-row .row-thumb {
    flex: 0 0 auto;
    width: 9rem;
    height: 9rem;
    /* 左图严格 1:1 */
    aspect-ratio: 1 / 1;
    border-radius: 0.5rem;
    overflow: hidden;
    background-color: var(--art-thumb-bg);
}

.article-row .row-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.article-row .row-body {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 0.4rem;
}

.article-row .art-title {
    font-weight: 700;
    font-size: 1.25rem;
    line-height: 1.4;
    color: var(--art-title);
}

.article-row .art-desc {
    font-size: 0.9rem;
    color: var(--art-desc);
    line-height: 1.6;
}

.article-row .art-meta {
    font-size: 0.8rem;
    color: var(--art-meta-dim);
}

@media (max-width: 640px) {
    .article-row {
        flex-direction: row;
        align-items: center;
    }

    .article-row .row-thumb {
        width: 6.5rem;
        height: 6.5rem;
    }

    .article-row .art-title {
        font-size: 1.05rem;
    }

    .article-row .art-desc {
        font-size: 0.82rem;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }
}

/* ---------- 阅读页正文 ---------- */
.article-page {
    max-width: 54rem;
    margin: 0 auto;
    padding: 0 1rem;
}

.article-page .article-head {
    padding: 1.5rem 0 1rem;
    border-bottom: 1px solid var(--art-rule);
    margin-bottom: 1.5rem;
}

.article-page .article-head h1 {
    font-size: 1.85rem;
    font-weight: 700;
    line-height: 1.35;
}

.article-page .article-head .article-sub {
    margin-top: 0.6rem;
    font-size: 0.9rem;
    color: var(--art-sub);
}

.opus {
    font-size: 1rem;
    line-height: 1.9;
    color: var(--art-body-text);
    word-wrap: break-word;
    overflow-wrap: anywhere;
}

.opus p {
    margin-bottom: 1rem;
}

.opus h2 {
    font-size: 1.35rem;
    font-weight: 700;
    line-height: 1.5;
    margin: 2rem 0 1rem;
    padding-left: 0.7rem;
    border-left: 4px solid var(--art-accent);
    color: var(--art-heading);
}

.opus h2:first-child {
    margin-top: 0;
}

.opus strong {
    font-weight: 700;
    color: var(--art-strong);
}

.opus a {
    color: var(--art-accent);
    word-break: break-all;
    transition: color 0.15s ease;
}

/* 正文里的行内链接（无 class 的普通 <a>）：hover / 键盘聚焦时出下划线并加深颜色。
   带 class 的 <a>（jump-card、code-btn、fig-link 等组件）不套用这套状态。 */
.opus a:not([class]):hover,
.opus a:not([class]):focus-visible {
    color: var(--art-accent-strong);
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 0.16em;
}

.opus ul,
.opus ol {
    margin: 0 0 1rem 1.4rem;
    list-style: disc;
}

.opus ol {
    list-style: decimal;
}

.opus li {
    margin-bottom: 0.35rem;
}

.opus hr {
    margin: 1.8rem 0;
    border: none;
    border-top: 1px dashed rgba(128, 128, 128, 0.5);
    background: none;
}

.opus figure {
    margin: 1.4rem 0;
    text-align: center;
}

.opus figure img {
    max-width: 100%;
    height: auto;
    border-radius: 0.5rem;
    border: 1px solid var(--art-rule);
    /* block + auto 居中：inline-block 会在图片底下留出行框基线空隙（约 10px），
       让图片与下方图注显得离得远 */
    display: block;
    margin: 0 auto;
}

/* 图注（B 站专栏里图片下方的灰色小字） */
.opus .fig-caption {
    text-align: center;
    color: var(--art-caption);
    font-size: 0.88rem;
    margin: -0.8rem 0 1.4rem;
}

.article-foot {
    margin: 2.5rem 0 3rem;
    padding-top: 1.5rem;
    border-top: 1px solid var(--art-rule);
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
    align-items: flex-start;
}

/* 底部按钮统一尺寸与间距：
   Bulma 给非末位按钮留了 0.5rem 下外边距，而 theme.css 在 ≤768px 把 .button 改成
   height:auto；两者叠加后 flex 的默认 stretch 会把「没有下外边距的最后一个按钮」拉高，
   视觉上就是它比别的按钮高一点点。这里把外边距归零、固定高度，间距只交给 gap。 */
.article-foot .button {
    height: 2.5rem;
    margin-bottom: 0;
    white-space: nowrap;
}

/* 区块标题（与首页其它区块保持一致） */
.article-section-title {
    padding-left: 0.75rem;
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
}

/* ---------- 阅读页：标题上方的封面图 ---------- */
.article-cover {
    margin: 0 0 1.5rem;
    text-align: center;
}

.article-cover img {
    max-width: 100%;
    height: auto;
    border-radius: 0.75rem;
    border: 1px solid var(--art-rule);
}

/* ---------- 副标题：作者 / 时间 / 分类 ---------- */
.article-sub {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.4rem;
    line-height: 1.7;
}

.article-sub .art-author a {
    color: var(--art-accent);
    font-weight: 700;
}

.article-sub .art-author a:hover {
    text-decoration: underline;
}

.art-sep {
    color: var(--art-sep);
}

.article-sub .art-cat {
    color: var(--art-accent);
    background-color: var(--art-accent-soft);
    border-radius: 1rem;
    padding: 0.05rem 0.6rem;
    font-size: 0.82rem;
}

/* 分类标签本身就是进入栏目页的链接 */
.article-sub a.art-cat {
    text-decoration: none;
    transition: background-color 0.15s ease, color 0.15s ease;
}

.article-sub a.art-cat:hover,
.article-sub a.art-cat:focus {
    color: #fff;
    background-color: var(--art-accent);
}

/* ---------- 分类分组与折叠 ---------- */
.article-cat {
    margin-bottom: 2.75rem;
}

.article-cat-title {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    font-size: 1.4rem;
    font-weight: 700;
    color: var(--art-heading);
    margin: 0 0 1rem;
    padding-left: 0.7rem;
    border-left: 4px solid var(--art-accent);
}

.article-cat-count {
    font-size: 0.78rem;
    font-weight: 400;
    color: #fff;
    background-color: var(--art-accent);
    border-radius: 1rem;
    padding: 0.1rem 0.6rem;
}

.article-cat-list[hidden] {
    display: none !important;
}

.cat-toggle {
    margin-top: 0.9rem;
}

/* 列表页「查看全部文章」跳转按钮 */
.cat-more {
    margin-top: 1.5rem;
}

/* ---------- 栏目页顶部：栏目切换条 ---------- */
/* 不换行 + 横向滚动：窄窗口下按钮不会掉到第二行显得"往下偏移" */
.cat-chips {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 0.45rem;
    overflow-x: auto;
    overflow-y: hidden;
    padding: 0.1rem 0 0.4rem;
    scrollbar-width: thin;
    scrollbar-color: rgba(128, 128, 128, 0.45) transparent;
    -webkit-overflow-scrolling: touch;
}

.cat-chips::-webkit-scrollbar {
    height: 6px;
}

.cat-chips::-webkit-scrollbar-track {
    background: transparent;
}

.cat-chips::-webkit-scrollbar-thumb {
    background-color: rgba(128, 128, 128, 0.45);
    border-radius: 3px;
}

.cat-chips .button {
    flex: 0 0 auto;
    margin: 0;
    white-space: nowrap;
}

/* 栏目页底部的「全部栏目 / 上一栏目 / 下一栏目 / 返回主页」 */
.cat-foot {
    row-gap: 0.5rem;
}

/* ---------- 正文表格 ---------- */
.opus table {
    margin-bottom: 1rem;
}

.opus table td,
.opus table th {
    vertical-align: middle;
}

/* ==========================================================================
   阅读页增强：cv 原地址按钮 / 跳转卡片 / 代码卡片 / 图注 / 行内公式
   ========================================================================== */

/* ---------- 副标题里的 cv 原地址按钮（作者 · 时间之后） ---------- */
.cv-btn {
    display: inline-block;
    font-family: ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", monospace;
    font-size: 0.78rem;
    line-height: 1.55;
    padding: 0.05rem 0.6rem;
    border-radius: 0.35rem;
    background-color: #00aeec;
    border: 1px solid transparent;
    color: #fff !important;
    text-decoration: none;
    transition: background-color 0.15s ease;
}

.cv-btn:hover {
    background-color: #0094c9;
    text-decoration: none;
}

/* ---------- 跳转卡片（B 站「引用专栏 / 引用视频」） ---------- */
.opus .jump-card {
    display: block;
    position: relative;
    margin: 1.5rem auto;
    max-width: 100%;
    border: 1px solid var(--art-panel-border);
    border-radius: 0.6rem;
    overflow: hidden;
    background-color: var(--art-panel-bg);
    text-decoration: none;
    transition: transform 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}

.opus .jump-card img {
    display: block;
    width: 100%;
    height: auto;
    border: none;
    border-radius: 0;
}

.opus .jump-card:hover {
    transform: translateY(-2px);
    border-color: #00aeec;
    box-shadow: 0 6px 18px rgba(0, 174, 236, 0.18);
}

.jump-card-badge {
    position: absolute;
    right: 0.5rem;
    bottom: 0.5rem;
    padding: 0.08rem 0.55rem;
    border-radius: 1rem;
    background-color: rgba(0, 174, 236, 0.92);
    color: #fff;
    font-size: 0.72rem;
    line-height: 1.6;
}

.jump-card-fallback {
    display: block;
    padding: 1rem 1.2rem;
    color: var(--art-panel-ink);
    font-weight: 700;
}

/* 文字版跳转卡片（结构化 link_card：封面 + 标题 + 数据） */
.opus .jump-card.is-text {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    padding: 0.7rem 0.9rem;
}

.opus .jump-card.is-text .jump-card-cover {
    flex: 0 0 auto;
    width: 7.5rem;
    height: 4.6rem;
    border-radius: 0.45rem;
    overflow: hidden;
    background-color: var(--art-panel-cover);
}

.opus .jump-card.is-text .jump-card-cover img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.opus .jump-card-main {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.opus .jump-card-title {
    font-weight: 700;
    font-size: 1rem;
    line-height: 1.45;
    color: var(--art-heading);
}

.opus .jump-card.is-text:hover .jump-card-title {
    color: var(--art-panel-ink);
}

.opus .jump-card-meta {
    font-size: 0.82rem;
    color: var(--art-meta);
}

.opus .jump-card.is-text .jump-card-badge {
    position: static;
    flex: 0 0 auto;
    align-self: center;
}

@media (max-width: 640px) {
    .opus .jump-card.is-text {
        gap: 0.6rem;
        padding: 0.6rem;
    }

    .opus .jump-card.is-text .jump-card-cover {
        width: 5rem;
        height: 3.2rem;
    }

    .opus .jump-card.is-text .jump-card-badge {
        display: none;
    }
}

/* @提及 */
.opus .opus-mention {
    color: var(--art-mention);
    font-weight: 700;
}

/* ---------- 代码卡片（可一键复制） ---------- */
.opus .code-card {
    margin: 1.5rem 0;
    border: 1px solid #3a3f4b;
    border-radius: 0.6rem;
    overflow: hidden;
    background-color: #282c34;
}

.opus .code-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    padding: 0.3rem 0.5rem 0.3rem 0.8rem;
    background-color: #21252b;
}

.opus .code-lang {
    color: #9da5b4;
    font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
    font-size: 0.78rem;
    letter-spacing: 0.02em;
}

.opus .code-btn {
    cursor: pointer;
    padding: 0.12rem 0.6rem;
    border: 1px solid #3f4654;
    border-radius: 0.35rem;
    background-color: transparent;
    color: #abb2bf;
    font-size: 0.75rem;
    transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.opus .code-btn:hover {
    background-color: #2f3540;
    color: #fff;
}

.opus .code-btn.is-done {
    color: #98c379;
    border-color: #98c379;
}

.opus .code-body {
    margin: 0;
    padding: 0.85rem 1rem;
    overflow-x: auto;
    background-color: transparent;
}

.opus .code-body code {
    display: block;
    margin: 0;
    padding: 0;
    background: none;
    color: #e6e9ef;
    font-family: ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", monospace;
    font-size: 0.86rem;
    line-height: 1.65;
    white-space: pre;
    tab-size: 4;
}

/* ---------- 行内公式（B 站 latex 图片 → 文本） ---------- */
.opus .inline-math {
    padding: 0 0.28rem;
    border-radius: 0.2rem;
    background-color: var(--art-math-bg);
    color: var(--art-math-fg);
    font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
    font-size: 0.92em;
    white-space: nowrap;
}

/* ---------- 老专栏里的字号 / 颜色类 ---------- */
.opus .font-size-12 {
    font-size: 0.78em;
}

.opus .font-size-16 {
    font-size: 1em;
}

.opus .font-size-20 {
    font-size: 1.25em;
}

.opus .font-size-23 {
    font-size: 1.4375em;
}

.opus .color-pink-03 {
    color: var(--art-accent);
}

.opus .color-pink-02 {
    color: var(--art-pink-2);
}

.opus .color-blue-03 {
    color: var(--art-mention);
}

/* ---------- 正文图与图注 ---------- */
.opus .opus-fig {
    margin: 1.7rem 0;
}

.opus .opus-fig .fig-caption {
    margin: 0.55rem 0 0;
}

/* ---------- 列表页图标与占位缩略图 ---------- */
.page-title {
    display: flex;
    align-items: center;
    gap: 0.6rem;
}

.page-icon {
    width: 2.4rem;
    height: 2.4rem;
    flex: 0 0 auto;
    border-radius: 0.5rem;
}

.row-thumb.is-placeholder,
.art-thumb.is-placeholder {
    background-color: var(--art-thumb-placeholder);
}

.row-thumb.is-placeholder img,
.art-thumb.is-placeholder img {
    object-fit: contain;
    padding: 0.8rem;
}

/* ---------- 阅读页：上一篇 / 下一篇（悬停或直接显示标题预览） ---------- */
.article-pager {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
    margin: 0 0 3rem;
}

/* 标题/作者下方的那一份：与底部完全同款，只把上下留白收紧一点 */
.article-pager.is-top {
    margin: 0 0 1.8rem;
}

.article-pager .pager-item {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.3rem;
    min-width: 0;
    padding: 0.7rem 0.9rem;
    border: 1px solid var(--art-rule);
    border-radius: 0.6rem;
    background-color: var(--art-soft-bg);
    color: inherit;
    text-decoration: none;
    transition: border-color 0.15s, background-color 0.15s;
}

.article-pager .pager-item.is-next {
    align-items: flex-end;
    text-align: right;
}

.article-pager .pager-item:hover,
.article-pager .pager-item:focus-visible {
    border-color: var(--art-accent);
    background-color: var(--art-accent-soft);
}

.article-pager .pager-dir {
    font-size: 0.8rem;
    font-weight: 700;
    color: var(--art-accent);
}

/* 标题预览：最多两行，超出省略 */
.article-pager .pager-title {
    font-size: 0.92rem;
    line-height: 1.5;
    word-break: break-word;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.article-pager .pager-item.is-disabled {
    pointer-events: none;
    background-color: transparent;
    border-style: dashed;
    opacity: 0.6;
}

.article-pager .pager-item.is-disabled .pager-dir {
    color: var(--art-sub);
}

@media screen and (max-width: 640px) {
    .article-pager {
        grid-template-columns: 1fr;
    }

    .article-pager .pager-item.is-next {
        align-items: flex-start;
        text-align: left;
    }
}

/* ---------- 站内文档（由本地 docx/doc/pdf/图片转换而来） ---------- */
.doc-badge {
    display: inline-block;
    padding: 0.05rem 0.55rem;
    border-radius: 999px;
    background-color: var(--art-accent-soft);
    color: var(--art-accent);
    font-size: 0.78rem;
    font-weight: 700;
    line-height: 1.5;
}

.doc-source {
    margin: 0.45rem 0 0;
    color: var(--art-sub);
    font-size: 0.85rem;
    word-break: break-word;
}

.doc-note {
    margin: 0.35rem 0 0;
    padding: 0.5rem 0.8rem;
    border-left: 3px solid var(--art-accent);
    border-radius: 0 0.3rem 0.3rem 0;
    background-color: var(--art-note-bg);
    color: var(--art-note-color);
    font-size: 0.85rem;
    line-height: 1.6;
}

/* ---------- 三级标题（仅中英双语文章）：B 站原稿的 level-2 标题 ──────────
   Bulma 的重置把 h3 压成 16px/400，与正文完全同款，层级看不出来；
   这里给双语文章补一点字号/字重/间距，中英两版观感一致。 */
.opus.is-bilingual h3 {
    font-size: 1.08rem;
    font-weight: 700;
    line-height: 1.6;
    margin: 1.3rem 0 0.6rem;
    color: var(--art-heading);
}

/* ---------- 中英切换按钮（副标题最右侧） ---------- */
.lang-btn {
    display: inline-block;
    font-size: 0.78rem;
    line-height: 1.55;
    padding: 0.05rem 0.6rem;
    border-radius: 0.35rem;
    background-color: var(--art-btn-bg);
    border: 1px solid var(--art-accent);
    color: var(--art-accent) !important;
    text-decoration: none;
}

.lang-btn:hover {
    background-color: var(--art-accent);
    color: #fff !important;
    text-decoration: none;
}

/* ---------- 公式（构建时用 KaTeX 预渲染成静态 HTML） ---------- */
.opus .math-block {
    margin: 1.2rem 0;
    text-align: center;
    overflow-x: auto;
    overflow-y: hidden;
    padding: 0.2rem 0;
}

.opus .math-block .katex-display {
    margin: 0;
}

.opus .katex {
    font-size: 1.02em;
}

/* PDF 原页面：整页图（可点击看原尺寸） */
.opus-fig.is-fullpage {
    margin: 1.1rem 0;
}

.opus-fig.is-fullpage a {
    display: block;
    line-height: 0;
}

.opus-fig.is-fullpage img {
    border: 1px solid var(--art-img-border);
    border-radius: 0.35rem;
    box-shadow: 0 1px 6px rgba(26, 29, 32, 0.16);
}




/* ==========================================================================
   夜间模式（跟随系统 prefers-color-scheme）
   Bulma 在夜间模式下会把页面底色换成深色，本文件的卡片/正文/跳转卡片
   必须一起换，否则会出现「深色页面上浮着白色块、正文 #333 看不清」。
   ========================================================================== */
@media (prefers-color-scheme: dark) {
    :root {
        /* 强调色在深底上提亮一档，保证可读 */
        --art-accent: #ff6b8a;
        --art-accent-strong: #ff8ea4;
        --art-accent-soft: rgba(255, 107, 138, 0.16);
        --art-pink-2: #ffb3c9;

        /* 卡片：比页面底色(hsl 221 14% 9%)略亮一档，靠边框分层 */
        --art-card-bg: hsl(var(--bulma-scheme-h, 221), var(--bulma-scheme-s, 14%), 12%);
        --art-card-border: rgba(255, 255, 255, 0.15);
        --art-card-border-weak: rgba(255, 255, 255, 0.1);
        --art-rule: rgba(255, 255, 255, 0.14);
        --art-thumb-bg: hsl(var(--bulma-scheme-h, 221), var(--bulma-scheme-s, 14%), 16%);
        --art-thumb-placeholder: hsl(200, 25%, 15%);
        --art-title: #f1f3f6;
        --art-meta: #9aa1ab;
        --art-caption: #9aa1ab;
        --art-meta-dim: #98a0aa;
        --art-desc: #aeb5bf;
        --art-sub: #9ba3ad;
        --art-sep: #5b626c;

        /* 正文：深灰底上用浅灰，不再用 #333 */
        --art-body-text: #d5d9e0;
        --art-heading: #f2f4f7;
        --art-strong: #ffffff;

        --art-soft-bg: rgba(255, 107, 138, 0.08);
        --art-note-bg: rgba(255, 107, 138, 0.1);
        --art-note-color: #b9c0c9;

        --art-panel-bg: hsl(200, 40%, 13%);
        --art-panel-cover: hsl(200, 28%, 18%);
        --art-panel-border: rgba(0, 174, 236, 0.45);
        --art-panel-ink: #7cc9f0;
        --art-mention: #7cc9f0;

        --art-math-bg: rgba(0, 174, 236, 0.18);
        --art-math-fg: #9ed2ff;

        --art-btn-bg: transparent;
        --art-img-border: rgba(255, 255, 255, 0.16);
    }

    /* 夜间模式下图片描边过黑会糊在底上，换成浅色细边 */
    .opus figure img,
    .article-cover img,
    .opus-fig.is-fullpage img {
        border-color: var(--art-img-border);
    }

    .opus-fig.is-fullpage img {
        box-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
    }

    /* 由 docx/doc 转换来的站内文档，正文里带着原文档的内联颜色
       （style="color:#222" / #244061 / #0b0080 等深色），变量管不到，
       夜间模式下在深底上几乎看不见。这里整体提亮：
       深色被抬到可读区间，原本就是红色的强调文字（#ff0000）保持红色。
       优先给「含内联色文字的段落」上一层滤镜（几百个 span 各建图层太重），
       不支持 :has() 的旧浏览器退回逐元素提亮。 */
    @supports selector(:has(*)) {
        .opus p:has([style*="color"]),
        .opus li:has([style*="color"]),
        .opus h2:has([style*="color"]),
        .opus h3:has([style*="color"]),
        .opus h4:has([style*="color"]),
        .opus td:has([style*="color"]),
        .opus th:has([style*="color"]),
        .opus blockquote:has([style*="color"]) {
            filter: brightness(3) saturate(1.15);
        }
    }

    @supports not selector(:has(*)) {
        .opus [style*="color"] {
            filter: brightness(3) saturate(1.15);
        }
    }

    /* 副标题里的 cv 原地址按钮 / 跳转卡片角标：B 站蓝（#00aeec）配白字在夜间
       只有 2.5:1，且蓝块本身很亮。夜间压深一档，白字对比升到 4.5 以上。 */
    .cv-btn {
        background-color: #0b7fa8;
    }

    .cv-btn:hover {
        background-color: #0e93c2;
    }

    .jump-card-badge {
        background-color: rgba(11, 127, 168, 0.95);
    }
}