/* ============================================================================
   heronk-pc-daynight —— 昼夜模式（电脑端）样式
   由宿主在装配 pc.global.body_end_html 槽时随 <head> 下发到每一个 PC 页面。

   分层：
   1. 引擎基座（背景图层 / 配色方案 / 滚动条 / 选区）
   2. 头部按钮 + 风格面板（hd-*）
   3. 全站基础跟随（scope_base）
   4. 顶部导航特效（data-hd-nav）
   5. 卡片特效（data-hd-card）
   6. 全站毛玻璃（data-hd-glass，仅背景图开启时由引擎点亮）
   7. 跟随范围：长文 / 动态 / 我的收藏 / 浏览历史 / 签到中心 / 页脚 / 关于作者
      （映射属性一律 !important：真实站点样式表顺序不可控，硬编码色必须稳赢）
   8. /daynight 设置页（hdn-*）
   ============================================================================ */

/* ------------------------------------------------------------------
   1. 引擎基座
   ------------------------------------------------------------------ */

/* 样式表加载探针：module.js 用 --hd-probe 变量检测本文件是否真的生效，
   未生效时自动按脚本地址补载 module.css（自愈） */
.hd-css-probe { --hd-probe: 1; }

html[data-hd] {
  color-scheme: light;
}
html[data-hd-mode="dark"] {
  color-scheme: dark;
}

