/* =====================================================================
   候鸟自在复盘笔记 · 视觉升级覆盖层 theme-v1（2026-10-01）

   策略：不改模板结构、不改 class 名，只在本文件里
     ① 重定义既有 CSS 变量（style.css 的 --bg/--ink/--line/--red/--serif …）
        —— 现有页面大量使用这些变量，重定义即可一次性改变大部分视觉；
     ② 覆盖少量硬编码的组件细节（圆角/阴影/过渡/表格/按钮）。

   引入位置：必须在 style.css / modules.css / home.css / dashboard.css 之后。
   回滚方式：删除 base.html 里对这一行的引入即可，其余文件零改动。

   注意：不引入任何外部字体（Google Fonts 在国内会拖慢首屏），
        字体栈里保留 Inter / JetBrains Mono 作为"有则更佳"，实际生效的是系统字体。
   ===================================================================== */

/* ---------------------------------------------------------------------
   1. Token 覆盖（核心杠杆）
   --------------------------------------------------------------------- */
:root {
  /* ---- 中性色：暖调纸感 → 冷调屏幕优先 ---- */
  --bg: #ffffff;              /* 原 #faf8f4 米白 */
  --bg-soft: #f6f7f9;
  --bg-sunken: #eef0f3;
  --card: #ffffff;
  --ink: #16181d;             /* 原 #1b1f27 */
  --sub: #5c6470;
  --mute: #8b93a1;
  --line: #e6e9ed;            /* 原 #e8e3d9 暖线 → 冷线 */
  --line-2: #d9dee4;

  /* ---- 品牌色：提纯（朱红延续，不做大改以免老读者失去识别） ---- */
  --red: #d4362a;
  --red-deep: #b02a21;
  --brand: #d4362a;
  --brand-soft: #fbeae8;
  --brand-ink: #a92a1f;

  /* ---- 功能色：咬住「涨红跌绿」的 A 股习惯，同时把品牌与涨跌分离 ---- */
  --up: #e23e36;
  --up-soft: #fdeceb;
  --down: #1e9e6e;
  --down-soft: #e6f6ef;
  --green: #1e9e6e;           /* 原 #1e8e68 */
  --warn: #e0951a;
  --amber: #e0951a;           /* 原 #b57708 */
  --gold: #a97e1f;            /* 保留：仅用于「最新」等标签，降低存在感 */
  --info: #2f6fdb;
  --info-soft: #e8f0fd;
  --slate: #5c6470;
  --teal: #1f7a8c;
  --violet: #6b4fa8;

  /* ---- 字体：弃衬线（小字号表格/数字里衬线会糊）---- */
  --sans: "Inter", "SF Pro Text", -apple-system, BlinkMacSystemFont,
          "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei",
          "Noto Sans SC", sans-serif;
  --mono: "JetBrains Mono", "SF Mono", "Roboto Mono", Consolas,
          "Courier New", monospace;
  /* 关键决策：标题不再用衬线。原先所有 var(--serif) 的引用自动跟着变，
     是"从书卷气到数据感"最直接的一步，且回滚只需改这一行。 */
  --serif: "Inter", -apple-system, BlinkMacSystemFont, "PingFang SC",
           "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans SC", sans-serif;

  /* ---- 圆角：10 → 12 基准，并补齐三档 ---- */
  --radius: 12px;
  --radius-sm: 8px;
  --radius-xs: 6px;
  --radius-lg: 16px;
  --radius-pill: 999px;

  /* ---- 阴影：3 级克制（唯一用途是表达"浮起"）---- */
  --shadow: 0 1px 2px rgba(22, 24, 29, .05);
  --shadow-md: 0 2px 6px rgba(22, 24, 29, .06), 0 1px 2px rgba(22, 24, 29, .05);
  --shadow-lg: 0 8px 24px rgba(22, 24, 29, .10), 0 2px 6px rgba(22, 24, 29, .06);
  --focus-ring: 0 0 0 3px rgba(212, 54, 42, .18);

  /* ---- 动效：只做反馈，不做表演 ---- */
  --ease: cubic-bezier(.22, .61, .36, 1);
  --t-fast: 120ms;
  --t: 180ms;
  --t-slow: 280ms;
  --lift: 2px;

  /* ---- 间距刻度（4 基线）---- */
  --sp-1: 4px;  --sp-2: 8px;  --sp-3: 12px; --sp-4: 16px;
  --sp-5: 20px; --sp-6: 24px; --sp-8: 32px; --sp-10: 40px;
}


