/* ==========================================================================
   收藏库 v2.0 · 页面级样式（Page Layer）
   --------------------------------------------------------------------------
   只放“页面专属”的组合/定位样式：锁屏、筛选栏下拉、加载态等。
   所有颜色/圆角/间距/字体一律引用 tokens.css 变量；
   可复用组件（按钮/输入框/面板/票根…）一律引用 components.css 的 ck- 类。
   ========================================================================== */

/* ==========================================================================
   1. 密码锁屏（PRD §7：结构沿用 v1.2，按 v2.0 令牌最小适配）
   ========================================================================== */

.lock-screen {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--c-page-bg);
}

.lock-card {
  width: 360px;
  padding: 36px 32px 32px;
  background: var(--c-surface);
  border: 1px solid var(--c-white);
  border-radius: var(--r-2xl);
  box-shadow: 0 16px 40px rgba(45, 50, 57, .08);
  text-align: center;
}

.lock-logo {
  width: 56px; height: 56px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--c-title);
  color: var(--c-surface);
  font: var(--fw-semibold) 26px/1 var(--font);
  border-radius: var(--r-xl);
}

.lock-title {                               /* 锁屏标题 H1：18/600/18（2026-09-21 标题体系定稿；原 20/28） */
  margin: 16px 0 0;
  font: var(--fw-semibold) var(--fs-18)/var(--lh-18) var(--font);
  color: var(--c-title);
}

.lock-sub {
  margin: 6px 0 0;
  font: var(--fw-regular) var(--fs-12)/var(--lh-12) var(--font);
  color: var(--c-text);
}

