body.cu-research { background: var(--cu-background); color: var(--cu-text); font-family: var(--cu-font-ui); }
/* Scheme 2: bookish headings, clear sans-serif body; no layout-size changes. */
body.cu-research h1, body.cu-research h2, body.cu-research h3 { font-family: var(--cu-font-heading); font-weight: 600; }

/* ---------------------------------------------------------------------------
 * 页面竖向骨架：内容不够长时，页脚也要落在视口底沿
 *
 * 页脚（.cu-site-footer）是 body 的直接子元素 —— 它挂在 wp_footer 上，
 * 触发点在 GeneratePress 的 </div>\3c !-- #page --> 之后，和 .site 是兄弟关系。
 * 所以「短页面页脚悬在半空」不能靠给 .site 加 min-height 修：那得把页头 113px、
 * 页脚 200px 在四个断点上的高度全部硬编码进 calc()，字号或折行一变就崩。
 * 让 body 变成竖排 flex、由 .site 吃掉剩余空间，高度交给浏览器算，没有魔数。
 *
 * 两条会咬人的 auto 外边距规则（页头与页脚都写着 margin:auto 又都带 max-width）：
 *   1) 交叉轴的 auto 边距会压过 align-items:stretch —— 不显式写 width:100%，
 *      页头会被收成内容宽、搜索框贴到左边；
 *   2) 主轴（这里即竖向）的 auto 边距会吸收剩余空间 —— 不置 0，页头会被挤下去居中。
 * 两条都是实测出来的，照规范推会推错。
 *
 * 100svh 是「浏览器工具栏可见」时的高度。移动端若用 100vh（= 工具栏隐藏后的高度），
 * 短页面会凭空多出一条滚动条；不支持 svh 的浏览器回落到上一行的 100vh。
 * 已知边界一处：登录态下 WP 会给 html 加 margin-top（管理员工具栏 32px、窄屏 46px），
 * 那时短页面会多出等高的滚动 —— 仅管理员可见的小瑕疵，本次未处理。
 * ------------------------------------------------------------------------- */
body.cu-research { display: flex; flex-direction: column; min-height: 100vh; min-height: 100svh; }
body.cu-research > .site { flex: 1 0 auto; width: 100%; }
body.cu-research > .cu-site-header,
body.cu-research > .cu-site-footer { flex: none; width: 100%; margin-top: 0; margin-bottom: 0; }

/* 隐藏父主题与 Elementor 的页头/页脚输出 —— 但这一层现在是「第二道锁」，不是主力。
   2026-09-22 起 GeneratePress 那套 Header / Footer 已由 functions.php 的 remove_action
   在输出前摘掉（规格 §13），DOM 里不再有 .top-bar / .site-header / .main-navigation /
   .site-info / .site-footer / .footer-widgets。这条 CSS 保留有三个理由：
     1) Elementor theme-builder 的位置（.elementor-location-*）不归那个 remove_action 管，
        将来若有人启用模板，仍需它兜住；
     2) 父主题的 div.site-footer 外壳直接写在 footer.php 里，remove_action 摘不掉，
        摘空后剩一个空 div —— 一并在这里关掉，免得受父主题动态 CSS 的 padding 影响；
     3) 万一回滚 functions.php，页面不会立刻露出两套页头。
   注意 .site-footer 与自建的 .cu-site-footer 是两个不同的类名，这里不会误伤页脚。 */
.cu-research .elementor-location-header, .cu-research .elementor-location-footer,
.cu-research .site-header, .cu-research .main-navigation, .cu-research .site-info,
.cu-research .top-bar, .cu-research .site-footer, .cu-research .footer-widgets { display: none; }

/* ---------------------------------------------------------------------------
 * 页头
 *
 * position: relative + z-index 是给 Mega Menu 用的：面板是 .cu-site-header 的
 * 绝对定位后代，页头不建立层叠上下文的话，它会钻到正文底下去。
 * 首页的页头是 absolute/fixed（见下方「首页页头」一节），所以它的定位由那条覆盖。
 * ------------------------------------------------------------------------- */
.cu-site-header { position: relative; z-index: 30; box-sizing: border-box; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 28px; max-width: 1440px; margin: auto; padding: 22px 32px; border-bottom: 1px solid var(--cu-border); background: var(--cu-surface); }
/* 品牌组。2026-09-22 起这里只剩 CU 一个子元素 —— 私人小方块搬去页脚了，
   为对齐它而写的 align-items:flex-end / padding-bottom:16px 一并撤掉，
   改回居中对齐（页头本身是 grid + align-items:center）。 */
.cu-brand-group { display: flex; align-items: center; gap: 8px; min-width: 0; }
.cu-research .cu-brand-flower, .cu-research .cu-brand-flower:hover { display: inline-flex; flex: none; align-items: center; justify-content: center; width: 44px; height: 44px; color: var(--cu-terracotta); text-decoration: none; }
.cu-flower { display: block; width: 22px; height: 22px; background: currentColor; -webkit-mask: url("rounded-four-petal.svg?v=20261022-3") center / contain no-repeat; mask: url("rounded-four-petal.svg?v=20261022-3") center / contain no-repeat; }
.cu-site-brand { display: flex; align-items: baseline; gap: 10px; color: var(--cu-purple-950) !important; font-size: 27px; font-weight: 750; letter-spacing: -.045em; text-decoration: none; white-space: nowrap; }
.cu-site-brand span { font-size: 9px; font-weight: 600; letter-spacing: .11em; }

/* 汉堡按钮：只在 ≤1024px 出现，桌面端整条规则不参与布局。 */
.cu-nav-toggle { display: none; align-items: center; justify-content: center; box-sizing: border-box; width: 44px; height: 44px; padding: 0; border: 1px solid var(--cu-border); border-radius: 0; background: transparent; color: var(--cu-text); cursor: pointer; }
.cu-nav-toggle-bars { position: relative; display: block; width: 18px; height: 1.5px; background: currentColor; }
.cu-nav-toggle-bars::before, .cu-nav-toggle-bars::after { content: ""; position: absolute; left: 0; width: 18px; height: 1.5px; background: currentColor; }
.cu-nav-toggle-bars::before { top: -6px; }
.cu-nav-toggle-bars::after { top: 6px; }

.cu-site-nav { display: flex; justify-content: center; align-items: center; gap: clamp(14px, 2.5vw, 36px); min-width: 0; }
/* 只给顶层导航项上色。原来写的是 .cu-site-nav a，会把 Mega Menu 里的分类链接
   一起染成 14px 白字（首页透明态还带 !important），面板一展开就是白底白字。 */
.cu-site-nav .cu-nav-link { color: var(--cu-text) !important; font-size: 14px; font-weight: 600; text-decoration: none; white-space: nowrap; }
.cu-site-nav .cu-nav-link:hover, .cu-site-nav .cu-nav-link:focus-visible { color: var(--cu-purple-600) !important; text-decoration: underline; }

/* ---------------------------------------------------------------------------
 * Mega Menu（规格 §17–§19）
 *
 * 面板锚在「页头」而不是「文章」上并水平居中 —— 锚在「文章」上的话，
 * 面板会偏在导航那一格的中间，跟整站中轴对不齐。
 * .cu-nav-group 因此不能设 position，否则绝对定位会提前在它身上结算。
 * padding-top 12px 是 hover 桥：从「文章」往下移到面板的这段路不能是空隙，
 * 否则鼠标穿过时菜单会先收起来。
 * ------------------------------------------------------------------------- */
.cu-mega { position: absolute; top: 100%; left: 50%; z-index: 1; box-sizing: border-box; width: min(920px, calc(100% - 48px)); padding-top: 12px; opacity: 0; visibility: hidden; transform: translateX(-50%); transition: opacity .16s ease, visibility .16s ease; }
.cu-mega-panel { display: flex; flex-direction: column; box-sizing: border-box; padding: 32px 36px; border: 1px solid var(--cu-border); border-radius: 2px; background: var(--cu-surface); box-shadow: 0 18px 44px rgba(41,63,53,.10); }
.cu-mega-inner { display: grid; grid-template-columns: 1fr 1fr; gap: 36px 44px; }
/* 一级方向（宏观 / 市场 / 公司 / 洞见）。2026-09-22 前这里是「英文大字 + 中文小字」两层，
   英文那层整层去掉，中文提上来承担层级 —— 所以它现在是面板里最大的一档，
   二级分类从 16px 压到 14px，层级差靠字号而不是靠语言切换（规格 §6、§14）。 */
.cu-mega-area-zh { margin: 0; color: var(--cu-purple-950); font-size: 17px; font-weight: 700; letter-spacing: .06em; }
.cu-research .cu-mega-area-zh a { color: inherit; text-decoration: none; }
.cu-research .cu-mega-area-zh a:hover, .cu-research .cu-mega-area-zh a:focus-visible { text-decoration: underline; }
.cu-mega-list a { overflow-wrap: anywhere; }
.cu-mega-list { display: grid; gap: 12px; margin: 16px 0 0; padding: 0; list-style: none; }
/* 显式带上 .cu-research 前缀，压过文件下方的通用链接色 .cu-research a。 */
.cu-research .cu-mega-list a { color: var(--cu-text); font-size: 14px; text-decoration: none; }
.cu-research .cu-mega-list a:hover, .cu-research .cu-mega-list a:focus-visible { color: var(--cu-purple-600); text-decoration: underline; }
/* flex + stretch 而不是 inline-flex + flex-start：这样 border-top 才会横贯整个面板，
   否则分隔线只有链接自身那么宽，在面板里断得突兀。文字与箭头靠右，与好美味统一。 */
.cu-mega-all { display: flex; align-items: center; justify-content: flex-end; gap: 8px; align-self: stretch; margin-top: 26px; padding-top: 20px; border-top: 1px solid var(--cu-border); font-size: 13px; font-weight: 600; text-decoration: none; }
.cu-mega-footer { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 12px 24px; margin-top: 26px; padding-top: 20px; border-top: 1px solid var(--cu-border); }
.cu-mega-footer > span { color: var(--cu-muted); font-size: 13px; }
.cu-mega-footer .cu-mega-all { margin: 0 0 0 auto; padding: 0; border: 0; }
.cu-mega-all:hover, .cu-mega-all:focus-visible { text-decoration: underline; }

