/* 中华消化网（csg）补充样式表
 *
 * 为什么单独一份：
 *   第一阶段复刻的 CSS 合并以 `_pages.json` 的 53 个页面为输入，
 *   而「学术资讯-专题」这两个页面（原站 #/consult_block 与 #/consult_block/detail/:id）
 *   当时**不在页面清单里**，它们的专属规则因此从未进入 site.css。
 *   本轮补做这两页时，从原站实采了它们的 <style>，逐字抽出缺的那几条放在这里。
 *
 * 加载顺序：本文件在 layout.tsx 里排在 site.css **之后** ——
 *   同优先级时后加载者生效；而这些选择器本来就只在专题页命中，互不影响。
 *   不直接往 site.css 里塞，是为了让那份合并产物保持「可由脚本复现」的干净状态。
 *
 * ⚠️ 修改本文件时请连同 _capture/block/head_styles_*.css 一起看 ——
 *   那是原站原始样式，本文件必须是它的忠实子集，不要手写原站没有的规则。
 */

.consult_block.container {
  padding: 40px 15px;
}

.consult_block .block_list {
  overflow: hidden;
  margin: 0 -7px;
  max-width: unset !important;
}

.consult_block .item {
  margin: 0 7px 30px 7px;
  width: 380px;
}

.consult_block .load_more {
  margin-top: 0;
}

.consult_block_detail .consult_block_detail.container {
  padding: 40px 15px;
}

.consult_block_detail .top_path {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  color: #fff;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  width: 1200px;
  height: 264px;
  padding: 24px 15px;
  background: -webkit-gradient(linear, left top, right top, from(rgba(4, 111, 214, 0.58)), to(rgba(147, 55, 199, 0.58)));
  background: linear-gradient(90deg, rgba(4, 111, 214, 0.58), rgba(147, 55, 199, 0.58));
  background-color: #046FD6;
  margin-bottom: 40px;
}

.consult_block_detail .top_path .view_box {
  width: 480px;
  height: 204px;
  background-color: #edf1f9;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  margin-right: 30px;
}

.consult_block_detail .top_path .view_title {
  font-size: 24px;
  font-family: SourceHanSansCN;
  font-weight: bold;
  color: white;
  line-height: 36px;
  margin-bottom: 29px;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.consult_block_detail .top_path .view_text {
  font-size: 16px;
  font-family: Arial;
  font-weight: 400;
  color: white;
  line-height: 24px;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
}

.consult_block_detail .tag_list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.consult_block_detail .tag {
  width: 140px;
  height: 40px;
  line-height: 40px;
  margin-bottom: 30px;
  text-align: center;
  background: #F1F2F5;
  border-radius: 4px;
  font-size: 16px;
  font-family: MicrosoftYaHeiLight;
  font-weight: bold;
  color: #2E3F76;
  cursor: pointer;
}

.consult_block_detail .path_header {
  margin-bottom: 30px;
}

.consult_block_detail .search_box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  margin-bottom: 62px;
}

.consult_block_detail .right_path {
  margin-left: 21px;
  width: 350px;
}

/* ═══════════════════════════════════════════════════════════════════════
   消化大讲堂 · 视频播放页（2026-09-21 第 62 条）
   ───────────────────────────────────────────────────────────────────────
   原站路由 #/video/detail/:categoryId/:id 在第一阶段不在 _pages.json 的页面清单里，
   它的专属规则因此没进 site.css 的合并结果（与专题页同样的情况，见上面的说明）。
   下面 30 条是从原站该页真实 <style> 里逐字抽出来的（脚本 _q23_extract_css.cjs），
   选择器一字未改 —— 页面 DOM 就是照这些选择器写的，改一个字符就命不中。
   ═══════════════════════════════════════════════════════════════════════ */