html[data-hd] body {
  background: var(--ls-bg, #f6f7f8) !important;
  color: var(--ls-text, #1f2937);
}

/* 背景图层：body::before 固定铺满，body 透明让图透出来；
   叠一层站长可调的暗色遮罩（--hd-bg-dim），保证浅色文字可读 */
html[data-hd-bg="on"] body {
  background: transparent !important;
}
html[data-hd-bg="on"] body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  background-image:
    linear-gradient(rgba(0, 0, 0, var(--hd-bg-dim, 0.25)), rgba(0, 0, 0, var(--hd-bg-dim, 0.25))),
    var(--hd-bg-image, none);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  pointer-events: none;
}

/* 图片处理（后台可选）：压暗 / 去饱和，暗色风格更沉浸 */
html[data-hd-image="dim"] img {
  filter: brightness(0.92);
}
html[data-hd-image="gray"] img {
  filter: grayscale(0.85) contrast(1.05);
}
html[data-hd-mode="dark"] img {
  filter: brightness(0.96);
}
html[data-hd-mode="dark"][data-hd-image="dim"] img {
  filter: brightness(0.88);
}
html[data-hd-mode="dark"][data-hd-image="gray"] img {
  filter: grayscale(0.85) contrast(1.05) brightness(0.92);
}

html[data-hd] ::selection {
  background: rgba(var(--ls-primary-rgb, 59, 130, 246), 0.24);
}

/* 暗色下的滚动条与占位骨架 */
html[data-hd-mode="dark"] ::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.16);
}
html[data-hd-mode="dark"] .ls-sidebar-wrap .widget-skeleton {
  background-color: var(--ls-card-bg, #17181d);
}

/* 暗色下的输入控件 / 分隔线 / 代码块 / 占位文字（scope_base） */
html[data-hd][data-hd-scope-base="on"][data-hd-mode="dark"] input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
html[data-hd][data-hd-scope-base="on"][data-hd-mode="dark"] textarea,
html[data-hd][data-hd-scope-base="on"][data-hd-mode="dark"] select {
  background-color: var(--ls-bg, #0f1115);
  color: var(--ls-text, #e5e7eb);
  border-color: var(--ls-border, #26272e);
}
html[data-hd][data-hd-scope-base="on"][data-hd-mode="dark"] input::placeholder,
html[data-hd][data-hd-scope-base="on"][data-hd-mode="dark"] textarea::placeholder {
  color: var(--ls-text-muted, #6b7280);
}
html[data-hd][data-hd-scope-base="on"][data-hd-mode="dark"] hr {
  border-color: var(--ls-border-light, #26272e);
}
html[data-hd][data-hd-scope-base="on"][data-hd-mode="dark"] pre,
html[data-hd][data-hd-scope-base="on"][data-hd-mode="dark"] code {
  background-color: var(--ls-bg, #0f1115);
  color: var(--ls-text, #e5e7eb);
}
html[data-hd][data-hd-scope-base="on"][data-hd-mode="dark"] blockquote {
  border-left-color: rgba(var(--ls-primary-rgb, 59, 130, 246), 0.5);
  color: var(--ls-text-secondary, #9ca3af);
}
/* 选中/激活态统一主题色 */
html[data-hd][data-hd-scope-base="on"] .ls-tab.active {
  color: var(--ls-primary, #3b82f6);
}
html[data-hd][data-hd-scope-base="on"][data-hd-mode="dark"] option,
html[data-hd][data-hd-scope-base="on"][data-hd-mode="dark"] optgroup {
  background-color: var(--ls-card-bg, #17181d);
  color: var(--ls-text, #e5e7eb);
}
/* 暗色细节批 2：提示 / 弹窗 / 空态 / 标签页 / 表格 / 折叠（2026 轮） */
html[data-hd][data-hd-scope-base="on"][data-hd-mode="dark"] .ls-toast,
html[data-hd][data-hd-scope-base="on"][data-hd-mode="dark"] .ls-dialog,
html[data-hd][data-hd-scope-base="on"][data-hd-mode="dark"] .ls-empty,
html[data-hd][data-hd-scope-base="on"][data-hd-mode="dark"] .ls-empty-page {
  background: var(--ls-card-bg, #17181d) !important;
  color: var(--ls-text, #e5e7eb) !important;
  border-color: var(--ls-border, #26272e) !important;
}
html[data-hd][data-hd-scope-base="on"][data-hd-mode="dark"] .ls-modal-header,
html[data-hd][data-hd-scope-base="on"][data-hd-mode="dark"] .ls-modal-footer,
html[data-hd][data-hd-scope-base="on"][data-hd-mode="dark"] .ls-dialog-footer {
  border-color: var(--ls-border, #26272e) !important;
}
html[data-hd][data-hd-scope-base="on"][data-hd-mode="dark"] .ls-modal-header,
html[data-hd][data-hd-scope-base="on"][data-hd-mode="dark"] .ls-dialog-body,
html[data-hd][data-hd-scope-base="on"][data-hd-mode="dark"] .ls-modal-close,
html[data-hd][data-hd-scope-base="on"][data-hd-mode="dark"] .ls-dialog-close {
  color: var(--ls-text, #e5e7eb) !important;
}
/* 确认 / 取消按钮：主按钮吃主题色，普通按钮吃次级表面 */
html[data-hd][data-hd-scope-base="on"][data-hd-mode="dark"] .ls-dialog-btn {
  background: var(--ls-bg, #0f1115) !important;
  color: var(--ls-text-secondary, #9ca3af) !important;
  border-color: var(--ls-border, #26272e) !important;
}
html[data-hd][data-hd-scope-base="on"][data-hd-mode="dark"] .ls-dialog-btn-primary {
  background: var(--ls-primary, #3b82f6) !important;
  color: #fff !important;
  border-color: transparent !important;
}
html[data-hd][data-hd-scope-base="on"][data-hd-mode="dark"] .ls-empty-tip {
  color: var(--ls-text-muted, #6b7280) !important;
}
html[data-hd][data-hd-scope-base="on"][data-hd-mode="dark"] .ls-tab {
  color: var(--ls-text-secondary, #9ca3af) !important;
}
html[data-hd][data-hd-scope-base="on"][data-hd-mode="dark"] .ls-tab.active {
  color: var(--ls-primary, #3b82f6) !important;
}
html[data-hd][data-hd-scope-base="on"][data-hd-mode="dark"] table {
  border-color: var(--ls-border, #26272e) !important;
}
html[data-hd][data-hd-scope-base="on"][data-hd-mode="dark"] table th,
html[data-hd][data-hd-scope-base="on"][data-hd-mode="dark"] table td {
  border-color: var(--ls-border-light, #26272e) !important;
  color: var(--ls-text, #e5e7eb);
}
/* 暗色下浅色投影改用风格投影，浮层不显脏
   （.ls-float-menu 恢复跟随阴影，v1.1.7 站长要求；背景/边线规则单独控制） */
html[data-hd][data-hd-scope-base="on"][data-hd-mode="dark"] .ls-hd-dropdown,
html[data-hd][data-hd-scope-base="on"][data-hd-mode="dark"] .ls-modal-content,
html[data-hd][data-hd-scope-base="on"][data-hd-mode="dark"] .ls-float-menu {
  box-shadow: var(--hd-shadow, 0 8px 32px rgba(0, 0, 0, 0.45)) !important;
}
/* kbd / details 摘要行 */
html[data-hd][data-hd-scope-base="on"][data-hd-mode="dark"] kbd {
  background: var(--ls-bg, #0f1115);
  color: var(--ls-text, #e5e7eb);
  border-color: var(--ls-border, #26272e);
}
html[data-hd][data-hd-scope-base="on"][data-hd-mode="dark"] details summary {
  color: var(--ls-text, #e5e7eb);
  cursor: pointer;
}
html[data-hd][data-hd-scope-base="on"][data-hd-mode="dark"] details summary:hover {
  color: var(--ls-primary, #3b82f6);
}

/* ------------------------------------------------------------------
   2. 头部按钮 + 风格面板
   ------------------------------------------------------------------ */

.hd-wrap {
  position: relative;
  display: flex;
  align-items: center;
  margin-right: 2px;
}

.hd-btn {
  position: relative;
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  color: var(--ls-text-secondary, #4b5563);
  background: transparent;
  border: none;
  border-radius: var(--ls-radius-md, 8px);
  cursor: pointer;
  transition: background 0.18s ease, color 0.18s ease, transform 0.18s ease;
  overflow: hidden;
}
.hd-btn:hover {
  background: var(--ls-bg-hover, #f1f5f9);
  color: var(--ls-primary, #3b82f6);
  transform: rotate(12deg);
}
.hd-btn .hd-ico {
  position: absolute;
  inset: 0;
  margin: auto;
  width: 20px;
  height: 20px;
  line-height: 20px;
  text-align: center;
  transition: transform 0.35s cubic-bezier(0.34, 1.56, 0.64, 1), opacity 0.2s ease;
}
/* 日间显示月亮（点去夜间），夜间显示太阳 */
html[data-hd-btnmode="light"] .hd-ico-sun { opacity: 0; transform: translateY(18px) rotate(90deg); }
html[data-hd-btnmode="light"] .hd-ico-moon { opacity: 1; transform: none; }
html[data-hd-btnmode="dark"] .hd-ico-sun { opacity: 1; transform: none; }
html[data-hd-btnmode="dark"] .hd-ico-moon { opacity: 0; transform: translateY(-18px) rotate(-90deg); }
html[data-hd-btnmode="dark"] .hd-btn { color: var(--ls-text-primary, #e5e7eb); }
html[data-hd-btnmode="dark"] .hd-btn:hover { color: var(--ls-primary, #3b82f6); }

.hd-panel {
  position: absolute;
  top: calc(100% + 10px);
  right: -6px;
  width: 320px;
  max-width: calc(100vw - 24px);
  background: var(--ls-card-bg, #fff);
  border: 1px solid var(--ls-border-light, #f3f4f6);
  border-radius: 14px;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.18), 0 2px 8px rgba(0, 0, 0, 0.06);
  padding: 14px;
  z-index: 10050;
  transform-origin: top right;
  animation: hd-panel-in 0.18s ease;
}
@keyframes hd-panel-in {
  from { opacity: 0; transform: translateY(-6px) scale(0.98); }
  to { opacity: 1; transform: none; }
}

.hd-panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 2px 10px;
  border-bottom: 1px solid var(--ls-border-light, #f3f4f6);
}
.hd-panel-title {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 14px;
  font-weight: 700;
  color: var(--ls-text, #1f2937);
}
.hd-panel-title i { color: var(--ls-primary, #3b82f6); font-size: 16px; }
.hd-panel-more {
  display: inline-flex;
  align-items: center;
  font-size: 12px;
  color: var(--ls-text-muted, #9ca3af);
  text-decoration: none;
  transition: color 0.15s ease;
}
.hd-panel-more:hover { color: var(--ls-primary, #3b82f6); }

.hd-panel-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  padding: 12px 0 4px;
  max-height: 240px;
  overflow-y: auto;
}
.hd-panel-grid::-webkit-scrollbar { width: 4px; }
.hd-panel-grid::-webkit-scrollbar-thumb { background: rgba(var(--ls-primary-rgb, 59, 130, 246), 0.25); border-radius: 4px; }

/* 面板风格搜索（风格组 >= 6 组时出现） */
.hd-panel-search {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 10px 0 0;
  padding: 0 10px;
  height: 32px;
  border-radius: 8px;
  background: var(--ls-bg, #f6f7f8);
  border: 1px solid var(--ls-border-light, #f3f4f6);
  transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}
.hd-panel-search:focus-within {
  border-color: rgba(var(--ls-primary-rgb, 59, 130, 246), 0.55);
  box-shadow: 0 0 0 3px rgba(var(--ls-primary-rgb, 59, 130, 246), 0.12);
}
.hd-panel-search > i {
  font-size: 14px;
  color: var(--ls-text-muted, #9ca3af);
  flex: 0 0 auto;
  transition: color 0.15s ease;
}
.hd-panel-search:focus-within > i { color: var(--ls-primary, #3b82f6); }
.hd-search-input {
  flex: 1 1 auto;
  min-width: 0;
  height: 100%;
  border: 0;
  outline: 0;
  padding: 0;
  background: transparent;
  font-size: 12.5px;
  color: var(--ls-text, #1f2937);
}
.hd-search-input::placeholder { color: var(--ls-text-muted, #9ca3af); }
.hd-search-count {
  flex: 0 0 auto;
  font-size: 10.5px;
  font-variant-numeric: tabular-nums;
  color: var(--ls-text-muted, #9ca3af);
  background: rgba(var(--ls-primary-rgb, 59, 130, 246), 0.1);
  color: var(--ls-primary, #3b82f6);
  padding: 2px 6px;
  border-radius: 99px;
  line-height: 1.2;
}
.hd-search-clear {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  cursor: pointer;
  color: var(--ls-text-muted, #9ca3af);
  font-size: 14px;
  transition: color 0.15s ease, transform 0.15s ease;
}
.hd-search-clear:hover { color: var(--ls-primary, #3b82f6); transform: scale(1.12); }
.hd-search-empty {
  margin: 10px 0 2px;
  padding: 14px 10px;
  text-align: center;
  font-size: 12px;
  color: var(--ls-text-muted, #9ca3af);
  background: var(--ls-bg, #f6f7f8);
  border: 1px dashed var(--ls-border, #e5e7eb);
  border-radius: 10px;
}
.hd-search-empty i { font-size: 15px; vertical-align: -2px; margin-right: 4px; }
.hd-panel-search[hidden],
.hd-search-count[hidden],
.hd-search-clear[hidden],
.hd-search-empty[hidden] { display: none !important; }
/* .hd-chip 类里有 display:flex，会顶掉 hidden 属性（历史同款坑），显式守卫 */
.hd-chip[hidden] { display: none !important; }

.hd-chip {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  padding: 10px 4px 8px;
  background: var(--ls-bg, #f6f7f8);
  border: 1px solid transparent;
  border-radius: 10px;
  cursor: pointer;
  transition: border-color 0.15s ease, background 0.15s ease, transform 0.15s ease;
}
.hd-chip:hover { transform: translateY(-1px); border-color: rgba(var(--ls-primary-rgb, 59, 130, 246), 0.35); }
.hd-chip.is-on {
  border-color: var(--ls-primary, #3b82f6);
  background: rgba(var(--ls-primary-rgb, 59, 130, 246), 0.08);
}
.hd-chip-color {
  position: relative;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  border: 1px solid rgba(0, 0, 0, 0.08);
  overflow: hidden;
}
.hd-chip-primary {
  position: absolute;
  right: -3px;
  bottom: -3px;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  border: 2px solid var(--ls-card-bg, #fff);
}
/* 风格图标：叠在色圆中心（rendered 时内联 color = 风格主题色） */
.hd-chip-ico {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 15px;
  line-height: 1;
  opacity: 0.92;
}
.hd-chip.is-on .hd-chip-ico { opacity: 1; transform: scale(1.08); transition: transform 0.15s ease; }
.hd-chip-name {
  max-width: 100%;
  font-size: 11px;
  line-height: 1.2;
  color: var(--ls-text-secondary, #4b5563);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.hd-chip.is-on .hd-chip-name { color: var(--ls-primary, #3b82f6); font-weight: 600; }

/* 面板风格块右上角收藏星标 */
.hd-chip-fav {
  position: absolute;
  top: 3px;
  right: 5px;
  line-height: 1;
  font-size: 11px;
  color: var(--ls-border, #e5e7eb);
  opacity: 0;
  transform: scale(0.7);
  transition: opacity 0.15s ease, transform 0.15s ease, color 0.15s ease;
}
.hd-chip { position: relative; }
.hd-chip:hover .hd-chip-fav,
.hd-chip:focus-visible .hd-chip-fav,
.hd-chip-fav.is-on { opacity: 1; transform: scale(1); }
.hd-chip-fav:hover { color: #f59e0b; transform: scale(1.2); }
.hd-chip-fav.is-on { color: #f59e0b; }
.hd-chip.is-on .hd-chip-fav.is-on { color: #f59e0b; }

.hd-panel-sec-title {
  padding: 8px 2px 2px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ls-text-muted, #9ca3af);
}

.hd-panel-opts { padding: 6px 0; }

.hd-switch-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 8px 2px;
  cursor: pointer;
  user-select: none;
}
.hd-switch-row.is-disabled,
.hd-switch-row.is-off-by-settings {
  opacity: 0.5;
  cursor: not-allowed;
}
.hd-switch-label {
  display: flex;
  flex-direction: column;
  gap: 1px;
  font-size: 13px;
  color: var(--ls-text, #1f2937);
}
.hd-switch-desc {
  font-size: 11px;
  font-style: normal;
  color: var(--ls-text-muted, #9ca3af);
}
.hd-switch-input {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
}
.hd-switch-ui {
  position: relative;
  flex-shrink: 0;
  width: 38px;
  height: 21px;
  border-radius: 999px;
  background: var(--ls-border, #e5e7eb);
  transition: background 0.2s ease;
}
.hd-switch-ui::after {
  content: "";
  position: absolute;
  top: 2px;
  left: 2px;
  width: 17px;
  height: 17px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
  transition: transform 0.2s cubic-bezier(0.34, 1.56, 0.64, 1);
}
.hd-switch-input:checked + .hd-switch-ui {
  background: var(--ls-primary, #3b82f6);
}
.hd-switch-input:checked + .hd-switch-ui::after {
  transform: translateX(17px);
}
.hd-switch-input:focus-visible + .hd-switch-ui {
  outline: 2px solid rgba(var(--ls-primary-rgb, 59, 130, 246), 0.5);
  outline-offset: 2px;
}

.hd-panel-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 2px 0;
  border-top: 1px solid var(--ls-border-light, #f3f4f6);
}
.hd-reset {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 5px 10px;
  font-size: 12px;
  color: var(--ls-text-secondary, #4b5563);
  background: transparent;
  border: 1px solid var(--ls-border, #e5e7eb);
  border-radius: 8px;
  cursor: pointer;
  transition: all 0.15s ease;
}
.hd-reset:hover {
  color: var(--ls-danger, #ef4444);
  border-color: rgba(239, 68, 68, 0.4);
}
.hd-lucky {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 6px 10px;
  font-size: 12px;
  border-radius: 8px;
  border: 1px solid rgba(var(--ls-primary-rgb, 59, 130, 246), 0.35);
  background: rgba(var(--ls-primary-rgb, 59, 130, 246), 0.08);
  color: var(--ls-primary, #3b82f6);
  cursor: pointer;
  transition: all 0.15s ease;
  white-space: nowrap;
}
.hd-lucky:hover {
  background: rgba(var(--ls-primary-rgb, 59, 130, 246), 0.16);
  transform: translateY(-1px);
}
.hd-hint { font-size: 11px; color: var(--ls-text-muted, #9ca3af); }

/* ------------------------------------------------------------------
   3. 全站基础跟随（scope_base）
   ------------------------------------------------------------------ */

html[data-hd][data-hd-scope-base="on"] .ls-header {
  background: var(--hd-header-bg, rgba(255, 255, 255, 0.86)) !important;
  border-bottom-color: var(--ls-border-light, #f3f4f6) !important;
}
html[data-hd][data-hd-scope-base="on"] .ls-widget-card {
  background: var(--ls-card-bg, #fff) !important;
  border: 1px solid var(--ls-border-light, #f3f4f6) !important;
  box-shadow: var(--hd-shadow, 0 2px 10px rgba(0, 0, 0, 0.06));
}
html[data-hd][data-hd-scope-base="on"] .ls-hd-dropdown {
  background: var(--ls-card-bg, #fff) !important;
}
html[data-hd][data-hd-scope-base="on"] .ls-modal-content,
html[data-hd][data-hd-scope-base="on"] .ls-search-modal .ls-search-container {
  background: var(--ls-card-bg, #fff) !important;
}
/* 悬浮菜单：只跟边线，不接管背景（v1.1.7 站长要求「不要 background 参数」） */
html[data-hd][data-hd-scope-base="on"] .ls-float-menu {
  border-color: var(--ls-border-light, #f3f4f6) !important;
}
/* 主内容列里的通用卡片（首页信息流 / 论坛等走 var 的部分一起兜住） */
html[data-hd][data-hd-scope-base="on"] .ls-main-nav .ls-nav-item > a:hover {
  color: var(--ls-primary, #3b82f6) !important;
  background: rgba(var(--ls-primary-rgb, 59, 130, 246), 0.08) !important;
}

/* ------------------------------------------------------------------
   4. 顶部导航特效（后台「视觉特效 → 顶部导航特效」）
   ------------------------------------------------------------------ */

/* 恒定毛玻璃 */
html[data-hd][data-hd-nav="glass"] .ls-header,
html[data-hd][data-hd-nav="elevate"] .ls-header {
  backdrop-filter: blur(var(--hd-glass-blur, 18px)) saturate(170%);
  -webkit-backdrop-filter: blur(var(--hd-glass-blur, 18px)) saturate(170%);
}

/* 底部渐变流光线 */
html[data-hd][data-hd-nav="gradient"] .ls-header::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px;
  height: 2px;
  background: linear-gradient(90deg, transparent, rgba(var(--ls-primary-rgb, 59, 130, 246), 0.9), transparent);
  background-size: 200% 100%;
  animation: hd-nav-flow 6s linear infinite;
  pointer-events: none;
}
@keyframes hd-nav-flow {
  from { background-position: 200% 0; }
  to { background-position: -200% 0; }
}

/* 霓虹辉光 */
html[data-hd][data-hd-nav="glow"] .ls-nav-item > a:hover span,
html[data-hd][data-hd-nav="glow"] .ls-nav-item.active > a span {
  text-shadow: 0 0 14px rgba(var(--ls-primary-rgb, 59, 130, 246), 0.65);
}
html[data-hd][data-hd-nav="glow"] .ls-nav-item.active > a {
  box-shadow: 0 0 18px rgba(var(--ls-primary-rgb, 59, 130, 246), 0.25);
}

/* 悬浮起投影 */
html[data-hd][data-hd-scrolled="on"][data-hd-nav="shadow"] .ls-header,
html[data-hd][data-hd-scrolled="on"][data-hd-nav="elevate"] .ls-header {
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.12);
}
html[data-hd][data-hd-nav="elevate"] .ls-nav-item > a {
  transition: transform 0.18s ease, color 0.18s ease, background 0.18s ease;
}
html[data-hd][data-hd-nav="elevate"] .ls-nav-item > a:hover {
  transform: translateY(-2px);
}

/* ------------------------------------------------------------------
   5. 卡片特效（后台「视觉特效 → 卡片风格」）
   ------------------------------------------------------------------ */

html[data-hd][data-hd-card="soft"] .ls-widget-card,
html[data-hd][data-hd-card="soft"] .wd-card,
html[data-hd][data-hd-card="soft"] .ls-article-card,
html[data-hd][data-hd-card="soft"] .ls-favorites-card,
html[data-hd][data-hd-card="soft"] .ls-post-item,
html[data-hd][data-hd-card="soft"] .ls-sign-box {
  box-shadow: var(--hd-shadow, 0 2px 10px rgba(0, 0, 0, 0.06));
}

html[data-hd][data-hd-card="outline"] .ls-widget-card,
html[data-hd][data-hd-card="outline"] .wd-card,
html[data-hd][data-hd-card="outline"] .ls-article-card,
html[data-hd][data-hd-card="outline"] .ls-favorites-card,
html[data-hd][data-hd-card="outline"] .ls-post-item,
html[data-hd][data-hd-card="outline"] .ls-sign-box {
  border: 1px solid rgba(var(--ls-primary-rgb, 59, 130, 246), 0.22);
}

html[data-hd][data-hd-card="elevated"] .ls-widget-card,
html[data-hd][data-hd-card="elevated"] .wd-card,
html[data-hd][data-hd-card="elevated"] .ls-article-card,
html[data-hd][data-hd-card="elevated"] .ls-favorites-card,
html[data-hd][data-hd-card="elevated"] .ls-post-item,
html[data-hd][data-hd-card="elevated"] .ls-sign-box {
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
html[data-hd][data-hd-card="elevated"] .ls-widget-card:hover,
html[data-hd][data-hd-card="elevated"] .wd-card:hover,
html[data-hd][data-hd-card="elevated"] .ls-favorites-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.14);
}

/* 全站过渡动画 */
html[data-hd][data-hd-anim="on"] .ls-widget-card,
html[data-hd][data-hd-anim="on"] .wd-card,
html[data-hd][data-hd-anim="on"] .ls-article-card,
html[data-hd][data-hd-anim="on"] .ls-favorites-card,
html[data-hd][data-hd-anim="on"] .ls-post-item,
html[data-hd][data-hd-anim="on"] .ls-sign-box {
  transition: background 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease, transform 0.2s ease;
}

/* ------------------------------------------------------------------
   6. 全站毛玻璃 —— 仅当背景图开启时引擎才挂 data-hd-glass="on"
   ------------------------------------------------------------------ */

html[data-hd][data-hd-glass="on"] .ls-widget-card,
html[data-hd][data-hd-glass="on"] .wd-card,
html[data-hd][data-hd-glass="on"] .ls-article-card,
html[data-hd][data-hd-glass="on"] .ls-favorites-card,
html[data-hd][data-hd-glass="on"] .ls-post-item,
html[data-hd][data-hd-glass="on"] .ls-sign-box,
html[data-hd][data-hd-glass="on"] .ls-sign-hero-inner,
html[data-hd][data-hd-glass="on"] .ls-hd-dropdown,
html[data-hd][data-hd-glass="on"] .ls-modal-content,
html[data-hd][data-hd-glass="on"] .ls-search-modal .ls-search-container {
  background: var(--hd-glass-card, rgba(255, 255, 255, 0.62)) !important;
  backdrop-filter: blur(var(--hd-glass-blur, 18px)) saturate(150%);
  -webkit-backdrop-filter: blur(var(--hd-glass-blur, 18px)) saturate(150%);
  border-color: rgba(255, 255, 255, 0.14);
}
/* 悬浮菜单不进毛玻璃名单：不接管其背景（v1.1.7 站长要求） */
html[data-hd][data-hd-glass="on"][data-hd-mode="light"] .ls-widget-card,
html[data-hd][data-hd-glass="on"][data-hd-mode="light"] .wd-card,
html[data-hd][data-hd-glass="on"][data-hd-mode="light"] .ls-article-card,
html[data-hd][data-hd-glass="on"][data-hd-mode="light"] .ls-favorites-card,
html[data-hd][data-hd-glass="on"][data-hd-mode="light"] .ls-post-item,
html[data-hd][data-hd-glass="on"][data-hd-mode="light"] .ls-sign-box {
  border-color: rgba(255, 255, 255, 0.55) !important;
}
html[data-hd][data-hd-glass="on"] .ls-header {
  background: var(--hd-header-bg, rgba(255, 255, 255, 0.6)) !important;
  backdrop-filter: blur(var(--hd-glass-blur, 18px)) saturate(170%);
  -webkit-backdrop-filter: blur(var(--hd-glass-blur, 18px)) saturate(170%);
}

/* ------------------------------------------------------------------
   7a. 跟随范围：长文（版权声明 + 喜欢/收藏/打赏/送礼）
   ------------------------------------------------------------------ */

/* 版权声明：背景 / 主文字（标题）/ 次要文字（内容）/ 弱化文字（meta） */
html[data-hd][data-hd-scope-article="on"] .ls-article-copyright {
  background: var(--ls-card-bg, #fff) !important;
  background-image: linear-gradient(135deg, rgba(var(--ls-primary-rgb, 59, 130, 246), 0.06) 0%, rgba(var(--ls-primary-rgb, 59, 130, 246), 0.015) 100%) !important;
  border: 1px solid var(--ls-border-light, #f3f4f6) !important;
}
html[data-hd][data-hd-scope-article="on"] .ls-article-copyright-title {
  color: var(--ls-text, #1f2937) !important;
}
html[data-hd][data-hd-scope-article="on"] .ls-article-copyright-content {
  color: var(--ls-text-secondary, #4b5563) !important;
}
html[data-hd][data-hd-scope-article="on"] .ls-article-copyright-meta,
html[data-hd][data-hd-scope-article="on"] .ls-article-copyright-meta > span,
html[data-hd][data-hd-scope-article="on"] .ls-article-copyright-link a {
  color: var(--ls-text-muted, #9ca3af) !important;
}
html[data-hd][data-hd-scope-article="on"] .ls-article-copyright-icon {
  color: rgba(var(--ls-primary-rgb, 59, 130, 246), 0.85) !important;
  background: rgba(var(--ls-primary-rgb, 59, 130, 246), 0.1) !important;
}
html[data-hd][data-hd-scope-article="on"] .ls-article-copyright-meta {
  border-top-color: var(--ls-border-light, #f3f4f6) !important;
}

/* 喜欢 / 收藏 / 打赏 / 送礼 / 分享 按钮排 */
html[data-hd][data-hd-scope-article="on"] .ls-article-actions {
  background: var(--ls-card-bg, #fff) !important;
  border-bottom-color: var(--ls-border-light, #f3f4f6) !important;
}
html[data-hd][data-hd-scope-article="on"] .ls-article-act-btn {
  color: var(--ls-text-secondary, #4b5563) !important;
  background: var(--ls-bg, #f6f7f8) !important;
  border: 1px solid var(--ls-border-light, #f3f4f6) !important;
}
html[data-hd][data-hd-scope-article="on"] .ls-article-act-btn:hover {
  color: var(--ls-primary, #3b82f6) !important;
  border-color: rgba(var(--ls-primary-rgb, 59, 130, 246), 0.45) !important;
  background: rgba(var(--ls-primary-rgb, 59, 130, 246), 0.08) !important;
}
html[data-hd][data-hd-scope-article="on"] .ls-article-act-like.ls-liked {
  color: var(--ls-danger, #ef4444) !important;
  border-color: rgba(239, 68, 68, 0.4) !important;
  background: rgba(239, 68, 68, 0.08) !important;
}
html[data-hd][data-hd-scope-article="on"] .ls-article-act-collect.ls-on {
  color: var(--ls-warning, #f59e0b) !important;
  border-color: rgba(245, 158, 11, 0.4) !important;
  background: rgba(245, 158, 11, 0.08) !important;
}
html[data-hd][data-hd-scope-article="on"] .ls-article-act-reward:hover {
  color: var(--ls-warning, #f59e0b) !important;
}
html[data-hd][data-hd-scope-article="on"] .ls-article-act-gift:hover {
  color: var(--ls-primary, #3b82f6) !important;
}

/* 长文页面其它跟随 */
html[data-hd][data-hd-scope-article="on"] .ls-article-card {
  background: var(--ls-card-bg, #fff) !important;
  border-color: var(--ls-border-light, #f3f4f6) !important;
}
html[data-hd][data-hd-scope-article="on"] .ls-article-title {
  color: var(--ls-text, #1f2937) !important;
}
html[data-hd][data-hd-scope-article="on"] .ls-article-author-meta,
html[data-hd][data-hd-scope-article="on"] .ls-article-author-meta span {
  color: var(--ls-text-muted, #9ca3af) !important;
}
html[data-hd][data-hd-scope-article="on"] .ls-article-tags .ls-article-tag {
  background: rgba(var(--ls-primary-rgb, 59, 130, 246), 0.08) !important;
  color: var(--ls-primary, #3b82f6) !important;
}
html[data-hd][data-hd-scope-article="on"] .ls-article-bbs-card {
  background: var(--ls-bg, #f6f7f8) !important;
}
html[data-hd][data-hd-scope-article="on"] .ls-article-interact {
  background: var(--ls-card-bg, #fff) !important;
}
html[data-hd][data-hd-scope-article="on"] .ls-article-body,
html[data-hd][data-hd-scope-article="on"] .ls-article-body p {
  color: var(--ls-text, #1f2937) !important;
}

/* ------------------------------------------------------------------
   7b. 跟随范围：动态（信息流 .ls-post-* + 详情页 .wd-*，2026 实站结构）
   主文字：正文 .wd-text / .ls-text、作者昵称、公告牌名、评论正文
   次要文字：板块标签、位置、互动按钮、标签页、引用
   弱化文字：作者 meta、时间来源、点赞明细、附件 meta、相关阅读 meta
   注：font.nickname 的等级色是站点刻意设计，映射落在其父级不覆盖它
   ------------------------------------------------------------------ */

/* ---- 动态详情页（wd-*） ---- */
html[data-hd][data-hd-scope-words="on"] .wd-page {
  color: var(--ls-text, #1f2937) !important;
}
html[data-hd][data-hd-scope-words="on"] .wd-card {
  background: var(--ls-card-bg, #fff) !important;
  border: 1px solid var(--ls-border-light, #f3f4f6) !important;
}
/* 主文字 */
html[data-hd][data-hd-scope-words="on"] .wd-text,
html[data-hd][data-hd-scope-words="on"] .wd-text p,
html[data-hd][data-hd-scope-words="on"] .wd-body,
html[data-hd][data-hd-scope-words="on"] .wd-body p,
html[data-hd][data-hd-scope-words="on"] .wd-title,
html[data-hd][data-hd-scope-words="on"] .wd-bbs-card-name,
html[data-hd][data-hd-scope-words="on"] .wd-ri-title,
html[data-hd][data-hd-scope-words="on"] .wd-author-name > a {
  color: var(--ls-text, #1f2937) !important;
}
html[data-hd][data-hd-scope-words="on"] .wd-author-name > a:hover {
  color: var(--ls-primary, #3b82f6) !important;
}
/* 次要文字 */
html[data-hd][data-hd-scope-words="on"] .wd-bbs-tag,
html[data-hd][data-hd-scope-words="on"] .wd-location,
html[data-hd][data-hd-scope-words="on"] .wd-act-btn,
html[data-hd][data-hd-scope-words="on"] .wd-interact-tab.ls-on,
html[data-hd][data-hd-scope-words="on"] .wd-interact-tab.ls-on em,
html[data-hd][data-hd-scope-words="on"] .wd-code-lang,
html[data-hd][data-hd-scope-words="on"] .wd-files-header,
html[data-hd][data-hd-scope-words="on"] .wd-power-header,
html[data-hd][data-hd-scope-words="on"] .wd-power-card-text,
html[data-hd][data-hd-scope-words="on"] .wd-quote {
  color: var(--ls-text-secondary, #4b5563) !important;
}
html[data-hd][data-hd-scope-words="on"] .wd-act-btn:hover {
  color: var(--ls-primary, #3b82f6) !important;
  background: rgba(var(--ls-primary-rgb, 59, 130, 246), 0.08);
}
/* 弱化文字 */
html[data-hd][data-hd-scope-words="on"] .wd-author-meta,
html[data-hd][data-hd-scope-words="on"] .wd-bbs-card-meta,
html[data-hd][data-hd-scope-words="on"] .wd-label-view,
html[data-hd][data-hd-scope-words="on"] .wd-interact-panel .wd-likes-text,
html[data-hd][data-hd-scope-words="on"] .wd-interact-tab,
html[data-hd][data-hd-scope-words="on"] .wd-interact-tab em,
html[data-hd][data-hd-scope-words="on"] .wd-ri-meta,
html[data-hd][data-hd-scope-words="on"] .wd-file-meta,
html[data-hd][data-hd-scope-words="on"] .wd-gift-detail {
  color: var(--ls-text-muted, #9ca3af) !important;
}
/* 板块卡 / 引用块 / 图片圆角 */
html[data-hd][data-hd-scope-words="on"] .wd-bbs-card {
  background: var(--ls-bg, #f6f7f8) !important;
  border: 1px solid var(--ls-border-light, #f3f4f6) !important;
}
html[data-hd][data-hd-scope-words="on"] .wd-quote {
  background: var(--ls-bg, #f6f7f8) !important;
  border-left: 3px solid rgba(var(--ls-primary-rgb, 59, 130, 246), 0.5) !important;
}
html[data-hd][data-hd-scope-words="on"] .wd-images img,
html[data-hd][data-hd-scope-words="on"] .wd-image-item img {
  border-radius: var(--hd-radius, 12px);
}
/* 评论区（ls-ci-*）：主 / 次 / 弱三层 */
html[data-hd][data-hd-scope-words="on"] .ls-ci-text,
html[data-hd][data-hd-scope-words="on"] .ls-ci-user,
html[data-hd][data-hd-scope-words="on"] .ls-ci-card-info strong,
html[data-hd][data-hd-scope-words="on"] .ls-comment-count,
html[data-hd][data-hd-scope-words="on"] .ls-comment-textarea,
html[data-hd][data-hd-scope-words="on"] .ls-comment-tabs .tab-item.on {
  color: var(--ls-text, #1f2937) !important;
}
html[data-hd][data-hd-scope-words="on"] .ls-ci-time,
html[data-hd][data-hd-scope-words="on"] .ls-ci-city,
html[data-hd][data-hd-scope-words="on"] .ls-ci-from,
html[data-hd][data-hd-scope-words="on"] .ls-ci-bar-left,
html[data-hd][data-hd-scope-words="on"] .ls-ci-badge-sep,
html[data-hd][data-hd-scope-words="on"] .ls-comment-empty {
  color: var(--ls-text-muted, #9ca3af) !important;
}
html[data-hd][data-hd-scope-words="on"] .ls-ci-badge,
html[data-hd][data-hd-scope-words="on"] .ls-ci-reply-ref,
html[data-hd][data-hd-scope-words="on"] .ls-ci-card-info span,
html[data-hd][data-hd-scope-words="on"] .ls-ci-bar-right > span,
html[data-hd][data-hd-scope-words="on"] .ls-comment-tabs .tab-item,
html[data-hd][data-hd-scope-words="on"] .ls-comment-toolbar .tool-btn {
  color: var(--ls-text-secondary, #4b5563) !important;
}

/* ---- 首页信息流 / 动态列表（ls-post-*） ---- */
html[data-hd][data-hd-scope-words="on"] .ls-post-item {
  background: var(--ls-card-bg, #fff) !important;
  border: 1px solid var(--ls-border-light, #f3f4f6) !important;
  border-radius: var(--hd-radius, 10px);
}
html[data-hd][data-hd-scope-words="on"] .ls-post-user-name .ls-name,
html[data-hd][data-hd-scope-words="on"] .ls-post-content .ls-text,
html[data-hd][data-hd-scope-words="on"] .ls-text {
  color: var(--ls-text, #1f2937) !important;
}
html[data-hd][data-hd-scope-words="on"] .ls-post-meta,
html[data-hd][data-hd-scope-words="on"] .ls-post-from,
html[data-hd][data-hd-scope-words="on"] .ls-action-btn,
html[data-hd][data-hd-scope-words="on"] .ls-action-btn span {
  color: var(--ls-text-muted, #9ca3af) !important;
}
html[data-hd][data-hd-scope-words="on"] .ls-post-footer .ls-board-link {
  color: var(--ls-text-secondary, #4b5563) !important;
}
html[data-hd][data-hd-scope-words="on"] .ls-post-footer .ls-board-link:hover {
  color: var(--ls-primary, #3b82f6) !important;
}
html[data-hd][data-hd-scope-words="on"] .ls-action-btn:hover {
  color: var(--ls-primary, #3b82f6) !important;
}

/* ------------------------------------------------------------------
   7b+. 互动面板（.ls-comment-box：评论 / 喜欢 / 礼物标签页 + 表单 + 列表）
   动态页与长文页共用同一组件，故同时挂在 scope-words 与 scope-article 下。
   2026 实站取色校准（lightsns.com /words 详情页）：
   - .ls-comment-tabs 条底 #f4f4f5、.tab-item.on 底 #fff 字 #1a1a1a
   - .ls-comment-form 边 #e4e4e7、.ls-editor/.ls-comment-textarea 字 #18181b
   - .ls-comment-menu/.ls-comment-img-list/.ls-comment-extra-list/.ls-comment-toolbar 字 #777
   - .tool-btn 图标 #a1a1aa、.ls-comment-submit 底 #3b82f6
   - .ls-comment-item 字 #777、.ls-ci-content 字 #27272a（原 7b 漏）
   - .ls-online-dot 在线点 / .ls-mark.lv 等级标是站点刻意设计，不覆盖
   ------------------------------------------------------------------ */

/* 面板本体与标签页条 */
html[data-hd][data-hd-scope-words="on"] .ls-comment-box,
html[data-hd][data-hd-scope-article="on"] .ls-comment-box {
  background: var(--ls-card-bg, #fff) !important;
  border-color: var(--ls-border-light, #f3f4f6) !important;
}
html[data-hd][data-hd-scope-words="on"] .ls-comment-tabs,
html[data-hd][data-hd-scope-article="on"] .ls-comment-tabs {
  background: var(--ls-bg, #f6f7f8) !important;
  border-color: var(--ls-border-light, #f3f4f6) !important;
}
html[data-hd][data-hd-scope-words="on"] .ls-comment-tabs .tab-item,
html[data-hd][data-hd-scope-article="on"] .ls-comment-tabs .tab-item {
  background: transparent !important;
  color: var(--ls-text-secondary, #4b5563) !important;
  transition: color 0.15s ease, background 0.15s ease !important;
}
html[data-hd][data-hd-scope-words="on"] .ls-comment-tabs .tab-item:hover,
html[data-hd][data-hd-scope-article="on"] .ls-comment-tabs .tab-item:hover {
  color: var(--ls-primary, #3b82f6) !important;
}
html[data-hd][data-hd-scope-words="on"] .ls-comment-tabs .tab-item.on,
html[data-hd][data-hd-scope-article="on"] .ls-comment-tabs .tab-item.on {
  background: var(--ls-card-bg, #fff) !important;
  color: var(--ls-text, #1f2937) !important;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08) !important;
}

/* 表单区：边框 / 编辑器 / 工具栏 / 提交按钮 */
html[data-hd][data-hd-scope-words="on"] .ls-comment-form,
html[data-hd][data-hd-scope-article="on"] .ls-comment-form {
  border-color: var(--ls-border-light, #f3f4f6) !important;
  background: var(--ls-card-bg, #fff) !important;
}
html[data-hd][data-hd-scope-words="on"] .ls-editor,
html[data-hd][data-hd-scope-article="on"] .ls-editor {
  color: var(--ls-text, #1f2937) !important;
  background: var(--ls-card-bg, #fff) !important;
}
html[data-hd][data-hd-scope-words="on"] .ls-comment-textarea,
html[data-hd][data-hd-scope-article="on"] .ls-comment-textarea {
  color: var(--ls-text, #1f2937) !important;
  background: var(--ls-card-bg, #fff) !important;
}
html[data-hd][data-hd-scope-words="on"] .ls-comment-textarea::placeholder,
html[data-hd][data-hd-scope-article="on"] .ls-comment-textarea::placeholder,
html[data-hd][data-hd-scope-words="on"] .ls-editor:empty::before,
html[data-hd][data-hd-scope-article="on"] .ls-editor:empty::before {
  color: var(--ls-text-muted, #9ca3af) !important;
}
html[data-hd][data-hd-scope-words="on"] .ls-comment-toolbar,
html[data-hd][data-hd-scope-article="on"] .ls-comment-toolbar {
  border-top-color: var(--ls-border-light, #f3f4f6) !important;
}
html[data-hd][data-hd-scope-words="on"] .ls-comment-toolbar .tool-btn,
html[data-hd][data-hd-scope-article="on"] .ls-comment-toolbar .tool-btn {
  color: var(--ls-text-muted, #9ca3af) !important;
}
html[data-hd][data-hd-scope-words="on"] .ls-comment-toolbar .tool-btn:hover,
html[data-hd][data-hd-scope-article="on"] .ls-comment-toolbar .tool-btn:hover {
  color: var(--ls-primary, #3b82f6) !important;
}
html[data-hd][data-hd-scope-words="on"] .ls-comment-submit,
html[data-hd][data-hd-scope-article="on"] .ls-comment-submit {
  background: var(--ls-primary, #3b82f6) !important;
  color: #fff !important;
  transition: background 0.15s ease, transform 0.15s ease !important;
}
html[data-hd][data-hd-scope-words="on"] .ls-comment-submit:hover,
html[data-hd][data-hd-scope-article="on"] .ls-comment-submit:hover {
  background: var(--ls-primary-hover, #2563eb) !important;
}
html[data-hd][data-hd-scope-words="on"] .ls-comment-submit:active,
html[data-hd][data-hd-scope-article="on"] .ls-comment-submit:active {
  transform: scale(0.96) !important;
}

/* 次要容器文字：菜单 / 图片列表 / 附加列表 / 列表项 */
html[data-hd][data-hd-scope-words="on"] .ls-comment-menu,
html[data-hd][data-hd-scope-article="on"] .ls-comment-menu,
html[data-hd][data-hd-scope-words="on"] .ls-comment-img-list,
html[data-hd][data-hd-scope-article="on"] .ls-comment-img-list,
html[data-hd][data-hd-scope-words="on"] .ls-comment-extra-list,
html[data-hd][data-hd-scope-article="on"] .ls-comment-extra-list,
html[data-hd][data-hd-scope-words="on"] .ls-comment-item,
html[data-hd][data-hd-scope-article="on"] .ls-comment-item {
  color: var(--ls-text-secondary, #4b5563) !important;
}
/* 喜欢/礼物列表（tab 切换后同一容器）：用户昵称主文字、条目边线 */
html[data-hd][data-hd-scope-words="on"] .ls-comment-list .ls-name,
html[data-hd][data-hd-scope-article="on"] .ls-comment-list .ls-name,
html[data-hd][data-hd-scope-words="on"] .ls-comment-list strong,
html[data-hd][data-hd-scope-article="on"] .ls-comment-list strong {
  color: var(--ls-text, #1f2937) !important;
}
html[data-hd][data-hd-scope-words="on"] .ls-comment-list .ls-ci-content,
html[data-hd][data-hd-scope-article="on"] .ls-comment-list .ls-ci-content {
  color: var(--ls-text, #1f2937) !important;
}
html[data-hd][data-hd-scope-words="on"] .ls-comment-item + .ls-comment-item,
html[data-hd][data-hd-scope-article="on"] .ls-comment-item + .ls-comment-item {
  border-top-color: var(--ls-border-light, #f3f4f6) !important;
}

/* ------------------------------------------------------------------
   7c. 跟随范围：我的收藏（左时间线 + 右侧概览栏，2026 实站结构）
   右侧栏：.ls-favorites-side → .ls-favorites-box（收藏概览/类型分布/
           收藏夹/月份索引），旧版映射的 .ls-fav-* 类并不存在
   主文字：标题/统计数字/卡片标题/收藏夹名；次要：筛选/标签/作者/收藏夹；
   弱化：时间/meta/计数/空态
   ------------------------------------------------------------------ */

html[data-hd][data-hd-scope-favorites="on"] .route-favorites,
html[data-hd][data-hd-scope-favorites="on"] body.route-favorites {
  background: var(--ls-bg, #f6f7f8) !important;
}
html[data-hd][data-hd-scope-favorites="on"] .ls-favorites-page {
  color: var(--ls-text, #1f2937) !important;
}
/* 页头与搜索 */
html[data-hd][data-hd-scope-favorites="on"] .ls-favorites-head h1 {
  color: var(--ls-text, #1f2937) !important;
}
html[data-hd][data-hd-scope-favorites="on"] .ls-favorites-search {
  background: var(--ls-card-bg, #fff) !important;
  border-color: var(--ls-border, #e5e7eb) !important;
}
html[data-hd][data-hd-scope-favorites="on"] .ls-favorites-search input {
  color: var(--ls-text, #1f2937) !important;
}
/* 时间线 */
html[data-hd][data-hd-scope-favorites="on"] .ls-favorites-group-head {
  background: var(--ls-bg, #f6f7f8) !important;
  color: var(--ls-text-muted, #9ca3af) !important;
}
html[data-hd][data-hd-scope-favorites="on"] .ls-favorites-group-head b {
  color: var(--ls-text, #1f2937) !important;
}
html[data-hd][data-hd-scope-favorites="on"] .ls-favorites-time,
html[data-hd][data-hd-scope-favorites="on"] .ls-favorites-end,
html[data-hd][data-hd-scope-favorites="on"] .ls-favorites-stat-month {
  color: var(--ls-text-muted, #9ca3af) !important;
}
/* 收藏卡片 */
html[data-hd][data-hd-scope-favorites="on"] .ls-favorites-card {
  background: var(--ls-card-bg, #fff) !important;
  border: 1px solid var(--ls-border-light, #f3f4f6) !important;
}
html[data-hd][data-hd-scope-favorites="on"] .ls-favorites-card:hover {
  border-color: rgba(var(--ls-primary-rgb, 59, 130, 246), 0.4) !important;
}
html[data-hd][data-hd-scope-favorites="on"] .ls-favorites-card-cover {
  background: var(--ls-bg-hover, #eef0f2) !important;
}
html[data-hd][data-hd-scope-favorites="on"] .ls-favorites-card-title,
html[data-hd][data-hd-scope-favorites="on"] .ls-favorites-card-text.is-lead {
  color: var(--ls-text, #1f2937) !important;
}
html[data-hd][data-hd-scope-favorites="on"] .ls-favorites-card-text,
html[data-hd][data-hd-scope-favorites="on"] .ls-favorites-card-author,
html[data-hd][data-hd-scope-favorites="on"] .ls-favorites-tag {
  color: var(--ls-text-secondary, #4b5563) !important;
}
html[data-hd][data-hd-scope-favorites="on"] .ls-favorites-card-meta {
  color: var(--ls-text-muted, #9ca3af) !important;
}
html[data-hd][data-hd-scope-favorites="on"] .ls-favorites-card-ops {
  background: var(--ls-card-bg, #fff) !important;
}
html[data-hd][data-hd-scope-favorites="on"] .ls-favorites-card-ops button {
  color: var(--ls-text-secondary, #4b5563) !important;
}
html[data-hd][data-hd-scope-favorites="on"] .ls-favorites-card-ops button:hover {
  color: var(--ls-primary, #3b82f6) !important;
  background: var(--ls-bg, #f6f7f8) !important;
}
/* 筛选 / 类型 / 更多 / 跳转 */
html[data-hd][data-hd-scope-favorites="on"] .ls-favorites-filter {
  background: var(--ls-card-bg, #fff) !important;
  border-color: var(--ls-border, #e5e7eb) !important;
  color: var(--ls-text-secondary, #4b5563) !important;
}
html[data-hd][data-hd-scope-favorites="on"] .ls-favorites-type {
  color: var(--ls-text-secondary, #4b5563) !important;
}
html[data-hd][data-hd-scope-favorites="on"] .ls-favorites-type em,
html[data-hd][data-hd-scope-favorites="on"] .ls-favorites-type i {
  color: var(--ls-text-muted, #9ca3af) !important;
  background: var(--ls-bg, #f6f7f8);
}
html[data-hd][data-hd-scope-favorites="on"] .ls-favorites-more-btn {
  background: var(--ls-card-bg, #fff) !important;
  color: var(--ls-text, #1f2937) !important;
  border-color: var(--ls-border, #e5e7eb) !important;
}
html[data-hd][data-hd-scope-favorites="on"] .ls-favorites-jump {
  color: var(--ls-text-secondary, #4b5563) !important;
}
/* ★ 右侧概览栏：收藏概览 / 类型分布 / 收藏夹 / 月份索引 */
html[data-hd][data-hd-scope-favorites="on"] .ls-favorites-box {
  background: var(--ls-card-bg, #fff) !important;
  border: 1px solid var(--ls-border-light, #f3f4f6) !important;
}
html[data-hd][data-hd-scope-favorites="on"] .ls-favorites-box-title {
  color: var(--ls-text, #1f2937) !important;
}
html[data-hd][data-hd-scope-favorites="on"] .ls-favorites-stats b {
  color: var(--ls-text, #1f2937) !important;
}
html[data-hd][data-hd-scope-favorites="on"] .ls-favorites-stats span,
html[data-hd][data-hd-scope-favorites="on"] .ls-favorites-menu .ls-favorites-menu-count,
html[data-hd][data-hd-scope-favorites="on"] .ls-favorites-folder > i,
html[data-hd][data-hd-scope-favorites="on"] .ls-favorites-folder em,
html[data-hd][data-hd-scope-favorites="on"] .ls-favorites-folder-ops button,
html[data-hd][data-hd-scope-favorites="on"] .ls-favorites-month em,
html[data-hd][data-hd-scope-favorites="on"] .ls-favorites-side-empty {
  color: var(--ls-text-muted, #9ca3af) !important;
}
html[data-hd][data-hd-scope-favorites="on"] .ls-favorites-folder,
html[data-hd][data-hd-scope-favorites="on"] .ls-favorites-month {
  color: var(--ls-text-secondary, #4b5563) !important;
}
html[data-hd][data-hd-scope-favorites="on"] .ls-favorites-folder-name {
  color: var(--ls-text, #1f2937) !important;
}
html[data-hd][data-hd-scope-favorites="on"] .ls-favorites-folder:hover,
html[data-hd][data-hd-scope-favorites="on"] .ls-favorites-month:hover {
  background: var(--ls-bg, #f6f7f8) !important;
}

/* ------------------------------------------------------------------
   7d. 跟随范围：浏览历史
   ------------------------------------------------------------------ */

html[data-hd][data-hd-scope-history="on"] .ls-view-history-page {
  color: var(--ls-text, #1f2937) !important;
}
html[data-hd][data-hd-scope-history="on"] .ls-view-history-page h1 {
  color: var(--ls-text, #1f2937) !important;
}
html[data-hd][data-hd-scope-history="on"] .ls-view-history-hero p {
  color: var(--ls-text-secondary, #4b5563) !important;
}
html[data-hd][data-hd-scope-history="on"] .ls-view-history-icon {
  background: rgba(var(--ls-primary-rgb, 59, 130, 246), 0.1) !important;
  color: var(--ls-primary, #3b82f6) !important;
}
html[data-hd][data-hd-scope-history="on"] .ls-view-history-clear {
  color: var(--ls-text-secondary, #4b5563) !important;
  background: var(--ls-card-bg, #fff) !important;
  border-color: var(--ls-border, #e5e7eb) !important;
}
html[data-hd][data-hd-scope-history="on"] .ls-view-history-page section {
  background: transparent !important;
}

/* ------------------------------------------------------------------
   7e. 跟随范围：聚合页脚
   主文字：logo 文案 / 栏目标题 / 品牌名
   次要文字：栏目链接 / 品牌描述 / 二维码文字
   弱化文字：版权行 / 备案
   ------------------------------------------------------------------ */

html[data-hd][data-hd-scope-footer="on"] .ls-footer-main {
  background: var(--ls-bg-light, #f6f7f8) !important;
  border-top-color: var(--ls-border, #e5e7eb) !important;
}
html[data-hd][data-hd-scope-footer="on"] .ls-footer-main::before {
  background: linear-gradient(90deg, transparent, rgba(var(--ls-primary-rgb, 59, 130, 246), 0.65), transparent) !important;
}
html[data-hd][data-hd-scope-footer="on"] .ls-footer-logo-text,
html[data-hd][data-hd-scope-footer="on"] .ls-footer-nav-title {
  color: var(--ls-text, #1f2937) !important;
}
html[data-hd][data-hd-scope-footer="on"] .ls-footer-desc,
html[data-hd][data-hd-scope-footer="on"] .ls-footer-nav-link,
html[data-hd][data-hd-scope-footer="on"] .ls-footer-qrcode-text {
  color: var(--ls-text-secondary, #4b5563) !important;
}
html[data-hd][data-hd-scope-footer="on"] .ls-footer-nav-link:hover {
  color: var(--ls-primary, #3b82f6) !important;
}
html[data-hd][data-hd-scope-footer="on"] .ls-footer-copyright,
html[data-hd][data-hd-scope-footer="on"] .ls-footer-bottom-links {
  color: var(--ls-text-muted, #9ca3af) !important;
}
html[data-hd][data-hd-scope-footer="on"] .ls-footer-social-item {
  background: var(--ls-card-bg, #fff) !important;
  color: var(--ls-text-secondary, #4b5563) !important;
  border: 1px solid var(--ls-border-light, #f3f4f6) !important;
}
html[data-hd][data-hd-scope-footer="on"] .ls-footer-social-item:hover {
  color: var(--ls-primary, #3b82f6) !important;
  border-color: rgba(var(--ls-primary-rgb, 59, 130, 246), 0.4) !important;
}

/* ------------------------------------------------------------------
   7f. 跟随范围：右上「关于作者」
   主文字：昵称与统计数字；次要文字：简介 / 查看主页；弱化文字：统计标签
   ------------------------------------------------------------------ */

html[data-hd][data-hd-scope-author="on"] .jinsom-module-widget-author-card .ls-widget-header h3 {
  color: var(--ls-text, #1f2937) !important;
}
html[data-hd][data-hd-scope-author="on"] .jinsom-module-widget-author-card-name a {
  color: var(--ls-text, #1f2937) !important;
}
html[data-hd][data-hd-scope-author="on"] .jinsom-module-widget-author-card-name a:hover {
  color: var(--ls-primary, #3b82f6) !important;
}
html[data-hd][data-hd-scope-author="on"] .jinsom-module-widget-author-card-bio {
  color: var(--ls-text-secondary, #4b5563) !important;
}
html[data-hd][data-hd-scope-author="on"] .jinsom-module-widget-author-card-stat strong {
  color: var(--ls-text, #1f2937) !important;
}
html[data-hd][data-hd-scope-author="on"] .jinsom-module-widget-author-card-stat span {
  color: var(--ls-text-muted, #9ca3af) !important;
}
html[data-hd][data-hd-scope-author="on"] .jinsom-module-widget-author-card-home {
  background: rgba(var(--ls-primary-rgb, 59, 130, 246), 0.09) !important;
  color: var(--ls-primary, #3b82f6) !important;
}
html[data-hd][data-hd-scope-author="on"] .jinsom-module-widget-author-card-home:hover {
  background: rgba(var(--ls-primary-rgb, 59, 130, 246), 0.16) !important;
}

/* ------------------------------------------------------------------
   7g. 跟随范围：签到中心（/sign，实站 DOM 校准）
   背景：页面 .ls-sign → 卡片 .ls-sign-box / .ls-sign-hero-inner
        → 次级表面 .ls-sign-reward / .ls-sign-mood-input / .ls-sign-chest-item / .ls-sign-rank-*
   主文字：盒子标题 / 日历日期 / 心情正文 / 排行昵称（.info b）
   次要文字：用户名 / 盒标签 / 月份导航 / 日历图例 / 排行摘要
   弱化文字：奖励日期与空态 / 星期表头 / 进度提示 / 心情登录提示与时间 / 排行时间
   主题色：签到按钮 / 盒图标 / 今日与已签格子 / 图例圆点
   ------------------------------------------------------------------ */

html[data-hd][data-hd-scope-checkin="on"] body.route-sign,
html[data-hd][data-hd-scope-checkin="on"] .route-sign {
  background: var(--ls-bg, #f6f7f8) !important;
}
/* 页面与卡片背景 */
html[data-hd][data-hd-scope-checkin="on"] .ls-sign {
  background: var(--ls-bg, #f6f7f8) !important;
  color: var(--ls-text-secondary, #4b5563) !important;
}
html[data-hd][data-hd-scope-checkin="on"] .ls-sign-hero-inner,
html[data-hd][data-hd-scope-checkin="on"] .ls-sign-box {
  background: var(--ls-card-bg, #fff) !important;
  border: 1px solid var(--ls-border-light, #f3f4f6) !important;
  border-radius: var(--hd-radius, 10px);
  box-shadow: var(--hd-shadow, 0 2px 10px rgba(0, 0, 0, 0.06));
}
/* 卡片内的次级表面 */
html[data-hd][data-hd-scope-checkin="on"] .ls-sign-reward,
html[data-hd][data-hd-scope-checkin="on"] .ls-sign-mood-input,
html[data-hd][data-hd-scope-checkin="on"] .ls-sign-chest-item,
html[data-hd][data-hd-scope-checkin="on"] .ls-sign-rank-summary {
  background: var(--ls-bg, #f6f7f8) !important;
}
html[data-hd][data-hd-scope-checkin="on"] .ls-sign-rank-item {
  background: var(--ls-bg, #f6f7f8) !important;
  border-color: var(--ls-border, #e5e7eb) !important;
}
html[data-hd][data-hd-scope-checkin="on"] .ls-sign-rank-item.top1,
html[data-hd][data-hd-scope-checkin="on"] .ls-sign-rank-item.top2,
html[data-hd][data-hd-scope-checkin="on"] .ls-sign-rank-item.top3 {
  border-color: rgba(var(--ls-primary-rgb, 59, 130, 246), 0.35) !important;
}

/* 主文字（排行项主文字在 .info b：昵称加粗处） */
html[data-hd][data-hd-scope-checkin="on"] .ls-sign-box-head h3,
html[data-hd][data-hd-scope-checkin="on"] .ls-sign-reward-title,
html[data-hd][data-hd-scope-checkin="on"] .ls-sign-calendar .days .d,
html[data-hd][data-hd-scope-checkin="on"] .ls-sign-chest-item .day,
html[data-hd][data-hd-scope-checkin="on"] .ls-sign-mood-item .content p,
html[data-hd][data-hd-scope-checkin="on"] .ls-sign-rank-item b,
html[data-hd][data-hd-scope-checkin="on"] .ls-sign-rank-item strong,
html[data-hd][data-hd-scope-checkin="on"] .ls-sign-rank-item .info {
  color: var(--ls-text, #1f2937) !important;
}
/* 次要文字 */
html[data-hd][data-hd-scope-checkin="on"] .ls-sign-user-name,
html[data-hd][data-hd-scope-checkin="on"] .ls-sign-box-tag,
html[data-hd][data-hd-scope-checkin="on"] .ls-sign-box-nav,
html[data-hd][data-hd-scope-checkin="on"] .ls-sign-calendar-legend span,
html[data-hd][data-hd-scope-checkin="on"] .ls-sign-rank-summary,
html[data-hd][data-hd-scope-checkin="on"] .sign-guest-showcase {
  color: var(--ls-text-secondary, #4b5563) !important;
}
/* 弱化文字（实站排行项的时间是 span.time / span.s，不是 .meta） */
html[data-hd][data-hd-scope-checkin="on"] .ls-sign-reward-date,
html[data-hd][data-hd-scope-checkin="on"] .ls-sign-reward-empty,
html[data-hd][data-hd-scope-checkin="on"] .ls-sign-calendar .week,
html[data-hd][data-hd-scope-checkin="on"] .ls-sign-calendar .week > span,
html[data-hd][data-hd-scope-checkin="on"] .ls-sign-chest-item .progress,
html[data-hd][data-hd-scope-checkin="on"] .ls-sign-mood-login,
html[data-hd][data-hd-scope-checkin="on"] .ls-sign-mood-item .content span,
html[data-hd][data-hd-scope-checkin="on"] .ls-sign-rank-item span.time,
html[data-hd][data-hd-scope-checkin="on"] .ls-sign-rank-item span.s {
  color: var(--ls-text-muted, #9ca3af) !important;
}

/* 主题色点缀：签到按钮 / 盒图标 / 计数 */
html[data-hd][data-hd-scope-checkin="on"] .ls-sign-action-btn {
  background: var(--ls-primary, #3b82f6) !important;
  transition: background 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
}
html[data-hd][data-hd-scope-checkin="on"] .ls-sign-action-btn:hover {
  background: var(--ls-primary-hover, #2563eb) !important;
  box-shadow: 0 4px 14px rgba(var(--ls-primary-rgb, 59, 130, 246), 0.35);
}
html[data-hd][data-hd-scope-checkin="on"] .ls-sign-box-head i {
  color: var(--ls-primary, #3b82f6) !important;
}
html[data-hd][data-hd-scope-checkin="on"] .ls-sign-box-head span:not(.ls-sign-box-tag) {
  color: var(--ls-primary, #3b82f6) !important;
}
/* 日历：今日 / 已签 / 礼物格子用主题色铺底，白字保持可读 */
html[data-hd][data-hd-scope-checkin="on"] .ls-sign-calendar .days .d.now,
html[data-hd][data-hd-scope-checkin="on"] .ls-sign-calendar .days .d.ok,
html[data-hd][data-hd-scope-checkin="on"] .ls-sign-calendar .days .d.sig,
html[data-hd][data-hd-scope-checkin="on"] .ls-sign-calendar .days .d.gift {
  background: var(--ls-primary, #3b82f6) !important;
  border-color: transparent !important;
  color: #fff !important;
}
html[data-hd][data-hd-scope-checkin="on"] .ls-sign-calendar .days .d.now .today-badge,
html[data-hd][data-hd-scope-checkin="on"] .ls-sign-calendar .days .d.now b {
  color: rgba(255, 255, 255, 0.85) !important;
}
html[data-hd][data-hd-scope-checkin="on"] .ls-sign-calendar-legend .dot.ok,
html[data-hd][data-hd-scope-checkin="on"] .ls-sign-calendar-legend .dot.now {
  background: var(--ls-primary, #3b82f6) !important;
}
/* 暗色模式下日历空格子补一层描边，避免整片融进背景 */
html[data-hd][data-hd-scope-checkin="on"][data-hd-mode="dark"] .ls-sign-calendar .days .d {
  border: 1px solid var(--ls-border-light, #f3f4f6) !important;
}
html[data-hd][data-hd-scope-checkin="on"][data-hd-mode="dark"] .ls-sign-calendar .days .d.now,
html[data-hd][data-hd-scope-checkin="on"][data-hd-mode="dark"] .ls-sign-calendar .days .d.ok,
html[data-hd][data-hd-scope-checkin="on"][data-hd-mode="dark"] .ls-sign-calendar .days .d.sig,
html[data-hd][data-hd-scope-checkin="on"][data-hd-mode="dark"] .ls-sign-calendar .days .d.gift {
  border-color: transparent !important;
}

/* ------------------------------------------------------------------
   7h. 毛玻璃对跟随范围卡片的最终兜底
   7a-7g 位于第 6 节之后且带 !important，会把毛玻璃卡片底色顶掉；
   这里以更高优先级重申：玻璃开启时，范围卡片用玻璃底色 + 背景模糊
   ------------------------------------------------------------------ */

html[data-hd][data-hd-glass="on"][data-hd-scope-article="on"] .ls-article-card,
html[data-hd][data-hd-glass="on"][data-hd-scope-words="on"] .wd-card,
html[data-hd][data-hd-glass="on"][data-hd-scope-words="on"] .ls-post-item,
html[data-hd][data-hd-glass="on"][data-hd-scope-favorites="on"] .ls-favorites-card,
html[data-hd][data-hd-glass="on"][data-hd-scope-favorites="on"] .ls-favorites-box,
html[data-hd][data-hd-glass="on"][data-hd-scope-checkin="on"] .ls-sign-box,
html[data-hd][data-hd-glass="on"][data-hd-scope-checkin="on"] .ls-sign-hero-inner,
html[data-hd][data-hd-glass="on"][data-hd-scope-base="on"] .ls-widget-card {
  background: var(--hd-glass-card, rgba(255, 255, 255, 0.62)) !important;
  -webkit-backdrop-filter: blur(var(--hd-glass-blur, 18px)) saturate(150%);
  backdrop-filter: blur(var(--hd-glass-blur, 18px)) saturate(150%);
}

/* ------------------------------------------------------------------
   8. /daynight 设置页（hdn-*）
   ------------------------------------------------------------------ */

.hdn-root {
  max-width: 1080px;
  margin: 0 auto;
  padding: 24px 16px 56px;
}
.hdn-loading,
.hdn-fail {
  padding: 80px 0;
  text-align: center;
  color: var(--ls-text-muted, #9ca3af);
  font-size: 14px;
}
.hdn-fail { color: var(--ls-danger, #ef4444); }

.hdn-page { display: flex; flex-direction: column; gap: 22px; }

/* 英雄区 */
.hdn-hero {
  position: relative;
  overflow: hidden;
  padding: 36px 32px;
  border-radius: var(--hd-radius, 16px);
  background:
    radial-gradient(600px 200px at 85% -10%, rgba(var(--ls-primary-rgb), 0.18), transparent 60%),
    radial-gradient(500px 220px at 0% 110%, rgba(var(--ls-primary-rgb), 0.12), transparent 55%),
    var(--ls-card-bg, #fff);
  border: 1px solid var(--ls-border-light, #f3f4f6);
  box-shadow: var(--hd-shadow, 0 2px 10px rgba(0, 0, 0, 0.06));
}
.hdn-hero::after {
  content: "";
  position: absolute;
  top: -40px;
  right: -40px;
  width: 160px;
  height: 160px;
  border-radius: 50%;
  border: 26px solid rgba(var(--ls-primary-rgb), 0.08);
  pointer-events: none;
}
.hdn-hero-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 12px;
  font-size: 12px;
  font-weight: 600;
  color: var(--ls-primary, #3b82f6);
  background: rgba(var(--ls-primary-rgb), 0.1);
  border-radius: 999px;
  margin-bottom: 14px;
}
.hdn-hero-title {
  margin: 0 0 8px;
  font-size: 26px;
  font-weight: 800;
  letter-spacing: -0.02em;
  color: var(--ls-text, #1f2937);
}
.hdn-hero-sub {
  margin: 0;
  font-size: 14px;
  color: var(--ls-text-secondary, #4b5563);
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}
.hdn-current-name { color: var(--ls-primary, #3b82f6); font-weight: 700; }
.hdn-current-mode {
  font-style: normal;
  font-size: 12px;
  padding: 2px 10px;
  border-radius: 999px;
  background: rgba(245, 158, 11, 0.12);
  color: var(--ls-warning, #f59e0b);
}
.hdn-current-mode.is-dark {
  background: rgba(var(--ls-primary-rgb), 0.12);
  color: var(--ls-primary, #3b82f6);
}
.hdn-hero-stats {
  display: flex;
  gap: 22px;
  margin-top: 18px;
  flex-wrap: wrap;
}
.hdn-hero-stat { display: flex; flex-direction: column; gap: 2px; }
.hdn-hero-stat b { font-size: 18px; color: var(--ls-text, #1f2937); }
.hdn-hero-stat span { font-size: 12px; color: var(--ls-text-muted, #9ca3af); }

/* 分区 */
.hdn-sec {
  background: var(--ls-card-bg, #fff);
  border: 1px solid var(--ls-border-light, #f3f4f6);
  border-radius: var(--hd-radius, 16px);
  padding: 22px;
  box-shadow: var(--hd-shadow, 0 2px 10px rgba(0, 0, 0, 0.06));
}
.hdn-sec-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 16px;
}
.hdn-sec-head h2 {
  margin: 0;
  font-size: 17px;
  font-weight: 700;
  color: var(--ls-text, #1f2937);
  display: flex;
  align-items: center;
  gap: 8px;
}
.hdn-sec-head h2 i { color: var(--ls-primary, #3b82f6); font-size: 18px; }
.hdn-sec-head span { font-size: 12px; color: var(--ls-text-muted, #9ca3af); }

/* 风格卡片网格 */
.hdn-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(228px, 1fr));
  gap: 14px;
}
.hdn-card {
  position: relative;
  border-radius: 14px;
  border: 2px solid var(--ls-border-light, #f3f4f6);
  background: var(--ls-bg, #f6f7f8);
  padding: 10px 10px 12px;
  cursor: pointer;
  transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
  outline: none;
}
.hdn-card:hover { transform: translateY(-3px); box-shadow: 0 12px 28px rgba(0, 0, 0, 0.12); }
.hdn-card:focus-visible { border-color: var(--ls-primary, #3b82f6); }
.hdn-card.is-active {
  border-color: var(--ls-primary, #3b82f6);
  box-shadow: 0 0 0 3px rgba(var(--ls-primary-rgb), 0.15);
}

.hdn-preview {
  position: relative;
  height: 128px;
  border-radius: 10px;
  overflow: hidden;
  padding: 10px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  border: 1px solid rgba(0, 0, 0, 0.06);
}
.hdn-pv-nav {
  display: flex;
  align-items: center;
  gap: 6px;
  height: 22px;
  border-radius: 7px;
  padding: 0 8px;
}
.hdn-pv-nav i { display: block; width: 26px; height: 5px; border-radius: 3px; background: rgba(128, 128, 128, 0.35); }
.hdn-pv-nav i:first-child { width: 38px; background: rgba(128, 128, 128, 0.55); }
.hdn-pv-card {
  position: relative;
  flex: 1;
  border-radius: 9px;
  border: 1px solid rgba(128, 128, 128, 0.2);
  padding: 10px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.hdn-pv-line { display: block; height: 6px; border-radius: 3px; width: 82%; opacity: 0.9; }
.hdn-pv-line.short { width: 52%; }
.hdn-pv-btn {
  position: absolute;
  right: 10px;
  bottom: 10px;
  width: 46px;
  height: 14px;
  border-radius: 7px;
  opacity: 0.95;
}
.hdn-pv-img {
  position: absolute;
  top: 8px;
  right: 8px;
  display: inline-flex;
  align-items: center;
  gap: 3px;
  font-size: 10px;
  padding: 2px 8px;
  border-radius: 999px;
  background: rgba(0, 0, 0, 0.45);
  color: #fff;
  backdrop-filter: blur(4px);
}

.hdn-card-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 10px 2px 0;
}
.hdn-card-name {
  font-size: 14px;
  font-weight: 700;
  color: var(--ls-text, #1f2937);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  min-width: 0;
}
.hdn-card-ico { font-size: 15px; flex: none; }
.hdn-card-tags { display: inline-flex; gap: 5px; flex-shrink: 0; }
.hdn-tag {
  font-style: normal;
  font-size: 10px;
  padding: 2px 7px;
  border-radius: 999px;
  background: var(--ls-bg, #f6f7f8);
  color: var(--ls-text-secondary, #4b5563);
  border: 1px solid var(--ls-border-light, #f3f4f6);
}
.hdn-tag.is-dark { background: #1f2937; color: #f9fafb; border-color: #1f2937; }
.hdn-tag.is-use {
  background: rgba(var(--ls-primary-rgb), 0.1);
  color: var(--ls-primary, #3b82f6);
  border-color: transparent;
}
.hdn-card-check {
  position: absolute;
  top: -2px;
  right: -2px;
  width: 26px;
  height: 26px;
  line-height: 26px;
  text-align: center;
  font-size: 14px;
  color: #fff;
  background: var(--ls-primary, #3b82f6);
  border-radius: 0 12px 0 12px;
  opacity: 0;
  transform: scale(0.6);
  transition: all 0.18s ease;
}
.hdn-card.is-active .hdn-card-check { opacity: 1; transform: scale(1); }

/* 偏好选项区 */
.hdn-opts {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 10px;
}
.hdn-opt {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 16px;
  border-radius: 12px;
  background: var(--ls-bg, #f6f7f8);
  border: 1px solid var(--ls-border-light, #f3f4f6);
  cursor: pointer;
  transition: border-color 0.15s ease;
}
.hdn-opt:hover { border-color: rgba(var(--ls-primary-rgb), 0.35); }
.hdn-opt.is-disabled { opacity: 0.55; cursor: not-allowed; }
.hdn-opt-main { display: flex; flex-direction: column; gap: 2px; }
.hdn-opt-title {
  font-size: 14px;
  font-weight: 600;
  color: var(--ls-text, #1f2937);
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.hdn-opt-title i { color: var(--ls-primary, #3b82f6); }
.hdn-opt-desc { font-size: 12px; color: var(--ls-text-muted, #9ca3af); }
.hdn-opt .hd-switch-ui { width: 42px; height: 23px; }
.hdn-opt .hd-switch-ui::after { width: 19px; height: 19px; }
.hdn-opt .hd-switch-input:checked + .hd-switch-ui::after { transform: translateX(19px); }

.hdn-reset-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px dashed var(--ls-border-light, #f3f4f6);
  flex-wrap: wrap;
}
.hdn-reset-row p { margin: 0; font-size: 12px; color: var(--ls-text-muted, #9ca3af); }
#hdnReset {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 16px;
  font-size: 13px;
  border-radius: 10px;
  border: 1px solid var(--ls-border, #e5e7eb);
  background: transparent;
  color: var(--ls-text-secondary, #4b5563);
  cursor: pointer;
  transition: all 0.15s ease;
}
#hdnReset:hover { color: var(--ls-danger, #ef4444); border-color: rgba(239, 68, 68, 0.45); }

/* 使用帮助 */
.hdn-help { display: flex; flex-direction: column; gap: 10px; }
.hdn-help-item {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  font-size: 13px;
  color: var(--ls-text-secondary, #4b5563);
  line-height: 1.7;
}
.hdn-help-item i { color: var(--ls-primary, #3b82f6); margin-top: 3px; }
.hdn-help-item code {
  padding: 1px 7px;
  border-radius: 6px;
  font-size: 12px;
  background: rgba(var(--ls-primary-rgb), 0.08);
  color: var(--ls-primary, #3b82f6);
  word-break: break-all;
}

/* ------------------------------------------------------------------
   /daynight 页：工具栏（排序 + 搜索 + 计数）
   ------------------------------------------------------------------ */
.hdn-toolbar {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 14px;
  padding: 10px 12px;
  border-radius: 12px;
  background: var(--ls-bg, #f6f7f8);
  border: 1px solid var(--ls-border-light, #f3f4f6);
}
.hdn-sort { display: inline-flex; gap: 4px; background: rgba(0, 0, 0, 0.04); border-radius: 10px; padding: 3px; }
.hdn-sort-btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 6px 14px;
  font-size: 13px;
  border: none;
  border-radius: 8px;
  background: transparent;
  color: var(--ls-text-secondary, #4b5563);
  cursor: pointer;
  transition: all 0.15s ease;
}
.hdn-sort-btn:hover { color: var(--ls-primary, #3b82f6); }
.hdn-sort-btn.is-on {
  background: var(--ls-card-bg, #fff);
  color: var(--ls-primary, #3b82f6);
  font-weight: 600;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1);
}
.hdn-search {
  flex: 1;
  min-width: 180px;
  max-width: 320px;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0 12px;
  height: 34px;
  border-radius: 10px;
  background: var(--ls-card-bg, #fff);
  border: 1px solid var(--ls-border-light, #f3f4f6);
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.hdn-search:focus-within {
  border-color: rgba(var(--ls-primary-rgb), 0.5);
  box-shadow: 0 0 0 3px rgba(var(--ls-primary-rgb), 0.12);
}
.hdn-search i { color: var(--ls-text-muted, #9ca3af); font-size: 15px; }
.hdn-search input {
  flex: 1;
  border: none;
  outline: none;
  background: transparent;
  font-size: 13px;
  color: var(--ls-text, #1f2937);
  min-width: 0;
}
.hdn-search input::placeholder { color: var(--ls-text-muted, #9ca3af); }
.hdn-search input::-webkit-search-cancel-button { cursor: pointer; }
.hdn-count {
  margin-left: auto;
  font-size: 12px;
  color: var(--ls-text-muted, #9ca3af);
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}

/* 搜索空态 */
.hdn-empty {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 34px 16px;
  border-radius: 12px;
  border: 1px dashed var(--ls-border, #e5e7eb);
  color: var(--ls-text-muted, #9ca3af);
  font-size: 13px;
}
.hdn-empty i { font-size: 18px; color: var(--ls-primary, #3b82f6); }
.hdn-card.is-filtered { display: none; }

/* hidden 属性兜底：显式 display 会盖掉 UA 的 [hidden]{display:none} */
.hdn-empty[hidden],
.hdn-bg-field button[hidden],
.hdn-blur-field button[hidden] { display: none !important; }

/* 卡片收藏星标 */
.hdn-card-fav {
  position: absolute;
  top: 6px;
  right: 6px;
  z-index: 3;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  font-size: 13px;
  line-height: 1;
  color: rgba(255, 255, 255, 0.9);
  background: rgba(0, 0, 0, 0.35);
  backdrop-filter: blur(4px);
  opacity: 0;
  transform: scale(0.7);
  transition: opacity 0.15s ease, transform 0.15s ease, color 0.15s ease, background 0.15s ease;
}
.hdn-card:hover .hdn-card-fav,
.hdn-card:focus-visible .hdn-card-fav,
.hdn-card-fav.is-on { opacity: 1; transform: scale(1); }
.hdn-card-fav:hover { background: rgba(0, 0, 0, 0.5); transform: scale(1.12); }
.hdn-card-fav.is-on { color: #fbbf24; }
.hdn-card.is-active .hdn-card-fav { right: 30px; }

/* roving tabindex 焦点环（面板 + 页面通用） */
.hd-chip:focus-visible,
.hdn-card:focus-visible,
.hdn-sort-btn:focus-visible {
  outline: 2px solid rgba(var(--ls-primary-rgb), 0.65);
  outline-offset: 2px;
}

/* 偏好区：自定义背景图 + 毛玻璃强度滑块 */
.hdn-opt-input { flex-wrap: wrap; cursor: default; }
.hdn-opt-input:hover { border-color: rgba(var(--ls-primary-rgb), 0.35); }
.hdn-opt-input .hdn-opt-main { flex: 1 1 100%; }
.hdn-bg-field,
.hdn-blur-field {
  flex: 1 1 100%;
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.hdn-bg-field input[type="url"] {
  flex: 1;
  min-width: 200px;
  height: 34px;
  padding: 0 12px;
  font-size: 13px;
  border-radius: 10px;
  border: 1px solid var(--ls-border, #e5e7eb);
  background: var(--ls-card-bg, #fff);
  color: var(--ls-text, #1f2937);
  outline: none;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.hdn-bg-field input[type="url"]:focus {
  border-color: rgba(var(--ls-primary-rgb), 0.5);
  box-shadow: 0 0 0 3px rgba(var(--ls-primary-rgb), 0.12);
}
.hdn-bg-field input[type="url"]::placeholder { color: var(--ls-text-muted, #9ca3af); }
.hdn-bg-field button,
.hdn-blur-field button {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  height: 34px;
  padding: 0 14px;
  font-size: 13px;
  border-radius: 10px;
  border: 1px solid rgba(var(--ls-primary-rgb), 0.4);
  background: rgba(var(--ls-primary-rgb), 0.08);
  color: var(--ls-primary, #3b82f6);
  cursor: pointer;
  transition: all 0.15s ease;
  white-space: nowrap;
}
.hdn-bg-field button:hover,
.hdn-blur-field button:hover {
  background: rgba(var(--ls-primary-rgb), 0.16);
  transform: translateY(-1px);
}
.hdn-blur-field input[type="range"] {
  flex: 1;
  min-width: 160px;
  max-width: 260px;
  height: 6px;
  appearance: none;
  -webkit-appearance: none;
  border-radius: 999px;
  background: linear-gradient(to right, rgba(var(--ls-primary-rgb), 0.55) var(--hd-blur-fill, 45%), rgba(0, 0, 0, 0.12) var(--hd-blur-fill, 45%));
  outline: none;
  cursor: pointer;
}
.hdn-blur-field input[type="range"]::-webkit-slider-thumb {
  appearance: none;
  -webkit-appearance: none;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: var(--ls-card-bg, #fff);
  border: 3px solid var(--ls-primary, #3b82f6);
  box-shadow: 0 1px 5px rgba(0, 0, 0, 0.25);
  transition: transform 0.12s ease;
}
.hdn-blur-field input[type="range"]:active::-webkit-slider-thumb { transform: scale(1.15); }
.hdn-blur-field input[type="range"]::-moz-range-thumb {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: var(--ls-card-bg, #fff);
  border: 3px solid var(--ls-primary, #3b82f6);
  box-shadow: 0 1px 5px rgba(0, 0, 0, 0.25);
}
.hdn-blur-field b {
  font-size: 13px;
  min-width: 44px;
  text-align: center;
  color: var(--ls-primary, #3b82f6);
  font-variant-numeric: tabular-nums;
}

/* 响应式 */
@media (max-width: 640px) {
  .hdn-hero { padding: 26px 20px; }
  .hdn-hero-title { font-size: 21px; }
  .hdn-grid { grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); }
  .hd-panel { right: -52px; }
  .hdn-toolbar { padding: 8px 10px; }
  .hdn-search { max-width: none; }
  .hdn-count { margin-left: 0; width: 100%; }
}

/* 动效克制 */
@media (prefers-reduced-motion: reduce) {
  .hdn-card, .hd-chip, .hd-btn, .hd-switch-ui::after, .hdn-card-fav, .hd-chip-fav, .hd-lucky, .hdn-sort-btn { transition: none !important; animation: none !important; }
  html[data-hd][data-hd-nav="gradient"] .ls-header::after { animation: none; }
}

/* ------------------------------------------------------------------
   9. 顶部阅读进度条（data-hd-progress：thin | gradient | glow | off）
   引擎在滚动时更新 --hd-progress（0% - 100%），CSS 只负责放映
   ------------------------------------------------------------------ */

html[data-hd][data-hd-progress]:not([data-hd-progress="off"]) body::after {
  content: "";
  position: fixed;
  top: 0;
  left: 0;
  width: var(--hd-progress, 0%);
  height: 3px;
  z-index: 2147483000;
  pointer-events: none;
  background: var(--ls-primary, #3b82f6);
  border-radius: 0 999px 999px 0;
  transition: width 0.08s linear;
}
/* 细线档：单色不发光 */
html[data-hd][data-hd-progress="thin"] body::after {
  height: 2px;
  background: var(--ls-primary, #3b82f6);
}
/* 渐变档：主题色向悬停色流光 */
html[data-hd][data-hd-progress="gradient"] body::after {
  height: 3px;
  background: linear-gradient(90deg, var(--ls-primary, #3b82f6), var(--ls-primary-hover, #2563eb));
  background-size: 200% 100%;
  box-shadow: 0 1px 4px rgba(var(--ls-primary-rgb, 59, 130, 246), 0.35);
}
/* 辉光档：更亮更粗，带拖尾光晕，进度满时短促绽放 */
html[data-hd][data-hd-progress="glow"] body::after {
  height: 4px;
  background: linear-gradient(90deg, var(--ls-primary-hover, #2563eb), var(--ls-primary, #3b82f6));
  box-shadow:
    0 0 10px rgba(var(--ls-primary-rgb, 59, 130, 246), 0.75),
    0 0 22px rgba(var(--ls-primary-rgb, 59, 130, 246), 0.4);
}
html[data-hd][data-hd-progress="glow"][data-hd-progress-done="on"] body::after {
  animation: hdn-progress-pop 0.5s ease;
}
@keyframes hdn-progress-pop {
  0% { filter: brightness(1); }
  40% { filter: brightness(1.7); }
  100% { filter: brightness(1); }
}
@media (prefers-reduced-motion: reduce) {
  html[data-hd][data-hd-progress]:not([data-hd-progress="off"]) body::after { transition: none; animation: none; }
}

/* ------------------------------------------------------------------
   10. 主题切换转场（View Transitions API；data-hd-trans：fade | circle | slide）
   浏览器不支持时引擎自动跳过，这里只在支持时生效
   ------------------------------------------------------------------ */

html[data-hd-trans="fade"]::view-transition-old(root),
html[data-hd-trans="circle"]::view-transition-old(root),
html[data-hd-trans="slide"]::view-transition-old(root) {
  animation: hd-trans-out 0.22s ease both;
}
html[data-hd-trans="fade"]::view-transition-new(root) {
  animation: hd-trans-fade-in 0.3s ease both;
}
html[data-hd-trans="circle"]::view-transition-new(root) {
  animation: hd-trans-circle-in 0.42s ease both;
}
html[data-hd-trans="slide"]::view-transition-new(root) {
  animation: hd-trans-slide-in 0.34s cubic-bezier(0.22, 1, 0.36, 1) both;
}
@keyframes hd-trans-out {
  to { opacity: 0; }
}
@keyframes hd-trans-fade-in {
  from { opacity: 0; }
  to { opacity: 1; }
}
@keyframes hd-trans-circle-in {
  from { clip-path: circle(0% at 50% 42%); }
  to { clip-path: circle(142% at 50% 42%); }
}
@keyframes hd-trans-slide-in {
  from { opacity: 0; transform: translateY(14px); }
  to { opacity: 1; transform: translateY(0); }
}
@media (prefers-reduced-motion: reduce) {
  html[data-hd-trans]::view-transition-old(root),
  html[data-hd-trans]::view-transition-new(root) { animation-duration: 0.01s !important; }
}

/* ------------------------------------------------------------------
   11. 弹层跟随扩展（scope_base）：模态 / 下拉 / 气泡 / Toast / 右键菜单 / 图片查看
   覆盖 lightsns.com 常见弹层容器：jinsom-*、ls-*、通用 class 关键词
   ------------------------------------------------------------------ */

/* 通用弹层容器：背景 / 边框 / 圆角 / 阴影 */
html[data-hd][data-hd-scope-base="on"] .jinsom-modal,
html[data-hd][data-hd-scope-base="on"] .jinsom-popup,
html[data-hd][data-hd-scope-base="on"] .jinsom-dialog,
html[data-hd][data-hd-scope-base="on"] .jinsom-popover,
html[data-hd][data-hd-scope-base="on"] .ls-modal,
html[data-hd][data-hd-scope-base="on"] .ls-dialog,
html[data-hd][data-hd-scope-base="on"] .ls-popover,
html[data-hd][data-hd-scope-base="on"] .ls-dropdown-menu,
html[data-hd][data-hd-scope-base="on"] [class*="jinsom-pop"],
html[data-hd][data-hd-scope-base="on"] [class*="popup-card"] {
  background: var(--ls-card-bg, #fff);
  color: var(--ls-text, #1f2937);
  border: 1px solid var(--ls-border, #e5e7eb);
  box-shadow: var(--hd-shadow, 0 8px 32px rgba(0, 0, 0, 0.12));
}
/* 弹层里的三级文字 */
html[data-hd][data-hd-scope-base="on"] .jinsom-modal .title,
html[data-hd][data-hd-scope-base="on"] .jinsom-modal h2,
html[data-hd][data-hd-scope-base="on"] .jinsom-modal h3,
html[data-hd][data-hd-scope-base="on"] .ls-modal h2,
html[data-hd][data-hd-scope-base="on"] .ls-modal h3,
html[data-hd][data-hd-scope-base="on"] [class*="jinsom-pop"] .title {
  color: var(--ls-text-primary, #1f2937);
}
html[data-hd][data-hd-scope-base="on"] .jinsom-modal p,
html[data-hd][data-hd-scope-base="on"] .ls-modal p,
html[data-hd][data-hd-scope-base="on"] .ls-dropdown-menu a,
html[data-hd][data-hd-scope-base="on"] [class*="jinsom-pop"] p {
  color: var(--ls-text-secondary, #4b5563);
}
html[data-hd][data-hd-scope-base="on"] .jinsom-modal .meta,
html[data-hd][data-hd-scope-base="on"] .jinsom-modal .desc,
html[data-hd][data-hd-scope-base="on"] .ls-modal small,
html[data-hd][data-hd-scope-base="on"] .ls-dropdown-menu a small {
  color: var(--ls-text-muted, #9ca3af);
}
/* 下拉菜单 / 右键菜单项悬停 */
html[data-hd][data-hd-scope-base="on"] .ls-dropdown-menu a:hover,
html[data-hd][data-hd-scope-base="on"] [class*="contextmenu"] li:hover {
  background: rgba(var(--ls-primary-rgb, 59, 130, 246), 0.1);
  color: var(--ls-primary, #3b82f6);
}
/* Toast 提示条 */
html[data-hd][data-hd-scope-base="on"] .ls-toast,
html[data-hd][data-hd-scope-base="on"] [class*="toast"] {
  background: var(--ls-card-bg, #fff);
  color: var(--ls-text-primary, #1f2937);
  border: 1px solid var(--ls-border, #e5e7eb);
  box-shadow: var(--hd-shadow, 0 8px 32px rgba(0, 0, 0, 0.12));
}
/* 表格与分隔线细节 */
html[data-hd][data-hd-scope-base="on"] table {
  border-color: var(--ls-border, #e5e7eb);
}
html[data-hd][data-hd-scope-base="on"] table th {
  color: var(--ls-text-primary, #1f2937);
  background: rgba(var(--ls-primary-rgb, 59, 130, 246), 0.05);
}
html[data-hd][data-hd-scope-base="on"] table td {
  color: var(--ls-text-secondary, #4b5563);
  border-color: var(--ls-border-light, #eef0f2);
}
/* 评论输入框 */
html[data-hd][data-hd-scope-base="on"] .jinsom-comment-input,
html[data-hd][data-hd-scope-base="on"] [class*="comment"] textarea,
html[data-hd][data-hd-scope-base="on"] [class*="comment-input"] {
  background: var(--ls-bg-light, #f6f7f8);
  color: var(--ls-text-primary, #1f2937);
  border-color: var(--ls-border, #e5e7eb);
}
/* 图片大图查看器的关闭按钮与工具条 */
html[data-hd][data-hd-scope-base="on"] [class*="viewer"],
html[data-hd][data-hd-scope-base="on"] [class*="lightbox"] {
  background-color: rgba(var(--ls-primary-rgb, 59, 130, 246), 0.06);
}

/* ------------------------------------------------------------------
   12. /daynight 页新增：Top3 徽章 / 分享按钮 / 应用横幅 / 导航特效覆盖
   ------------------------------------------------------------------ */

/* 人气 Top3 徽章行 */
.hdn-top3 {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px dashed rgba(var(--ls-primary-rgb, 59, 130, 246), 0.25);
}
.hdn-top3-label {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 12px;
  font-weight: 700;
  color: var(--ls-primary, #3b82f6);
}
.hdn-top3-item {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 7px 12px;
  border-radius: 999px;
  border: 1px solid var(--ls-border, #e5e7eb);
  background: var(--ls-card-bg, #fff);
  color: var(--ls-text-secondary, #4b5563);
  font-size: 12px;
  cursor: pointer;
  transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
}
.hdn-top3-item:hover {
  transform: translateY(-2px);
  border-color: rgba(var(--ls-primary-rgb, 59, 130, 246), 0.5);
  box-shadow: 0 4px 14px rgba(var(--ls-primary-rgb, 59, 130, 246), 0.18);
}
.hdn-top3-item.is-dark { background: rgba(0, 0, 0, 0.18); }
.hdn-top3-rank {
  font-style: normal;
  width: 18px;
  height: 18px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  font-size: 11px;
  font-weight: 800;
  color: #fff;
  background: linear-gradient(135deg, #c0c7d1, #9aa3b0);
}
.hdn-top3-rank.is-1 { background: linear-gradient(135deg, #ffd76e, #f5a623); box-shadow: 0 1px 6px rgba(245, 166, 35, 0.45); }
.hdn-top3-rank.is-2 { background: linear-gradient(135deg, #e3e8ef, #b8c0cc); }
.hdn-top3-rank.is-3 { background: linear-gradient(135deg, #edb884, #c97b3d); }
.hdn-top3-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  flex: none;
  box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.55);
}
.hdn-top3-name { font-weight: 700; color: var(--ls-text-primary, #1f2937); max-width: 9em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hdn-top3-count { color: var(--ls-text-muted, #9ca3af); font-variant-numeric: tabular-nums; }
/* Top3「来自分享」徽记：礼物图标 + 计数，主题色浅底 */
.hdn-top3-share {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  margin-left: 2px;
  padding: 1px 7px;
  border-radius: 99px;
  font-size: 10.5px;
  line-height: 1.5;
  font-variant-numeric: tabular-nums;
  color: var(--ls-primary, #3b82f6);
  background: rgba(var(--ls-primary-rgb, 59, 130, 246), 0.1);
  transition: background 0.15s ease, transform 0.15s ease;
}
.hdn-top3-share i { font-size: 11px; }
.hdn-top3-item:hover .hdn-top3-share {
  background: rgba(var(--ls-primary-rgb, 59, 130, 246), 0.18);
  transform: translateY(-1px);
}

/* 卡片分享按钮 */
.hdn-card-share {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 10px;
  border-radius: 999px;
  border: 1px solid var(--ls-border, #e5e7eb);
  background: var(--ls-bg-light, #f6f7f8);
  color: var(--ls-text-secondary, #4b5563);
  font-size: 12px;
  cursor: pointer;
  opacity: 0;
  transform: translateY(2px);
  transition: opacity 0.18s ease, transform 0.18s ease, color 0.18s ease, border-color 0.18s ease;
}
.hdn-card:hover .hdn-card-share,
.hdn-card:focus-within .hdn-card-share { opacity: 1; transform: translateY(0); }
.hdn-card-share:hover {
  color: var(--ls-primary, #3b82f6);
  border-color: rgba(var(--ls-primary-rgb, 59, 130, 246), 0.5);
}

/* 分享应用横幅 */
.hdn-share-banner {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  padding: 12px 16px;
  margin-bottom: 16px;
  border-radius: var(--ls-radius, 12px);
  border: 1px solid rgba(var(--ls-primary-rgb, 59, 130, 246), 0.35);
  background: linear-gradient(135deg, rgba(var(--ls-primary-rgb, 59, 130, 246), 0.12), rgba(var(--ls-primary-rgb, 59, 130, 246), 0.04));
  color: var(--ls-text-primary, #1f2937);
  font-size: 13px;
  animation: hdn-banner-in 0.32s cubic-bezier(0.22, 1, 0.36, 1) both;
}
@keyframes hdn-banner-in {
  from { opacity: 0; transform: translateY(-8px); }
  to { opacity: 1; transform: translateY(0); }
}
.hdn-share-banner span { display: inline-flex; align-items: center; gap: 6px; }
.hdn-share-apply {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 6px 14px;
  border: none;
  border-radius: 999px;
  background: var(--ls-primary, #3b82f6);
  color: #fff;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  transition: filter 0.15s ease, transform 0.15s ease;
}
.hdn-share-apply:hover { filter: brightness(1.1); transform: translateY(-1px); }
.hdn-share-dismiss {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  border: none;
  border-radius: 50%;
  background: transparent;
  color: var(--ls-text-muted, #9ca3af);
  cursor: pointer;
  transition: background 0.15s ease, color 0.15s ease;
}
.hdn-share-dismiss:hover { background: rgba(0, 0, 0, 0.08); color: var(--ls-text-primary, #1f2937); }

/* 导航特效覆盖：分段选择器 */
.hdn-nav-opts {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  justify-content: flex-end;
  max-width: 340px;
}
.hdn-nav-btn {
  padding: 5px 12px;
  border-radius: 999px;
  border: 1px solid var(--ls-border, #e5e7eb);
  background: var(--ls-bg-light, #f6f7f8);
  color: var(--ls-text-secondary, #4b5563);
  font-size: 12px;
  cursor: pointer;
  transition: all 0.15s ease;
}
.hdn-nav-btn:hover {
  color: var(--ls-primary, #3b82f6);
  border-color: rgba(var(--ls-primary-rgb, 59, 130, 246), 0.45);
}
.hdn-nav-btn.is-on {
  background: var(--ls-primary, #3b82f6);
  border-color: var(--ls-primary, #3b82f6);
  color: #fff;
  font-weight: 600;
  box-shadow: 0 2px 8px rgba(var(--ls-primary-rgb, 59, 130, 246), 0.35);
}

/* Top3 徽章点击后对应卡片的短暂高亮 */
.hdn-card.is-flash {
  animation: hdn-card-flash 1.2s ease;
}
@keyframes hdn-card-flash {
  0%, 100% { box-shadow: none; }
  25% { box-shadow: 0 0 0 3px rgba(var(--ls-primary-rgb, 59, 130, 246), 0.55), var(--hd-shadow, 0 8px 32px rgba(0, 0, 0, 0.12)); }
  60% { box-shadow: 0 0 0 2px rgba(var(--ls-primary-rgb, 59, 130, 246), 0.3), var(--hd-shadow, 0 8px 32px rgba(0, 0, 0, 0.12)); }
}
@media (prefers-reduced-motion: reduce) {
  .hdn-card.is-flash { animation: none; }
  .hdn-share-banner { animation: none; }
}

/* 卡片 meta 行变为 flex 以容纳分享按钮 */
.hdn-card-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }
.hdn-card-tags { flex: 1 1 auto; }

/* 移动端适配 */
@media (max-width: 640px) {
  /* 顶部英雄区 */
  .hdn-root { padding: 16px 12px 44px; }
  .hdn-hero { padding: 22px 16px; }
  .hdn-hero-title { font-size: 20px; }
  .hdn-hero-stats { flex-wrap: wrap; gap: 12px; }
  .hdn-top3 { flex-wrap: wrap; }
  .hdn-top3-item { padding: 5px 9px; font-size: 11px; }
  .hdn-top3-count { display: none; }
  /* 风格库 */
  .hdn-sec { padding: 14px 12px; }
  .hdn-grid { grid-template-columns: repeat(auto-fill, minmax(138px, 1fr)); gap: 10px; }
  .hdn-card { padding: 12px; }
  .hdn-card-meta { flex-wrap: wrap; }
  .hdn-card-share { opacity: 1; transform: none; }
  /* 工具栏 */
  .hdn-toolbar { flex-wrap: wrap; gap: 8px; padding: 8px 10px; }
  .hdn-search { max-width: none; flex: 1 1 100%; }
  .hdn-count { margin-left: 0; }
  /* 偏好区：窄屏改上下两行，开关右对齐 */
  .hdn-opt { flex-wrap: wrap; }
  .hdn-opt-main { flex: 1 1 auto; }
  .hdn-nav-opts { max-width: none; justify-content: flex-start; flex-wrap: wrap; }
  /* 分享横幅与重置行 */
  .hdn-share-banner { flex-wrap: wrap; gap: 8px; }
  .hdn-reset-row { flex-direction: column; gap: 10px; text-align: center; }
  /* 面板在小屏不超出视口 */
  .hd-panel { right: -52px; width: min(300px, calc(100vw - 32px)); }
}

/* ============================================================================
   细节批 3：质感与反馈打磨（v1.0.7）
   ============================================================================ */

/* -- 面板毛玻璃质感：用户开了毛玻璃时，面板自己也吃一套磨砂 ---------------- */
html[data-hd-glass="on"] .hd-panel {
  background: var(--hd-glass-card, rgba(255, 255, 255, 0.62));
  backdrop-filter: blur(var(--hd-glass-blur, 18px)) saturate(1.6);
  -webkit-backdrop-filter: blur(var(--hd-glass-blur, 18px)) saturate(1.6);
  border: 1px solid rgba(255, 255, 255, 0.28);
  box-shadow: 0 18px 50px rgba(0, 0, 0, 0.22);
}
html[data-hd-glass="on"][data-hd-mode="dark"] .hd-panel {
  border-color: rgba(255, 255, 255, 0.12);
  box-shadow: 0 18px 50px rgba(0, 0, 0, 0.5);
}
/* 毛玻璃下面板内部的小面板（开关行、风格块）再垫一层极薄底，保证可读性 */
html[data-hd-glass="on"] .hd-panel .hd-switch-row,
html[data-hd-glass="on"] .hd-panel .hd-chip { backdrop-filter: blur(2px); -webkit-backdrop-filter: blur(2px); }

/* -- 按压反馈：可点元素按下去轻微缩一下，手感立现 --------------------------- */
.hd-btn:active, .hd-chip:active, .hd-reset:active, .hd-lucky:active,
.hdn-card:active, .hdn-share-apply:active, .hdn-share-dismiss:active,
.hdn-nav-btn:active, .hdn-sort-btn:active, .hdn-card-share:active {
  transform: scale(0.96);
  transition-duration: 0.08s;
}
.hd-btn, .hd-chip, .hd-reset, .hd-lucky, .hdn-card, .hdn-share-apply,
.hdn-share-dismiss, .hdn-nav-btn, .hdn-sort-btn, .hdn-card-share {
  will-change: transform;
}
@media (prefers-reduced-motion: reduce) {
  .hd-btn:active, .hd-chip:active, .hd-reset:active, .hd-lucky:active,
  .hdn-card:active, .hdn-share-apply:active, .hdn-share-dismiss:active,
  .hdn-nav-btn:active, .hdn-sort-btn:active, .hdn-card-share:active { transform: none; }
}

/* -- 键盘焦点环：tab 到任何可点元素都有一圈主题色描边，无障碍不糊 ------------ */
.hd-btn:focus-visible, .hd-chip:focus-visible, .hd-reset:focus-visible,
.hd-lucky:focus-visible, .hdn-card:focus-visible, .hdn-sort-btn:focus-visible,
.hdn-nav-btn:focus-visible, .hdn-card-share:focus-visible, .hdn-card-fav:focus-visible,
.hd-chip-fav:focus-visible, .hdn-share-apply:focus-visible, .hdn-share-dismiss:focus-visible {
  outline: 2px solid var(--ls-primary, #3b82f6);
  outline-offset: 2px;
}

/* -- /daynight 卡片悬停渐变描边：主题色流动描边（mask 双层实现，圆角自适应） - */
.hdn-card { position: relative; }
.hdn-card::after {
  content: '';
  position: absolute;
  inset: -1px;
  border-radius: inherit;
  padding: 1px;
  background: linear-gradient(135deg,
    rgba(var(--ls-primary-rgb, 59, 130, 246), 0.85),
    rgba(var(--ls-primary-rgb, 59, 130, 246), 0.15) 40%,
    rgba(var(--ls-primary-rgb, 59, 130, 246), 0.65));
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  mask-composite: exclude;
  opacity: 0;
  transition: opacity 0.25s ease;
  pointer-events: none;
}
.hdn-card:hover::after, .hdn-card.is-active::after, .hdn-card.is-flash::after { opacity: 1; }
.hdn-card.is-active::after { opacity: 0.55; }
/* 悬停时卡片轻轻上浮 */
.hdn-card { transition: transform 0.2s ease, box-shadow 0.2s ease; }
.hdn-card:hover { transform: translateY(-3px); }
@media (prefers-reduced-motion: reduce) { .hdn-card:hover { transform: none; } }

/* -- /daynight 英雄区主题色光晕：给页面一点「氛围灯」 ----------------------- */
.hdn-hero { position: relative; overflow: hidden; }
.hdn-hero::before {
  content: '';
  position: absolute;
  width: 420px;
  height: 420px;
  border-radius: 50%;
  right: -120px;
  top: -180px;
  background: radial-gradient(circle, rgba(var(--ls-primary-rgb, 59, 130, 246), 0.14), transparent 65%);
  pointer-events: none;
}
.hdn-hero::after {
  content: '';
  position: absolute;
  width: 300px;
  height: 300px;
  border-radius: 50%;
  left: -140px;
  bottom: -180px;
  background: radial-gradient(circle, rgba(var(--ls-primary-rgb, 59, 130, 246), 0.08), transparent 60%);
  pointer-events: none;
}
.hdn-hero > * { position: relative; z-index: 1; }

/* -- 面板风格块色圆微动效：悬停转一下、选中弹一下 --------------------------- */
.hd-chip-color { transition: transform 0.18s ease; }
.hd-chip:hover .hd-chip-color { transform: rotate(14deg) scale(1.06); }
.hd-chip.is-on .hd-chip-color { transform: scale(1.1); }
.hd-chip-ico { transition: transform 0.18s ease; }
.hd-chip:hover .hd-chip-ico { transform: scale(1.12); }

/* -- 面板头部标题渐变小图标 ------------------------------------------------- */
.hd-panel-title i {
  background: linear-gradient(135deg, var(--ls-primary, #3b82f6), var(--ls-primary-hover, #2563eb));
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: var(--ls-primary, #3b82f6); /* 不支持 background-clip:text 时回落 */
}

/* -- 「更多设置」链接箭头滑动小动效 ----------------------------------------- */
.hd-panel-more i { transition: transform 0.2s ease; }
.hd-panel-more:hover i { transform: translateX(3px); }

/* -- 分享横幅入场动效 ------------------------------------------------------- */
@keyframes hdBannerIn {
  from { opacity: 0; transform: translateY(-8px); }
  to { opacity: 1; transform: translateY(0); }
}
.hdn-share-banner { animation: hdBannerIn 0.3s ease; }
@media (prefers-reduced-motion: reduce) { .hdn-share-banner { animation: none; } }

/* -- 面板分隔线统一弱化，视觉更整 ------------------------------------------- */
.hd-panel-sec-title {
  display: flex;
  align-items: center;
  gap: 8px;
}
.hd-panel-sec-title::after {
  content: '';
  flex: 1;
  height: 1px;
  background: linear-gradient(90deg, rgba(var(--ls-primary-rgb, 59, 130, 246), 0.35), transparent);
}

   细节批 7：最近在用快捷回切条 · 面板头部右侧布局
   ========================================================================== */

/* -- 面板头部右侧：更多设置 + 迷你对比入口 --------------------------------- */
.hd-panel-head-r { display: inline-flex; align-items: center; gap: 12px; margin-left: auto; }
/* -- 英雄区「最近在用」快捷回切条 ------------------------------------------ */
.hdn-recent {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px dashed rgba(var(--ls-primary-rgb, 59, 130, 246), 0.18);
}
.hdn-recent[hidden] { display: none; }
.hdn-recent-label {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 12px;
  font-weight: 700;
  color: var(--ls-text-muted, #9ca3af);
}
.hdn-recent-label i { font-size: 14px; color: rgba(var(--ls-primary-rgb, 59, 130, 246), 0.75); }
.hdn-recent-item {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 6px 12px;
  border-radius: 999px;
  border: 1px solid var(--ls-border, #d1d5db);
  background: var(--ls-card-bg, #fff);
  color: var(--ls-text, #1f2937);
  font-size: 12.5px;
  cursor: pointer;
  transition: transform 0.16s ease, border-color 0.16s ease, box-shadow 0.16s ease, background 0.16s ease;
}
.hdn-recent-item:hover {
  transform: translateY(-2px);
  border-color: rgba(var(--ls-primary-rgb, 59, 130, 246), 0.5);
  box-shadow: 0 8px 18px -10px rgba(var(--ls-primary-rgb, 59, 130, 246), 0.45);
}
.hdn-recent-item.is-cur {
  border-color: rgba(var(--ls-primary-rgb, 59, 130, 246), 0.65);
  background: rgba(var(--ls-primary-rgb, 59, 130, 246), 0.07);
}
.hdn-recent-item:focus-visible { outline: 2px solid rgba(var(--ls-primary-rgb, 59, 130, 246), 0.55); outline-offset: 2px; }
.hdn-recent-dot { width: 11px; height: 11px; border-radius: 50%; flex-shrink: 0; box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.08); }
.hdn-recent-name { font-weight: 700; max-width: 10em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hdn-recent-item .hdn-tag { flex-shrink: 0; transform: scale(0.9); }
html[data-hd-mode='dark'] .hdn-recent-item.is-dark { background: rgba(255, 255, 255, 0.06); }

/* -- 小屏：回切条收紧、托盘箭头常显（触屏无 hover） ------------------------- */
@media (max-width: 720px) {
  .hdn-recent-item { padding: 5px 10px; font-size: 12px; }
  .hdn-recent-item .hdn-tag { display: none; }
}

/* -- reduced-motion：批 7 新增动画退化 -------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  .hdn-recent-item { transition: none !important; }
  .hdn-recent-item:hover { transform: none; }
}

/* ==========================================================================
   8. 原样模式（默认模式）+ 内容筛选器跟随（v1.1.3）
   ========================================================================== */

/* -- 内容管理筛选下拉：背景/文字/边框随主题走（原生 select） ----------------
   挂 html[data-hd] 门槛：原样模式下自动失效，站点控件保持原样 */
html[data-hd] .ls-cc-filter-select {
  background-color: var(--ls-card-bg, #ffffff) !important;
  color: var(--ls-text, #1f2937) !important;
  border: 1px solid var(--ls-border, #e5e7eb) !important;
  border-radius: var(--hd-radius, 10px);
}
html[data-hd] .ls-cc-filter-select:hover,
html[data-hd] .ls-cc-filter-select:focus {
  border-color: rgba(var(--ls-primary-rgb, 59, 130, 246), 0.55) !important;
  outline: none;
  box-shadow: 0 0 0 3px rgba(var(--ls-primary-rgb, 59, 130, 246), 0.12);
}
/* 展开的原生 option 列表：Chromium/Firefox 可控，Safari 部分可控（尽力而为） */
html[data-hd] .ls-cc-filter-select option {
  background-color: var(--ls-card-bg, #ffffff);
  color: var(--ls-text, #1f2937);
}
html[data-hd][data-hd-mode="dark"] .ls-cc-filter-select {
  background-color: var(--ls-bg, #0f1115) !important;
}
html[data-hd][data-hd-mode="dark"] .ls-cc-filter-select option {
  background-color: var(--ls-bg, #0f1115);
}

/* -- 面板风格块：原样风格 ---------------------------------------------- */
/* 色圆对角分割：左上半站点底色 / 右下半暗黑夜色，一眼看出「原样 ↔ 暗黑」的两极 */
.hd-chip.is-plain .hd-chip-color {
  background: linear-gradient(135deg, #f8fafc 0%, #f8fafc 49%, #0f1115 51%, #0f1115 100%);
  border-color: rgba(0, 0, 0, 0.14);
}
.hd-chip.is-plain .hd-chip-ico {
  color: #64748b;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.6);
}
.hd-chip.is-plain .hd-chip-primary { display: none; }
/* 选中态：分割圆点亮一圈柔光 */
.hd-chip.is-plain.is-on .hd-chip-color {
  box-shadow: 0 0 0 3px rgba(100, 116, 139, 0.25);
}

/* -- /daynight 卡片：原样风格示意 --------------------------------------- */
/* 预览区：细格纹底（像「透明画布」），内部元素用中性灰（CSS 默认已是灰调） */
.hdn-preview.is-plain {
  background:
    repeating-conic-gradient(rgba(148, 163, 184, 0.14) 0% 25%, transparent 0% 50%) 0 0 / 16px 16px,
    linear-gradient(160deg, #fbfcfd, #f1f5f9);
}
.hdn-pv-plain-tag {
  position: absolute;
  left: 50%;
  bottom: 8px;
  transform: translateX(-50%);
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.02em;
  color: #475569;
  background: rgba(255, 255, 255, 0.86);
  border: 1px solid rgba(100, 116, 139, 0.3);
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.08);
  white-space: nowrap;
}
.hdn-pv-plain-tag .remix-icon { font-size: 12px; }
/* 卡片名称图标：原样风格没有主题色，给中性色 */
.hdn-card-plain .hdn-card-ico { color: #64748b; }
/* 「不改变外观」标签：中性灰调（区别于日/夜的蓝白与黑金） */
.hdn-tag.is-plain {
  background: #f1f5f9;
  color: #475569;
  border-color: #e2e8f0;
}
/* 原样卡 hover：微微上浮 + 中性描边（不抢主题色） */
.hdn-card-plain:hover .hdn-preview { border-color: rgba(100, 116, 139, 0.4); }

/* -- reduced-motion：原样示意无动画，无需豁免（占位保持一致性） ------------- */

/* ==========================================================================
   9. /chat 消息页主题跟随（v1.1.4）
   --------------------------------------------------------------------------
   宿主 chat.css 是「变量驱动」的：全部颜色引用 :root 上的 --lsc-* 浅色
   变量表（--lsc-bg / --lsc-bg-white / --lsc-text / --lsc-text-muted /
   --lsc-border / --lsc-bubble-* 等）。引擎此前只重定义 --ls-* 系核心变量，
   聊天页四栏（图标导航 | 会话列表 | 聊天区 | 详情面板）因此完全不变色。
   修复方式：把整套 --lsc-* 映射到引擎变量表 —— 一次映射，chat.css 里
   200+ 处引用全部自动跟随；仅少量硬编码残留（滚动条拇指、emoji 悬停）
   定点补齐。挂 scope-chat 门槛，后台「跟随范围」可独立开关。
   备注：--lsc-primary / --lsc-primary-hover / --lsc-primary-rgb 不映射，
   它们是站长皮肤色（站点内联样式注入），品牌色日夜间都应保留。
   ========================================================================== */

/* -- 变量表整体映射（任意非原样风格生效：日间自定义风格同样换装） ---------- */
html[data-hd][data-hd-scope-chat="on"] {
  --lsc-bg: var(--ls-bg, #f6f7f8);
  --lsc-bg-white: var(--ls-bg-white, #ffffff);
  --lsc-bg-hover: rgba(var(--ls-primary-rgb, 59, 130, 246), 0.08);
  --lsc-bg-soft: rgba(var(--ls-primary-rgb, 59, 130, 246), 0.05);
  --lsc-text: var(--ls-text, #1f2937);
  --lsc-text-sub: var(--ls-text-secondary, #4b5563);
  --lsc-text-secondary: var(--ls-text-secondary, #4b5563);
  --lsc-text-muted: var(--ls-text-muted, #9ca3af);
  --lsc-text-light: var(--ls-text-muted, #9ca3af);
  --lsc-border: var(--ls-border, #e5e7eb);
  --lsc-border-light: var(--ls-border-light, #eef0f2);
  --lsc-bubble-self: var(--ls-primary, #3b82f6);
  --lsc-bubble-self-text: #ffffff;
  --lsc-bubble-other: color-mix(in srgb, var(--ls-card-bg, #ffffff) 82%, var(--ls-text, #1f2937) 18%);
  --lsc-bubble-other-text: var(--ls-text, #1f2937);
  --lsc-primary-light: rgba(var(--ls-primary-rgb, 59, 130, 246), 0.14);
  --lsc-shadow: 0 1px 5px 1px rgba(0, 0, 0, 0.1);
  --lsc-shadow-md: 0 4px 16px rgba(0, 0, 0, 0.14);
}

/* -- 暗黑模式：阴影加深（浅色映射的阴影在暗底上不明显） -------------------- */
html[data-hd][data-hd-scope-chat="on"][data-hd-mode="dark"] {
  --lsc-shadow: 0 1px 5px 1px rgba(0, 0, 0, 0.4);
  --lsc-shadow-md: 0 4px 16px rgba(0, 0, 0, 0.5);
}

/* -- 暗黑模式：硬编码残留定点覆盖 ------------------------------------------
   chat.css 的滚动条拇指写死 rgba(0,0,0,0.08)（暗底上不可见）、
   emoji 悬停写死浅灰 #f4f4f5 / 深字 #18181b，逐个补齐 */
html[data-hd][data-hd-scope-chat="on"][data-hd-mode="dark"] .ls-chat-messages::-webkit-scrollbar-thumb,
html[data-hd][data-hd-scope-chat="on"][data-hd-mode="dark"] .ls-chat-session-list.ls-scrolling::-webkit-scrollbar-thumb,
html[data-hd][data-hd-scope-chat="on"][data-hd-mode="dark"] .ls-chat-group-list.ls-scrolling::-webkit-scrollbar-thumb,
html[data-hd][data-hd-scope-chat="on"][data-hd-mode="dark"] .ls-chat-editor::-webkit-scrollbar-thumb,
html[data-hd][data-hd-scope-chat="on"][data-hd-mode="dark"] .ls-chat-panel-body::-webkit-scrollbar-thumb,
html[data-hd][data-hd-scope-chat="on"][data-hd-mode="dark"] .ls-emoji-body::-webkit-scrollbar-thumb,
html[data-hd][data-hd-scope-chat="on"][data-hd-mode="dark"] .ls-chat-mention-panel::-webkit-scrollbar-thumb,
html[data-hd][data-hd-scope-chat="on"][data-hd-mode="dark"] .ls-group-members-panel-list::-webkit-scrollbar-thumb,
html[data-hd][data-hd-scope-chat="on"][data-hd-mode="dark"] .ls-create-group-list::-webkit-scrollbar-thumb,
html[data-hd][data-hd-scope-chat="on"][data-hd-mode="dark"] .ls-group-all-members::-webkit-scrollbar-thumb,
html[data-hd][data-hd-scope-chat="on"][data-hd-mode="dark"] .ls-group-blacklist::-webkit-scrollbar-thumb,
html[data-hd][data-hd-scope-chat="on"][data-hd-mode="dark"] .ls-group-notice-full::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.16) !important;
}
html[data-hd][data-hd-scope-chat="on"][data-hd-mode="dark"] .ls-chat-messages::-webkit-scrollbar-thumb:hover,
html[data-hd][data-hd-scope-chat="on"][data-hd-mode="dark"] .ls-chat-session-list.ls-scrolling::-webkit-scrollbar-thumb:hover,
html[data-hd][data-hd-scope-chat="on"][data-hd-mode="dark"] .ls-chat-group-list.ls-scrolling::-webkit-scrollbar-thumb:hover,
html[data-hd][data-hd-scope-chat="on"][data-hd-mode="dark"] .ls-chat-editor::-webkit-scrollbar-thumb:hover,
html[data-hd][data-hd-scope-chat="on"][data-hd-mode="dark"] .ls-chat-panel-body::-webkit-scrollbar-thumb:hover,
html[data-hd][data-hd-scope-chat="on"][data-hd-mode="dark"] .ls-emoji-body::-webkit-scrollbar-thumb:hover,
html[data-hd][data-hd-scope-chat="on"][data-hd-mode="dark"] .ls-chat-mention-panel::-webkit-scrollbar-thumb:hover,
html[data-hd][data-hd-scope-chat="on"][data-hd-mode="dark"] .ls-group-members-panel-list::-webkit-scrollbar-thumb:hover,
html[data-hd][data-hd-scope-chat="on"][data-hd-mode="dark"] .ls-create-group-list::-webkit-scrollbar-thumb:hover,
html[data-hd][data-hd-scope-chat="on"][data-hd-mode="dark"] .ls-group-all-members::-webkit-scrollbar-thumb:hover,
html[data-hd][data-hd-scope-chat="on"][data-hd-mode="dark"] .ls-group-blacklist::-webkit-scrollbar-thumb:hover,
html[data-hd][data-hd-scope-chat="on"][data-hd-mode="dark"] .ls-group-notice-full::-webkit-scrollbar-thumb:hover {
  background: rgba(255, 255, 255, 0.28) !important;
}
html[data-hd][data-hd-scope-chat="on"][data-hd-mode="dark"] .ls-emoji-item:hover {
  background: rgba(255, 255, 255, 0.08) !important;
}
html[data-hd][data-hd-scope-chat="on"][data-hd-mode="dark"] .ls-emoji-tab:hover {
  color: var(--ls-text, #e5e7eb) !important;
}