/* 桌面端靠 hover / 键盘焦点展开；触屏走 ≤1024px 的点击逻辑，不在这里。 */
@media (min-width: 1025px) {
  /* Keep the trigger's hit area connected to the header-anchored panel. */
  .cu-site-nav { align-self: stretch; }
  .cu-nav-group { display: flex; align-items: center; align-self: stretch; margin-bottom: -22px; padding-bottom: 22px; }
  body.home .cu-nav-group { margin-bottom: 0; padding-bottom: 0; }
  .cu-nav-group:not(.cu-nav-dismissed) > .cu-nav-link:hover + .cu-mega,
  .cu-nav-group:not(.cu-nav-dismissed):focus-within .cu-mega,
  .cu-nav-group-open .cu-mega { opacity: 1; visibility: visible; }
  .cu-nav-group.cu-nav-dismissed .cu-mega { opacity: 0; visibility: hidden; transition: none; }
}

.cu-header-search { position: relative; justify-self: end; }
.cu-header-search summary { display: inline-flex; align-items: center; justify-content: center; box-sizing: border-box; min-height: 44px; padding: 0 18px; border-radius: 8px; background: var(--cu-purple-950); color: var(--cu-surface); font-size: 14px; cursor: pointer; list-style: none; }
.cu-header-search summary::-webkit-details-marker { display: none; }
.cu-header-search summary:hover { background: var(--cu-purple-600); }
.cu-site-search { position: absolute; top: calc(100% + 10px); right: 0; z-index: 3; display: flex; align-items: center; gap: 6px; box-sizing: border-box; width: min(340px, calc(100vw - 40px)); padding: 6px; margin: 0; border: 1px solid var(--cu-border); border-radius: 10px; background: var(--cu-surface); box-shadow: 0 8px 24px rgba(41,63,53,.08); }
.cu-site-search label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.cu-header-search .cu-site-search input { box-sizing: border-box; flex: 1; width: 0; min-width: 0; min-height: 40px; padding: 8px 10px; border: 0; border-radius: 6px; background: transparent; color: var(--cu-text); font: inherit; font-size: 14px; }
.cu-site-search button { flex: none; min-height: 40px; padding: 8px 14px; border: 0; border-radius: 6px; background: var(--cu-purple-950); color: var(--cu-surface); font-size: 14px; cursor: pointer; }
.cu-header-search:focus-within .cu-site-search { border-color: var(--cu-purple-muted); }
.cu-research .cu-header-search .cu-site-search { outline: none; }
.cu-header-search .cu-site-search input:focus { outline: none; box-shadow: none; }

/* 首页页头叠加在 Hero 上：透明态 → 滚动后转为浅紫半透明（规格 §14，过渡 200ms）。
   absolute 与 fixed 都不占文档流，所以状态切换只会换背板，不会引起页面跳动。
   基础规则里的品牌色是 !important，这里的还原也必须带 !important 且特异性更高才压得住。

   2026-09-22：羽毛改回浅色面纱，叠加态的前景色随之由白翻黑。
   于是出现一个巧合 —— 现在的「透明态」与「滚动实底态」前景色几乎一样
   （都是 --cu-purple-950 / --cu-text），两者的差别只剩背板与分隔线。
   保留两组规则仍然有意义：过渡动画要靠它们，且实底态要压掉光晕。 */
body.home .cu-site-header { position: absolute; top: 0; left: 0; right: 0; z-index: 30; background: transparent; border-bottom-color: rgba(41,63,53,.14); transition: background-color .2s ease, border-color .2s ease, color .2s ease; }
body.home .cu-site-header .cu-site-brand { color: var(--cu-purple-950) !important; text-shadow: none; }
body.home .cu-site-header .cu-site-nav .cu-nav-link { color: var(--cu-text) !important; text-shadow: none; }
body.home .cu-site-header .cu-site-nav .cu-nav-link:hover, body.home .cu-site-header .cu-site-nav .cu-nav-link:focus-visible { color: var(--cu-purple-600) !important; }
body.home .cu-site-header .cu-nav-toggle { border-color: rgba(41,63,53,.18); color: var(--cu-text); }
/* 搜索框在浅羽毛上就是一块「浅色玻璃」，而这正是现在需要的：
   半透明白底既与羽纹分层，又不会在浅背景上砸出一个深色洞。
   注：这条与上面那组是同一个反转 —— 深遮罩时期白底玻璃会把背后羽毛提亮到 L≈0.20，
   白字只剩 4.18:1，所以当年只能把框压暗；现在前景是深字，白底重新成立。 */