/* ---------------------------------------------------------------------
   2. 基础排版
   --------------------------------------------------------------------- */
body {
  background: var(--bg);
  color: var(--ink-2, #2c313a);
  font: 400 15px/1.6 var(--sans);
  -webkit-font-smoothing: antialiased;
}
a { color: var(--red); transition: color var(--t-fast) var(--ease); }

/* 数字 / 代码 / 百分比：等宽 + 表格数字，保证纵向对齐 */
.num, .ds-num, code, kbd, samp, pre,
.article-views, .view-count, .like-count,
.cat-row-date, .db-tl-date, .hp-recent-date,
.resonance-code, .article-date, .article-gen,
.cat-cal-cell, .ab-stat b, .hp-stat b, .db-signal-num {
  font-family: var(--mono);
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum";
}

/* 标题：统一字重与字距，收紧行长 */
h1, h2, h3, h4,
.article-title, .hero-title, .sec-head h2, .db-hero-title,
.hp-title, .cat-head-title, .page-title, .ab-h2,
.resonance-title, .comments-title {
  color: var(--ink);
  letter-spacing: -.01em;
}


/* ---------------------------------------------------------------------
   3. 头部与导航
   --------------------------------------------------------------------- */
.site-header {
  background: rgba(255, 255, 255, .88);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--line);
  box-shadow: none;
}
.logo-mark { border-radius: var(--radius-sm); background: var(--red); }
.logo-text { letter-spacing: 0; }