.classroom_detail.container {
  padding: 40px 15px 60px;
}
.classroom_detail .video_box {
  background: #333333;
  margin: 0 -15px 60px;
  max-width: unset !important;
}
.classroom_detail .video_box .vidoe_info_row {
  padding: 21px 15px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font-size: 16px;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  border-top: 1px solid #4A4A4A;
}
.classroom_detail .video_box [class*='_icon'] {
  width: 24px;
  height: 24px;
  margin-right: 10px;
  margin-left: 30px;
}
.classroom_detail .video_box .info {
  width: 377px;
  font-size: 16px;
  font-family: MicrosoftYaHei;
  font-weight: 400;
  color: white;
  line-height: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.info_date {
  font-size: 16px;
  font-family: MicrosoftYaHei;
  font-weight: 400;
  color: white;
  line-height: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  width: 380px;
  text-indent: 2em;
}
.classroom_detail .video_box .operation {
  color: #bababa;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-left: 17px;
}
.classroom_detail .video_box .operation > * {
  cursor: pointer;
}
.classroom_detail .video_box .copyright {
  font-size: 16px;
  color: #bababa;
}
.classroom_detail .identity {
  width: 820px;
  position: relative;
}
/* 🔴 这条**不能**是绝对定位（2026-09-21 第 34 轮修）：
   原站把它写成 `position:absolute; bottom:0; left:0; right:0`（叠在视频底部），
   但视频是原生 `<video controls>` —— 播放控件正好占底部那一带，
   于是提示条把进度条整条盖住、拖不动。
   实测（`_q34_tip.cjs`）：video 高 492px、tip 高 28px，两者底部完全对齐，重叠 28px。
   现在让它**参与正常流**：视频下方独立一行，宽度自然填满 `.identity`（820px）。
   `.identity` 总高因此 +28px，右侧「相关视频」栏是 flex 拉伸，不受影响。 */
.classroom_detail .identity .tip {
  padding: 7px 15px;
  font-size: 14px;
  font-family: MicrosoftYaHei;
  font-weight: 400;
  color: #e65090;
  line-height: 1;
  background: rgba(51, 51, 51, 0.8);
}
.classroom_detail .identity .video_title {
  padding: 18px 16px;
  font-size: 24px;
  font-weight: bold;
  color: white;
  line-height: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
.classroom_detail .identity .video_body {
  width: 100%;
  height: 492px;
  background: #003a8e;
}
.classroom_detail .video_list_box {
  border-left: 1px solid #4A4A4A;
}
.classroom_detail .video_list_box .title {
  font-size: 18px;
  font-family: MicrosoftYaHei;
  font-weight: bold;
  color: #fffefe;
  padding: 21px 15px;
  margin-bottom: 0;
  line-height: 1;
}
.classroom_detail .video_list_box .video_list {
  width: 380px;
  height: 492px;
  overflow: auto;
  padding: 0 15px;
}
.classroom_detail .video_list_box .video_list .item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  border-bottom: 1px solid #4A4A4A;
  padding: 12px 0;
  cursor: pointer;
}
.classroom_detail .video_list_box .video_list .item .image {
  width: 94px;
  height: 70px;
  margin-right: 10px;
  border-radius: 4px;
  background-size: cover;
  overflow: hidden;
  background-repeat: no-repeat;
  background-position: center;
}
.classroom_detail .video_list_box .video_list .item .ellipsis_row_2 {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  font-size: 14px;
  font-weight: 400;
  color: #FFFFFF;
  line-height: 24px;
  margin-top: -5px;
}
.classroom_detail .video_list_box .video_list .item .info_row {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin-top: 15px;
  font-size: 13px;
  font-family: SourceHanSansCN;
  color: #999999;
  line-height: 1;
}
.classroom_detail .video_list_box .video_list .item .info_row .cost {
  font-size: 13px;
  font-family: Arial;
  font-weight: 400;
  color: #e65090;
}
.classroom_detail .tag {
  width: 140px;
  height: 40px;
  line-height: 40px;
  margin-bottom: 30px;
  text-align: center;
  background: #F1F2F5;
  border-radius: 4px;
  font-size: 16px;
  font-family: MicrosoftYaHeiLight;
  font-weight: bold;
  color: #2E3F76;
  cursor: pointer;
}
.classroom_detail .path_header {
  margin-bottom: 23px;
}
.classroom_detail .search_box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-bottom: 62px;
}
.classroom_detail .right_path {
  margin-left: 71px;
  width: 350px;
}
.classroom_detail .title {
  font-size: 24px;
  font-family: MicrosoftYaHei;
  font-weight: bold;
  color: #333333;
  line-height: 36px;
  margin-bottom: 33px;
}
.classroom_detail .tip {
  font-size: 14px;
  font-family: MicrosoftYaHei;
  font-weight: 400;
  color: #828aa7;
}
.classroom_detail .line {
  margin: 19px 0 50px;
  border-top: 1px solid #EDF1F9;
}
.classroom_detail .content {
  font-size: 14px;
  font-family: MicrosoftYaHei;
  font-weight: 400;
  color: #333333;
  line-height: 30px;
  width: 749px;
}
.classroom_detail .content img, .classroom_detail .content video {
    max-width: 100% !important;
}