body.home .cu-site-header .cu-site-search input::placeholder { color: var(--cu-muted); }
body.home .cu-site-header .cu-site-search button { background: var(--cu-purple-950); color: #fff; }
/* 滚动后换成浅紫半透明背板 + 模糊。
   2026-09-22 起透明态本身就是深字，这里不再承担「从白翻回深」的职责，
   只做两件事：把导航/品牌字号色归一到更深的紫阶，以及去掉压在羽毛上用的浅色光晕
   （背板已经够稳，光晕留在浅底上只是发虚）。
   顺带补一条极轻的投影，让它在浅色正文上有一层薄薄的分离感。 */
body.home .cu-site-header.cu-header-solid { position: fixed; background: var(--cu-home-veil); border-bottom-color: var(--cu-border); backdrop-filter: saturate(140%) blur(10px); box-shadow: 0 1px 18px rgba(41,63,53,.06); }
body.home .cu-site-header.cu-header-solid .cu-site-brand { color: var(--cu-purple-950) !important; text-shadow: none; }
body.home .cu-site-header.cu-header-solid .cu-site-nav .cu-nav-link { color: var(--cu-text) !important; text-shadow: none; }
body.home .cu-site-header.cu-header-solid .cu-site-nav .cu-nav-link:hover,
body.home .cu-site-header.cu-header-solid .cu-site-nav .cu-nav-link:focus-visible { color: var(--cu-purple-600) !important; }
body.home .cu-site-header.cu-header-solid .cu-nav-toggle { border-color: var(--cu-border); color: var(--cu-text); }
body.home .cu-site-header.cu-header-solid .cu-site-search input::placeholder { color: var(--cu-muted); }
body.home .cu-site-header.cu-header-solid .cu-site-search button { background: var(--cu-purple-950); color: #fff; }

/* ---------------------------------------------------------------------------
 * 页脚
 * ------------------------------------------------------------------------- */
.cu-site-footer { box-sizing: border-box; display: grid; gap: 36px; min-height: 280px; max-width: none; margin: auto; padding: 64px 32px 44px; border-top: 1px solid var(--cu-border); background: var(--cu-footer-background); color: #fff; font-size: 13px; }
.cu-research .cu-site-footer a { color: #fff; }
.cu-research .cu-site-footer a:hover { color: var(--cu-purple-100); }
/* Full-bleed color, with restrained centered content. The private link is above. */
.cu-footer-primary, .cu-footer-compliance { display: flex; align-items: center; flex-wrap: wrap; gap: 12px 24px; box-sizing: border-box; width: 100%; max-width: 1320px; margin-inline: auto; }
.cu-footer-primary span { margin-right: auto; font-size: 20px; font-weight: 700; }
.cu-footer-compliance a { display: flex; align-items: center; gap: 6px; }
.cu-footer-compliance { padding-top: 20px; border-top: 1px solid rgba(255,255,255,.25); font-size: 12px; }
.cu-footer-compliance img { object-fit: contain; }

/* 页脚焦点环复用浅紫入口色，避免在新灰紫底上失去辨识度。 */
.cu-research .cu-site-footer :focus-visible { outline: 3px solid var(--cu-footer-accent); outline-offset: 5px; }

/* ---------------------------------------------------------------------------
 * 通用
 *
 * 全站链接色（2026-09-27）由 --cu-purple-600 换成 --cu-purple-muted。
 * 这一条是「紫色用得太多」最大的一个来源：它是**所有**没有被更具体规则命中的
 * 链接的兜底色，正文内链、搜索结果标题、日期、摘要里的链接全落在它上面。
 * 紫 600 #6d3fd1 是「小面积、要跳出来」的强调色（见 design-tokens.css 的注释），
 * 一页几十个链接都用它，强调就变成了底色 —— 用户这一轮说的「明亮度过高」正是这个。
 * muted #644b9b 是同一色相降饱和后的值，在 #fcfaff 上 6.70:1、纯白上 6.95:1，
 * 比换之前更宽；换句话说这次只降了饱和度，没有牺牲可读性。
 * hover 仍是 --cu-purple-950，层级不变。
 *
 * focus 环一起换，理由同上（浅底上由 5.5:1 提到 6.7:1）。
 * 两处**刻意不动**：
 *   · :166 页脚那条 —— 紫 600 压在深紫页脚上只有 2.7:1，当年正是因为它不达标
 *     才换成紫 400（实测 5.6:1），换成 muted 只会更暗，是把一个修好的问题改回去；
 *   · .cu-site-header / .cu-hero-* 里那一组（:68 / :89 / :116 / :134 / :750）——
 *     用户明确说「羽毛表头处不动」，且那是 hover 态的点状强调，本来就是紫 600 的用法。
 * 已知边界（改前就存在，不是这次引入的）：.entry-content pre 的底色是 --cu-purple-950，
 * 落在它上面的 focus 环 muted 只有 2.44:1、原紫 600 是 2.67:1，两者都不达 1.4.11 的 3:1。
 * `<pre>` 里能 Tab 到的链接极罕见，本轮不为此单开规则，但如实记在这里。
 * ------------------------------------------------------------------------- */
.cu-research a { color: var(--cu-purple-muted); text-underline-offset: .22em; }
.cu-research a:hover { color: var(--cu-purple-950); }
.cu-research :focus-visible { outline: 3px solid var(--cu-purple-muted); outline-offset: 5px; }
.cu-research .site-header, .cu-research .site-info { background: var(--cu-surface); }
.cu-research .site-header { border-bottom: 1px solid var(--cu-border); }
.cu-research .site-info { border-top: 1px solid var(--cu-border); }

/* 索引页那一行眉标（page-research.php:23）。同一句话全站只留页头站标一处，
   这一处的去留（不是颜色）留给用户定；颜色随全站一起降饱和。 */
.cu-eyebrow { color: var(--cu-purple-muted); font-size: 12px; letter-spacing: .14em; font-weight: 600; }

/* ---------------------------------------------------------------------------
 * 文章索引页（page-research.php）
 * ------------------------------------------------------------------------- */
.cu-research .cu-index { width: 100%; float: none; max-width: var(--cu-page-width); margin: auto; }
.cu-index .site-main { padding: 32px 24px 64px; margin: 0; }
.cu-intro { padding: 24px 0 40px; border-bottom: 1px solid var(--cu-border); }
.cu-intro h1 { font-size: clamp(32px, 4vw, 52px); line-height: 1.2; letter-spacing: -.035em; margin: 18px 0; }
.cu-intro > p:last-child { color: var(--cu-muted); font-size: 17px; }

/* ---------------------------------------------------------------------------
 * 首页骨架
 * ------------------------------------------------------------------------- */
.cu-home { width: min(100% - 48px, var(--cu-page-width)); margin: 0 auto; padding: 40px 0 72px; }
.cu-home-wide { width: 100%; max-width: none; padding: 0 0 var(--cu-space-7); }
/* Hero 要真正全出血：既要解除 GeneratePress 的 .grid-container 约束（实测 max-width 1385px
   把 main 卡在 x=16 / 宽 1367），也要抵消 Elementor 留下的按页规则
   body.elementor-page-132 { margin: 11px; padding: 5px }。
   首页 132 当年由 Elementor 构建，改由 front-page.php 渲染后这条 CSS 仍被输出，
   已不参与布局、只剩副作用：页头是 absolute/top:0，正文却被推到 y=16，
   于是顶部横着一条 16px 浅色带；页脚下方同样留 16px 浅色。
   实测像素：y=0..15 = rgb(252,250,255)（即 --cu-background），y=16 起才是羽毛图。
   选择器多带一个 .cu-research 是刻意的 —— body.elementor-page-132 同为 0,1,1 特异性，
   靠样式表加载顺序决胜太脆，多一个类直接压过它。
   页头、页脚是 body 的直接子元素，不受影响；首页其余区块自带宽度约束
   （.cu-home-research 为 min(100% - 48px, 1200px) 居中），因此影响范围仅限 Hero。 */
body.cu-research.home { margin: 0; padding: 0; }
body.home .site.grid-container { max-width: none; padding-left: 0; padding-right: 0; }
/* 首屏之后回到浅色阅读面：羽毛只属于 Hero，不铺满整页。
   正文区沿用 body.cu-research 的暖米白 --cu-background；
   页脚使用独立的 --cu-footer-background 灰紫令牌。 */

/* 精选列表：Hero 那篇已经排除在外，剩下的交给下面的「首页内容 Row 系统」按行排。
   2026-09-25（第四轮）之前这里是三列等宽卡片墙，每篇权重相同、节奏重复；
   现在改成一大一小 / 单篇横向 / 两篇并列 / 三篇并列四种 Row。
   原来那条 .cu-home .cu-posts 三列规则已删除，首页不再走 .cu-posts。 */
/* 首屏到正文区的距离（§15「Section 到 Section 100–160px」的下沿，取 64–96px）：
   首屏与列表同属首页一个阅读流，拉到 100px 以上会把列表整个挤出第一屏
   （verify-homepage.cjs 的 listPeeksIntoFirstScreen 就是盯这一点的）。 */
/* 仅首页文章陈列扩宽，索引 1200px 和长文 760px 不变。 */
.cu-home-research { box-sizing: border-box; width: min(100% - 80px, 1320px); margin: 0 auto; padding-top: var(--cu-space-6); }
/* 正文区的区块标题（2026-09-26 按用户要求加回，文案「研究」）。
   为什么加回来：没有它，首页的标题序列是 H1（首屏）→ H3（卡片），跳了一级；
   正文区也没有任何可被辅助技术当作区段名导航的标题。
   为什么是 24px：这不是新取的值 —— 它就是 2026-09-25 删掉的那条
   `.cu-home-research .cu-section-heading h2 { font-size: 24px }` 的值，沿用以保持这个位置
   的原有尺度。字重不写，继承全站标题的 400（本站标题体系是常规字重，不是粗体）。
   上间距由 .cu-home-research 的 padding-top（--cu-space-6）给，下间距由
   .cu-rows 的 margin-top（--cu-space-4）给 —— 所以这里 margin:0，不重复加空隙。
   右上角那条「全部文章 →」不跟着回来：页头导航与 Mega Menu 都已经是它的入口。
   保持克制 —— 不加英文副标题、不加说明句、不加装饰、不加动画（用户第 3 条）。 */
.cu-home-research-title { margin: 0; font-size: 24px; line-height: 1.3; letter-spacing: -.01em; color: var(--cu-text); }

/* ---------------------------------------------------------------------------
 * Hero（规格 §8–§13）
 *
 * 首屏主角是「当前最重要的一篇研究」，不是品牌宣言，所以版式按文章来排：
 * 眉标 → 类型标签 → 标题 → 分类 · 日期 → 短摘要 → 阅读入口。
 *
 * 高度收到 520–620px：首屏不再是唯一内容，下面的研究列表要在第一屏露出头，
 * 让人一眼看出这是一个持续更新的档案库而不是一张封面。
 * 文案仍然底对齐，底部 padding 112px 决定了文字下沿落在 Hero 的 85% 处，
 * 正好是第 3 层渐变开始的位置 —— 留白同时也是那条渐变的跑道。
 * ------------------------------------------------------------------------- */
.cu-home-intro { position: relative; display: flex; align-items: flex-end; box-sizing: border-box; min-height: clamp(520px, 62vh, 620px); overflow: hidden; isolation: isolate; background: var(--cu-hero-background); }
/* 三层浅色面纱，从最上面一层开始叠，第一层先画。
   （2026-09-22：由「深紫压暗 + 白字」改回「浅色面纱 + 黑字」，即 72cb1e0 的原始方案。）
     1) 左侧横向铺白，把文案栏下的羽纹抬到足够浅，黑字才有底；
     2) 顶部纵向再加一层 —— 页头是透明压在羽毛上的，而第 1 层在最右侧只剩 .10，
        单靠它顶不住右上角的导航与搜索框，所以另给一条上重下轻的纵向提亮；
     3) 最底一层自 85% 起渐变为正文底色 #fcfaff，把羽毛交接给浅色页面。
   第 3 层的色值必须与 --cu-background 一致，改 tokens 时要同步改这里。
   原本第 3 层为了不露出「未经压暗的亮部」必须不透明收尾；改浅色之后这个顾虑反转了 ——
   面纱与 #fcfaff 同色系，交接天然无缝。 */
.cu-home-intro-content { position: relative; z-index: 1; box-sizing: border-box; width: min(100% - 48px, var(--cu-page-width)); margin: 0 auto; padding: 136px 0 112px; }
.cu-home-intro-copy { max-width: 760px; }
/* 首屏小标：2026-09-22 定为 --cu-purple-950。这里踩过的坑值得记下来。
   面纱转浅后的第一版取 --cu-purple-600（#6d3fd1），1440 下实测 5.25:1 通过，
   但 768 只剩 2.25:1、430 只剩 2.78:1 —— 因为窄屏下文案区几乎占满宽度，
   横向渐变到那个位置只剩 .10，深色羽纹正好落进这一行。
   算一下就明白这不是调参能解决的：中调紫 L≈0.115，要在 11–12px 上到 4.5:1，
   背景亮度得爬到 L≥0.69；羽毛再浅也到不了，等于把整片图刷白 —— 与「保留羽毛」冲突。
   所以只能把字压深：--cu-purple-950 的 L≈0.014，实测最坏背景 L≈0.32 时仍有 5.8:1。
   代价是这一档紫色视觉上接近黑，层级改由字号/字距/大小写承担。
   紫色强调在本屏只剩主按钮与小方块两处。
   **2026-09-27 起这条只适用于 .cu-hero-label**：原来这里还有一条
   `.cu-home-intro .cu-eyebrow { margin: 0; color: var(--cu-purple-950); }`，
   而首屏那个「CU / INDEPENDENT RESEARCH」眉标已按用户要求删除
   （与页头站标重复，见 front-page.php），规则随之删掉 —— 留着就是一条
   指向不存在元素的死规则，下一轮读到这里的人会以为首屏还有眉标。
   上面那些实测数字仍然有效：背景问题出在羽毛本身，与承载它的那行字无关。 */
/* 类型小标（本期精选 / 最新文章）。原为 FEATURED RESEARCH / LATEST RESEARCH，
   中文后 11px 偏小，提到 12px；字距保留 —— 「本期精选」四个字拉开一点更像一枚标签。
   margin 由 10px 0 0 改为 0（2026-09-27）：那个 10px 原本是它与上方眉标的距离，
   眉标删掉后它成了 .cu-home-intro-copy 的第一个子元素，再留 10px 就是一段没有来由的偏移
   （该父元素没有 padding，这 10px 会外塌到它自己头上，把整块文案往下推）。 */
.cu-hero-label { display: inline-flex; align-items: center; gap: 9px; margin: 0; color: var(--cu-purple-950); font-size: 12px; font-weight: 700; letter-spacing: .16em; }
/* Decorative editorial mark only: never used as a financial up/down signal. */
.cu-hero-label::before { content: ""; flex: none; width: 6px; height: 6px; border-radius: 50%; background: var(--cu-terracotta); }
/* 标题是一条真实文章标题，长度不可控，所以用 overflow-wrap 兜底而不是 text-wrap: balance
   —— balance 会把中文复合词从中间切开，甚至让标点落到行首（违反中文避头尾）。 */
.cu-home-intro h1 { max-width: 780px; margin: 18px 0 0; color: var(--cu-text); font-size: clamp(40px, 5vw, 70px); line-height: 1.08; letter-spacing: -.03em; overflow-wrap: anywhere; text-shadow: none; }
.cu-home-intro h1 a { color: var(--cu-text); text-decoration: none; }
/* 首屏标题悬停/聚焦都不再给任何反馈（用户 2026-09-25）。原来这里加下划线，但：
   ① 标题下方紧接着就有一个很大的「阅读全文 →」主按钮，两者都在说同一件事；
   ② 40–70px、折到 2–3 行的大标题挂上下划线过于抢眼，压过标题本身。
   color 必须**显式**钉住。第一版只删掉了「加下划线」，结果是把变色**打开**了：
   本规则一撤，通用一节那条 .cu-research a:hover（--cu-purple-950）就露了出来，
   实测悬停从 rgb(33,28,43) 变成 rgb(36,17,63) —— 正是用户说的「黑变紫」，
   哪怕只落在深紫黑那一档。探针 probe-r5-changes.cjs 第 ③ 项就是这么抓到的：
   「删掉一条不改色的 :hover 规则」不等于「不响应悬停」，而是把决定权交给了更宽的规则。
   代价只是鼠标悬停没有反馈，可点性由下方主按钮承担；键盘可达性不受影响，
   全站那条 :focus-visible 焦点环（见上方「通用」一节）照旧给出可见焦点。 */
.cu-home-intro h1 a:hover, .cu-home-intro h1 a:focus-visible { color: var(--cu-text); }
.cu-hero-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; margin: 18px 0 0; font-size: 12px; }
.cu-hero-meta a { color: var(--cu-purple-950); font-weight: 600; letter-spacing: .12em; text-decoration: none; }
.cu-hero-meta a:hover, .cu-hero-meta a:focus-visible { text-decoration: underline; }
/* 日期不能再用 --cu-muted：它是给浅色正文标定的深灰（L≈0.164），
   压在羽毛上时最坏背景只有 L≈0.23，实测掉到 1.3–4.0。
   要让它合格，背景亮度得接近纯白（L≥0.91）—— 还是那句，等于取消羽毛。
   所以羽毛上的次级文字一律降到 --cu-text，层级改用字号区分。 */
.cu-hero-meta time { color: var(--cu-text); letter-spacing: .06em; font-variant-numeric: tabular-nums; }
.cu-hero-excerpt { max-width: 620px; margin: 16px 0 0; color: var(--cu-text); font-size: clamp(17px, 1.5vw, 19px); line-height: 1.75; }
.cu-home-intro-actions { display: flex; flex-wrap: wrap; gap: 12px 24px; margin-top: 30px; }
/* 首屏按钮的尺寸与配色（2026-09-27 起）全部由下面「阅读全文统一组件」那一条给 ——
   见 .cu-research .cu-read, .cu-research .cu-hero-primary。
   这里原有两条：
     .cu-home-intro-actions a                  → 14px / min-height 44px / padding 10px 20px /
                                                 letter-spacing .06em，无圆角
     .cu-home-intro-actions .cu-hero-primary   → 深紫实心底 + 白字，hover 换 --cu-purple-600
   两条整条删除。理由：用户这一轮要求「大标题文章的阅读全文也用圆角」「全页的阅读全文
   都需要统一框的大小、字的大小、配色」，而这个按钮是页面上唯一一处**没有圆角、
   字号 14 与别处 13 不一致、底色是深紫而别处是浅紫**的阅读全文 ——
   它正是「不统一」的源头。删掉之后首屏按钮与正文按钮同为 13px / 8px / --cu-purple-100 底 /
   --cu-text 字。
   已知代价（明说，未自行回退）：首屏主 CTA 的视觉权重因此下降 —— 从一块深紫实心
   变成一块浅紫。它仍然是页面上唯一带底色的主按钮、字号与颜色与正文按钮同族，
   但不再靠颜色压过正文。如果看完截图觉得首屏需要更重，把这一条单独加回来即可。 */

/* ---------------------------------------------------------------------------
 * 区块标题
 * ------------------------------------------------------------------------- */
/* 2026-09-25 起 .cu-section-heading 只服务索引页 page-research.php:27 的
   「近期文章 / 按时间阅读」（首页那一处已按用户要求整块删除）。
   同轮删掉了 .cu-section-more —— 它当初只为首页右上角那个「全部文章 →」而写，
   现在没有任何模板产出该 class（索引页入口改为只走页头导航与 Mega Menu）。 */
.cu-section-heading { display: flex; justify-content: space-between; align-items: baseline; padding-top: 32px; gap: 16px; }
.cu-section-heading h2 { font-size: 20px; margin: 0; }
.cu-section-heading span, .cu-meta { color: var(--cu-muted); font-size: 13px; }

/* ---------------------------------------------------------------------------
 * 文章卡片（规格 §14–§15）
 *
 * 顺序固定为：分类 → 标题 → 日期 → 短摘要。
 * 没有配图，没有装饰图标 —— 它更像档案条目，不像新闻卡。
 * ------------------------------------------------------------------------- */
.cu-posts { display: grid; grid-template-columns: 1fr 1fr; column-gap: 48px; }
.cu-post { padding: 32px 0; border-bottom: 1px solid var(--cu-border); min-width: 0; }
/* 分类小标改用分类自己的中文名（2026-09-22）。原来那套依赖「全大写 + 大字距」成立，
   汉字没有大小写，所以这里靠字号与字距分层：11px / 600 / .14em。
   中文比英文短，同样的字号下这一行反而更轻，不需要再加字距。 */
.cu-post-cat { margin: 0; font-size: 11px; font-weight: 600; letter-spacing: .14em; line-height: 1.5; }
/* 分类小标改用低饱和紫（2026-09-27 用户：「用低饱和度一点的紫色，现在的紫色有点太明亮了。
   会觉得有点视觉上被多个重点吸引的感觉」）。
   --cu-purple-600 #6d3fd1 是给「小面积、要跳出来」的强调用的亮紫；一页四张卡就是四个亮紫，
   重点互相抵消，反而谁都不突出。--cu-purple-muted 是同一色相降饱和后的值，
   对比度还略高（6.70:1 vs 6.18:1），只是不再喊。令牌定义与数值推导见 design-tokens.css。
   这里**不改字号与字距** —— 用户说的是颜色太重，不是这行太小或太大；
   11px / 600 / .14em 是中文分类名实测调出来的分层，动它等于换一个问题。 */
.cu-research .cu-post-cat a { color: var(--cu-purple-muted); text-decoration: none; }
.cu-research .cu-post-cat a:hover, .cu-research .cu-post-cat a:focus-visible { color: var(--cu-purple-950); text-decoration: underline; }
.cu-post-title { margin: 12px 0 0; font-size: clamp(21px, 1.8vw, 25px); line-height: 1.34; letter-spacing: -.02em; overflow-wrap: anywhere; }
.cu-research .cu-post-title a { color: var(--cu-text); text-decoration: none; }
/* 悬停只加下划线，不换色（用户 2026-09-25：「变色和加横线，二者不要同时存在」，
   文章标题取的是「加横线」这一侧）。
   原来这里把标题染成 --cu-purple-600 —— 用户看到的就是「黑色标题一点击变紫」，明确不要。
   color 这里**显式**再写一遍 --cu-text，而不是省掉让它回落：
   省掉的话，命中 hover 的还有上面「通用」一节那条 .cu-research a:hover（深紫黑 --cu-purple-950），
   两者特异性相同（0,2,1）、靠源码顺序决胜 —— 能赢，但太脆，改一次顺序就悄悄变色。
   深紫黑本身是用户认可的颜色，但那属于「变色」那一侧，与下划线不能并用，所以钉死。 */
.cu-research .cu-post-title a:hover, .cu-research .cu-post-title a:focus-visible { color: var(--cu-text); text-decoration: underline; }
.cu-post-date { margin: 10px 0 0; color: var(--cu-muted); font-size: 12px; letter-spacing: .06em; font-variant-numeric: tabular-nums; }
.cu-post-excerpt { margin: 12px 0 0; color: var(--cu-muted); font-family: var(--cu-font-body); font-size: 16px; line-height: 1.75; }
/* ---------------------------------------------------------------------------
 * 「阅读全文」统一组件（2026-09-27）
 * -------------------------------------------------------------------------
 * 全站每一处「阅读全文」现在共用这一条规则。产出它的地方一共四处：
 *   ① 首页首屏主按钮（front-page.php:39，类 .cu-hero-primary）
 *   ② 首页三张正文卡（cu_home_card，functions.php:414）
 *   ③ 索引页 /法律文章（page-research.php:32 → cu_render_post_card）
 *   ④ 分类归档页（functions.php:819 → cu_render_post_card）
 * 同高度、同圆角、同字号、同内边距、同底色、同字色、同 hover ——
 * 用户的原话是「这些阅读全文，都统一一下」。
 *
 * 单篇页底部的「相关阅读」**没有这个按钮**，不是漏了：那里走
 * cu_render_post_card( $id, 22, true ) 的 $compact 分支，而阅读全文与摘要
 * 都在 `if ( ! $compact )` 里（functions.php:216-219）—— 紧凑卡只有分类 / 标题 / 日期。
 * 所以本文件里凡是指向相关阅读的按钮规则都没有意义，这条组件也不必为它留位置。
 * （探针 probe-r6-button.cjs 把单篇页一并量了，那里按钮数就该是 0。）
 *
 * 用户这一轮的三条要求，逐条对应：
 * ① 「阅读全文和箭头用黑色字，不用紫色字」→ color 用 --cu-text（深灰近黑 #211c2b）。
 *    换掉紫字有两个收益：紫字在浅紫底上只有 5.82:1，而 --cu-text 是 13.1:1；
 *    并且首页一屏就有 4 个紫字按钮（首屏 1 + 正文 3），本身就是 4 个紫重点，
 *    正是用户说的「被多个重点吸引」。
 *    深灰字与正文标题同一族颜色，按钮退回「背景块 + 内容」，不再自己发光。
 * ② 「大标题文章的阅读全文，也用圆角」→ 首屏那个按钮原来是直角矩形
 *    （旧规则 .cu-home-intro-actions a 只给了内边距，没给 border-radius），
 *    现在与正文按钮同为 8px。旧规则整条删除，尺寸全部由这一条接管。
 * ③ 「全页的阅读全文都需要统一框的大小、字的大小、配色等等」→ 就是删掉 .cu-home 前缀。
 *    上一轮这条规则写成 .cu-home .cu-card .cu-read，因为 BCG §23 把归档页 / 相关阅读
 *    划在修改范围之外；本轮用户明确要求「全页统一」，那条范围约束由更新的指令取代。
 *
 * 底色从 --cu-purple-50(#f7f2ff) 换成 --cu-purple-100(#e9dfff)：
 * 前者对页面底只有 1.06:1 —— 浅到读不出「这里有个按钮」（上一轮实测值）。
 * 用户这轮说的是「可以不用太深的紫色（但要合适）作为底色」，要的是一个看得见的浅紫。
 * 用的是既有令牌，没有新增色值。注意：任何浅紫对近白底的比值都到不了 3:1，
 * 所以这个按钮的可识别性**来自文字**（13.1:1），不来自色块边界 ——
 * 与上一轮 WCAG 1.4.11 那条 N/A 的裁决理由一致。
 *
 * line-height 必须显式写 1.5。本站正文行高 2.5 来自 GeneratePress 定制器的
 * 「正文行高」设置（父主题层，AGENTS.md 不许动），会一路继承到这里；不写的话
 * 按钮高度由那个 2.5 决定，实测 48.5px —— 13px 的字裹在一颗很高的胶囊里。
 *
 * display 用 inline-flex 而不是 inline-block：箭头是一个独立 span，inline-flex 让它
 * 在垂直方向真正居中，不依赖两段文字的基线恰好一致；文字与箭头之间的间距由 gap 给
 * （标记里那个半角空格在 flex 布局下会被当作匿名 flex 项的首尾空白去掉）。
 * gap 同时修掉一处旧毛病：首屏按钮的标记里箭头前有空格、卡片按钮里也有，
 * 但两处的字号不同（14px / 13px），空格宽度也就不同 —— 统一字号之后这个差异一并消失。
 * ------------------------------------------------------------------------- */
.cu-research .cu-read,
.cu-research .cu-hero-primary {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 10px 16px;
  border-radius: 8px;
  background: var(--cu-purple-100);
  color: var(--cu-text);
  font-size: 13px;
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: 0;
  text-decoration: none;
  box-sizing: border-box;
}
/* 与上方内容的距离只给 .cu-read。首屏按钮不能有 margin-top：
   它在 .cu-home-intro-actions（display:flex）里，外边距会与容器那 30px 叠加成 46px。 */
.cu-research .cu-read { margin-top: 16px; }
/* 悬停**不换色**，只让箭头右移 3px —— 全站唯一的按钮反馈。
   必须显式钉住 color：通用规则 .cu-research a:hover（本文件「通用」一节）会把链接
   推向 --cu-purple-950，不钉的话按钮字色会变，等于出现了第二种反馈。
   .cu-research .cu-read:hover = (0,3,0)，压得过 .cu-research a:hover = (0,2,1)。 */
.cu-research .cu-read:hover,
.cu-research .cu-read:focus-visible,
.cu-research .cu-hero-primary:hover,
.cu-research .cu-hero-primary:focus-visible { color: var(--cu-text); }

.cu-research .cu-read .cu-arrow,
.cu-research .cu-hero-primary .cu-arrow { display: inline-block; transition: transform .24s ease; }
.cu-research .cu-read:hover .cu-arrow,
.cu-research .cu-read:focus-visible .cu-arrow,
.cu-research .cu-hero-primary:hover .cu-arrow,
.cu-research .cu-hero-primary:focus-visible .cu-arrow { transform: translateX(3px); }

/* Related Research 用的是紧凑卡：阅读栏只有 760px，三列带摘要会挤成一团。 */
.cu-related-posts { grid-template-columns: 1fr; column-gap: 0; }
.cu-post-compact { padding: 20px 0; }
.cu-post-compact .cu-post-title { font-size: 20px; margin-top: 8px; }

/* ---------------------------------------------------------------------------
 * 单篇文章页（规格 §25）
 * ------------------------------------------------------------------------- */
/* 2026-10-15：文章页面外围与阅读面统一米白，消除父主题背景色分层。 */
body.cu-research.single-post { --cu-surface: var(--cu-background); --base-2: var(--cu-background); --base-3: var(--cu-background); }
.cu-research.single-post :is(.site, .site-content, .content-area, .site-main, .entry-header, .entry-content) { background: var(--cu-background); }
.cu-research.single-post .site-content { display: block; }
.cu-research.single-post #primary { width: 100%; float: none; }
.cu-research.single-post .inside-article { max-width: calc(var(--cu-reading-width) + 64px); box-sizing: border-box; margin: 32px auto; padding: 40px 32px; background: var(--cu-surface); }
/* 标题之上的英文分类标签，把「首页 → 分类 → 文章 → 相关研究」这条链露出来。 */
/* 单篇页标题上方的分类眉题（规格 §15：不删这一层，只把英文换成中文）。
   中文后字号 11→12px、字重 700→600，与标题的距离（14px）与页头那套保持一致。 */
.cu-single-cat { margin: 0 0 14px; font-size: 12px; font-weight: 600; letter-spacing: .14em; }
/* 与卡片上的分类小标同一个颜色（2026-09-27）。单篇页的底是 --cu-surface 纯白，
   --cu-purple-muted 在纯白上是 7.0:1，比在 #fcfaff 上还宽一点。 */
.cu-research .cu-single-cat a { color: var(--cu-purple-muted); text-decoration: none; }
.cu-research .cu-single-cat a:hover, .cu-research .cu-single-cat a:focus-visible { color: var(--cu-purple-950); text-decoration: underline; }
.cu-research.single-post .entry-title { font-size: clamp(30px, 4vw, 48px); line-height: 1.15; letter-spacing: -.025em; overflow-wrap: anywhere; }
.cu-research.single-post .entry-meta { font-size: 13px; color: var(--cu-muted); }
/* 这里原先有一条 .byline { display: none } 用来遮掉「作者 CU」。
   2026-09-24 已改成在 functions.php 里 add_filter( 'generate_post_author', '__return_false' )，
   作者项在数据层就被摘掉、根本不进 DOM，所以 CSS 不再需要管它。
   留这两行是防止后人看到「没有 byline 样式」又补一条回来。 */
.cu-research.single-post .entry-content { font-family: var(--cu-font-body); font-size: var(--cu-body-size); line-height: var(--cu-body-leading); overflow-wrap: anywhere; }
/* UI deterrent only, not access control or protection against scraping/screenshots. */
.cu-research.single-post .entry-content,
.cu-research.single-post .entry-content * { -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; }
.cu-research.single-post .entry-content :is(input, textarea, select, [contenteditable]:not([contenteditable="false"])),
.cu-research.single-post .entry-content [contenteditable]:not([contenteditable="false"]) * { -webkit-user-select: text; user-select: text; -webkit-touch-callout: default; }
.cu-research.single-post .entry-content h2 { font-size: 34px; line-height: 1.22; margin: 2em 0 .8em; }
.cu-research.single-post .entry-content h3 { font-size: 26px; line-height: 1.3; margin-top: 1.8em; }
/* 引用块左侧那 3px 竖线：2026-09-27 由紫 600 换成 muted。
   它是一条 3px 的实心色带，面积虽小却是正文里唯一的彩色线条，
   亮紫在这里最容易被读成「这里很重要」；引用只是排版层级，不是强调。 */
.cu-research.single-post .entry-content blockquote { margin: 32px 0; padding: 20px 24px; border-left: 3px solid var(--cu-purple-muted); background: var(--cu-background); font-style: normal; }
.cu-research.single-post .entry-content pre { max-width: 100%; overflow-x: auto; background: var(--cu-purple-950); color: white; padding: 24px; font-size: 14px; white-space: pre; }
.cu-research.single-post .entry-content table { display: block; max-width: 100%; overflow-x: auto; border-collapse: collapse; font-size: .9em; }
.cu-research.single-post .entry-content :is(th, td) { padding: 12px 16px; border: 1px solid var(--cu-border); }
.cu-research.single-post .entry-content :is(th, td):first-child { min-width: 6em; }
.cu-research.single-post .entry-content :is(th, td):not(:first-child) { min-width: 12em; }
.cu-research.single-post .entry-content th { background: var(--cu-background); }
.cu-research.single-post .entry-content img { max-width: 100%; height: auto; }
.cu-research.single-post .entry-content figure { max-width: 100%; margin-inline: 0; }
.cu-research.single-post .entry-content figcaption { color: var(--cu-muted); font-size: 13px; }
.cu-research.single-post .entry-content .cu-copyright { margin-top: 64px; padding-top: 20px; border-top: 1px solid var(--cu-border); color: var(--cu-muted); font-family: var(--cu-font-ui); font-size: 13px; line-height: 1.6; }
.cu-about-credit { max-width: var(--cu-reading-width); margin: 48px auto 24px; padding: 16px 20px; border-top: 1px solid var(--cu-border); color: var(--cu-muted); font-family: var(--cu-font-ui); font-size: 13px; line-height: 1.6; }
/* About follows the continuous warm paper and centered article reading measure. */
body.cu-research.page-id-197 { --cu-surface: var(--cu-background); --base-2: var(--cu-background); --base-3: var(--cu-background); }
.cu-research.page-id-197 .site-content { display: block; }
.cu-research.page-id-197 #primary { width: 100%; float: none; }
.cu-research.page-id-197 .inside-article { box-sizing: border-box; max-width: calc(var(--cu-reading-width) + 64px); margin: 32px auto; padding: 40px 32px; background: transparent; }
.cu-research.page-id-197 .elementor > .e-con { padding-inline: 0; }
@media (max-width: 767px) {
  .cu-research.page-id-197 .inside-article { margin: 0 auto; padding: 28px 20px; }
}
body.page-id-197 .elementor-element-622421a img { -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; -webkit-user-drag: none; }
.cu-research.single-post .sidebar { float: none; width: 100%; max-width: 824px; margin: auto; }
/* Related Research 落在 .entry-content 之外的 .inside-article 里，
   宽度和左右内边距由父级给定，这里只管分节留白。 */
.cu-related { margin-top: 64px; padding-top: 32px; border-top: 1px solid var(--cu-border); }
/* 相关阅读（原 Related Research，规格 §16）。
   英文那版靠全大写 + 大字距在 12px 上就能当小标题用；中文没有大小写，
   12px 的灰字只会读成图注，所以提到 15px 并改用正文色。 */
.cu-related-title { margin: 0; color: var(--cu-text); font-size: 15px; font-weight: 700; letter-spacing: .02em; }

/* ---------------------------------------------------------------------------
 * 归档页与搜索结果（规格 §16 / §17；2026-09-27 起五处共用）
 *
 * 覆盖范围：分类归档（eyebrow 写方向）+ 标签 / 日期 / 作者归档 + 搜索结果。
 * eyebrow 只有分类归档有（方向是分类独有的），其余四种的页头就是 h1 + 数量。
 *
 * eyebrow 写的是分类所属的方向（宏观 / 市场 / 公司 / 洞见），分类名交给 <h1> ——
 * 原来两处都写分类名，同一行字在标题上下各出现一次。数量在标题之下。
 * 类名避开 .cu-archive —— 那是上一版设计留下的死规则，2026-09-24 已确认全站没有
 * 任何元素带这个裸类名，连同 .cu-archive h2 与 767px 里那条 gap 一并删除。
 *
 * 列表条目（2026-09-23，§17）改吃首页那套 .cu-posts / .cu-post 卡片，所以这里
 * 不再写第二套版式。
 *
 * 容器（2026-09-24 修正）：只给 max-width 是不够的 —— ≤1024 时 GP 的 .grid-container
 * 已经没有左右内边距，#primary 就等于视口宽，卡片会直接贴到屏幕边缘（实测 390 下
 * 卡片左沿 x=0，摘要一路顶到右沿）。所以照 .cu-index 的做法，把留白做在 #primary
 * 自己身上：桌面 24px、≤767 收成 20px，与索引页逐档相同。
 * GP 的 #page.grid-container 宽度来自主题选项，与 --cu-page-width 不一定相等，
 * 所以仍要把它收进同一个最大宽度。
 *
 * 标题区（2026-09-24）：原来还是 GP 默认的 .page-header —— 纯白盒子、四周 40px 内边距、
 * h1 固定 30px。盒子与 design.md「白和近白为主体、少用盒子」相冲；30px 又比索引页
 * clamp 上限的 52px 矮一档，同一个站里出现两个标题层级。现在改成与 .cu-intro 同一套：
 * 无背景、同一条底部分隔线、同一档 clamp、横向内边距归零。
 * 实测：修正前 1440 标题文字 x=160 / 卡片 x=120（错位 40px）、390 为 30 / 0；
 * 修正后 1440 两者同为 x=144、390 同为 x=20，与「全部文章」索引页逐档一致。
 *
 * 列数不用另写：.cu-posts 默认两列，归档因此自动与「全部文章」索引页一样是两列。
 * 2026-09-25 之前首页单独提到三列，那条已随第四轮的 Row 系统删除；
 * 现在 .cu-posts 的列数全站只有这一个定义，索引页 / 归档 / 相关阅读共用。
 * ------------------------------------------------------------------------- */
/* 2026-09-27：这套骨架从「只有分类归档」扩到标签 / 日期 / 作者归档与搜索结果。
   那四种归档原先完全走 GP 默认 —— 列表是 GP 的条目、页头是 GP 的
   .separate-containers .page-header（自带 --base-3 白底、四周 30–40px 内边距、
   h1 固定 30px）。和分类归档、索引页、首页摆在一起：一个是纯白盒子加 30px 标题，
   一个是无底色的 52px 标题加一条细线，同一个站里两套标题层级。

   容器宽度仍必须显式给：GP 的 #page.grid-container 上限来自主题选项（实测 1385px），
   与 --cu-page-width 1200 不等，不收进来搜索结果里的正文会比卡片系统宽出一大截。 */
.cu-research:is(.category, .search, .tag, .date, .author) #primary { width: 100%; float: none; box-sizing: border-box; max-width: var(--cu-page-width); margin: auto; padding-left: 24px; padding-right: 24px; }
.cu-research:is(.category, .search, .tag, .date, .author) .page-header { background: none; padding: 24px 0 40px; border-bottom: 1px solid var(--cu-border); }
.cu-research.category .page-header h1 { font-size: clamp(32px, 4vw, 52px); line-height: 1.2; letter-spacing: -.035em; margin: 18px 0 0; }
/* 其余四种归档的页头里没有 eyebrow（方向是分类独有的），h1 就是第一个子元素，
   所以上边距归零 —— 分类那条的 18px 是它与 eyebrow 之间的距离，照搬过来会多出一段
   没有来由的空白。字号 / 字距 / 行高与分类归档同一档，标题层级全站统一。 */
.cu-research:is(.search, .tag, .date, .author) .page-header h1 { font-size: clamp(32px, 4vw, 52px); line-height: 1.2; letter-spacing: -.035em; margin: 0; }
/* eyebrow 的紫 600 → muted（2026-09-27），与全站链接色同一处理：
   一页里它和卡片上的分类小标（:350 已是 muted）是同一个语义，颜色不该有两档。 */
.cu-archive-eyebrow { margin: 0 0 10px; color: var(--cu-purple-muted); font-size: 12px; font-weight: 600; letter-spacing: .14em; }
.cu-archive-count { margin: 10px 0 0; color: var(--cu-muted); font-size: 13px; letter-spacing: .04em; font-variant-numeric: tabular-nums; }
/* 空归档 / 空搜索的说明句：替代 GP 那句「什么也没找到 / 也许搜索能有所帮助」——
   那句话把「这个分类还没有文章」「没有这个词的结果」说成了「你找的东西不存在」，是误导。 */
.cu-archive-empty { margin: 28px 0 0; color: var(--cu-muted); font-family: var(--cu-font-body); font-size: 17px; }

/* 空搜索页的搜索框（functions.php 的 .cu-search-empty-form）。
   外观照页头那个 .cu-site-search 对齐 —— 用户是从那个框搜过来的，重搜的入口
   长得应该和它一样 —— 但不复用它的类：页头那套选择器一半是给「压在羽毛上」
   写的（.cu-site-search 有 body.home 的 4 条覆盖），在正文里命中只会读到意外值。
   这里只抄几何：方角、1px --cu-border 边、13px 字、紫 950 的实心按钮。
   宽度不学页头的 130px —— 那是为了不撑破一行导航，正文里没有这个约束。
   圆角保持 0：与页头搜索框一致，也与全站「不要圆角卡片」一致；
   唯一有圆角的是「阅读全文」按钮的 8px。 */
.cu-search-empty-form { display: flex; align-items: center; gap: 8px; margin: 24px 0 0; max-width: 420px; }
.cu-search-empty-form label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.cu-search-empty-form input { box-sizing: border-box; flex: 1 1 auto; min-width: 0; padding: 8px 10px; border: 1px solid var(--cu-border); border-radius: 8px; background: var(--cu-surface); color: var(--cu-text); font: inherit; font-size: 14px; }
/* 占位文字的颜色必须**显式**给（2026-09-27 实测补）。不给就用 Chrome 的默认 #757575 ——
   在 #fff 上只有 3.60:1，低于正文阈值 4.5:1。页头那个 .cu-site-search 一早就写了同一条
   （:123 / :137 / :807），只有本轮新加的这个框漏了，于是两个搜索框的占位字深浅还不一样。
   发现方式值得记：verify-r7-contrast.cjs 量这个输入框时，「最坏像素的背景」是 #757575 ——
   那不是背景，是占位字自己（color: transparent 管不到 ::placeholder，得单独写）。
   换 --cu-muted 后 #fff 上是 4.87:1，与页头搜索框逐字一致。 */
.cu-search-empty-form input::placeholder { color: var(--cu-muted); }
.cu-search-empty-form button { flex: none; padding: 9px 11px; border: 0; border-radius: 8px; background: var(--cu-purple-950); color: #fff; font: inherit; font-size: 13px; cursor: pointer; }

.cu-pagination { padding: 32px 0; display: flex; flex-wrap: wrap; gap: 16px; }

/* ---------------------------------------------------------------------------
 * 首页内容 Row 系统（2026-09-25，第四轮）
 *
 * 首页 Header 以下原先是「羽毛首屏 + 一个等宽三列卡片墙」，每篇视觉权重相同、
 * 节奏重复。这里改成由大小 / 数量 / 排列各不相同的 Row 组成：
 * 一大一小 → 单篇横向 → 两篇并列 → 三篇并列（见 functions.php 的 cu_home_row_recipe）。
 *
 * 版式仍建在 .cu-post 之上 —— 分类 / 标题 / 日期 / 摘要 / 阅读全文 / 细线分隔都不重写，
 * 这里只加尺寸与排列的修饰类：.cu-row-{type} 与 .cu-card-{lead|wide|plain|small}。
 * 所以索引页 / 分类归档 / 相关阅读完全不受影响，它们走的是 .cu-posts + .cu-post。
 *
 * 整节必须写在这个位置：下面两个媒体查询（≤1024 / ≤767）靠「后写者胜」覆盖，
 * 媒体查询不增加特异性，把本节放到它们之后会反过来压掉窄屏的单列规则。
 *
 * 留白按方案 §15 分三层：卡内 10–16px（沿用 .cu-post 现值）、
 * 行内卡与卡 32–56px（column-gap）、行与行 var(--cu-space-6) 64–96px。
 * 卡片自身不再留 32px 上内边距：留白由「行间距」这一个量统一负责，
 * 否则图片卡顶上会多出一段没人解释的 32px，实际行距也超出 §15 的范围。
 * ------------------------------------------------------------------------- */

/* 行与行的距离（§15「Row 到 Row 64–100px」）。
   只给相邻行之间加，首行不加 —— 首行到「精选研究」标题的距离由 .cu-rows 的上外边距给。 */
.cu-rows { margin-top: var(--cu-space-4); }
.cu-row + .cu-row { margin-top: var(--cu-space-6); }

/* 这里原有「区块标题下一条极轻辅助线」（.cu-home-research .cu-section-heading 的 border-bottom），
   随「精选研究」区块标题一并删除（2026-09-25）—— 标题没有了，线也就没有承载对象。 */

/* Row 1：一大一小。大卡在左占 1.6 份，右侧是小卡。
   align-items: start —— 否则小卡会被拉伸到与大卡等高，卡内的图与文字就不再是自然高度。
   （原注释说的是「底部细线对不上」，那条细线 2026-09-25 已删，理由随之改写；
   现在这一步的实际作用是让两栏各自按内容高度收尾 —— 两栏都带同高图片之后，
   它们的高度本来就接近持平，见 functions.php cu_home_card() 那段说明。） */
.cu-row-lead-stack { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); column-gap: 56px; align-items: start; }

/* Row 2：单篇横向（图 + 文）。整行一张卡，卡内部再分两栏。 */
.cu-row-wide { display: block; }
.cu-card-wide { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); column-gap: 48px; align-items: start; }

/* 并列卡落单时的降级行（见 functions.php 的 cu_home_row_degrade）：
   整行一张普通卡，安静收尾，不把它升格成横向大卡。
   注：以前这里写的是「无图文字卡」，§6 之后四种版式一律带图，那句话已不成立。 */
.cu-row-single { display: block; }

/* Row 3 / Row 4：并列卡（§13：三篇并列要降低使用频率，整页最多一次）。
   注：以前写的是「纯排版无图」，§6 之后并列卡也带图，差别只剩每张图的宽度。 */
.cu-row-pair { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 48px; align-items: start; }
.cu-row-trio { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: 32px; align-items: start; }

/* 卡片：沿用 .cu-post 的版式，只去掉上内边距（见上）。
   **卡片容器本身**不加圆角、不加阴影、不加底色（§19/§20，AGENTS.md 也禁止「圆角卡片」）
   —— 结构靠排版和留白建立。§10 说的「文章容器圆角要统一」在本文档里是有条件的
   （「如果正文文章使用背景容器 / Card」）：本站不使用容器，所以这条无对象，
   统一圆角只落在图片上（§9，见 .cu-card-media）。 */
.cu-card { padding: 0 0 28px; }
/* 首页卡片底部那条细线一律去掉（用户 2026-09-25：「大标题下面不要横线了」，
   确认下来的对象就是每张卡片底部这一条）。这一条来自 .cu-post 的 border-bottom。
   选择器写成 .cu-home .cu-card（0,2,0）而不是 .cu-card：后者与 .cu-post 同为 (0,1,0)，
   要靠源码顺序决胜，太脆；多一个类直接压过，同时明说这条只对首页生效 ——
   索引页 / 分类归档 / 相关阅读的 .cu-post 仍然保留那条线。
   去掉之后首页正文区不再有任何横向细线，卡与卡只靠留白和字号分层。
   顺带修掉两处原本就不成立的观感：Row 1 两栏不等高时，那条线会在两个不同高度
   各画一条（实测一高一低差约 445px）；Row 2 的单张横向卡后面还会吊着一条线。
   底部内边距保持 28px 不动 —— 它的作用是卡内留白，与这条线无关，去掉线不改变行距。 */
.cu-home .cu-card { border-bottom: none; }
.cu-card-body { min-width: 0; }

/* 图片容器（§17）。
   object-fit: cover 与显式宽高比要用，前提是容器有确定宽度、且没被 grid 拉伸 ——
   aspect-ratio 只在「有一轴为 auto」时才生效，所以两个父级的 align-items 都是 start。
   主题没有全局 img { max-width: 100% }（只在 .entry-content 里），
   这里必须显式 width: 100%，否则一张原图就能撑破列、带出横向滚动。 */
.cu-card-media {
  /* 高度统一、宽度随版式变、圆角统一（§7 / §8 / §9）。
     上一轮是按版式给不同比例（大卡 16:9、横向卡 4:3），但宽高比只在「宽度也相同」时
     才等于等高；实测宽度一变高度就跟着变：1024 档大卡 307.1 高、横向卡 327.9 高，
     同屏差 21px；768 档差 16px。§7 明确「不要让某篇图片因为原始图片比例不同而把整个
     Row 撑高」，所以比例改成固定高度：宽度不同、视觉高度一致，由 cover 负责裁切。
     值取 clamp 而不是死值，避免窄屏一张图吃掉整屏：
       1440 → 374，1280 → 333，1024 → 266，768 → 200，430/390 → 190（下界）。
     单独放一个自定义属性，是为了 §8 说的那种例外——将来某张图不适合 cover 时，
     只要覆盖这一个值或给某个 .cu-card-media-{layout} 另设高度，不必动版式。
     圆角 10px：落在 §9 建议的 8–12px 内，与「阅读全文」按钮的 8px 同一量级，
     克制、有现代感，但不至于变成 SaaS 风格的圆角卡片（§9 / AGENTS.md 都要求不那样）。 */
  --cu-media-h: clamp(190px, 26vw, 384px);
  box-sizing: border-box;
  overflow: hidden;
  height: var(--cu-media-h);
  border-radius: 10px;
  background: var(--cu-purple-50);
}
.cu-card-media img { display: block; width: 100%; height: 100%; object-fit: cover; }
/* 图与文之间的间距。除横向卡以外的三种版式，图片都压在文字上方，而卡片**不是** grid
   —— 图片和 .cu-card-body 是普通块级兄弟，中间没有任何间距机制，必须显式给。
   实测（probe-r5-geometry.cjs，六档）：不给的时候图底到首个文字元素顶整整是 0，
   分类小标直接贴在图片下沿上。数值取 20px，与横向卡 ≤767 折成单列时
   .cu-card-wide 的 grid row-gap 一致，不新造量。
   横向卡不走这条：它 ≥768 是左右两栏，纵向间距无意义；≤767 折成单列时由那条
   row-gap: 20px 负责，两条规则不重叠、也不会叠加成 40px。 */
.cu-card:not(.cu-card-wide) .cu-card-media { margin-bottom: 20px; }

/* 正文标题统一（§3.1 / §4 / §5）：所有正文文章同一个字号，不再按版式分档。
   上一轮是 lead 42 / wide 34 / small 19 三档 —— 那恰好是 §5 明令禁止的
   「用不同标题大小制造 Row 差异」。Row 的区别改由宽度、左右位置和留白承担。
   精选（首屏那篇）不受此约束：§3.2 要求它明显大于正文，故 front-page.php 的
   h1 保持原样（clamp 到 42px 那一档），这里是「有意层级」而非不一致。
   clamp(24px, 2.4vw, 34px)：1440 → 34，1280 → 30.7，1024 → 24.6，768 及以下 → 24。
   §4 说桌面 30–36、宁可稍大、手机不要变小 —— 24px 中文标题在手机上仍清晰，
   长标题自然换行，不靠缩字号去避免换行。
   字重不动：四档本来就同为继承值，本来就是统一的，不必改（§3.1 只要求「统一」）。 */
.cu-card .cu-post-title { margin-top: 14px; font-size: clamp(24px, 2.4vw, 34px); line-height: 1.3; letter-spacing: -.02em; }
/* 摘要与日期仍沿用 .cu-post 的规则，不加特例 —— 日期 12px 永远是最弱的一档。
   正文摘要已在 §15 取消，但这条规则不能删：索引页 / 归档 / 相关阅读的
   .cu-post-excerpt 还在用（§23 本轮不动那三处）。 */

/* ---------------------------------------------------------------------------
 * 「阅读全文」的规则已上移到「文章卡片」一节之后的独立组件条目（搜「阅读全文统一组件」）
 * -------------------------------------------------------------------------
 * 这里原有 .cu-home .cu-card .cu-read 与它的 :hover（2026-09-26 版）：
 * 浅紫 --cu-purple-50 底 + 紫字 --cu-purple-600，且**只在 .cu-home 之下生效** ——
 * 因为那一轮 BCG §23 把归档页 / 相关阅读划在修改范围之外，组件只敢在首页内统一。
 *
 * 2026-09-27 用户明确要求「全页的阅读全文都需要统一框的大小、字的大小、配色等等」，
 * 并且要求字色改黑、首屏那个直角按钮也改圆角。那条更新的指令取代了 §23 的范围约束，
 * 所以规则整条搬走、删掉 .cu-home 前缀，四处共用一个定义，不再有第二份。
 * 留这条注释是为了让「原来这里有一条规则、它去哪了」可查，不是死代码。
 * ------------------------------------------------------------------------- */

/* ---------------------------------------------------------------------------
 * 唯一的 hover 反馈（§13 / §14 / §22H）：箭头右移 3px
 * -------------------------------------------------------------------------
 * ① 触发范围从上一轮的「整张卡」收到「阅读全文本身」。上一轮是 .cu-card:hover，
 *    鼠标扫过标题、日期、图片都会带动箭头；§13 的原话是「『阅读全文』可以有非常轻的
 *    hover」，所以触发器就是那个按钮。副作用（好的那种）：一张卡上现在只有一处会动。
 * ② :focus-visible 一起给，键盘 Tab 到按钮时有同样反馈，不靠鼠标独占。
 * ③ 上一轮的「标题下划线从左向右展开」整段删除（§13 标题不要动画）。
 * ④ 上一轮的「图片 scale(1.02)」整条删除（§13 图片第一版不需要动画，§14 禁止叠加）。
 * ⑤ 不与颜色变化同时发生：§13 说箭头移动 / 底色变化 / 字色变化三者选一种即可。
 *
 * 被删掉的两条为什么必须留一条「压掉」的规则，而不是直接删干净：
 * .cu-research .cu-post-title a:hover（本文件 :329）是三页共用的，它同样命中首页
 * 卡片的标题；不显式覆盖的话，首页标题悬停会冒出那条静态下划线，等于标题又有反馈了。
 * 另：这一条与今天早些时候「标题点击加横线、不要变色」的要求相反 ——
 * 那份要求已被 20260926bcg调整建议 §13/§22H 取代，且**只在首页生效**，
 * 另外三页（索引 / 归档 / 相关阅读）保持原样，§23 不许动。
 * ------------------------------------------------------------------------- */
.cu-home .cu-card .cu-post-title a:hover,
.cu-home .cu-card .cu-post-title a:focus-visible {
  color: var(--cu-text);
  text-decoration: none;
}

/* 箭头的位移规则同样已上移，且现在覆盖首屏按钮（.cu-hero-primary .cu-arrow）——
   见「阅读全文统一组件」一节末尾。上面那条 .cu-home .cu-card .cu-post-title a:hover 保持不变：它管的是标题，
   与按钮无关，而且必须留着才能压掉三页共用的 .cu-post-title a:hover 下划线（§13）。 */

/* ---------------------------------------------------------------------------
 * ≤1024px：导航折成「品牌 + 搜索 + 汉堡」，菜单点击展开
 *
 * 触屏没有 hover，Mega Menu 必须由点击驱动（.cu-nav-open / .cu-nav-group-open
 * 由页脚那段 JS 切换）。层级只有两级：导航项 → 四个方向，方向下面是链接
 * 而不是第三层菜单。触控区一律 ≥44px。整块不出现横向滚动。
 * ------------------------------------------------------------------------- */
@media (max-width: 1024px) {
  /* 768–1024 这一段要单独加面纱，原因是版式而不是审美：
     桌面那版靠的是横向渐变（左侧 .92 → 右侧 .10），前提是正文只占左半边。
     可一旦 ≤1024，.cu-home-intro-copy 的 760px 上限就超过可用宽度，
     文案几乎铺满整行 —— 实测 768 下标题横跨 x24–744（全宽 97%），
     横向渐变护不到右端，实测眉标掉到 2.25:1。
     所以这一段改成近似均匀的纵向提亮，横向分量不再承担保护职责。 */
  .cu-home-research { width: calc(100% - 48px); }
  .cu-site-header { grid-template-columns: minmax(0, 1fr) auto auto; gap: 12px; padding: 18px 24px; }
  .cu-brand-group { grid-column: 1; grid-row: 1; }
  .cu-nav-toggle { display: inline-flex; grid-column: 2; grid-row: 1; }
  .cu-header-search { grid-column: 3; grid-row: 1; }
  .cu-header-search { position: static; }
  .cu-site-search { top: calc(100% + 4px); right: 20px; }
  body.home .cu-site-search { right: 0; }

  .cu-site-nav { display: none; grid-column: 1 / -1; grid-row: 2; flex-direction: column; align-items: stretch; justify-content: flex-start; gap: 0; padding-top: 8px; border-top: 1px solid var(--cu-border); margin-top: 4px; }
  .cu-site-nav.cu-nav-open { display: flex; }
  .cu-site-nav .cu-nav-link { display: flex; align-items: center; min-height: 48px; font-size: 16px; }

  /* 面板回到文档流里，成为导航的第二层，不再绝对定位。 */
  .cu-mega { position: static; width: auto; padding-top: 0; opacity: 1; visibility: visible; transform: none; display: none; }
  .cu-nav-group-open .cu-mega { display: block; }
  .cu-mega-panel { padding: 4px 0 12px 16px; border: 0; border-left: 2px solid var(--cu-border); border-radius: 0; box-shadow: none; background: transparent; }
  .cu-mega-inner { grid-template-columns: 1fr; gap: 24px; }
  .cu-mega-area-zh { display: inline; margin: 0 0 0 8px; }
  .cu-mega-list { gap: 0; margin-top: 6px; }
  .cu-research .cu-mega-list a { display: flex; align-items: center; min-height: 44px; font-size: 15px; }
  /* 「文章」本身在窄屏只负责展开，进索引页要靠这一条。 */
  .cu-mega-all { min-height: 44px; margin-top: 16px; padding-top: 14px; }

  /* 展开态的底衬。
     首页页头是 body.home 的透明绝对定位版（压在 Hero 图上），导航面板本身也没有底色，
     于是展开后的菜单会直接叠在 Hero 文案和卡片上，两层字互相压住、都读不出来。
     菜单一展开就把页头切成实底，并同步把品牌 / 导航项 / 搜索 / 小方块一并切回深色。
     .cu-nav-expanded 由页脚那段 JS 切换；选择器带上 body.home 与 .cu-site-header，
     是为了压过 77–91 行那组 0,4,1 的透明态 !important 规则。
     这里刻意不改 position：滚动后另有 .cu-header-solid 负责 fixed，两者互不冲突。 */
  body.home .cu-site-header.cu-nav-expanded { background: var(--cu-surface); border-bottom-color: var(--cu-border); }
  body.home .cu-site-header.cu-nav-expanded .cu-site-brand { color: var(--cu-purple-950) !important; text-shadow: none; }
  body.home .cu-site-header.cu-nav-expanded .cu-site-nav .cu-nav-link { color: var(--cu-text) !important; text-shadow: none; }
  body.home .cu-site-header.cu-nav-expanded .cu-site-nav .cu-nav-link:hover,
  body.home .cu-site-header.cu-nav-expanded .cu-site-nav .cu-nav-link:focus-visible { color: var(--cu-purple-600) !important; }
  body.home .cu-site-header.cu-nav-expanded .cu-nav-toggle { border-color: var(--cu-border); color: var(--cu-text); }
  body.home .cu-site-header.cu-nav-expanded .cu-site-search input::placeholder { color: var(--cu-muted); }
  body.home .cu-site-header.cu-nav-expanded .cu-site-search button { background: var(--cu-purple-950); color: #fff; }
  /* 展开态自己带一层实底（不依赖上面那组页头规则是否命中），并且自成一个滚动容器：
     390×844 的真机视口下整份菜单约 932px 高，最后一项「全部文章」会落到屏幕外。
     窄屏「文章」只负责展开、不跳转，这一项是进索引页的唯一入口，够不到就等于进不去；
     而滚动页面会把 absolute 页头切成 fixed，等于把没显示完的那截永远钉在屏幕外。
     100svh 是「浏览器工具栏可见」时的高度，偏保守；导航顶边实测 100–102px，
     留 108px 之后菜单底沿落在视口底部之上 6–8px。 */
  .cu-site-nav.cu-nav-open { background: var(--cu-surface); max-height: calc(100svh - 108px); overflow-y: auto; }

  /* 此断点下页头折成两行，Hero 文案需让出更高的顶部空间 */
  .cu-home-intro-content { padding: 156px 0 96px; }

  /* 平板端：三篇并列降到两列，一大一小的差距收窄（§27）。
     三列在 768–1024 只剩约 300px 一栏，中文标题会碎成一行四个字。 */
  .cu-row-lead-stack { grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); column-gap: 40px; }
  .cu-row-trio { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 32px; row-gap: 36px; }
  .cu-row-pair { column-gap: 36px; }
  .cu-card-wide { grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); column-gap: 36px; }
}

@media (max-width: 767px) {
  .cu-site-header { padding: 16px 18px; }
  .cu-site-footer { min-height: 260px; gap: 28px; padding: 48px 20px 36px; }
  .cu-site-brand span { display: none; }
  .cu-posts { grid-template-columns: 1fr; }
  .cu-index .site-main { padding: 20px 20px 40px; }
  /* 归档容器跟着索引页收到 20px（见上方「分类归档页」一节）。
     媒体查询不增加特异性，这里靠「后写者胜」压过基础的 24px。 */
  .cu-research.category #primary { padding-left: 20px; padding-right: 20px; }
  .cu-research.single-post .inside-article { padding: 28px 20px; margin: 0; }
  .cu-home { width: min(100% - 36px, var(--cu-page-width)); padding: 20px 0 48px; }
  .cu-home-wide { width: 100%; padding: 0 0 var(--cu-space-7); }
  /* 竖构图原图在窄屏下按宽度裁切，取中部羽纹；文字落在底部 */
  /* 窄屏把页头拉高（见 .cu-home-intro-content 的 padding），所以提亮也保持顶部最强 */
  .cu-home-intro { min-height: min(78svh, 660px); }
  /* 窄屏取竖图中段，文字带里正好压着羽毛的过曝高光（原始像素已到 255）。
     2026-09-22 改为浅色面纱后这条反而是最省事的：过曝高光对黑字本来就是最好的底，
     所以不再需要「提前到位、撑到 88%」的深压，只要把可能偏暗的羽纹整体抬亮即可。
     因此窄屏的提亮比桌面更平（.64 → .34 单向递减），不再做「下重上轻」。
     页头那一条横带在窄屏同样需要底，所以顶部保持 .64 不降。 */
  /* 手机端面纱要比 ≤1024 那段再厚一档。第一版取 .52/.44/.34，
     实测 390 下日期那一行的中位背景亮度只有 0.23（对应底部那段深紫羽纹），
     连近黑字都只剩 4.5:1 擦线。这里按实测反推：要把最坏像素抬到 L≈0.45 以上，
     面纱得到 .56 上下。现在日期用 --cu-text，实测最坏 6.4:1，留出余量。 */
  .cu-home-intro-content, .cu-home-research { width: min(100% - 36px, var(--cu-page-width)); }
  .cu-home-intro-content { padding: 132px 0 92px; }
  .cu-home-intro-actions { margin-top: 26px; }
  .cu-home-intro h1 { font-size: clamp(30px, 9vw, 44px); line-height: 1.14; }
  .cu-hero-excerpt { font-size: 16px; }
  .cu-research.single-post .entry-title { font-size: 34px; }
  .cu-research.single-post .entry-content h2 { font-size: 28px; }
  .cu-research.single-post .entry-content h3 { font-size: 22px; }

  /* 手机端：所有 Row 一律单列，重新排列而不是机械缩小（§27）。
     横向卡因为图片在 DOM 里本就在前，折成单列后自然就是「图在上、文在下」，
     不需要 order 干预。视觉权重的差别仍在：大卡的图更宽、标题在版式里占的横向空间更大；
     小卡和并列卡的图窄。但**不再靠「有的卡有图、有的没图」或「标题一大一小」来区分**
     —— §6 要求每篇正文都有图，§3.1/§5 要求标题统一，两者都取代了上一轮的做法。 */
  .cu-row-lead-stack,
  .cu-row-pair,
  .cu-row-trio { grid-template-columns: 1fr; column-gap: 0; row-gap: 36px; }
  /* 相邻行之间已经有 var(--cu-space-6)，行内再留 36px 就重复了。
     这里让「行内卡与卡」和「行与行」共用同一个量，靠 .cu-row 自身的间距分层。
     2026-09-26 用户第 2 条：这里原有 `padding-top: 28px; border-top: 1px solid var(--cu-border)`，
     两条一起删除。删线是因为全站改由「图片 + 内容 + 留白」分层，不靠传统列表分隔线；
     删那 28px 是因为它是为了给那条线让位才加的 —— 只删线不删内边距，两卡之间的空隙
     会变成 36(row-gap) + 28(padding) = 64px，比行间距还大，等于把「同一行」的层级关系弄反。
     现在行内与行间只差一个量级，符合「留白分层」而不是「线条分层」。 */
  .cu-card-wide { grid-template-columns: 1fr; column-gap: 0; row-gap: 20px; }
  /* 这里原有 .cu-card-media-wide { aspect-ratio: 16 / 9 }（折成上图下文后 4:3 太方）。
     图片高度已经统一成 .cu-card-media 上那个 --cu-media-h，宽高比不再参与布局，
     所以整条删除 —— 留着一个不生效的比例声明只会让人以为它还在起作用。 */
}

/* ---------------------------------------------------------------------------
 * 降低动效偏好（2026-09-25 补）
 *
 * 本文件此前一条都没有，而全站有四处过渡：Mega Menu、页头 solid 态、私人入口小方块，
 * 加上第四轮新增的标题下划线 / 箭头 / 图片放大。
 * 一次覆盖全部，而不是只给新加的那几条 —— 只降级新的会让同一页里一半动一半不动，
 * 对「减少动态效果」这个需求来说反而更糟。
 *
 * 用 transition-duration 而不是 transition: none：保留过渡本身（终态照常到达），
 * 只是把时间压到不可见，避免个别浏览器在 display 变化时因 transition: none 出错。
 * ------------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  body.cu-research *,
  body.cu-research *::before,
  body.cu-research *::after {
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
  }
}