.lock-form {
  margin-top: 24px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.lock-input {
  width: 100%;
  height: var(--size-ctrl-lg);
  padding: 0 16px;
  border: 1px solid transparent;
  border-radius: var(--r-lg);
  background: var(--c-bg);
  color: var(--c-title);
  font: var(--fw-regular) var(--fs-14)/var(--lh-14) var(--font);
  transition: border-color .12s ease;
}
.lock-input::placeholder { color: var(--c-muted); }
.lock-input:focus { border-color: var(--c-title); }

.lock-submit { width: 100%; }

.lock-error {
  margin: 0;
  font: var(--fw-regular) var(--fs-12)/var(--lh-12) var(--font);
  color: var(--c-danger);
}

/* ==========================================================================
   2. 筛选栏下拉（评分 / 标签 —— 中按钮 + 选项面板组合）
   ========================================================================== */

.pg-dropdown { position: relative; }

.pg-dropdown__panel {
  position: absolute;
  top: calc(100% + var(--sp-2));
  left: 0;
  z-index: 60;
  width: max-content;
  min-width: 138px;
  max-width: 260px;
  max-height: 320px;
  overflow-y: auto;
}

/* 多选选项行（ck-option + ck-check 组合，勾选与文字间距 8） */
.pg-option { cursor: pointer; }
.pg-option__name { min-width: 0; overflow: hidden; text-overflow: ellipsis; }

/* v2.8.1 标签筛选选项补图标（Figma v2.8「多选下拉选项」图标=on）：
   行 32/r8/pad8，多选框到图标 8，图标 16×16 到文案 4；图标与卡片标签同源，
   无配置图标时走问号兜底；「无标签」为纯文字（对应图标=off 变体） */
.pg-option__label {
  display: flex;
  align-items: center;
  gap: 4px;
  min-width: 0;
}
.pg-option__tagicon {
  width: 16px;
  height: 16px;
  flex: none;
  display: block;
  object-fit: contain;
  pointer-events: none;
}

/* v2.6 评分筛选面板切图化（PRD §6，Figma 5:1306）：
   面板 116 宽（pad8 + 内容100 + pad8），单独覆盖 ck-panel 默认 138，不影响标签筛选等其他面板；
   选项行 100×32 步进 36（gap4）；行内 多选框16×16 + 评价切图 60×30（小图档，与卡片同源）；
   触发按钮 label 保留文字「评分（n/5）」（D6） */
.pg-dropdown__panel--grade {
  width: 116px;
  min-width: 116px;
  max-width: 116px;
}
.pg-option--grade {
  width: 100px;
  padding: 0 8px;
  gap: 8px;
}
.pg-option__grade {
  width: 60px;
  height: 30px;
  object-fit: contain;
  display: block;
  pointer-events: none;
}

/* 触发器三角：面板展开时旋转 180°（尖朝上），收起复位 */
.pg-dropdown .ck-icon--triangle { transition: transform .18s ease; }
.pg-dropdown.is-open .ck-icon--triangle { transform: rotate(180deg); }

/* v2.7 搜索框（PRD §2.1）：132×40，复用 .ck-input 口径（pad12 / gap10 / r12 / 底 --c-bg）；
   聚焦态用 :focus-within 着 1px 描边，平时透明占位不产生位移 */
.pg-search {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 132px;
  height: var(--size-ctrl-md);
  padding: 0 12px;
  border: 1px solid transparent;
  border-radius: var(--r-lg);
  background: var(--c-bg);
  transition: border-color .12s ease;
}
.pg-search:focus-within { border-color: var(--c-title); }
.pg-search .ck-icon { color: var(--c-text); }
.pg-search__input {
  flex: 1;
  min-width: 0;
  height: 100%;
  padding: 0;
  border: 0;
  background: none;
  color: var(--c-title);
  caret-color: var(--c-title);
  font: var(--fw-regular) var(--fs-14)/var(--lh-14) var(--font);
}
.pg-search__input::placeholder { color: var(--c-muted); }

/* ==========================================================================
   3. 骨架屏 / 空态
   ========================================================================== */

/* v2.7 骨架屏（PRD §3）：复用真实导航容器与内容网格，只替换叶子节点；
   扫光层覆盖导航 + 内容，1.4s linear 循环，只动 transform */
.ck-stage.is-skeleton { position: relative; }

.pg-sk-bar { display: block; border-radius: 4px; }
/* v2.7.1 验收期：标题占位不再用描边色（过重），统一为深背景色 */
.pg-sk-bar--hover  { background: var(--c-hover); }
.pg-sk-item {                       /* 导航选项行 132×32，条 100×16 左 16 纵向居中 */
  display: flex;
  align-items: center;
  height: var(--size-ctrl-sm);
  padding-left: 16px;
  border-radius: var(--r-sm);
}
.pg-sk-card {                       /* 卡位 136×216，内块 120×208 @8,8 */
  position: relative;
  width: 136px;
  height: 216px;
}
.pg-sk-card > span {
  position: absolute;
  left: 8px; top: 8px;
  width: 120px; height: 208px;
  border-radius: 8px;
  background: var(--c-hover);
}

/* 200ms 防闪（PRD §3.4）：先占位不显形，超时后整体淡入 */
.ck-stage.is-skeleton .pg-sk-bar,
.ck-stage.is-skeleton .pg-sk-item,
.ck-stage.is-skeleton .pg-sk-card,
.ck-stage.is-skeleton .pg-sk-panel { opacity: 0; transition: opacity .18s ease; }
.ck-stage.is-sk-shown .pg-sk-bar,
.ck-stage.is-sk-shown .pg-sk-item,
.ck-stage.is-sk-shown .pg-sk-card,
.ck-stage.is-sk-shown .pg-sk-panel { opacity: 1; }

.pg-sk-shine {                      /* 扫光层：整块骨架区上覆盖一条 240 宽白渐变带 */
  position: absolute;
  inset: 0;
  z-index: 8;
  overflow: hidden;
  pointer-events: none;
  opacity: 0;
  transition: opacity .18s ease;
}
.ck-stage.is-sk-shown .pg-sk-shine { opacity: 1; }
.pg-sk-shine::before {
  content: "";
  position: absolute;
  top: 0; bottom: 0; left: -240px;
  width: 240px;
  background: linear-gradient(100deg, transparent 0%, var(--c-white) 50%, transparent 100%);
  opacity: .55;
  animation: pg-sk-sweep 1.4s linear infinite;
}
@keyframes pg-sk-sweep {
  from { transform: translateX(0); }
  to   { transform: translateX(calc(100vw + 240px)); }
}
@media (prefers-reduced-motion: reduce) {
  .pg-sk-shine { display: none; }
}

.sub-empty {
  padding: 18px 0 6px;
  font: var(--fw-regular) var(--fs-13)/var(--lh-13) var(--font);
  color: var(--c-muted);
}

/* ==========================================================================
   4. 骨架收尾（顶栏收起导航后的右区自适应等）
   ========================================================================== */

/* v2.8.1 导航收起：宽度 160→0 + 内边距收拢 + 淡出，负外边距抵掉 24 间距，右区随之铺满；
   动画结束才 visibility:hidden（避免 Tab 聚焦到不可见的选项），展开时立即可见 */
.ck-stage.nav-collapsed .ck-sidenav {
  width: 0;
  padding-left: 0;
  padding-right: 0;
  margin-right: calc(-1 * var(--layout-gap));
  opacity: 0;
  pointer-events: none;
  visibility: hidden;
  transition: width .22s var(--ease-modal-in),
              padding .22s var(--ease-modal-in),
              margin-right .22s var(--ease-modal-in),
              opacity .16s ease,
              visibility 0s linear .22s;
}

/* v2.8.1 筛选栏收起：高度 40→0 + 淡出，抵掉与滚动区的 16 间距（下拉面板靠透明度隐藏，不裁切） */
.ck-filterbar.is-collapsed {
  height: 0;
  margin-bottom: calc(-1 * var(--sp-6));
  opacity: 0;
  pointer-events: none;
  visibility: hidden;
  transition: height .2s var(--ease-modal-in),
              margin-bottom .2s var(--ease-modal-in),
              opacity .14s ease,
              visibility 0s linear .2s;
}

/* v2.8.1：减少动态效果时直接切换；必须写在本节之后，才能覆盖上面收起态的 transition */
@media (prefers-reduced-motion: reduce) {
  .ck-stage.nav-collapsed .ck-sidenav,
  .ck-filterbar.is-collapsed { transition: none; }
}

/* ==========================================================================
   5. 弹窗内表单组合（dlg-：详情 / 新增编辑 / 管理弹窗的页面级拼装）
   颜色/字体/圆角一律引用 tokens；可复用件全部来自 components.css
   ========================================================================== */

/* 字段组：label + 输入框 + 帮助文字（间距 12） */
.dlg-field { display: flex; flex-direction: column; gap: 12px; }
.dlg-help a { color: var(--c-title); text-decoration: underline; }

/* 错误提示（12/400 #E5444C） */
.dlg-error {
  font: var(--fw-regular) var(--fs-12)/var(--lh-12) var(--font);
  color: var(--c-danger);
}

/* footer 左侧状态文字（测试连接结果等） */
.dlg-status {
  margin-right: auto;
  font: var(--fw-regular) var(--fs-12)/var(--lh-12) var(--font);
  color: var(--c-muted);
}

/* ---------- 详情弹窗（653：左海报槽 + 右信息列） ---------- */
.dlg-detail__name {
  font: var(--fw-semibold) var(--fs-16)/var(--lh-16) var(--font);
  color: var(--c-title);
  word-break: break-all;
}
.dlg-detail__row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.dlg-detail__status {                        /* 状态小标签：灰底胶囊 */
  padding: 4px 10px;
  border-radius: var(--r-md);
  background: var(--c-bg);
  font: var(--fw-regular) var(--fs-12)/var(--lh-12) var(--font);
  color: var(--c-text);
}
.dlg-detail__sec { display: flex; flex-direction: column; gap: 8px; }
.dlg-detail__tags { display: flex; flex-wrap: wrap; gap: 8px; }
.dlg-detail__notes {
  font: var(--fw-regular) var(--fs-14)/20px var(--font);
  color: var(--c-title);
  white-space: pre-wrap;
  word-break: break-all;
}
.dlg-tag-chip { cursor: default; }            /* span 复用小按钮视觉做标签展示 */

/* ---------- 新增/编辑弹窗：名称 + 搜索浮层 ---------- */
.dlg-name-wrap { position: relative; display: flex; flex-direction: column; gap: 4px; }
.dlg-search-pop {
  position: absolute;
  top: calc(100% + 4px);
  left: 0; right: 0;
  z-index: 10;
  width: auto;                                 /* 覆盖 ck-panel 默认 138 宽，撑满输入区 */
  max-height: 320px;
  overflow-y: auto;
}
.dlg-search-group { display: flex; flex-direction: column; gap: 2px; }
.dlg-search-group + .dlg-search-group {             /* 多数据源分组：虚线分割 */
  margin-top: 4px;
  padding-top: 6px;
  border-top: 1px dashed var(--c-stroke);
}
.dlg-search-group-title {
  padding: 6px 8px 2px;
  font: var(--fw-semibold) var(--fs-12)/var(--lh-12) var(--font);
  color: var(--c-muted);
}
.dlg-search-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 8px;
  border: 0;
  border-radius: var(--r-md);
  background: none;
  cursor: pointer;
  text-align: left;
}
/* .dlg-search-item:hover → 见文件末触屏 hover 闸门 */
.dlg-search-thumb {                           /* 缩略图 40x56 r4：v2.8.0 加载态统一为浅背景 + 转圈 */
  position: relative;
  width: 40px; height: 56px;
  flex: none;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 4px;
  overflow: hidden;
  background: var(--c-bg);
}
.dlg-search-thumb img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; }
.dlg-search-thumb img.is-ok { opacity: 1; }                  /* v2.4.4：加载成功才显示——加载中/失败不绘制 Safari 系统占位（蓝底问号）与裂图闪现，loading 始终可见 */
.dlg-search-thumb img.is-ph { opacity: 1; }                  /* v2.7.1 海报兜底图直显（PRD §2.2） */
.dlg-search-spin {                              /* v2.4.3 列表缩略图加载中 loading：14px 环形转圈，终态隐藏 */
  position: absolute;
  left: 50%; top: 50%;
  width: 14px; height: 14px;
  margin: -7px 0 0 -7px;
  border: 2px solid rgba(45, 50, 57, .18);
  border-top-color: rgba(45, 50, 57, .55);
  border-radius: 50%;
  animation: dlg-search-spin .7s linear infinite;
}
.dlg-search-thumb.is-loaded .dlg-search-spin { display: none; }
@keyframes dlg-search-spin { to { transform: rotate(360deg); } }
.dlg-search-info { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.dlg-search-name {
  font: var(--fw-semibold) var(--fs-14)/var(--lh-14) var(--font);
  color: var(--c-title);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.dlg-search-year {
  font: var(--fw-regular) var(--fs-12)/var(--lh-12) var(--font);
  color: var(--c-muted);
}
.dlg-search-empty {
  padding: 12px 8px;
  font: var(--fw-regular) var(--fs-13)/var(--lh-13) var(--font);
  color: var(--c-muted);
}
.dlg-search-loading {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px 8px;
  font: var(--fw-regular) var(--fs-13)/var(--lh-13) var(--font);
  color: var(--c-muted);
}
.dlg-search-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-top: 4px;
  padding: 8px;
  border-top: 1px solid var(--c-hover);
  font: var(--fw-regular) var(--fs-12)/var(--lh-12) var(--font);
  color: var(--c-muted);
}
.dlg-search-config {
  border: 0;
  background: none;
  padding: 0;
  font: inherit;
  color: var(--c-title);
  text-decoration: underline;
  cursor: pointer;
}

/* ---------- 新增/编辑弹窗：分类下拉 ---------- */
.dlg-cat-wrap { position: relative; }
.dlg-cat-pop {
  position: absolute;
  top: calc(100% + 4px);
  left: 0; right: 0;
  z-index: 10;
  width: auto;                                 /* 撑满触发按钮宽 */
  max-height: 280px;
  overflow-y: auto;
}
.dlg-cat-group { display: flex; flex-direction: column; gap: 4px; }
.dlg-cat-mid {
  padding: 6px 8px 2px;
  font: var(--fw-semibold) var(--fs-12)/var(--lh-12) var(--font);
  color: var(--c-muted);
}

/* ---------- 新增/编辑弹窗：标签多选按钮组 ---------- */
.dlg-tag-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.dlg-tag-chips .ck-btn--outline {                 /* 未选中：虚线描边 + 近白底（与弹窗底同色，融入背景） */
  background: var(--c-surface);
  border: 1px dashed var(--c-stroke);
  box-shadow: none;                              /* 覆盖组件库 inset 实线描边 */
}
.dlg-tag-chips .ck-btn--outline:active,
.dlg-tag-chips .ck-btn--outline.is-press {       /* 补回按压底色（近白底规则同特异性靠后盖住了组件库 :active 背景） */
  background: var(--c-stroke);
}

/* ---------- 编辑标签弹窗：图标上传槽（v2.1） ---------- */
.dlg-tag-row { display: flex; align-items: center; gap: 8px; }
.dlg-tag-row .ck-input { flex: 1; min-width: 0; }
.dlg-tag-icon {                                   /* 40x40 圆角 12 浅底方块（对齐「中按钮·仅图标」规格，PRD v2.1 §2.2） */
  position: relative;
  flex: none;
  width: var(--size-ctrl-md);                     /* 40 */
  height: var(--size-ctrl-md);
  border-radius: var(--r-lg);                     /* 12 */
  background: var(--c-bg);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.dlg-tag-icon > .ck-icon { color: var(--c-subtitle); }   /* 空态加号：16x16 副标题色 */
.dlg-tag-icon > img { width: 24px; height: 24px; object-fit: contain; }   /* 有图：贴纸 24x24 居中（与 16 加号形成大小差） */
.dlg-tag-icon__mask {                             /* 蒙层：仅桌面 hover 显现（见文件末触屏闸门） */
  position: absolute;
  inset: 0;
  border-radius: inherit;                         /* 跟随槽圆角 */
  background: rgba(0, 0, 0, .35);
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  pointer-events: none;                           /* 默认穿透：点击落到槽本体（触屏无删除入口） */
}
.dlg-tag-icon__mask .ck-icon { pointer-events: none; color: #fff; }

/* ---------- 管理弹窗（分类 360 / 标签 514）：内容区 414 高内部滚动 ---------- */
.dlg-mg-body { height: 414px; overflow-y: auto; }
.dlg-mg-body > * { flex: none; }               /* 内容超出时滚动，禁止 flex 压缩行高 */
.dlg-mg-body--wide { gap: 16px; }              /* 标签管理（宽）组间距 16 */

.dlg-mg-group { display: flex; flex-direction: column; gap: 8px; }
.dlg-mg-head { display: flex; align-items: center; gap: 6px; height: var(--size-ctrl-sm); min-width: 0; border-radius: var(--r-md); }
.dlg-mg-head[draggable] { cursor: grab; }
.dlg-mg-arrow { color: var(--c-subtitle); transform: rotate(-90deg); transition: transform .15s ease; }   /* 折叠：尖朝右 */
.dlg-mg-arrow.is-open { transform: rotate(0deg); }   /* 展开：尖朝下 */
.dlg-mg-mid { font: var(--fw-semibold) var(--fs-16)/24px var(--font); color: var(--c-subtitle); }
.dlg-mg-caticon { width: 24px; height: 24px; object-fit: contain; flex: none; }

/* 行内操作（编辑/删除）：悬停行时浮现，保持画面接近设计稿干净态 */
.dlg-mg-ops {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-left: auto;
  opacity: 0;
  transition: opacity .12s ease;
}
/* .dlg-mg-head:hover .dlg-mg-ops / .ck-tagrow:hover .ck-tagrow__action（悬停浮现）→ 见文件末触屏 hover 闸门 */
.ck-tagrow .ck-tagrow__action { opacity: 0; transition: opacity .12s ease; }
.dlg-mg-op {
  display: inline-flex;
  padding: 4px;
  border: 0;
  background: none;
  color: var(--c-text);
  cursor: pointer;
  border-radius: 4px;
}
/* .dlg-mg-op:hover → 见文件末触屏 hover 闸门 */
.dlg-mg-op .ck-icon { display: block; }

.dlg-mg-subs { display: flex; flex-direction: column; gap: 4px; }
.dlg-mg-sub { cursor: grab; }
/* v2.7 修订：系列行与「添加系列」默认不填充底色（底色由弹窗承载，悬停仍浮现，见文件末闸门） */
.dlg-mg-body:not(.dlg-mg-body--wide) .ck-tagrow { background: none; }
.dlg-mg-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 4px; }
.dlg-mg-addmid { align-self: flex-start; }

/* 拖拽落点标记（v2.7，PRD §6 / Figma 分类管理 10:3493）：
   前后换位：2px 横线（--c-title / 圆角 1 / 与目标行等宽），居中落在 4px 行间隙（top/bottom:-3px），
   不侵占行内容、不推挤布局；
   系列拖入分类：目标分类标题模块高亮（--c-bg 底 + 1px --c-title 描边），
   分类展开时同时在插入位置显示横线（标题 → 首位；列表空白 / 添加系列 → 末位），折叠时仅描边 */
.dlg-mg-sub, .dlg-mg-head, .dlg-mg-add { position: relative; }
.dlg-mg-sub.dlg-drop-before::before, .dlg-mg-head.dlg-drop-before::before,
.dlg-mg-add.dlg-drop-before::before {
  content: "";
  position: absolute;
  left: 0; right: 0; top: -3px;
  height: 2px;
  border-radius: 1px;
  background: var(--c-title);
  pointer-events: none;
}
.dlg-mg-sub.dlg-drop-after::after, .dlg-mg-head.dlg-drop-after::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: -3px;
  height: 2px;
  border-radius: 1px;
  background: var(--c-title);
  pointer-events: none;
}
.dlg-mg-head.dlg-drop-target {
  background: var(--c-bg);
  box-shadow: inset 0 0 0 1px var(--c-title);
}

/* v2.7 拖动中行弱化（PRD §6 / §7.1）：不透明度 .35 + 轻微缩小 */
.dlg-mg-sub.dlg-dragging, .dlg-mg-head.dlg-dragging,
.ck-tagrow.dlg-dragging { opacity: .35; transform: scale(.98); }

/* v2.7 标签拖动落点（PRD §7.1）：2px 竖线贴在目标格左缘/右缘的列间隙；
   首列左缘 / 末列右缘改为内贴边（left/right: 0），避免被滚动容器裁切，保证完整显示 */
.dlg-mg-grid .ck-tagrow { position: relative; cursor: grab; }
.dlg-mg-grid .ck-tagrow.dlg-tag-drop-before::before {
  content: "";
  position: absolute;
  left: -3px; top: 0; bottom: 0;
  width: 2px;
  border-radius: 1px;
  background: var(--c-title);
  pointer-events: none;
}
.dlg-mg-grid .ck-tagrow.dlg-tag-drop-after::after {
  content: "";
  position: absolute;
  right: -3px; top: 0; bottom: 0;
  width: 2px;
  border-radius: 1px;
  background: var(--c-title);
  pointer-events: none;
}
.dlg-mg-grid .ck-tagrow[data-tab]:nth-child(odd).dlg-tag-drop-before::before { left: 0; }
.dlg-mg-grid .ck-tagrow[data-tab]:nth-child(even).dlg-tag-drop-after::after { right: 0; }

/* ---------- 版本信息弹窗（v2.7，PRD §4.2 / Figma 8:3069） ---------- */
/* 正文槽 466×346 内部滚动；条目间距 24，条目内 版本号 16/600/18 + 说明 14/400/16 间距 12 */
.dlg-ver__body {
  display: flex;
  flex-direction: column;
  gap: var(--sp-7);                              /* 24 */
  width: 466px;
  max-height: 346px;
  overflow-y: auto;
}
.dlg-ver__item { display: flex; flex-direction: column; gap: var(--sp-5); }   /* 12 */
.dlg-ver__no {
  font: var(--fw-semibold) var(--fs-16)/var(--lh-16) var(--font);
  color: var(--c-title);
}
.dlg-ver__desc {
  display: flex;
  flex-direction: column;
  gap: 8px;                                      /* v2.7 修订：列表行距 8 */
  font: var(--fw-regular) var(--fs-14)/var(--lh-14) var(--font);
  color: var(--c-text);
}
.dlg-ver__line {                                 /* v2.7 修订：每条改动一行，行首圆点 */
  position: relative;
  padding-left: 14px;
}
.dlg-ver__line::before {
  content: "";
  position: absolute;
  left: 4px; top: 6px;                           /* 16 行高内垂直居中（4px 圆点） */
  width: 4px; height: 4px;
  border-radius: 50%;
  background: currentColor;
}
.dlg-ver__close {                                /* 单个「关闭」按钮 68×40，居右 */
  width: 68px;
  padding: 0;
  justify-content: center;
}

/* ==========================================================================
   6. 触屏 hover 闸门（PRD §4.9 方案 A，2026-09-21）
   页面级 :hover 仅在「可悬停 + 精确指针」环境生效；触屏不应用 hover，
   粘滞自然消除（组件库部分见 components.css 末尾闸门）。
   ========================================================================== */
@media (hover: hover) and (pointer: fine) {
  .dlg-search-item:hover { background: var(--c-bg); }
  .dlg-mg-head:hover .dlg-mg-ops { opacity: 1; }
  .ck-tagrow:hover .ck-tagrow__action { opacity: 1; }
  .dlg-mg-body:not(.dlg-mg-body--wide) .ck-tagrow:hover { background: var(--c-bg); }   /* 分类弹窗行默认无底色，悬停仍浮现 */
  .dlg-mg-op:hover { color: var(--c-title); background: var(--c-bg); }
  .dlg-tag-chips .ck-btn--outline:hover { background: var(--c-hover); }   /* 补回原 hover 背景（近白底规则盖住了组件库 hover，需同等以上特异性重声明） */
  .dlg-tag-icon.has-img:hover .dlg-tag-icon__mask { opacity: 1; }         /* 有图 hover 出蒙层 */
  .dlg-tag-icon.has-img:hover .dlg-tag-icon__mask .ck-icon { pointer-events: auto; }   /* 重置图标可点（其余区域仍穿透=替换） */
}