/* ===== 大讲堂 · 顶部标签栏（.tags_row，第 63 条补） =====
   这 13 条是从原站 _capture/dom/classroom.html 的 <style> 里逐字抄出来的，
   连 [data-v-41760ca1] 都原样保留 —— 全部选择器都挂在这个作用域属性上，
   而整站只有大讲堂的标签栏带这个属性，因此不会波及任何其他页面。
   图标路径改成站内副本（原站是 /images/icon/cart_line.png）。 */
.tags_row[data-v-41760ca1] {max-width:unset!important;position:relative;z-index:3;}
/* ↑ margin:0 是**必须显式写**的：学组页的外层容器是 .consult_block_detail，
   而 site-extra.css 里那条「学术资讯详情页」规则 .consult_block_detail .tag 也命中本组件，
   它带 margin-bottom:30px（为 140×40 的标签列表写的）→ 不写这一句，标签栏高度
   会从 30px 变成 60px（首页 30 / 学组页 60，两边不一致）。
   优先级同是 0,2,0，靠「后出现的赢」压住；.more_section .tag（0,3,0）仍然压得住本行。 */
.tag[data-v-41760ca1] {position:relative;z-index:2;cursor:pointer;margin:0;border-radius:4px;box-sizing:border-box;min-width:74px;width:auto;height:30px;line-height:30px;text-align:center;padding:0 10px;background:#F1F2F5;font-size:14px;font-weight:bold;color:#2e3f76;}
.tag.active[data-v-41760ca1], .active .tag[data-v-41760ca1] {background:#046FD6!important;color:#fff!important;}
.show_more[data-v-41760ca1] {float:left;background:transparent;cursor:pointer;padding:0;font-size:14px;font-weight:bold;color:#b8bfd5;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end;}
.show_more.active[data-v-41760ca1] {-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;}
.line_cart[data-v-41760ca1] {display:inline-block;width:6px;height:16px;background:url("/replica-csg/img/adc4c3f13001_cart_line.png") no-repeat center transparent;margin-right:12px;}
.line_cart.up[data-v-41760ca1] {-webkit-transform:rotate(180deg);transform:rotate(180deg);}
.more_section[data-v-41760ca1] {position:absolute;width:100%;z-index:1;padding:12px 0;top:45px;left:0;background:white;border:1px solid #d9ddea;box-shadow:0px 0px 6px 0px rgba(46,118,63,.35);}
.more_section > div[data-v-41760ca1] {margin:0 -6px;max-width:unset!important;}
.more_section .cart_top[data-v-41760ca1] {position:absolute;bottom:100%;right:31px;width:0;height:0;border-left:6px solid transparent;border-right:6px solid transparent;border-bottom:10px solid #fff;}
.more_section .cart_top[data-v-41760ca1]::after {content:"";display:block;width:0;height:0;border-left:6px solid transparent;border-right:6px solid transparent;border-bottom:8px solid rgba(46,118,63,.35);position:absolute;z-index:-1;left:-6px;top:-2px;-webkit-filter:blur(4px);filter:blur(4px);}
.more_section .tag[data-v-41760ca1] {float:left;margin:8px 12px;background:transparent;}
.tags_back[data-v-41760ca1] {width:100%;height:100vh;position:fixed;left:0;top:0;background:#ffffff00;z-index:0;}

/* 上面那两条 `margin:0` / 本条，治的是**同一个污染源**的第二个受害者：
   学组页的筛选标签（排序 / 积分）。筛选标签由 site.css 里 0,3,0 的
   `.classroom_category .filter_box .tag` 定尺寸（赢下 height/width），
   但那条规则**没有声明 margin-bottom** → 于是 0,2,0 的
   `.consult_block_detail .tag`（「学术资讯详情页」那套 140×40 标签列表的规则，
   见本文件前面的 consult 段）的 margin-bottom:30px 漏了进来，
   筛选栏高度从 80px 变成 180px。
   原站实测口径（_q24_cmp_group.js，原站 #/classroom_block/detail/24）：
     firstTag = {h:30, w:74, mb:0px, ml:25px, fs:14px, lh:30px}，filter_box 高 80
   这里显式归零，按原站钉死。 */
.classroom_category .filter_box .tag {margin-bottom:0;}

/* 第三条：筛选栏自己的 padding-top。
   `.classroom_category .filter_box {padding-top:40px}` 来自 classroom.html（**大讲堂首页**
   那份 CSS，文件 site-replica/assets/css/classroom.css）；而原站
   classroom_block_24.html（**热门专题详情**，学组页的版式来源）里**根本没有这条规则**
   —— 实测它的 filter_box padding-top = 0（见 _q24_cmp_group.js）。
   合并成一份 site.css 之后首页那条漏了进来，学组页的筛选栏就平白多了 40px。
   这里按 block-detail 的口径归零。
   （顺带：原站自己在 classroom_block_24.html 里也写了
     `.classroom_category .filter_box .tag {margin-bottom: 0px !important; ...}`
     —— 与我们上一行做的事一字不差，同样是为了压掉宿主那条 140×40 标签规则的 margin。） */
.classroom_category .filter_box {padding-top:0;}

/* 学组页顶部那条标签栏是我们加的（原站这一页没有），与筛选行之间留 20px。
   20px 不是拍的：原站自己 `.filter_box > div + div {margin-top:20px}` 就是行间距，
   取同一个值，节奏与原站一致。 */
.classroom_category .tags_row {margin-bottom:20px;}

/* 第四条（热门专题页专项复核发现）：网格容器自己的外边距。
   `.classroom_category .video_block_list {overflow:hidden; margin-top:40px}` 与
   `.classroom_category .video_block_list .item {margin:15px !important}` 这两条
   在原站「热门专题详情」页的 CSS 里**都不存在** —— CDP `CSS.getMatchedStylesForNode`
   实测：原站 `.video_block_list` 命中 0 条规则、`.block.item` 只命中
   `.block_list .item[data-v-43cc139d] {margin:0 5px 0 5px}`。
   它们来自别的页面，合并成一份 site.css 后串到了大讲堂列表页上，后果是
   首卡比原站低 55px（容器 +40、卡片 +15），整块网格比原站矮一头。
   归零后 `.block_list` 自己的 `margin:24px` 会照原站那样向上折叠到
   `.video_block_list` 外面，网格起始位置与原站一致。
   ⚠️ `.item` 必须带 !important：宿主那条原文就带，只能靠「同为 !important
      且更靠后」取胜（site-extra.css 在 site.css 之后加载）。 */
.classroom_category .video_block_list {margin-top:0; overflow:visible;}
.classroom_category .video_block_list .item {margin-top:0 !important; margin-bottom:0 !important;}

/* ═══════════════════════════════════════════════════════════════════════════
   【积分 / 评论 / 收藏】区块（2026-09-21 · v0.40.0）

   来源：原站「个人中心」那几个异步 chunk（29/34/35/41）里内嵌的 scoped CSS，
   已原样导出在 `中华消化网妇科/_capture/origin_css/`。这一整段是**逐字搬过来**的，
   只改了两处、各有注释说明，别"顺手优化"。

   为什么保留 `[data-v-xxxx]` 作用域属性：
     原站这些规则都带 scoped 后缀（Vue 给组件内每个元素加的属性）。
     我们把同样的属性写进自己的 DOM，规则就能**原样生效且特异性不变**；
     去掉后缀会让 `.personal_base.container` 掉到和 site.css 的 `.container`
     同一档，只能靠"谁在后面谁生效"取胜 —— 能跑，但下次谁往 site.css 里再加一条
     `.container` 就又翻车了。带上属性最稳。
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── ① 个人中心外壳（`.personal_base`，原 chunk 41 / personal_layout.css 501c8196）──
   左栏 230px 菜单 + 右栏自适应内容，两块白底 + 同一套阴影。 */
.personal_base.container[data-v-501c8196] {
  background: unset;
  padding: 40px 0;
}
.personal_base .left_nav[data-v-501c8196] {
  width: 230px;
  /* ⚠️ 定宽菜单必须拒绝收缩。少了这一条，右栏一旦出现超宽元素
     （下面「①-补」那次 `.csg-auth-wrap` 事故就是这么发生的），
     flex 会把收缩压力全压在左栏，230px 的菜单被压成「一个汉字宽」的竖排。 */
  flex-shrink: 0;
  background: white;
  box-shadow: 0px 0px 6px 0px rgba(158, 172, 216, 0.35);
  /* #54 全站白容器圆角统一：4px → 10px（口径见 site.css 末尾 #54 段） */
  border-radius: 10px;
  margin-right: 30px;
}
/* ⚠️ 改动点 1：原站是 `.nav_item.router-link-active`（Vue Router 自动加的类）。
   我们不用 vue-router，改成自己的 `.nav_item.active`，其余一字不改。 */
.personal_base .left_nav .nav_item[data-v-501c8196] {
  display: block;
  text-decoration: unset;
  position: relative;
  height: 60px;
  line-height: 60px;
  font-size: 16px;
  font-family: MicrosoftYaHei;
  font-weight: 400;
  color: #2e3f76;
  text-align: center;
  cursor: pointer;
}
.personal_base .left_nav .nav_item.active[data-v-501c8196] {
  background: #edf1f9;
  color: #046fd6;
}
.personal_base .content[data-v-501c8196] {
  background: #fff;
  flex: 1;
  /* 允许右栏收缩（默认 min-width:auto 会让它拒绝窄于自身内容）。 */
  min-width: 0;
  padding: 39px 60px;
  box-shadow: 0px 0px 6px 0px rgba(158, 172, 216, 0.35);
  /* #54：这张卡原先**没有圆角**（直角），统一到 10px。
     它和左栏 .left_nav 是「两块白底 + 同一套阴影」的配套卡，
     只圆一个会很怪 —— 所以两处必须一起改。 */
  border-radius: 10px;
}

/* ── ①-补 个人资料面板的外壳降级（2026-09-21 第 33 轮修）
   —— `.csg-auth-wrap` 是**登录/注册整页**的容器，自带固定 `width: 1200px`；
      ProfilePanel 复用了它，于是塞进只有 ~940px 宽的右栏后：
        content 的 min-width:auto → 撑到 1200
        content 的 flex-basis 又是 0% → 收缩权重为 0，一点不缩
        ⇒ 收缩压力 100% 落到左栏，230px 菜单被压成 16px（见 `_q33_layout.cjs` 实测）
      这里把它降级成「填满父容器」的普通块：宽度交给外层 `.content` 的 padding 管，
      内外两层 padding 会叠成 99px/120px 的大留白，所以一并归零。
      用 3 个 class 命中，特异性天然高于 auth.css 里的 `.csg-auth-wrap` 单类，
      加载顺序换了也不会失手。 */
.personal_base .content .csg-auth-wrap {
  width: 100%;
  min-height: 0;
  padding: 0;
}

/* ── ② 积分获取页（原 chunk 29 / personal_points.css 773a0768）── */
.personal_points .way_row[data-v-773a0768] {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 40px 0;
  border-bottom: 1px solid #E8EFF7;
}
.personal_points .way_row > div[data-v-773a0768]:first-child {
  margin-right: 20px;
}
.personal_points .way_row .title[data-v-773a0768] {
  font-size: 18px;
  line-height: 1;
  font-family: MicrosoftYaHei;
  font-weight: bold;
  color: #333333;
  margin-bottom: 27px;
}
.personal_points .way_row .content[data-v-773a0768] {
  font-size: 14px;
  line-height: 1;
  font-weight: 400;
  color: #666666;
}
.personal_points .way_row .content .tip[data-v-773a0768] {
  color: #e65090;
}
.personal_points .way_row .btn[data-v-773a0768] {
  width: 120px;
  height: 40px;
  line-height: 40px;
  text-align: center;
  background: #F1F2F5;
  border-radius: 4px;
  font-size: 16px;
  font-family: MicrosoftYaHeiLight;
  font-weight: bold;
  color: #046FD6;
  border: 0px none;
  outline: none;
  cursor: pointer;
  padding: 0;
}
.personal_points .way_row .btn[data-v-773a0768]:disabled {
  color: #8893b5;
  cursor: default;
}
.personal_points .success_tip[data-v-773a0768] {
  position: absolute;
  top: 152px;
  right: 300px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 222px;
  height: 56px;
  background: #F1F2F5;
  border: 1px solid #d9ddea;
  box-shadow: 0px 0px 6px 0px rgba(158, 216, 172, 0.35);
  border-radius: 10px;
  font-size: 16px;
  font-family: MicrosoftYaHei;
  font-weight: 400;
  color: #046fd6;
}
.personal_points .success_tip .success_round_blue_icon[data-v-773a0768] {
  margin-left: 10px;
}

/* ── ③ 积分记录页（原 chunk 34 / personal_log.css 6cc7318f）── */
.points_log .log_row[data-v-6cc7318f] {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 32px 0;
  font-size: 15px;
  font-family: MicrosoftYaHeiLight;
  font-weight: 400;
  color: #666666;
  border-bottom: 1px solid #E8EFF7;
}
.points_log .log_row .score[data-v-6cc7318f] {
  font-size: 16px;
  font-weight: bold;
  color: #8893b5;
}

/* ── ④ 我的收藏页（原 chunk 35 / personal_collect.css c7390a16）── */
.personal_collect.collect_list[data-v-c7390a16] {
  position: relative;
}
.personal_collect .collect_item[data-v-c7390a16] {
  display: flex;
  justify-content: flex-start;
  align-items: stretch;
  border-bottom: 1px solid #e9eff7;
  padding: 16px 0;
  cursor: pointer;
}
.personal_collect .collect_item .title[data-v-c7390a16] {
  color: #333333;
  margin-bottom: 24px;
  font-size: 20px;
  line-height: 1;
  font-weight: 400;
}
.personal_collect .collect_item .desc[data-v-c7390a16] {
  font-size: 14px;
  font-weight: 400;
  color: #999;
  margin-bottom: 27px;
  line-height: 18px;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
}
.personal_collect .collect_item .tip[data-v-c7390a16] {
  font-size: 14px;
  font-weight: 400;
  color: #999;
}
.personal_collect .collect_item .image img[data-v-c7390a16] {
  width: 200px;
  height: 150px;
  border-radius: 4px;
  margin-right: 20px;
}
.personal_collect .success_tip[data-v-c7390a16] {
  position: absolute;
  top: 125px;
  right: 300px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 222px;
  height: 56px;
  background: #F1F2F5;
  border: 1px solid #d9ddea;
  box-shadow: 0px 0px 6px 0px rgba(158, 216, 172, 0.35);
  border-radius: 10px;
  font-size: 16px;
  font-family: MicrosoftYaHei;
  font-weight: 400;
  color: #f2b101;
}
.personal_collect .success_tip .success_round_icon[data-v-c7390a16] {
  margin-left: 10px;
}
/* ⚠️ 改动点 2：原站 CSS 里写的是 `.atricle_content`（把 article 拼错了），
   而 DOM 里实际用的类是 `collect_content` —— 那条规则在原站是**死代码**，
   于是收藏条目的「作者 / 来源 / 时间」那行贴在摘要下面、没有沉到条目底部。
   这里把原站那条规则的声明原封不动改挂到真实类名上，把设计意图补回来
   （图片固定 150px 高、条目 align-items:stretch，本来就是为了让那行沉底）。 */
.personal_collect .collect_item .collect_content[data-v-c7390a16] {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 6px 0 9px;
}

/* ── ⑤ 积分获取页顶部「注册即送 2000」说明条（原站没有，我们自己加）──
   用户拍板「三张卡 + 注册说明」，所以注册这一项不做成可点击的行，只在页顶讲清。 */
.csg-points-note {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px 24px;
  margin-bottom: 8px;
  background: #F1F2F5;
  border: 1px solid #d9ddea;
  border-radius: 6px;
  font-size: 15px;
  color: #2e3f76;
}
.csg-points-note .balance {
  font-size: 20px;
  font-weight: bold;
  color: #046fd6;
}
.csg-points-note .balance em {
  font-style: normal;
  font-size: 14px;
  font-weight: 400;
  color: #8893b5;
  margin-right: 10px;
}

/* ── ⑥ 大讲堂视频的「积分锁」遮罩（原站没有）──
   原站付费视频进页面直接播、扣分挂在后端接口上，界面上看不到"要花多少积分"。
   我们按用户要求做成**明确的三态遮罩**：未登录 / 积分够(可点解锁) / 积分不够。
   按钮样式沿用页面已有的蓝色按钮观感，这里只负责定位与文案排版。 */
.csg-lock {
  width: 100%;
  min-height: 420px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: #F1F2F5;
  border: 1px solid #d9ddea;
  border-radius: 4px;
  box-sizing: border-box;
}
.csg-lock-title {
  font-size: 20px;
  font-weight: bold;
  color: #2e3f76;
  margin-bottom: 16px;
}
.csg-lock-sub {
  font-size: 14px;
  color: #8893b5;
  margin-bottom: 30px;
  text-align: center;
  line-height: 22px;
}
.csg-lock-btn {
  min-width: 160px;
  height: 44px;
  line-height: 44px;
  padding: 0 28px;
  text-align: center;
  background: #046fd6;
  border: 0 none;
  border-radius: 4px;
  font-size: 16px;
  font-weight: bold;
  color: #fff;
  cursor: pointer;
}
.csg-lock-btn:disabled {
  background: #a8bfdc;
  cursor: default;
}
.csg-lock-btn.ghost {
  background: #F1F2F5;
  color: #046fd6;
}

/* ── ⑦ 轻量提示条（我们的交互反馈，原站没有）──
   评论成功 / 收藏成功 / 积分不足 这类一次性结果统一用它，不弹 alert。 */
.csg-toast {
  position: fixed;
  left: 50%;
  top: 40px;
  transform: translateX(-50%) translateY(-16px);
  z-index: 9999;
  max-width: 80vw;
  padding: 12px 24px;
  background: #046fd6;
  border-radius: 4px;
  box-shadow: 0 4px 16px rgba(46, 63, 118, 0.25);
  font-family: MicrosoftYaHei;
  font-size: 14px;
  color: #fff;
  opacity: 0;
  transition: opacity 0.25s, transform 0.25s;
  pointer-events: none;
}
.csg-toast.show {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}
.csg-toast.err {
  background: #e65090;
}

/* ══════════════════════════════════════════════════════════════════════════
   页脚「底部链接」三页 —— 版权声明 / 联系我们 / 网站投稿（2026-09-21 第 38 轮）
   路由 /csg/bottom/{copyright|contact|submission}，内容见 src/lib/csg/bottom-links.ts

   这几条是从原站**实测**出来的（CDP `CSS.getMatchedStylesForNode` 报的
   matchedCSSRules），不是照感觉写的。原站选择器带 scoped 属性 [data-v-18cd555e]，
   所以 TS 那边给每个元素都挂了同名属性 —— 属性必须落在**目标元素自己**身上，
   漏一个那条规则就整条不命中（这个坑第 36 轮在收藏页栽过一次）。

   布局：外层 = .container（1200px 定宽）.flex_justify_top（flex + space-between）
         左 230px 导航卡 + margin-right 30px + 右 820px 正文卡，外层左右各 60px 内边距。
   ══════════════════════════════════════════════════════════════════════════ */
.bottom_link.container[data-v-18cd555e] {
  background: unset;
  padding: 40px 60px;
}
.bottom_link .left_nav[data-v-18cd555e] {
  width: 230px;
  /* 🔴 flex-shrink:0 不能省（第 33 轮在个人中心踩过同款）：定宽栏在 flex 行里默认
     参与收缩，窗口一窄就把 230px 的菜单压成「单字一列」，看着像乱码。
     原站没写这条 —— 它靠外层 .container 的 min-width:1200px 顶着，这里补上更稳。 */
  flex-shrink: 0;
  background: white;
  box-shadow: 0 0 6px 0 rgba(158, 216, 172, 0.35);
  /* #54 全站白容器圆角统一：4px → 10px */
  border-radius: 10px;
  margin-right: 30px;
}
.bottom_link .item[data-v-18cd555e] {
  height: 60px;
  line-height: 60px;
  font-size: 16px;
  font-family: MicrosoftYaHei;
  font-weight: 400;
  color: #2e3f76;
  text-align: center;
  cursor: pointer;
}
.bottom_link .item.active[data-v-18cd555e] {
  background: #edf1f9;
  color: #046fd6;
  cursor: default;
}
.bottom_link .content[data-v-18cd555e] {
  background: #fff;
  flex: 1;
  /* 同上：flex 子项给 min-width:0，长英文/长数字才不会把卡片顶宽 */
  min-width: 0;
  padding: 39px 60px;
  /* #54：原先没有圆角（直角），统一到 10px —— 与左栏 .left_nav 配套。 */
  border-radius: 10px;
}
/* 正文段落。原站是 ueditor 产物 —— 每个 <p> 带内联 line-height:1.75em、
   每个 <span> 带 font-size:14px，还混着 rgb(90,90,90) 这类颜色。
   这里收成一条规则：视觉一致，以后改文案不必跟内联样式较劲。
   ⚠️ 选择器把属性挂在 .content 上、`p` 作为**后代**（不是 `p[data-v-…]`）——
      正文那些 <p> 没挂作用域属性，写成后者会一条都命不中。 */
.bottom_link .content[data-v-18cd555e] p {
  font-size: 14px;
  line-height: 1.75;
  color: #333;
  margin: 0 0 10px;
}
.bottom_link .content[data-v-18cd555e] strong {
  font-weight: 700;
  color: #333;
}

/* ── 「联系我们」里的地图容器 ──
   先用一张**不需要任何 key** 的位置卡片占位；contact-map.js 拿到 key 之后把它换成
   腾讯地图。容器必须给定高度 —— 腾讯地图 GL 在高度为 0 的容器里不会渲染。
   高度 344px 取自原站那张百度地图 iframe（534×344）。 */
.csg-map {
  width: 100%;
  height: 344px;
  margin: 10px 0 6px;
  border-radius: 4px;
  overflow: hidden;
  background: #f8fafc;
}
.csg-map .csg-map__card {
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 12px;
  border: 1px solid #e9eff7;
  border-radius: 4px;
}
.csg-map .csg-map__pin {
  width: 20px;
  height: 20px;
  border-radius: 50% 50% 50% 0;
  transform: rotate(-45deg);
  background: #046fd6;
}
/* 特异性要压过上面那条 `.bottom_link .content[data-v-…] p` */
.bottom_link .content[data-v-18cd555e] .csg-map__name {
  margin: 0;
  font-size: 14px;
  color: #2e3f76;
}
.csg-map .csg-map__link {
  font-size: 13px;
  color: #046fd6;
  text-decoration: none;
  border: 1px solid #046fd6;
  border-radius: 2px;
  padding: 5px 16px;
  line-height: 1.6;
}
.csg-map .csg-map__link:hover {
  background: #046fd6;
  color: #fff;
}