.main-nav a {
  border-radius: var(--radius-sm);
  color: var(--ink-3, #5c6470);
  transition: color var(--t-fast) var(--ease), background var(--t-fast) var(--ease);
}
.main-nav a:hover { color: var(--red); background: var(--brand-soft); }
.main-nav a.active { color: var(--red); background: var(--brand-soft); font-weight: 600; }

/* 模块目录：胶囊化（文章页锚点导航） */
.mod-nav {
  border: 1px solid var(--line);
  border-radius: var(--radius-pill);
  background: rgba(255, 255, 255, .92);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  padding: var(--sp-1);
  gap: var(--sp-1);
}
.mod-nav a {
  border-radius: var(--radius-pill);
  font-size: 13px;
  color: var(--ink-3, #5c6470);
  transition: all var(--t-fast) var(--ease);
}
.mod-nav a:hover { color: var(--red); background: var(--brand-soft); }


/* ---------------------------------------------------------------------
   4. 按钮与表单
   --------------------------------------------------------------------- */
.btn {
  border-radius: var(--radius-sm);
  font-weight: 600;
  transition: background var(--t-fast) var(--ease),
              border-color var(--t-fast) var(--ease),
              color var(--t-fast) var(--ease),
              transform var(--t) var(--ease),
              box-shadow var(--t) var(--ease);
}
.btn:active { transform: translateY(1px); }
.btn:focus-visible { outline: none; box-shadow: var(--focus-ring); }

.btn-primary { background: var(--red); color: #fff; }
.btn-primary:hover { background: var(--red-deep); color: #fff; }

.btn-ghost,
.btn-secondary {
  background: #fff;
  color: var(--ink-3, #5c6470);
  border-color: var(--line-2);
}
.btn-ghost:hover,
.btn-secondary:hover { border-color: var(--red); color: var(--red); background: #fff; }

.btn-sm { border-radius: var(--radius-xs); }
.btn-lg { border-radius: var(--radius-sm); }

/* 表单控件：统一高度与聚焦环 */
input[type="text"], input[type="email"], input[type="password"],
input[type="search"], input[type="number"], textarea, select {
  border: 1px solid var(--line-2);
  border-radius: var(--radius-sm);
  background: #fff;
  color: var(--ink);
  font-family: var(--sans);
  transition: border-color var(--t-fast) var(--ease), box-shadow var(--t-fast) var(--ease);
}
input:focus, textarea:focus, select:focus {
  outline: none;
  border-color: var(--red);
  box-shadow: var(--focus-ring);
}
input::placeholder, textarea::placeholder { color: var(--mute); }


/* ---------------------------------------------------------------------
   5. 卡片 / 列表 / 面板
   --------------------------------------------------------------------- */
/* 统一"卡片感"：1px 描边 + 极淡阴影 + 12px 圆角（原来多数是 10px 暖调） */
.list-item, .cat-row, .cat-feature, .hp-recent-item, .db-tl-item,
.db-cat, .hp-cat, .hp-feat, .hp-about-card, .ab-card, .ab-term,
.mini, .ds-card, .auth-card, .reg-guide-card, .unlock-gate-card,
.hp-note-card, .cat-digest, .cat-cal, .resonance,
.comment-item, .profile-card, .admin-card {
  border-radius: var(--radius);
  border-color: var(--line);
}
.list-item, .cat-row, .hp-recent-item, .db-tl-item, .ab-card, .ab-term {
  background: #fff;
  box-shadow: none;
  transition: border-color var(--t-fast) var(--ease), background var(--t-fast) var(--ease);
}
.list-item:hover, .cat-row:hover, .hp-recent-item:hover, .db-tl-item:hover {
  background: var(--bg-soft);
  border-color: var(--line-2);
}

/* 可点击的大卡片：hover 上移 2px */
.cat-feature, .db-cat, .hp-cat, .hp-feat, .cat-digest, .hp-about-card {
  transition: transform var(--t) var(--ease),
              box-shadow var(--t) var(--ease),
              border-color var(--t) var(--ease);
}
.cat-feature:hover, .db-cat:hover, .hp-cat:hover, .hp-feat:hover,
.cat-digest:hover, .hp-about-card:hover {
  transform: translateY(calc(-1 * var(--lift)));
  box-shadow: var(--shadow-md);
}

/* 区块标题：细分割线替代粗黑边 */
.sec-head, .db-sec-head, .hp-sec-head, .cat-cal-head, .ab-h2 {
  border-bottom: 1px solid var(--line);
}
.sec-head { border-bottom-width: 1px; }
.ab-h2 { border-bottom: 2px solid var(--ink); }  /* 关于页保留强调 */

/* 首页首屏：暖色渐变 → 冷调极淡渐变 */
.hero, .hp-hero {
  background: linear-gradient(160deg, #fff 0%, #fdf7f6 55%, #f9eeec 100%);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
}


/* ---------------------------------------------------------------------
   6. 文章页
   --------------------------------------------------------------------- */
.article {
  background: #fff;
  border-color: var(--line);
  border-radius: var(--radius);
  box-shadow: none;
}
.article-title { line-height: 1.28; letter-spacing: -.015em; }
.article-body { font-size: 15px; line-height: 1.85; color: var(--ink-2, #2c313a); }
.article-body h2, .article-body h3 { letter-spacing: -.01em; }
.article-body blockquote {
  border-left: 3px solid var(--red);
  background: var(--bg-soft);
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
}
.article-body code { font-family: var(--mono); border-radius: var(--radius-xs); }
.article-body pre { border-radius: var(--radius-sm); }

/* 数据来源标签（T2 三要素）：药丸化，降低视觉重量 */
.article-source, .article-gen {
  background: var(--bg-soft);
  border-color: var(--line);
  border-radius: var(--radius-pill);
  color: var(--ink-3, #5c6470);
  font-size: 12px;
}


/* ---------------------------------------------------------------------
   7. 表格（数据密度优先）
   --------------------------------------------------------------------- */
table {
  border-color: var(--line);
  border-radius: var(--radius-sm);
}
th {
  background: var(--bg-sunken);
  color: var(--ink-3, #5c6470);
  font-weight: 600;
  border-bottom: 1px solid var(--line);
}
td { border-bottom: 1px solid var(--line); }
tbody tr { transition: background var(--t-fast) var(--ease); }
tbody tr:hover { background: var(--bg-soft); }


/* ---------------------------------------------------------------------
   8. 徽章 / 标签 / 提示（统一药丸与色调）
   --------------------------------------------------------------------- */
.db-chip, .hp-chip, .cat-feature-tag, .cat-digest-tag, .db-cat-latest-tag,
.resonance-mod, .ds-chip {
  border-radius: var(--radius-pill);
  font-weight: 600;
}
.resonance-hits, .hp-chip-num, .db-cat-cnt, .cat-feature-flag {
  border-radius: var(--radius-pill);
}
.flash {
  border-radius: var(--radius-sm);
  border: 1px solid var(--line);
}
.flash-ok { background: var(--down-soft); border-color: rgba(30,158,110,.25); }
.flash-err { background: var(--up-soft); border-color: rgba(226,62,54,.25); }
.flash-warn { background: var(--warn-soft, #fdf3e2); border-color: rgba(224,149,26,.28); }


/* ---------------------------------------------------------------------
   9. v3 新组件对齐新风格
   --------------------------------------------------------------------- */
/* 共振榜：品牌左描边 + 浅底条目 */
.resonance {
  border-left: 3px solid var(--red);
  box-shadow: var(--shadow);
}
.resonance-item {
  background: var(--bg-soft);
  border-color: var(--line);
  border-radius: var(--radius-sm);
}
.resonance-code { color: var(--ink-3, #5c6470); font-weight: 700; }
.resonance-name { color: var(--ink); }
.resonance-hits { background: var(--brand-soft); color: var(--brand-ink); }

/* 栏目页摘要卡 */
.cat-digest { background: linear-gradient(135deg, #fff 0%, #fdf8f7 100%); }
.cat-digest-main { display: block; color: inherit; text-decoration: none; }
.cat-digest-num { border-radius: var(--radius-sm); }
.cat-digest-num b { color: var(--red); font-family: var(--mono); }

/* 更新日历：命中色统一为涨红（同时是"有内容"的强调色） */
.cat-cal { border-radius: var(--radius); }
.cat-cal-cell { border-radius: 4px; font-family: var(--mono); }
.cat-cal-cell.has { background: var(--red); }
.cat-cal-dot.has { background: var(--red); }

/* 预告条 */
.hp-notice {
  border-radius: var(--radius-sm);
  background: var(--warn-soft, #fdf3e2);
  border-color: rgba(224,149,26,.25);
}


/* ---------------------------------------------------------------------
   10. 页脚
   --------------------------------------------------------------------- */
.site-footer {
  background: var(--bg-soft);
  border-top: 1px solid var(--line);
}
.footer-col h4 { color: var(--ink); }
.footer-col a { color: var(--ink-3, #5c6470); }
.footer-col a:hover { color: var(--red); }
.footer-bottom { border-top: 1px solid var(--line); color: var(--mute); }

/* ---- 2026-10-21：页脚背景在本层改成了浅色，但内部元素仍是深色底那一套配色
        （近白的 logo 文字、白色半透明边框的社交按钮、浅棕的版权行），
        在浅底上几乎看不见。这里按浅色底补齐一套，顺带去掉深色时代的顶部彩线。 ---- */
.site-footer::before { display: none; }
.site-footer .footer-logo-text { color: var(--ink); }
.site-footer .footer-logo-text em { color: var(--red); }
.site-footer .footer-brand-desc { color: var(--sub); }
.site-footer .social-btn {
  border-color: var(--line-2);
  background: #fff;
  color: var(--sub);
  box-shadow: none;
}
.site-footer .social-btn:hover { color: #fff; border-color: transparent; }
.site-footer .social-btn .social-avatar { box-shadow: 0 0 0 1.5px var(--line-2); }
.site-footer .footer-bottom { color: var(--mute); }
.site-footer .footer-bottom a { color: var(--sub); }
.site-footer .footer-bottom a:hover { color: var(--red); }

/* 互动邀请条（C7） */
.reg-float-inner {
  border-radius: var(--radius-pill);
  background: rgba(255, 255, 255, .96);
  border: 1px solid var(--line-2);
  box-shadow: var(--shadow-lg);
}


/* ---------------------------------------------------------------------
   11. 首屏专项修正
   --------------------------------------------------------------------- */
/* 去掉「纸质堆叠」装饰卡（hp-card-back）：
   ① 它是拟物装饰，与新语言的"描边 + 留白"不一致；
   ② 数据卡内容改版后变矮，装饰层会在下方露出一块空米色，观感是 bug。
   数据卡改为独立悬浮，更干净。 */
.hp-card-back { display: none !important; }
.hp-note-card {
  min-height: 0;                      /* 不再需要保底高度去遮装饰层 */
  margin: 0;
  border-radius: var(--radius-lg);
  border-color: var(--line);
  box-shadow: var(--shadow-md);
}
.hp-note-card:hover { box-shadow: var(--shadow-lg); }

/* 首屏标题：收紧字号与字距，避免「新高」被拆行
   中文大标题用正字距（.03em）会显松散；负字距更紧凑、更"数据感"。
   同时把字号上限从 44 → 40px，并让数字与单位不可断开。 */
.hp-title {
  font: 900 clamp(25px, 3.3vw, 40px)/1.24 var(--serif);
  letter-spacing: -.015em;
}
.hp-title b { white-space: nowrap; }
.hp-note-stat b, .hp-chip-num b { font-family: var(--mono); font-variant-numeric: tabular-nums; }

/* 首屏数据卡内的数字：等宽对齐 */
.hp-note-stat b { letter-spacing: -.01em; }

/* 点赞数为 0 时只留图标（模板已按 likes 判断，此处兜底紧凑化） */
.like-btn { border-radius: var(--radius-sm); }
.like-count, .comment-time, .cat-row-meta { font-variant-numeric: tabular-nums; }

/* ---------------------------------------------------------------------
   12. 色彩噪音清理（统一小标签与虚线，去掉"模板感"）
   --------------------------------------------------------------------- */
/* 章节小标签（kicker）：原为金色底 + 全大写 + .22em 字距 —— 典型的通用模板样式，
   与新语言的克制气质冲突。改为中性药丸：灰底灰字、不做大小写变换、字距收窄。 */
.hp-kicker {
  font-weight: 600; font-size: 11.5px; letter-spacing: .04em;
  color: var(--ink-3, #5c6470);
  background: var(--bg-sunken);
  border: 1px solid var(--line);
  border-radius: var(--radius-pill);
  padding: 3px 10px;
  text-transform: none;
}
.cat-digest-tag { color: var(--ink-3, #5c6470); letter-spacing: .04em; }
.cat-feature-tag, .db-cat-latest-tag {
  background: var(--brand-soft); color: var(--brand-ink);
  border-radius: var(--radius-pill);
}

/* 股评引述块：金底 → 中性浅底 + 品牌左描边 */
.hp-note-quote {
  background: var(--bg-soft);
  border-left: 3px solid var(--red);
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
  color: var(--ink-2, #2c313a);
}
.hp-note-quote i { color: var(--mute); }

/* 数据卡内的小格：暖白 → 纯白，避免与卡片底产生"脏"层次 */
.hp-note-stat { background: #fff; }
.hp-note-stat b { color: var(--red); }

/* 高饱和红色虚线框 → 中性描边（虚线保留，但去掉"警示红"的错误语义） */
.hp-feat-skel,
.unlock-gate-card,
.reg-guide-card,
.type-card,
.admin-empty {
  border-color: var(--line-2);
}
/* 「全文免费」提示框：原本是红色虚线 + 浅红底 + 红色粗体——那是"付费墙"的视觉语言，
   与"免费阅读"的语义相反。改为中性浅底。 */
.hp-note-lock {
  border: 1px solid var(--line);
  background: var(--bg-soft);
  border-radius: var(--radius-sm);
  color: var(--ink-3, #5c6470);
  font-weight: 500;
}
/* 解锁/注册引导卡：暖色渐变 → 中性面（虚线保留，表达"占位"语义） */
.unlock-gate-card,
.reg-guide-card {
  background: var(--bg-soft);
  border: 1px dashed var(--line-2);
  border-radius: var(--radius);
}
/* 暖色分隔虚线 → 冷灰 */
.hp-note-foot, .hp-final-inner, .db-signal-date,
.hp-recent-item + .hp-recent-item {
  border-color: var(--line);
}

/* 后台/管理页的暖色底统一为冷灰 */
.db-signal, .db-focus-card, .db-top-item { background: #fff; }
.db-cat { background: #fff; }


/* ---------------------------------------------------------------------
   13. 响应式与可访问性
   --------------------------------------------------------------------- */
/* 全局防溢出兜底：任何元素都不得把页面撑出横向滚动条 */
html, body { max-width: 100%; overflow-x: hidden;
  /* overflow-x:clip 与 hidden 同样防横向溢出，但不会把 body 变成滚动容器，
     从而保住后代元素的 position:sticky（文章页目录轨依赖它）。
     不支持 clip 的老内核会忽略此行、保持 hidden，仅目录轨跟随失效，无其他副作用。 */
  overflow-x: clip; }

@media (max-width: 767px) {
  .article-body { font-size: 15px; }
  .mod-nav { border-radius: var(--radius); }

  /* 顶部导航：窄屏从「多行堆叠」改为「单行横向滚动药丸条」。
     原标题项会 flex-wrap 成 5-6 行，把首屏往下推一大截；改为不换行 + 容器内横向滚动。 */
  .header-inner { flex-wrap: wrap; row-gap: 8px; padding: 10px 14px; }
  .main-nav {
    order: 3; width: 100%; flex: none;
    flex-wrap: nowrap; overflow-x: auto; white-space: nowrap;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none; padding-bottom: 2px;
  }
  .main-nav::-webkit-scrollbar { display: none; }
  .main-nav a { flex: none; white-space: nowrap; }

  /* 首屏 CTA：窄屏改纵向堆叠 + 允许文字换行
     （原来两个按钮并排，长文案「看今日复盘 · 41 只首板 →」会把整行撑爆） */
  .hp-cta { flex-direction: column; align-items: stretch; gap: 10px; }
  .hp-cta .btn {
    width: 100%; min-width: 0; height: auto;
    padding: 12px 16px; white-space: normal; line-height: 1.35;
  }
  .hp-final-actions { flex-direction: column; align-items: stretch; gap: 10px; }

  /* 药丸类标签在窄屏允许换行，不撑破容器 */
  .article-source, .article-gen { white-space: normal; }
  .ds-badge, .db-chip, .hp-chip, .resonance-mod { max-width: 100%; }

  /* 长表格改为容器内横向滚动，而不是把整页撑宽 */
  .ds-table-wrap, .article-body table {
    display: block; overflow-x: auto; -webkit-overflow-scrolling: touch;
  }
  /* 长标题/长链接允许断行 */
  .hp-title, .hp-sub, .hp-note-note, .article-title, .resonance-title {
    overflow-wrap: break-word;
  }
  /* 数字在窄屏略收字号，避免四宫格拥挤 */
  .hp-note-stat b, .cat-digest-num b { font-size: 19px; }
}

/* 全局尊重减弱动效偏好（此块必须保留在文件靠后的位置） */
@media (prefers-reduced-motion: reduce) {
  .btn, .list-item, .cat-row, .hp-recent-item, .db-tl-item,
  .cat-feature, .db-cat, .hp-cat, .hp-feat, .cat-digest,
  .hp-about-card, .cat-cal-cell, a, tbody tr {
    transition: none !important;
    transform: none !important;
  }
}

/* ---------------------------------------------------------------------
   14. 修正：「最新」标签配色 + 更新日历铺满（2026-10-01 用户反馈）
   --------------------------------------------------------------------- */
/* 【问题】「最新」标签红底红字、几乎看不清。
   【原因】dashboard.css 用后代选择器按栏目分色
           （如 .db-cat-fupan .db-cat-latest-tag { background: var(--red) }），
           优先级 (0,2,0) 高于本覆盖层的单类选择器，背景被改成深红；
           而 color 被本覆盖层改成了深红字 → 红底 + 红字。
   【修法】用同等优先级的后代选择器覆盖，统一为「同色系浅底 + 深色字」，
           既保证可读，又保留四个栏目的颜色识别。 */
.db-cat-latest-tag,
.cat-feature-tag,
.hp-cat-latest-tag,
.cat-digest-tag {
  background: var(--brand-soft);
  color: var(--brand-ink);
}
.db-cat-fupan .db-cat-latest-tag   { background: var(--up-soft);           color: var(--red-deep); }
.db-cat-guping .db-cat-latest-tag  { background: rgba(169,126,31,.16);     color: #7a5a10; }
.db-cat-xuangu .db-cat-latest-tag  { background: rgba(224,149,26,.18);     color: #8a5207; }
.db-cat-guanzhu .db-cat-latest-tag { background: rgba(97,116,138,.16);     color: #46586e; }

/* 【问题】三联月历（7 列 × 方形格）整块高达约 400px，首屏几乎全被
           "更新记录"占据，正文被挤出视野（2026-10-04 用户反馈）。
   【修法】改为「紧凑日历条」（方案 A）：每月压成一行 31 个小格，
           去掉星期头/日期数字/图例——本栏目一周五天日日更新，
           "星期几"对"有没有更新"没有信息量；红格连续规律（= 稳定更新）
           依然一眼可见，高度降到约 1/4（约 90px）。 */
.cat-cal-strip { display: flex; flex-direction: column; gap: 6px; }
.cat-cal-row { display: flex; align-items: center; gap: 10px; }
.cat-cal-month-label {
  flex: none; width: 38px; margin: 0;
  font: 600 12px var(--sans); color: var(--ink-3, #5c6470);
  letter-spacing: .02em;
}
.cat-cal-days { display: flex; gap: 3px; flex: 1 1 auto; min-width: 0; }
/* 覆盖旧版的固定 20×20 —— 必须显式重置 width/height，否则 aspect-ratio 不生效。
   每格 flex:1 等分整行宽度，格高由 aspect-ratio 跟随格宽，整行自适应铺满。 */
.cat-cal-cell {
  flex: 1 1 0; min-width: 0;
  width: auto; height: auto; aspect-ratio: 1 / 1; min-height: 0;
  border-radius: 3px; background: var(--bg-sunken);
  transition: background var(--t-fast) var(--ease);
}
.cat-cal-cell.has { background: var(--red); }
.cat-cal-cell.today { box-shadow: inset 0 0 0 1.5px var(--ink); }
.cat-cal-cell.future { opacity: .3; }

@media (max-width: 767px) {
  /* 手机上每行仍是完整一个月；格子随宽度自动变小（~9px），
     作为"规律图案"依然可读，悬浮 title 提供具体日期 */
  .cat-cal-row { gap: 8px; }
  .cat-cal-month-label { width: 32px; font-size: 11px; }
  .cat-cal-days { gap: 2px; }
}