/* ============================================================
 * EduMaster 统一前端设计系统 (frontend.css)
 * ------------------------------------------------------------
 * 作用：
 *  1) 定义全站品牌设计令牌（深蓝 #0E2A47 / 蓝 #1B4A77 / 金 #C8A45C
 *     + 中性色 / 间距 / 圆角 / 阴影 / 字体）。
 *  2) 全局把各模块自己定义的主色变量（--*-primary / --*-brand /
 *     --*-main / --*-accent 等）统一重定向到品牌色（带 !important，
 *     确保覆盖晚加载的模块 CSS），从而一次性让 70+ 路由页配色统一，
 *     无需逐个改写模板。
 *  3) 提供可复用的 .ls-* 公共组件类（卡片/按钮/区块/徽标/栅格/标签/
 *     列表/选项卡/统计/提示/表单），供模块模板按需采纳，逐步收敛结构。
 *
 * 加载顺序：在 tailwind-output.css / style.css 之后（theme.php 注册），
 * 但 remap 使用 !important，与加载先后无关，始终生效。
 * ============================================================ */

/* ---------- 1. 品牌设计令牌 ---------- */
:root {
  /* 品牌三主色 */
  --ls-navy:        #0E2A47;   /* 深蓝（标题/底栏/强调） */
  --ls-blue:        #1B4A77;   /* 品牌蓝（主按钮/链接/主色） */
  --ls-gold:        #C8A45C;   /* 金（点缀/分隔/高亮） */

  /* 品牌衍生浅色（用于底色/描边/悬停） */
  --ls-blue-soft:   #EAF0F6;
  --ls-blue-soft-2: #F4F8FC;
  --ls-blue-line:   #D6E0EC;
  --ls-gold-soft:   #F4ECDD;
  --ls-gold-line:   #E4D4AE;
  --ls-navy-soft:   #16293F;

  /* 中性色阶 */
  --ls-ink:    #1A2230;
  --ls-body:   #3A4452;
  --ls-muted:  #6B7686;
  --ls-faint:  #98A2B3;
  --ls-line:   #E6EAF0;
  --ls-line-2: #EEF1F6;
  --ls-bg:     #F5F7FA;
  --ls-bg-2:   #FBFCFE;
  --ls-card:   #FFFFFF;
  --ls-invert: #FFFFFF;

  /* 语义状态色（保留，不纳入品牌重定向） */
  --ls-success: #2E9E6B;
  --ls-success-soft: #E7F5EE;
  --ls-danger:  #D9534F;
  --ls-danger-soft:  #FBEAEA;
  --ls-warn:    #D99A2B;
  --ls-warn-soft:    #FBF1DD;
  --ls-info:    #2F6FB0;
  --ls-info-soft:    #E8F1F9;

  /* 间距标尺（4 的倍数） */
  --ls-s1: 4px;  --ls-s2: 8px;  --ls-s3: 12px; --ls-s4: 16px;
  --ls-s5: 20px; --ls-s6: 24px; --ls-s8: 32px; --ls-s10: 40px; --ls-s12: 48px;

  /* 圆角 */
  --ls-r-sm: 8px;
  --ls-r:    12px;
  --ls-r-lg: 16px;
  --ls-r-xl: 20px;
  --ls-r-pill: 999px;

  /* 阴影 */
  --ls-sh-sm: 0 1px 2px rgba(14,42,71,.06);
  --ls-sh:    0 4px 16px rgba(14,42,71,.08);
  --ls-sh-lg: 0 10px 30px rgba(14,42,71,.12);
  --ls-sh-blue: 0 8px 24px rgba(27,74,119,.16);

  /* 字体 */
  --ls-font: -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei",
             "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --ls-font-serif: "Songti SC", "SimSun", Georgia, "Times New Roman", serif;

  /* 容器与栅格断点（与现有 max-w-7xl 对齐） */
  --ls-container: 1280px;
}

/* ---------- 2. 全局品牌色重定向（统一 70+ 模块主色） ---------- */
/* 说明：以下变量原为各模块自定主色（蓝青/绿/紫/红等），现统一收口到品牌蓝/深蓝。
 * 使用 !important 确保即便模块 CSS 在 footer 晚加载也能覆盖。
 * 仅重定向"身份主色"，不碰语义状态色（成功/危险/警告），避免破坏业务含义。 */
:root {
  /* 数字资源 dresources */
  --dr-primary:   var(--ls-blue)   !important;
  --dr-primary-d: var(--ls-navy)   !important;
  --dr-accent:    var(--ls-gold)   !important;

  /* 威客 witkey */
  --wk-primary:        var(--ls-blue)   !important;
  --wk-primary-light:  var(--ls-blue-soft) !important;
  --wk-primary-dark:   var(--ls-navy)   !important;
  --wk-accent:         var(--ls-gold)   !important;

  /* 二手市场 market */
  --mk-brand:      var(--ls-navy)   !important;
  --mk-brand-soft: var(--ls-blue-soft) !important;

  /* 招聘 jobs */
  --lsj-primary:       var(--ls-blue)   !important;
  --lsj-primary-soft:  var(--ls-blue-soft) !important;
  --lsj-primary-line:  var(--ls-blue-line) !important;
  --lsj-primary-dark:  var(--ls-navy)   !important;

  /* 考公 kaogong（深蓝系，归一到品牌深蓝/蓝） */
  --kg-primary:   var(--ls-navy)   !important;
  --kg-primary-l: var(--ls-blue)   !important;
  --kg-primary-h: var(--ls-navy-soft) !important;

  /* 智能体 OA / agent-oa */
  --ao-primary:   var(--ls-blue)   !important;
  --ao-primary-l: var(--ls-blue-soft) !important;
  --ao-primary-d: var(--ls-navy)   !important;

  /* AI 工具 / 成就 */
  --ai-primary:       var(--ls-blue)   !important;
  --ai-primary-dark:  var(--ls-navy)   !important;
  --ach-brand:        var(--ls-blue)   !important;
  --ach-brand-dark:   var(--ls-navy)   !important;

  /* 概览 / 通知 / 商城后台 */
  --ov-primary:    var(--ls-blue)   !important;
  --tn-brand:      var(--ls-blue)   !important;
  --sd-primary:        var(--ls-blue)   !important;
  --sd-primary-soft:   var(--ls-blue-soft) !important;

  /* 考试中心 exam-hub 的 --eh-main 已是 #1B4A77（== 品牌蓝），无需重定向，保留。 */
}

/* ---------- 3. 公共组件类 .ls-* ---------- */
/* 模块模板可逐步替换自有类名为以下组件类，结构与配色即统一。 */

/* 页面容器 */
.ls-page {
  max-width: var(--ls-container);
  margin: 0 auto;
  padding: var(--ls-s6) var(--ls-s5) var(--ls-s12);
}
@media (max-width: 640px) { .ls-page { padding: var(--ls-s5) var(--ls-s4) var(--ls-s10); } }

/* 区块 + 区块标题 */
.ls-section { margin-bottom: var(--ls-s8); }
.ls-section-head {
  display: flex; align-items: center; justify-content: space-between;
  gap: var(--ls-s3); margin-bottom: var(--ls-s4);
}
.ls-section-title {
  display: flex; align-items: center; gap: var(--ls-s2);
  font-size: 18px; font-weight: 700; color: var(--ls-navy);
  margin: 0; line-height: 1.3;
}
.ls-section-title::before {
  content: ""; width: 4px; height: 18px; border-radius: 2px;
  background: linear-gradient(180deg, var(--ls-blue), var(--ls-gold));
}
.ls-section-more {
  font-size: 13px; color: var(--ls-blue); text-decoration: none;
  display: inline-flex; align-items: center; gap: 2px;
}
.ls-section-more:hover { text-decoration: underline; }

/* 栅格 */
.ls-grid {
  display: grid; gap: var(--ls-s4);
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
}
.ls-grid-2 { grid-template-columns: repeat(2, 1fr); }
.ls-grid-3 { grid-template-columns: repeat(3, 1fr); }
.ls-grid-4 { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 900px) { .ls-grid-3, .ls-grid-4 { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .ls-grid-2, .ls-grid-3, .ls-grid-4 { grid-template-columns: 1fr; } }

/* 卡片 */
.ls-card {
  background: var(--ls-card); border: 1px solid var(--ls-line);
  border-radius: var(--ls-r-lg); padding: var(--ls-s5);
  box-shadow: var(--ls-sh-sm); transition: box-shadow .2s, transform .2s, border-color .2s;
}
.ls-card-hover:hover {
  box-shadow: var(--ls-sh); transform: translateY(-2px);
  border-color: var(--ls-blue-line);
}
.ls-card-title { font-size: 16px; font-weight: 700; color: var(--ls-navy); margin: 0 0 var(--ls-s2); }
.ls-card-body { color: var(--ls-body); font-size: 14px; line-height: 1.7; }
.ls-card-meta { color: var(--ls-muted); font-size: 12px; margin-top: var(--ls-s3); }

/* 按钮 */
.ls-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  padding: 9px 18px; border-radius: var(--ls-r-pill); font-size: 14px; font-weight: 600;
  border: 1px solid transparent; cursor: pointer; text-decoration: none;
  transition: background .18s, color .18s, border-color .18s, box-shadow .18s;
  line-height: 1.2; white-space: nowrap;
}
.ls-btn-primary { background: var(--ls-blue); color: #fff; box-shadow: var(--ls-sh-blue); }
.ls-btn-primary:hover { background: var(--ls-navy); color: #fff; }
.ls-btn-gold { background: var(--ls-gold); color: var(--ls-navy); }
.ls-btn-gold:hover { filter: brightness(.96); color: var(--ls-navy); }
.ls-btn-ghost { background: #fff; color: var(--ls-blue); border-color: var(--ls-blue-line); }
.ls-btn-ghost:hover { background: var(--ls-blue-soft); color: var(--ls-blue); }
.ls-btn-soft { background: var(--ls-blue-soft); color: var(--ls-blue); }
.ls-btn-soft:hover { background: var(--ls-blue-line); color: var(--ls-navy); }
.ls-btn-block { width: 100%; }
.ls-btn-sm { padding: 6px 13px; font-size: 13px; }
.ls-btn-lg { padding: 12px 26px; font-size: 15px; }
.ls-btn-success { background: var(--ls-success); color: #fff; }
.ls-btn-success:hover { background: #257e55; color: #fff; }
.ls-btn-danger { background: var(--ls-danger); color: #fff; }
.ls-btn-danger:hover { background: #c04743; color: #fff; }
/* 区块上分隔线（品牌浅线） */
.ls-hr-top { border-top: 1px solid var(--ls-line); }

/* 徽标 / 标签 / 芯片 */
.ls-badge {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 2px 9px; border-radius: var(--ls-r-pill);
  font-size: 12px; font-weight: 600; line-height: 1.6;
}
.ls-badge-primary { background: var(--ls-blue-soft); color: var(--ls-blue); }
.ls-badge-gold   { background: var(--ls-gold-soft); color: #8a6d2f; }
.ls-badge-success{ background: var(--ls-success-soft); color: var(--ls-success); }
.ls-badge-danger { background: var(--ls-danger-soft);  color: var(--ls-danger); }
.ls-badge-warn   { background: var(--ls-warn-soft);    color: #9a6b14; }
.ls-badge-muted  { background: var(--ls-line-2); color: var(--ls-muted); }
.ls-chip {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 5px 12px; border-radius: var(--ls-r-pill);
  background: #fff; border: 1px solid var(--ls-line);
  font-size: 13px; color: var(--ls-body); cursor: pointer;
  transition: all .18s;
}
.ls-chip:hover, .ls-chip.active {
  border-color: var(--ls-blue); color: var(--ls-blue); background: var(--ls-blue-soft);
}
.ls-chip.active { font-weight: 600; }

/* 列表 */
.ls-list { display: flex; flex-direction: column; gap: var(--ls-s2); }
.ls-list-item {
  display: flex; align-items: center; gap: var(--ls-s3);
  padding: var(--ls-s3) var(--ls-s4); background: #fff;
  border: 1px solid var(--ls-line); border-radius: var(--ls-r);
  transition: border-color .18s, background .18s;
}
.ls-list-item:hover { border-color: var(--ls-blue-line); background: var(--ls-blue-soft-2); }
.ls-list-item .ls-li-title { font-weight: 600; color: var(--ls-navy); }
.ls-list-item .ls-li-sub { color: var(--ls-muted); font-size: 13px; }
.ls-list-item .ls-li-right { margin-left: auto; color: var(--ls-muted); }

/* 选项卡 */
.ls-tabs { display: flex; gap: var(--ls-s1); border-bottom: 1px solid var(--ls-line); margin-bottom: var(--ls-s5); flex-wrap: wrap; }
.ls-tab {
  padding: 10px 16px; font-size: 14px; font-weight: 600; color: var(--ls-muted);
  border: none; background: none; cursor: pointer; position: relative;
  border-bottom: 2px solid transparent; margin-bottom: -1px; transition: color .18s;
}
.ls-tab:hover { color: var(--ls-blue); }
.ls-tab.active { color: var(--ls-blue); border-bottom-color: var(--ls-gold); }

/* 统计卡 */
.ls-stat {
  background: #fff; border: 1px solid var(--ls-line); border-radius: var(--ls-r-lg);
  padding: var(--ls-s5); position: relative; overflow: hidden;
}
.ls-stat::before {
  content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px;
  background: linear-gradient(180deg, var(--ls-blue), var(--ls-gold));
}
.ls-stat .ls-stat-num { font-size: 26px; font-weight: 800; color: var(--ls-navy); line-height: 1.1; }
.ls-stat .ls-stat-label { font-size: 13px; color: var(--ls-muted); margin-top: 4px; }
.ls-stat-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: var(--ls-s4); }

/* 提示框 */
.ls-alert {
  display: flex; gap: var(--ls-s3); align-items: flex-start;
  padding: var(--ls-s4); border-radius: var(--ls-r); font-size: 14px; line-height: 1.6;
  border: 1px solid transparent;
}
.ls-alert-info  { background: var(--ls-info-soft);  color: var(--ls-info);  border-color: #cfe2f3; }
.ls-alert-success { background: var(--ls-success-soft); color: var(--ls-success); border-color: #cdeede; }
.ls-alert-warn  { background: var(--ls-warn-soft);  color: #9a6b14; border-color: #f0e0bd; }
.ls-alert-danger { background: var(--ls-danger-soft); color: var(--ls-danger); border-color: #f3cccc; }

/* 空状态 */
.ls-empty {
  text-align: center; padding: var(--ls-s12) var(--ls-s5); color: var(--ls-muted);
  background: var(--ls-bg-2); border: 1px dashed var(--ls-line); border-radius: var(--ls-r-lg);
}
.ls-empty .ls-empty-ico { font-size: 40px; opacity: .5; margin-bottom: var(--ls-s3); }
.ls-empty .ls-empty-title { font-size: 15px; color: var(--ls-body); font-weight: 600; margin-bottom: 4px; }

/* 表单 */
.ls-field { margin-bottom: var(--ls-s4); }
.ls-field label { display: block; font-size: 13px; font-weight: 600; color: var(--ls-body); margin-bottom: 6px; }
.ls-input, .ls-textarea, .ls-select {
  width: 100%; padding: 10px 13px; font-size: 14px; color: var(--ls-ink);
  background: #fff; border: 1px solid var(--ls-line); border-radius: var(--ls-r);
  font-family: var(--ls-font); transition: border-color .18s, box-shadow .18s;
}
.ls-input:focus, .ls-textarea:focus, .ls-select:focus {
  outline: none; border-color: var(--ls-blue); box-shadow: 0 0 0 3px var(--ls-blue-soft);
}
.ls-textarea { min-height: 96px; resize: vertical; }

/* 工具行 */
.ls-toolbar { display: flex; flex-wrap: wrap; gap: var(--ls-s3); align-items: center; margin-bottom: var(--ls-s5); }
.ls-toolbar .ls-spacer { margin-left: auto; }

/* 头像 */
.ls-avatar {
  width: 44px; height: 44px; border-radius: 50%; object-fit: cover;
  background: var(--ls-blue-soft); color: var(--ls-blue);
  display: inline-flex; align-items: center; justify-content: center; font-weight: 700; flex: none;
}

/* 文本辅助 */
.ls-muted { color: var(--ls-muted); }
.ls-ink { color: var(--ls-ink); }
.ls-navy { color: var(--ls-navy); }
.ls-blue { color: var(--ls-blue); }
.ls-gold { color: var(--ls-gold); }
.ls-divider { height: 1px; background: var(--ls-line); border: 0; margin: var(--ls-s5) 0; }
.ls-mt-0 { margin-top: 0; } .ls-mt-3 { margin-top: var(--ls-s3); } .ls-mt-4 { margin-top: var(--ls-s4); } .ls-mt-5 { margin-top: var(--ls-s5); }
.ls-mb-3 { margin-bottom: var(--ls-s3); } .ls-mb-4 { margin-bottom: var(--ls-s4); } .ls-mb-5 { margin-bottom: var(--ls-s5); }

/* ---------- 4. 路由壳 .ls-route 跨模块Tailwind工具类品牌收口 ---------- */
/* 由 page-generic.php 把所有片段型路由模块包裹在 .ls-route 内。
 * 下方规则针对跨模块高频、且"各自为政"的 Tailwind 工具类做品牌重定向：
 * 链接蓝 / 主按钮底色 / 强调色，统一到品牌色，使 70+ 模块视觉一致。
 * 选择器为 .ls-route + 工具类（双类，特异性高于 Tailwind 单类），无需 !important。 */
.ls-route a.text-blue-600,
.ls-route .text-blue-600 { color: var(--ls-blue); }
.ls-route a.hover\:text-blue-600:hover { color: var(--ls-blue); }
.ls-route .border-blue-600 { border-color: var(--ls-blue); }
.ls-route .bg-blue-600 { background-color: var(--ls-blue); }
/* 主按钮常见底色（深灰/黑）统一为品牌蓝，保证主操作一致 */
.ls-route .bg-gray-900,
.ls-route .hover\:bg-gray-900:hover { background-color: var(--ls-blue); }
.ls-route .hover\:bg-gray-800:hover { background-color: var(--ls-navy); }
/* 强调色收口：紫→品牌蓝，绿→成功色（语义色保留），避免多色杂陈 */
.ls-route .text-purple-600 { color: var(--ls-blue); }
.ls-route .text-green-600 { color: var(--ls-success); }
.ls-route .bg-green-600 { background-color: var(--ls-success); }
.ls-route .bg-purple-600 { background-color: var(--ls-blue); }
/* 卡片边框统一为品牌浅线，圆角统一 */
.ls-route .border-gray-200 { border-color: var(--ls-line); }
.ls-route .rounded-lg,
.ls-route .rounded-xl { border-radius: var(--ls-r-lg); }

/* ==== 来源: mobile.css ==== */
/* ============================================================
   EduMaster Mobile UI —— 杨亦涛定制 (v2)
   仅保留最核心、最有效的移动端规则
   目标：APP 级体验 —— 内容排满、触控友好、视觉紧凑
   ============================================================ */

/* ---------- 通用工具类 ---------- */
.scrollbar-hide::-webkit-scrollbar { display: none; }
.scrollbar-hide { -ms-overflow-style: none; scrollbar-width: none; }

/* 顶部导航电话：手机/平板(<1024px)强制隐藏，避免 logo 下方两行；桌面(≥1024)保留显示方便联系 */
@media (max-width: 1023.98px) {
  #main-header a[href*="tel:"] { display: none !important; }
}

/* ============================================================
   Dock 横排布局：始终生效（不依赖断点），任意视口 7 项都横排不崩
   .mobile-tab-bar 在 lg(1024px) 才隐藏；768-1023px 宽屏区间若靠
   @media(767px) 才设 flex，则 nav 退化为块级 → 7 个 tab 项竖排堆
   左上、下方大片空白。这里把横排 + fixed 底部定位提到断点之外。
   ============================================================ */
#mobile-nav-dock.mobile-tab-bar {
    display: flex !important;
    flex-direction: row !important;
    position: fixed !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    z-index: 9999 !important;
    justify-content: space-around !important;
    align-items: center !important;
    height: calc(64px + env(safe-area-inset-bottom, 0px)) !important;
    background: #ffffff !important;
    border-top: 1px solid #f3f4f6 !important;
    box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.05) !important;
}
#mobile-nav-dock .mobile-tab-item {
    flex: 1 1 0 !important;
    min-width: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
}

/* ---------- 桌面端隐藏 Dock（仅 mobile.css 加载时，宽屏不出现底部浮排） ---------- */
@media (min-width: 1024px) {
    #mobile-nav-dock.mobile-tab-bar { display: none !important; }
}

/* ============================================================
   手机端主规则 (≤767px)
   ============================================================ */
@media (max-width: 767px) {

    /* ---------- 全局基础 ---------- */
    /* 注意：绝不要给 html 设置 overflow-x:hidden —— 在 iOS Safari 上会触发
       已知 bug：position:fixed 顶栏退化、整页纵向滚动卡死。
       改用 body 的 overflow-x: clip：只裁掉横向溢出，不创建滚动容器，
       纵向原生滚动与惯性滑动均正常。 */
    body { overflow-x: clip; }
    body {
        padding-bottom: calc(64px + env(safe-area-inset-bottom, 0px)) !important;
        font-size: 14px;
        line-height: 1.55;
        -webkit-tap-highlight-color: transparent;
        -webkit-font-smoothing: antialiased;
    }
    main { padding-top: 0 !important; padding-bottom: 0 !important; }

    /* ---------- 手机端底部 Dock 导航 ---------- */
    .mobile-tab-bar {
        position: fixed !important;
        bottom: 0 !important;
        left: 0 !important;
        right: 0 !important;
        z-index: 9999 !important;
        display: flex !important;
        justify-content: space-around !important;
        align-items: center !important;
        height: calc(64px + env(safe-area-inset-bottom, 0px)) !important;
        background: #ffffff !important;
        border-top: 1px solid #f3f4f6 !important;
        box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.05) !important;
        padding-bottom: env(safe-area-inset-bottom) !important;
    }
    .mobile-tab-item {
        flex: 1 1 0 !important;
        min-width: 0 !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 2px !important;
        height: 100% !important;
        padding: 0 1px !important;
        color: #6b7280 !important;
        text-decoration: none !important;
        font-size: 10px !important;
        font-weight: 500 !important;
        line-height: 1.2 !important;
        white-space: nowrap !important;
        transition: color 0.2s ease, background-color 0.2s ease, transform 0.15s ease !important;
        -webkit-tap-highlight-color: transparent !important;
    }
    .mobile-tab-item:active {
        transform: scale(0.92) !important;
    }
    .mobile-tab-item.active,
    .mobile-tab-item:hover {
        color: var(--color-primary, #2563eb) !important;
    }
    .mobile-tab-item svg {
        width: 20px !important;
        height: 20px !important;
        flex-shrink: 0 !important;
        transition: transform 0.15s ease !important;
    }

    /* AI 入口：居中突出，圆形渐变按钮 + 上浮 */
    .mobile-tab-item-ai {
        position: relative !important;
        top: -10px !important;
        color: #2563eb !important;
        font-weight: 700 !important;
    }
    .mobile-tab-ai-icon {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 44px !important;
        height: 44px !important;
        border-radius: 50% !important;
        background: linear-gradient(135deg, #2563eb 0%, #7c3aed 100%) !important;
        color: #fff !important;
        box-shadow: 0 6px 16px rgba(37, 99, 235, 0.35) !important;
        margin-bottom: 2px !important;
        transition: transform 0.15s ease, box-shadow 0.2s ease !important;
    }
    .mobile-tab-ai-icon svg {
        width: 23px !important;
        height: 23px !important;
    }
    /* 极窄屏（<=360px）6 个入口进一步压缩，避免文字换行 */
    @media (max-width: 360px) {
        .mobile-tab-item { font-size: 9.5px !important; }
        .mobile-tab-item svg { width: 19px !important; height: 19px !important; }
        .mobile-tab-ai-icon { width: 42px !important; height: 42px !important; }
    }
    .mobile-tab-item-ai:active .mobile-tab-ai-icon {
        transform: scale(0.92) !important;
    }
    .mobile-tab-item-ai.active .mobile-tab-ai-icon,
    .mobile-tab-item-ai:hover .mobile-tab-ai-icon {
        box-shadow: 0 8px 20px rgba(37, 99, 235, 0.45) !important;
    }

    /* ---------- 容器：去掉大留白，内容排满屏幕 ---------- */
    .max-w-7xl, .max-w-4xl, .max-w-3xl, .max-w-2xl, .max-w-xl, .container {
        padding-left: 12px !important;
        padding-right: 12px !important;
        max-width: 100% !important;
    }
    .max-w-2xl { max-width: 100% !important; }

    /* ---------- 间距类全局收紧 ---------- */
    .gap-2 { gap: 4px !important; }
    .gap-3 { gap: 6px !important; }
    .gap-4 { gap: 8px !important; }
    .gap-5 { gap: 8px !important; }
    .gap-6 { gap: 10px !important; }
    .gap-8 { gap: 12px !important; }
    .gap-10 { gap: 14px !important; }
    .gap-12 { gap: 16px !important; }

    .space-y-4 > * + * { margin-top: 10px !important; }
    .space-y-6 > * + * { margin-top: 12px !important; }
    .space-y-8 > * + * { margin-top: 16px !important; }
    .space-y-10 > * + * { margin-top: 18px !important; }
    .space-y-12 > * + * { margin-top: 20px !important; }

    .mt-4 { margin-top: 8px !important; }
    .mt-6 { margin-top: 10px !important; }
    .mt-8 { margin-top: 12px !important; }
    .mt-10 { margin-top: 14px !important; }
    .mt-12 { margin-top: 16px !important; }
    .mt-16 { margin-top: 20px !important; }

    .mb-4 { margin-bottom: 8px !important; }
    .mb-6 { margin-bottom: 10px !important; }
    .mb-8 { margin-bottom: 12px !important; }
    .mb-10 { margin-bottom: 14px !important; }
    .mb-12 { margin-bottom: 16px !important; }

    .pt-6 { padding-top: 10px !important; }
    .pt-8 { padding-top: 12px !important; }
    .pt-10 { padding-top: 14px !important; }
    .pt-12 { padding-top: 16px !important; }

    .pb-6 { padding-bottom: 10px !important; }
    .pb-8 { padding-bottom: 12px !important; }
    .pb-10 { padding-bottom: 14px !important; }
    .pb-12 { padding-bottom: 16px !important; }

    .px-4 { padding-left: 10px !important; padding-right: 10px !important; }
    .px-5 { padding-left: 12px !important; padding-right: 12px !important; }
    .px-6 { padding-left: 12px !important; padding-right: 12px !important; }
    .px-8 { padding-left: 14px !important; padding-right: 14px !important; }

    .py-4 { padding-top: 8px !important; padding-bottom: 8px !important; }
    .py-6 { padding-top: 10px !important; padding-bottom: 10px !important; }
    .py-8 { padding-top: 12px !important; padding-bottom: 12px !important; }
    .py-10 { padding-top: 14px !important; padding-bottom: 14px !important; }
    .py-12 { padding-top: 16px !important; padding-bottom: 16px !important; }

    .p-4 { padding: 8px !important; }
    .p-5 { padding: 10px !important; }
    .p-6 { padding: 12px !important; }
    .p-8 { padding: 14px !important; }

    .rounded-xl { border-radius: 12px !important; }
    .rounded-2xl { border-radius: 14px !important; }
    .rounded-3xl { border-radius: 16px !important; }

    /* ---------- 字号收紧 ---------- */
    .text-5xl { font-size: 26px !important; line-height: 1.2 !important; }
    .text-4xl { font-size: 22px !important; line-height: 1.25 !important; }
    .text-3xl { font-size: 20px !important; line-height: 1.3 !important; }
    .text-2xl { font-size: 18px !important; line-height: 1.35 !important; }
    .text-xl { font-size: 16px !important; line-height: 1.4 !important; }
    .text-lg { font-size: 14.5px !important; line-height: 1.55 !important; }
    .text-base { font-size: 14px !important; }
    .text-sm { font-size: 12.5px !important; }
    .text-xs { font-size: 11.5px !important; }

    /* ---------- Hero 区域（首页顶部） ---------- */
    section.relative.pt-6.pb-8 { padding-top: 8px !important; padding-bottom: 12px !important; }
    .max-w-4xl.mx-auto.text-center { padding-left: 8px; padding-right: 8px; }

    .max-w-4xl.mx-auto.text-center h1,
    .max-w-4xl.mx-auto.text-center .text-3xl,
    .max-w-4xl.mx-auto.text-center .text-4xl,
    .max-w-4xl.mx-auto.text-center .text-5xl {
        font-size: 24px !important;
        line-height: 1.25 !important;
        letter-spacing: -0.01em;
        margin-bottom: 8px !important;
    }
    .max-w-4xl.mx-auto.text-center .text-2xl { font-size: 17px !important; line-height: 1.4 !important; }
    .max-w-4xl.mx-auto.text-center .text-lg,
    .max-w-4xl.mx-auto.text-center .text-xl {
        font-size: 14px !important;
        line-height: 1.6 !important;
    }
    .max-w-4xl.mx-auto.text-center .inline-flex.items-center.gap-2.px-4.py-1\.5 {
        padding: 4px 10px !important;
        font-size: 11px !important;
        margin-bottom: 10px !important;
    }
    .max-w-4xl.mx-auto.text-center button,
    .max-w-4xl.mx-auto.text-center a.px-6,
    .max-w-4xl.mx-auto.text-center a.px-8 {
        padding: 9px 16px !important;
        font-size: 13px !important;
        min-height: 40px;
        border-radius: 10px;
    }

    /* ---------- 公告条 ---------- */
    .bg-gradient-to-r.from-orange-50.to-red-50 {
        padding: 6px 0 !important;
        border-bottom-width: 1px !important;
    }

    /* ---------- Section 通用 ---------- */
    section { padding-top: 14px !important; padding-bottom: 14px !important; }
    section h2.text-3xl, section h2.text-2xl {
        font-size: 18px !important;
        margin-bottom: 10px !important;
    }

    /* ---------- 卡片网格（课程/文章/商品） ---------- */
    .grid.grid-cols-2, .grid.grid-cols-3, .grid.grid-cols-4,
    .grid.grid-cols-5, .grid.grid-cols-6, .grid.lg\:grid-cols-3,
    .grid.lg\:grid-cols-4, .grid.lg\:grid-cols-5, .grid.md\:grid-cols-3 {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 8px !important;
    }

    /* 课程页：force-grid-3 需高于上面通用 2 列规则（特异性提升：grid+类） */
    .grid.force-grid-3,
    .grid.grid-cols-3.force-grid-3,
    .grid.grid-cols-2.force-grid-3 {
        grid-template-columns: repeat(3, 1fr) !important;
        gap: 8px !important;
    }

    /* 首页「精品课程 / 创作者商城」：手机端固定一行 3 个（紧凑 APP 感），覆盖上面通用 2 列规则 */
    .grid.home-cards-3 { grid-template-columns: repeat(3, 1fr) !important; gap: 10px !important; }

    /* 首页热门排行榜（课程/文章/商品三榜）：手机端固定一行 4 个。
       必须用 id 提升特异性，覆盖上面 .grid.home-cards-3 的 3 列与通用 2 列规则；
       桌面端（≥768px）不受本规则影响，仍按 index.php 的 md:grid-cols-6 显示 6 列。 */
    #rank-course, #rank-product, #rank-article {
        grid-template-columns: repeat(4, 1fr) !important;
        gap: 8px !important;
    }

    /* 首页 4 项区块（创作者权益 / 数字资源中心）：手机端 2×2，避免 3+1 孤行 */
    .grid.home-cards-2 { grid-template-columns: repeat(2, 1fr) !important; gap: 10px !important; }

    /* 首页扫码咨询：手机端固定一行 3 个 */
    .grid.home-qr-3 { grid-template-columns: repeat(3, 1fr) !important; gap: 10px !important; }
    .grid.home-qr-3 .max-w-\[120px\],
    .grid.home-qr-3 .sm\:max-w-\[140px\] { max-width: 90px !important; }
    .grid.home-qr-3 .text-3xl { font-size: 24px !important; }

    /* 首页顶部数据卡：新版卡片样式适配（手机端改为 APP 风格 4 列紧凑格子） */
    .grid.home-stats { grid-template-columns: repeat(4, 1fr) !important; gap: 8px !important; padding: 10px !important; }
    .grid.home-stats > a { padding: 0 !important; }
    .grid.home-stats .w-10.h-10 { width: 30px !important; height: 30px !important; margin-bottom: 6px !important; border-radius: 9px !important; }
    .grid.home-stats .w-10.h-10 svg { width: 15px !important; height: 15px !important; }
    .grid.home-stats p.font-extrabold { font-size: 16px !important; line-height: 1.15 !important; }
    .grid.home-stats p.text-xs { font-size: 10px !important; margin-top: 3px !important; line-height: 1.25 !important; }
    .home-stats-wrap { border-radius: 12px !important; box-shadow: 0 1px 3px rgba(0,0,0,0.05) !important; }

    /* 首页热门排行榜 tab 切换：手机端改成 APP 分段控制器，更紧凑 */
    .home-rank-tabs {
        border-radius: 10px !important;
        padding: 3px !important;
        gap: 3px !important;
        background: #f3f4f6 !important;
        border-color: transparent !important;
        box-shadow: inset 0 1px 2px rgba(0,0,0,0.05) !important;
    }
    .home-rank-tabs button {
        flex: 1 1 0 !important;
        min-width: 58px !important;
        padding: 5px 10px !important;
        font-size: 12.5px !important;
        line-height: 1.4 !important;
        border-radius: 8px !important;
        background: transparent !important;
        color: #6b7280 !important;
        font-weight: 500 !important;
        border: none !important;
        box-shadow: none !important;
    }
    .home-rank-tabs button.bg-gray-900,
    .home-rank-tabs button[aria-pressed="true"],
    .home-rank-tabs button.active {
        background: #ffffff !important;
        color: #111827 !important;
        box-shadow: 0 1px 2px rgba(0,0,0,0.08) !important;
        font-weight: 600 !important;
    }
    .home-rank-tabs button:active { transform: scale(0.96); }

    .grid.grid-cols-3 .p-4,
    .grid.grid-cols-4 .p-4,
    .grid.lg\:grid-cols-3 .p-4,
    .grid.lg\:grid-cols-4 .p-4,
    .grid.grid-cols-2 .p-4 { padding: 8px !important; }

    /* 布局型网格（内容+侧栏，如职位中心 / 企业中心）：
       显式 grid-cols-1 + lg:grid-cols-3/4 的，手机端必须单列堆叠，
       避免被上面的通用规则压成两列导致内容错位。卡片网格（grid-cols-2/3 直接类）不受影响。 */
    .grid.grid-cols-1.lg\:grid-cols-3,
    .grid.grid-cols-1.lg\:grid-cols-4 {
        grid-template-columns: 1fr !important;
    }

    .grid > a .text-lg, .grid > div .text-lg,
    .grid > a h3, .grid > a h4 {
        font-size: 14px !important;
        line-height: 1.4 !important;
        margin-top: 8px !important;
        margin-bottom: 4px !important;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }
    .grid .text-sm, .grid .text-base { font-size: 12.5px !important; line-height: 1.45 !important; }
    .grid .text-gray-500 { font-size: 11.5px !important; }
    .grid .text-primary, .grid .text-blue-600, .grid .font-bold { font-size: 14px !important; }

    /* ---------- 图标网格（快速入口/服务导航） ---------- */
    .grid.grid-cols-6, .grid.grid-cols-8 {
        grid-template-columns: repeat(5, 1fr) !important;
        gap: 8px !important;
    }
    .grid.grid-cols-6 a, .grid.grid-cols-8 a { padding: 8px 4px !important; }
    .grid.grid-cols-6 .w-12, .grid.grid-cols-8 .w-12 { width: 40px !important; height: 40px !important; }
    .grid.grid-cols-6 .w-16, .grid.grid-cols-8 .w-16 { width: 44px !important; height: 44px !important; }
    .grid.grid-cols-6 .text-sm, .grid.grid-cols-8 .text-sm { font-size: 11px !important; margin-top: 4px !important; }

    /* ---------- 横向滚动分类标签 ---------- */
    .flex.flex-wrap.gap-2, .flex.flex-wrap.gap-3 { gap: 6px !important; }
    .flex.flex-wrap.gap-2 a, .flex.flex-wrap.gap-3 a { font-size: 12px !important; padding: 5px 10px !important; }

    .flex.gap-2.overflow-x-auto, .flex.gap-3.overflow-x-auto {
        gap: 6px !important;
        padding-bottom: 4px !important;
    }
    .flex.gap-2.overflow-x-auto a, .flex.gap-3.overflow-x-auto a {
        padding: 6px 12px !important;
        font-size: 12px !important;
        border-radius: 100px !important;
        white-space: nowrap;
        min-height: 40px;
    }

    /* ---------- 文章页（single.php） ---------- */
    .single-main { min-height: 100vh; padding-bottom: 40px !important; }
    article.bg-white.rounded, article.bg-white, article {
        border-radius: 12px !important;
        padding: 14px !important;
        margin-bottom: 12px !important;
    }
    article .text-2xl, article .text-3xl { font-size: 20px !important; margin-bottom: 8px !important; }
    article h2.text-xl { font-size: 16px !important; margin-bottom: 8px !important; }
    article h2.text-lg { font-size: 15px !important; margin-bottom: 6px !important; }
    article .text-lg { font-size: 14px !important; line-height: 1.6 !important; }
    article .text-sm { font-size: 12.5px !important; }

    /* 文章正文内容 */
    .article-content, .main-content {
        font-size: 15px !important;
        line-height: 1.75 !important;
        width: 100% !important;
    }
    .article-content p { margin-bottom: 12px !important; }
    .article-content h1 { font-size: 22px !important; margin-top: 16px !important; margin-bottom: 10px !important; }
    .article-content h2 { font-size: 18.5px !important; margin-top: 16px !important; margin-bottom: 10px !important; font-weight: 700 !important; }
    .article-content h3 { font-size: 16.5px !important; margin-top: 14px !important; margin-bottom: 8px !important; font-weight: 700 !important; }
    .article-content h4 { font-size: 15px !important; margin-top: 12px !important; margin-bottom: 6px !important; }
    .article-content img { border-radius: 10px !important; margin: 10px 0 !important; max-width: 100%; height: auto; }
    .article-content blockquote {
        padding: 10px 12px !important;
        margin: 12px 0 !important;
        border-radius: 8px !important;
        font-size: 14px !important;
    }
    .article-content ul, .article-content ol { padding-left: 18px !important; margin: 10px 0 !important; }
    .article-content li { margin-bottom: 6px !important; }
    .article-content code {
        padding: 2px 6px !important;
        border-radius: 4px !important;
        font-size: 13px !important;
    }
    .article-content pre {
        padding: 10px !important;
        border-radius: 8px !important;
        font-size: 12px !important;
        overflow-x: auto;
    }
    .article-content table { font-size: 12.5px !important; width: 100%; overflow-x: auto; display: block; }
    .article-content th, .article-content td { padding: 6px 8px !important; }

    /* 文章 info card / related post */
    article .info-card { padding: 10px !important; margin-bottom: 10px !important; border-radius: 8px !important; }
    article .info-title { font-size: 13px !important; margin-bottom: 8px !important; }
    article .info-grid { grid-template-columns: repeat(2, 1fr) !important; gap: 6px !important; }
    article .info-item { padding: 6px !important; }
    article .info-value { font-size: 14px !important; }
    article .info-label { font-size: 10.5px !important; }
    article .action-buttons { flex-direction: column !important; margin-top: 12px !important; padding-top: 10px !important; gap: 6px !important; }
    article .action-btn { padding: 10px !important; font-size: 13px !important; min-height: 44px; border-radius: 10px; }
    article .related-posts { padding: 10px !important; border-radius: 8px !important; margin-top: 12px !important; }
    article .related-title { font-size: 13px !important; margin-bottom: 8px !important; }
    article .related-list { grid-template-columns: 1fr 1fr !important; gap: 8px !important; }
    article .related-thumb { height: 80px !important; border-radius: 8px !important; }

    /* 文章页：侧边栏隐藏，主内容占满 */
    .article-container {
        grid-template-columns: 1fr !important;
        gap: 10px !important;
        padding: 0 10px !important;
    }
    .sidebar, .sidebar-desktop-only { display: none !important; }
    .main-content { padding: 12px !important; border-radius: 10px !important; width: 100% !important; }
    .article-header { padding-bottom: 10px !important; margin-bottom: 10px !important; }
    .article-title { font-size: 20px !important; line-height: 1.3 !important; }
    .article-meta { font-size: 12px !important; gap: 8px !important; }

    /* ---------- 课程详情页 ---------- */
    .course-detail { padding-bottom: calc(140px + env(safe-area-inset-bottom, 0px)) !important; }
    .course-header { padding: 30px 16px !important; }
    .course-header .title { font-size: 1.6rem !important; }
    .course-header .back { padding: 6px 14px !important; font-size: 12px !important; }
    .course-info-bar { margin: -24px 12px 20px !important; padding: 14px !important; gap: 10px !important; flex-wrap: wrap; }
    .course-info-bar .item { width: calc(50% - 6px) !important; padding: 10px !important; }
    .course-info-bar .value { font-size: 1.2rem !important; }
    .course-content { padding: 0 12px !important; }
    .course-section { padding: 14px !important; margin-bottom: 12px !important; border-radius: 12px !important; }
    .course-section h3 { font-size: 16px !important; }
    .teacher-card { padding: 14px !important; gap: 12px !important; border-radius: 12px !important; }
    .teacher-avatar { width: 50px !important; height: 50px !important; font-size: 20px !important; }
    .teacher-name { font-size: 15px !important; }
    .chapter-item { padding: 12px !important; border-radius: 10px !important; }
    .chapter-item:hover { transform: none !important; }
    .chapter-item .title span:first-child { font-size: 13px !important; }

    .course-buy {
        padding: 12px 16px !important;
        gap: 10px !important;
        bottom: calc(60px + env(safe-area-inset-bottom, 0px)) !important;
        z-index: 99998 !important;
    }
    .course-buy .btn { padding: 12px 22px !important; font-size: 14px !important; border-radius: 10px !important; }
    .course-price { font-size: 1.15rem !important; }

    /* ---------- Hero 区块（部分页面顶部） ---------- */
    .hero { height: 150px !important; margin-top: -10px !important; }
    .hero-content { padding: 10px !important; }
    .hero-title { font-size: 18px !important; margin-bottom: 6px !important; }
    .category-tag { font-size: 10px !important; padding: 3px 8px !important; margin-bottom: 4px !important; border-radius: 100px !important; }
    .hero-meta { gap: 6px !important; font-size: 11.5px !important; flex-wrap: wrap; }

    /* ---------- 作者卡片 ---------- */
    .author-card { flex-direction: column !important; padding: 12px !important; gap: 10px !important; border-radius: 12px !important; }
    .author-avatar { width: 44px !important; height: 44px !important; }
    .author-info { text-align: center !important; }
    .author-name { font-size: 14px !important; }
    .author-bio { font-size: 12px !important; }
    .author-stats { justify-content: center !important; font-size: 11.5px !important; gap: 12px !important; }
    .author-actions { flex-direction: row !important; gap: 8px !important; width: 100% !important; }
    .author-actions button { flex: 1 !important; padding: 8px 10px !important; font-size: 12.5px !important; border-radius: 8px !important; }

    /* ---------- 表单与输入 ---------- */
    input[type="text"], input[type="email"], input[type="password"],
    input[type="search"], input[type="tel"], input[type="number"],
    textarea, select {
        font-size: 16px !important;
        padding: 10px 12px !important;
        border-radius: 10px !important;
        min-height: 44px;
        box-sizing: border-box;
    }
    input[type="checkbox"], input[type="radio"] { width: 18px; height: 18px; }
    label { font-size: 13px !important; }

    /* ---------- 按钮 & 触控目标 ---------- */
    button, .btn, a.button, a[role="button"],
    input[type="submit"], input[type="button"], input[type="reset"],
    .px-4.py-2, .px-5.py-2, .px-6.py-2, .px-6.py-3, .px-8.py-3 {
        min-height: 40px !important;
        font-size: 14px !important;
        border-radius: 10px !important;
    }

    /* ---------- 徽章 / 标签 ---------- */
    .badge, .tag, .chip,
    .inline-block.px-2.py-1, .inline-flex.px-2.py-1 {
        padding: 3px 10px !important;
        font-size: 11.5px !important;
        border-radius: 100px !important;
    }

    /* ---------- 面包屑 ---------- */
    nav.flex.items-center.gap-2.text-sm { font-size: 12.5px !important; padding: 8px 0 !important; }

    /* ---------- 分页 ---------- */
    .pagination { gap: 6px !important; margin-top: 16px !important; flex-wrap: wrap; justify-content: center; }
    .pagination a, .pagination span {
        min-width: 36px !important;
        height: 36px !important;
        padding: 6px 10px !important;
        font-size: 13px !important;
        border-radius: 8px !important;
    }
    nav.flex.justify-center.gap-2 { gap: 6px !important; margin-top: 20px !important; flex-wrap: wrap; justify-content: center; }
    nav.flex.justify-center.gap-2 a, nav.flex.justify-center.gap-2 span,
    nav.flex.justify-center.gap-2 button {
        min-width: 36px !important;
        min-height: 36px !important;
        padding: 6px 10px !important;
        font-size: 13px !important;
    }

    /* ---------- 搜索条 / 搜索卡片 ---------- */
    .search-card { padding: 12px !important; border-radius: 12px !important; margin-bottom: 14px !important; }
    .search-form { grid-template-columns: 1fr !important; gap: 10px !important; }
    .search-input { font-size: 14px !important; padding: 10px 12px !important; border-radius: 8px !important; }
    .search-select { font-size: 14px !important; padding: 10px 12px !important; border-radius: 8px !important; }
    .search-btn { padding: 12px !important; font-size: 14px !important; border-radius: 8px !important; }

    .search-bar { padding: 8px 14px !important; border-radius: 24px !important; margin-bottom: 14px !important; }
    .search-bar .search-input { font-size: 13px !important; padding: 8px 12px !important; border-radius: 20px !important; }
    .search-bar .search-btn { padding: 8px 16px !important; font-size: 13px !important; border-radius: 20px !important; }

    /* ---------- 筛选器 ---------- */
    .filters { gap: 8px !important; flex-wrap: nowrap !important; overflow-x: auto !important; padding: 0 12px 10px !important; margin-bottom: 10px !important; }
    .filter-btn { padding: 6px 12px !important; font-size: 12px !important; white-space: nowrap !important; border-radius: 100px !important; }

    /* ---------- 职位 / 内容 网格 ---------- */
    .job-grid, .content-grid { grid-template-columns: 1fr !important; gap: 10px !important; }
    .job-card { padding: 12px !important; border-radius: 12px !important; }
    .job-title { font-size: 15px !important; }
    .job-company { font-size: 13px !important; }
    .job-tags { margin-bottom: 8px !important; gap: 6px !important; }
    .job-tag { padding: 3px 8px !important; font-size: 11px !important; border-radius: 4px !important; }
    .job-footer { flex-direction: column !important; gap: 8px !important; align-items: flex-start !important; }
    .job-salary { font-size: 16px !important; }

    .content-card { border-radius: 10px !important; }
    .card-content { padding: 10px !important; }
    .card-title { font-size: 13.5px !important; margin-bottom: 4px !important; line-height: 1.4 !important; }
    .card-meta { font-size: 11.5px !important; gap: 8px !important; }
    .card-price { font-size: 14px !important; }

    /* ---------- 空状态 ---------- */
    .empty-state { padding: 40px 20px !important; }
    .empty-state h3 { font-size: 16px !important; }
    .empty-state p { font-size: 13px !important; }

    /* ---------- 表格：横向滚动 ---------- */
    table { display: block; width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
    table td, table th { white-space: nowrap; }

    /* ---------- Modal / 弹窗 ---------- */
    .fixed.inset-0 .max-w-lg,
    .fixed.inset-0 .max-w-md,
    .fixed.inset-0 .max-w-sm,
    .fixed.inset-0 .max-w-xl,
    .fixed.inset-0 .max-w-2xl {
        width: calc(100% - 32px) !important;
        margin: 0 16px !important;
        max-height: 90vh !important;
        overflow-y: auto !important;
    }

    /* ---------- 作者页 / 标签页 滚动 ---------- */
    .author-tabs { overflow-x: auto !important; -webkit-overflow-scrolling: touch !important; flex-wrap: nowrap !important; }
    .author-tabs a { white-space: nowrap !important; font-size: 13px !important; padding: 8px 14px !important; border-radius: 100px !important; }

    /* ---------- 标签/档案页标题 ---------- */
    .page-title { font-size: 22px !important; margin-bottom: 6px !important; }
    .page-subtitle { font-size: 12px !important; }
    .page-header { text-align: center !important; margin-bottom: 14px !important; }

    /* ---------- line clamp ---------- */
    .line-clamp-2 { display: -webkit-box !important; -webkit-line-clamp: 2 !important; -webkit-box-orient: vertical !important; overflow: hidden !important; }

    /* ============================================================
       APP 级增强：顶栏安全区 / Dock 选中态 / 吸顶筛选 / 页脚精简 / 冗余浮窗隐藏
       ============================================================ */

    /* ---------- 顶部 APP 栏：刘海安全区 + 毛玻璃 ---------- */
    #main-header {
        padding-top: env(safe-area-inset-top, 0px) !important;
        background: rgba(255, 255, 255, 0.92) !important;
        -webkit-backdrop-filter: saturate(180%) blur(12px);
        backdrop-filter: saturate(180%) blur(12px);
        border-bottom-color: rgba(243, 244, 246, 0.7) !important;
    }
    /* 占位条高度 = 顶栏(56px) + 刘海安全区，避免内容被固定顶栏遮挡 */
    #mobile-header-spacer { height: calc(56px + env(safe-area-inset-top, 0px)) !important; }

    /* ---------- 移动端菜单遮罩：阻断微信 WebView 命中测试拦截 ----------
       #mobile-menu-overlay 是 fixed inset-0 全屏层，仅靠 translate-x-full 把自身
       移出视区隐藏。iOS 微信 WKWebView 对「被 transform 移出视口、但 pointer-events
       默认 auto」的 fixed 元素仍会做命中测试拦截，导致整页「很多点不动」。
       兜底：默认 pointer-events:none（点击穿透到下层），仅在菜单打开（移除
       translate-x-full）时启用自动；不影响关闭时的滑出动画（visibility 始终可见）。 */
    #mobile-menu-overlay { pointer-events: none !important; }
    #mobile-menu-overlay:not(.translate-x-full) { pointer-events: auto !important; }

    /* ---------- 底部 Dock：选中态高亮（APP 质感） ---------- */
    .mobile-tab-item.active {
        background: rgba(37, 99, 235, 0.08);
        border-radius: 14px;
        color: var(--color-primary, #2563eb) !important;
    }
    .mobile-tab-item.active svg { transform: translateY(-1px) scale(1.05); }

    /* ---------- 横向筛选 / 分类标签：吸顶（APP 常见交互） ---------- */
    .filters {
        position: sticky !important;
        top: calc(56px + env(safe-area-inset-top, 0px)) !important;
        z-index: 30 !important;
        background: rgba(249, 250, 251, 0.96) !important;
        -webkit-backdrop-filter: blur(8px);
        backdrop-filter: blur(8px);
        margin: 0 !important;
        border-bottom: 1px solid #f3f4f6;
    }

    /* ---------- 页脚：移动端精简为极简版权条（避免链接墙） ---------- */
    footer { padding-top: 0 !important; padding-bottom: 14px !important; }
    footer > .max-w-7xl > div:first-child,
    footer > .max-w-7xl > div:nth-child(2) { display: none !important; }
    footer .pt-8.border-t { padding-top: 16px !important; padding-bottom: 4px !important; }
    footer .pt-8.border-t .text-sm { font-size: 12px !important; }
    footer .pt-8.border-t .gap-6 { gap: 12px !important; }

    /* ---------- 隐藏与 Dock 重叠的桌面浮窗（返回顶部） ---------- */
    .back-to-top { display: none !important; }

    /* OPC 创作中心：#opc-back-top 悬浮按钮压在 64px Dock 上，手机端隐藏（APP 形态用 Dock） */
    #opc-back-top { display: none !important; }

    /* 招聘页自研底部导航 .lsj-mnav 与全局 7 项 Dock 双层重叠，手机端隐藏，统一走 Dock「求职」项 */
    .lsj-mnav { display: none !important; }

    /* 威客大厅 FAB：抬高到 Dock 之上避免被盖死；里程碑删除按钮补足触控区 */
    .wk-fab {
        bottom: calc(76px + env(safe-area-inset-bottom, 0px)) !important;
        z-index: 9998 !important;
    }
    .wk-ms-del { min-width: 36px !important; min-height: 36px !important; padding: 8px !important; }
    .wk-filter-row { padding: 8px 0 !important; }
    /* 威客大厅学生快单 / 招标卡：2 列窄卡内联 padding 收紧 */
    .wk-hall-grid { gap: 10px !important; }
    .wk-hall-grid > div { padding: 10px 12px !important; border-radius: 10px !important; }

    /* ---------- 企业中心（route-misc company 分支）手机端收紧 ----------
       hero 大留白、功能 2×2 卡、精选 logo、薪资 nowrap 挤压 */
    .wk-company-center .hero-co { padding: 18px 14px !important; }
    .wk-company-center .hero-co h1 { margin-top: 6px !important; font-size: 20px !important; }
    .wk-company-center .grid.grid-cols-2 .text-2xl { font-size: 16px !important; margin-bottom: 4px !important; }
    .wk-company-center .grid.grid-cols-2 .p-5 { padding: 10px !important; }
    .wk-company-center .grid.grid-cols-2 .w-16.h-16 { width: 44px !important; height: 44px !important; }
    .wk-company-center .flex.items-center.justify-between { gap: 10px !important; }
    .wk-company-center .whitespace-nowrap { white-space: nowrap !important; }

    /* ---------- OPC 创作者工作台（opc-creator.php .oc-*）手机端收紧 ---------- */
    .oc-stat { padding: 12px !important; }
    .oc-stat .v { font-size: 18px !important; }
    .oc-stat .l { font-size: 10px !important; }
    .oc-table { font-size: 12.5px !important; }
    .oc-table td, .oc-table th { padding: 6px 0 !important; }
    .oc-wrap .grid.grid-cols-2 { grid-template-columns: 1fr !important; }
    /* OPC 新增工作台面板（仪表盘/套餐/订单/AI助手）手机端收紧 */
    .opc-card, .opc-tier, .oc-card { border-radius: 12px !important; }
    .opc-tier { padding: 18px 14px !important; }
    .opc-tier .opc-tier-price { font-size: 24px !important; }
    .opc-sec-head h2 { font-size: 19px !important; }
    .opc-stats { gap: 8px !important; }
    .opc-stat { padding: 12px 10px !important; }
    .opc-stat .opc-stat-v { font-size: 18px !important; }
    .opc-qr-row { grid-template-columns: 1fr 1fr !important; }
    .opc-otable { font-size: 12px !important; }

    /* ---------- 右下角通知铃铛：手机端隐藏 ----------
       56×56 fixed 按钮在移动端遮挡内容、与底部 Dock 冲突，显得页面"空/不兼容"。 */
    #ls-notification-bell { display: none !important; }

    /* ---------- 商城页标题区：手机端更紧凑 ----------
       避免"创客商城"标题区上下留白过多、显得空。 */
    .ls-shop-page .page-header { margin: 8px 0 4px !important; text-align: left !important; }
    .ls-shop-page .page-title { font-size: 18px !important; line-height: 1.3 !important; margin-bottom: 2px !important; }
    .ls-shop-page .page-subtitle { font-size: 11px !important; margin-top: 2px !important; color: #9ca3af !important; }

    /* ---------- 更紧凑：内容排满屏幕 ---------- */
    .max-w-7xl, .max-w-4xl, .max-w-3xl, .max-w-xl, .container {
        padding-left: 10px !important;
        padding-right: 10px !important;
    }
    section { padding-top: 12px !important; padding-bottom: 12px !important; }

    /* ---------- 移动端侧滑菜单：紧凑 APP 化 ----------
       用户截图反馈抽屉菜单排版松散，像网页不像 APP。
       header.php 已改为紧凑 markup；这里用更通用的子选择器兜底，
       防止 Tailwind 工具类被其他样式覆盖。 */
    #mobile-menu-overlay > .border-b {
        padding: 10px 12px !important;
    }
    #mobile-menu-overlay > .border-b a {
        gap: 8px !important;
    }
    #mobile-menu-overlay > .border-b img {
        height: 28px !important;
    }
    #mobile-menu-overlay > .border-b [class*="rounded-"] svg {
        width: 20px !important;
        height: 20px !important;
    }

    #mobile-menu-overlay > nav {
        padding: 10px 12px !important;
    }

    /* 搜索条 */
    #mobile-menu-overlay form[role="search"] {
        padding: 6px 10px !important;
        margin-bottom: 10px !important;
        border-radius: 10px !important;
    }
    #mobile-menu-overlay form[role="search"] svg {
        width: 16px !important;
        height: 16px !important;
    }
    #mobile-menu-overlay form[role="search"] input {
        font-size: 13px !important;
    }
    #mobile-menu-overlay form[role="search"] button {
        font-size: 12px !important;
        padding: 0 !important;
        min-height: auto !important;
    }

    /* 快捷入口：强制 5 列紧凑图标 */
    #mobile-menu-overlay .grid {
        grid-template-columns: repeat(5, 1fr) !important;
        gap: 6px !important;
        margin-bottom: 10px !important;
    }
    #mobile-menu-overlay .grid > a {
        padding: 6px 2px !important;
        gap: 3px !important;
        border-radius: 8px !important;
    }
    #mobile-menu-overlay .grid > a > div {
        width: 30px !important;
        height: 30px !important;
        border-radius: 8px !important;
    }
    #mobile-menu-overlay .grid > a > div svg {
        width: 15px !important;
        height: 15px !important;
    }
    #mobile-menu-overlay .grid > a span {
        font-size: 10px !important;
        line-height: 1.2 !important;
    }

    /* 分组标题 */
    #mobile-menu-overlay [class*="tracking-wider"] {
        font-size: 10px !important;
        margin-bottom: 4px !important;
        letter-spacing: 0.02em !important;
        color: #9ca3af !important;
    }

    /* 列表项： tighter */
    #mobile-menu-overlay > nav > div {
        margin-bottom: 8px !important;
    }
    #mobile-menu-overlay > nav > div > * + * {
        margin-top: 0 !important;
    }
    #mobile-menu-overlay a.flex.items-center {
        padding: 5px 10px !important;
        font-size: 13px !important;
        min-height: 32px !important;
        border-radius: 8px !important;
    }
    #mobile-menu-overlay a.flex.items-center svg {
        width: 16px !important;
        height: 16px !important;
    }

    /* 底部操作区 */
    #mobile-menu-overlay > .border-t {
        padding: 10px 12px !important;
    }
    #mobile-menu-overlay > .border-t a {
        padding: 6px 10px !important;
        font-size: 13px !important;
        border-radius: 10px !important;
        min-height: 32px !important;
    }
    #mobile-menu-overlay > .border-t a svg {
        width: 16px !important;
        height: 16px !important;
    }

    /* ---------- 课程页：手机端 3 列紧凑（APP 质感） ----------
       route-courses.php 的课程卡片/分类卡片默认已 grid-cols-3，
       这里再兜底强制 3 列并压缩卡片内边距，避免换行。 */
    .grid.force-grid-3 {
        grid-template-columns: repeat(3, 1fr) !important;
        gap: 8px !important;
    }
    .grid.force-grid-3 > a > .h-36 {
        height: 84px !important;
    }
    .grid.force-grid-3 > a > div.p-4 {
        padding: 8px !important;
    }
    .grid.force-grid-3 > a h3 {
        font-size: 12px !important;
        line-height: 1.25 !important;
        margin-bottom: 4px !important;
    }
    .grid.force-grid-3 > a p.text-xs {
        font-size: 10px !important;
        margin-bottom: 4px !important;
    }
    /* 分类导航卡片（含描述文字）：3 列下压缩图标与文字，避免溢出 */
    .grid.force-grid-3 > a .w-10.h-10 {
        width: 28px !important;
        height: 28px !important;
        font-size: 14px !important;
    }
    .grid.force-grid-3 > a .flex.items-start {
        gap: 6px !important;
    }

    /* ---------- 阻止橡皮筋/链拉刷新干扰 APP 手感 ---------- */
    body { overscroll-behavior-y: contain; }

    /* ---------- 滚动条隐藏（APP 质感） ---------- */
    *::-webkit-scrollbar { width: 0; height: 0; }
    * { -ms-overflow-style: none; scrollbar-width: none; }

    /* ============================================================
       个人中心（创客控制台）移动端适配
       目标：首屏直接呈现主内容，侧边导航默认折叠后置
       ============================================================ */
    /* 主容器：去掉 80px 巨大上留白，与顶栏/Dock 安全区对齐 */
    main.min-h-screen.bg-gray-50.pt-20.pb-24 {
        padding-top: calc(56px + env(safe-area-inset-top, 0px)) !important;
        padding-bottom: 10px !important;
    }
    .ls-pc-root { padding: 0 10px !important; margin-top: 0 !important; }

    /* 头部：强制深蓝背景 + 高对比白字，解决用户名/邮箱/按钮看不清 */
    .ls-pc-header {
        background: linear-gradient(135deg, #1e3a8a 0%, #2563eb 100%) !important;
        color: #fff !important;
        padding: 14px 16px !important;
        border-radius: 16px !important;
        margin-bottom: 10px !important;
        box-shadow: 0 4px 14px rgba(37, 99, 235, 0.25) !important;
    }
    .ls-pc-header-inner { flex-direction: row !important; align-items: center !important; padding: 0 !important; gap: 12px !important; }
    .ls-pc-avatar { width: 48px !important; height: 48px !important; border-radius: 14px !important; border: 2px solid rgba(255,255,255,0.35) !important; flex-shrink: 0 !important; }
    .ls-pc-avatar img { filter: none !important; }
    .ls-pc-userinfo { min-width: 0 !important; }
    .ls-pc-username { font-size: 17px !important; font-weight: 700 !important; color: #fff !important; gap: 6px !important; line-height: 1.3 !important; text-shadow: 0 1px 2px rgba(0,0,0,0.15) !important; }
    .ls-pc-username span { color: #fff !important; }
    .ls-pc-useremail { font-size: 12px !important; color: rgba(255,255,255,0.92) !important; margin-top: 3px !important; }
    .ls-pc-header-actions { flex-wrap: nowrap !important; gap: 8px !important; margin-top: 0 !important; margin-left: auto !important; }
    .ls-pc-header-actions > * {
        padding: 7px 12px !important;
        font-size: 12px !important;
        font-weight: 600 !important;
        border-radius: 10px !important;
        white-space: nowrap !important;
        background: #fff !important;
        color: #1e40af !important;
        border: none !important;
        box-shadow: 0 2px 6px rgba(0,0,0,0.1) !important;
    }
    .ls-pc-header-actions > a[href*="wp-admin"] { background: #fff !important; color: #1e40af !important; }
    .ls-pc-points-pill { display: none !important; }

    /* 布局：主内容在前，侧边栏折叠后置 */
    .ls-pc-flex { flex-direction: column-reverse !important; gap: 10px !important; }
    .ls-pc-content { order: -1; width: 100% !important; min-width: 0 !important; }
    .ls-pc-sidebar { width: 100% !important; }

    /* 侧边栏导航：紧凑网格，减少大片空白 */
    .ls-pc-nav { border-radius: 14px !important; overflow: hidden !important; }
    .ls-pc-nav-title-wrap { padding: 10px 12px 6px !important; background: transparent !important; border-bottom: none !important; }
    .ls-pc-nav-title { font-size: 12px !important; color: #6b7280 !important; letter-spacing: 0.02em !important; }
    .ls-pc-navlist {
        display: grid !important;
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 6px !important;
        padding: 6px 10px 10px !important;
    }
    .ls-pc-navlist:not(.is-expanded) {
        max-height: 168px;
        overflow: hidden;
        position: relative;
    }
    .ls-pc-navlist:not(.is-expanded)::after { content: ''; position: absolute; bottom: 0; left: 0; right: 0; height: 40px; background: linear-gradient(to bottom, transparent, rgba(255,255,255,1)); pointer-events: none; }
    .ls-pc-navlist.is-expanded { max-height: none; }
    .ls-pc-navlist > div { grid-column: 1 / -1 !important; padding: 10px 4px 4px !important; font-size: 11px !important; color: #9ca3af !important; }
    .ls-pc-navlist > a {
        flex-direction: column !important;
        justify-content: center !important;
        align-items: center !important;
        gap: 4px !important;
        padding: 10px 4px !important;
        font-size: 12px !important;
        font-weight: 500 !important;
        line-height: 1.2 !important;
        border-radius: 10px !important;
        min-height: 64px !important;
        text-align: center !important;
        background: #f8fafc !important;
        color: #374151 !important;
    }
    .ls-pc-navlist > a span { white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; width: 100% !important; }
    .ls-pc-navlist > a.bg-blue-50, .ls-pc-navlist > a[class*="bg-blue"] {
        background: #eff6ff !important;
        color: #1d4ed8 !important;
        font-weight: 700 !important;
        box-shadow: inset 0 0 0 1px #bfdbfe !important;
    }
    .ls-pc-nav-more {
        display: flex !important;
        justify-content: center;
        align-items: center;
        width: 100%;
        padding: 9px;
        font-size: 13px;
        font-weight: 600;
        color: #1d4ed8;
        background: #eff6ff;
        border-top: 1px solid #dbeafe;
        border-radius: 0 0 14px 14px;
        min-height: 42px;
    }

    /* ---------- 首页超紧凑布局（进一步减少留白，内容不减） ---------- */
    main > .relative.pt-10.pb-8 { padding-top: 8px !important; padding-bottom: 10px !important; }
    main .max-w-4xl.mx-auto.text-center { padding-left: 6px; padding-right: 6px; }
    main .max-w-4xl.mx-auto.text-center > .inline-flex.items-center.gap-2 {
        margin-bottom: 6px !important;
        padding: 3px 8px !important;
        font-size: 10.5px !important;
    }
    main .max-w-4xl.mx-auto.text-center > h1 {
        margin-bottom: 6px !important;
        font-size: 22px !important;
        line-height: 1.25 !important;
    }
    main .max-w-4xl.mx-auto.text-center > h1 span { margin-top: 2px !important; }
    main .max-w-4xl.mx-auto.text-center > p.text-gray-500 {
        margin-bottom: 8px !important;
        font-size: 12.5px !important;
        line-height: 1.5 !important;
    }
    main .max-w-4xl.mx-auto.text-center > .flex.items-center.justify-center.gap-3 {
        margin-bottom: 6px !important;
        gap: 6px !important;
        font-size: 11px !important;
    }
    main .max-w-4xl.mx-auto.text-center > .mb-8.flex.flex-col.sm\:flex-row {
        margin-bottom: 8px !important;
        gap: 6px !important;
    }
    main .max-w-4xl.mx-auto.text-center > .mb-8.flex.flex-col.sm\:flex-row a {
        padding: 7px 14px !important;
        font-size: 12px !important;
        min-height: 36px;
    }

    /* 统计卡（超小屏）：4 列紧凑 APP 格子 */
    .home-stats-wrap { margin-top: 8px !important; border-radius: 10px !important; }
    .grid.home-stats { grid-template-columns: repeat(4, 1fr) !important; }
    .grid.home-stats > a { padding: 0 !important; }
    .grid.home-stats .w-10.h-10 {
        width: 26px !important; height: 26px !important;
        margin-bottom: 5px !important; border-radius: 8px !important;
    }
    .grid.home-stats .w-10.h-10 svg { width: 13px !important; height: 13px !important; }
    .grid.home-stats p.font-extrabold { font-size: 15px !important; line-height: 1.15 !important; margin-bottom: 0 !important; }
    .grid.home-stats p.text-xs { font-size: 9.5px !important; margin-top: 2px !important; }

    /* 统计卡下方 4 个分类标签 */
    .home-stats-wrap .grid.grid-cols-4.border-t > a {
        padding: 5px 2px !important;
        gap: 3px !important;
        font-size: 10.5px !important;
    }
    .home-stats-wrap .grid.grid-cols-4.border-t svg { width: 14px !important; height: 14px !important; }

    /* 核心权益 */
    .py-10.bg-gray-50\/50 { padding-top: 10px !important; padding-bottom: 10px !important; }
    .py-10.bg-gray-50\/50 .text-center.mb-10 { margin-bottom: 6px !important; }
    .py-10.bg-gray-50\/50 .text-center > span {
        margin-bottom: 4px !important;
        padding: 2px 8px !important;
        font-size: 10px !important;
    }
    .py-10.bg-gray-50\/50 .text-center h2 { font-size: 17px !important; margin-bottom: 4px !important; }
    .py-10.bg-gray-50\/50 .text-center p { margin-top: 2px !important; font-size: 12px !important; }
    .grid.home-cards-2 { gap: 8px !important; }
    .grid.home-cards-2 > a { padding: 10px !important; border-radius: 10px !important; }
    .grid.home-cards-2 > a .w-10,
    .grid.home-cards-2 > a .sm\:w-16 {
        width: 36px !important; height: 36px !important;
        margin-bottom: 2px !important;
        font-size: 16px !important;
        border-radius: 8px !important;
    }
    .grid.home-cards-2 > a h3 { margin-bottom: 2px !important; font-size: 13px !important; }
    .grid.home-cards-2 > a p { font-size: 11px !important; line-height: 1.35 !important; }

    /* 主内容卡片 */
    .ls-pc-content { padding-top: 0 !important; }
    .ls-pc-content > div { padding: 12px !important; border-radius: 12px !important; }
    .ls-pc-content .space-y-6 > * + * { margin-top: 10px !important; }
    .ls-pc-content h3 { font-size: 15px !important; margin-bottom: 8px !important; }

    /* 学习仪表盘统计卡 */
    .ls-pc-learning-stats { grid-template-columns: repeat(2, 1fr) !important; gap: 8px !important; }
    .ls-pc-learning-stats > div { padding: 12px !important; border-radius: 12px !important; }
    .ls-pc-learning-stats .text-3xl { font-size: 22px !important; }
    .ls-pc-learning-stats .text-sm { font-size: 12px !important; }

    /* 趋势图 + 概览面板 */
    .ls-pc-chart-panel, .ls-pc-overview-panel { padding: 12px !important; border-radius: 12px !important; }
    .ls-pc-chart-panel .relative.h-48 { height: 160px !important; }
    .ls-pc-overview-panel .space-y-3 > div { padding: 10px 12px !important; border-radius: 10px !important; }
    .ls-pc-overview-panel .font-bold { font-size: 15px !important; }

    /* 课程进度卡片 */
    .ls-pc-content .grid.grid-cols-1.sm\:grid-cols-2.lg\:grid-cols-3 { grid-template-columns: 1fr !important; gap: 8px !important; }
    .ls-pc-content .grid.grid-cols-1.sm\:grid-cols-2.lg\:grid-cols-3 > a { padding: 10px !important; border-radius: 10px !important; }
    .ls-pc-content .grid.grid-cols-1.sm\:grid-cols-2.lg\:grid-cols-3 .w-16.h-16 { width: 48px !important; height: 48px !important; border-radius: 8px !important; }
}

/* ============================================================
   小屏手机优化 (≤380px)
   ============================================================ */
@media (max-width: 380px) {
    .grid.grid-cols-6, .grid.grid-cols-5 { grid-template-columns: repeat(4, 1fr) !important; gap: 6px !important; }
    .max-w-4xl.mx-auto.text-center h1, .max-w-4xl.mx-auto.text-center .text-3xl { font-size: 20px !important; }
    section h2.text-2xl, section h2.text-3xl { font-size: 16px !important; }
    body { font-size: 13.5px; }
}

/* ============================================================
   大屏手机优化 (500-767px) —— 3 列更紧凑
   ============================================================ */
@media (min-width: 500px) and (max-width: 767px) {
    .max-w-4xl.mx-auto.text-center h1 { font-size: 28px !important; }
}
/* ============================================================
   数字资源模块 dr-* 手机端适配
   ============================================================ */
@media (max-width: 767px) {
    /* 容器紧凑 */
    .dr-wrap { padding: 12px 12px 80px; }
    .dr-topbar-inner { padding: 8px 12px; gap: 8px; }
    .dr-logo { font-size: 15px; }
    
    /* Hero 区域单列 */
    .dr-hero { flex-direction: column; padding: 20px 16px; gap: 16px; }
    .dr-hero-text { min-width: 0; }
    .dr-searchbar { max-width: 100%; }
    
    /* 统计卡片2列 */
    .dr-hero-stats { grid-template-columns: repeat(2, 1fr); gap: 10px; }
    .dr-stat b { font-size: 18px; }
    
    /* 布局单列 */
    .dr-layout { grid-template-columns: 1fr; }
    .dr-side { position: static; }
    
    /* 卡片网格2列 */
    .dr-grid { grid-template-columns: repeat(2, 1fr); gap: 10px; }
    .dr-stage-row { grid-template-columns: repeat(2, 1fr); }
    .dr-netdisk-row { grid-template-columns: repeat(2, 1fr); }
    
    /* 卡片紧凑 */
    .dr-card { }
    .dr-card-body { padding: 10px; gap: 4px; }
    .dr-card-title { font-size: 13px; }
    .dr-card-cover-ph { font-size: 32px; }
    
    /* 详情页单列 */
    .dr-detail-head { flex-direction: column; gap: 12px; }
    .dr-detail-cover { width: 100%; flex: none; max-width: 320px; margin: 0 auto; }
    .dr-detail-info h1 { font-size: 18px; }
    .dr-detail-price { font-size: 20px; }
    
    /* 筛选栏堆叠 */
    .dr-filters { padding: 12px; }
    .dr-filter-field { min-width: 100%; }
    
    /* 侧边卡片 */
    .dr-card-side { padding: 14px; }
    
    /* FAB 上移 */
    .dr-fab { bottom: 72px; right: 14px; }
    .dr-fab a { width: 44px; height: 44px; font-size: 20px; }
}

/* ============================================================
   二手市场模块 mk-* 手机端适配
   ============================================================ */
@media (max-width: 767px) {
    /* 容器紧凑 */
    .mk-wrap { padding: 0 12px; }
    
    /* 主布局单列 */
    .mk-main { grid-template-columns: 1fr; min-height: auto; }
    .mk-list-col { border-right: none; overflow-y: visible; }
    .mk-detail-col { position: static; height: auto; overflow-y: visible; border-top: 1px solid var(--mk-line); }
    .mk-detail-col.empty { display: none; }
    
    /* 商品列表2列 */
    .mk-grid { grid-template-columns: repeat(2, 1fr); gap: 10px; }
    .mk-grid-3 { grid-template-columns: repeat(2, 1fr); }
    
    /* 商品卡片紧凑 */
    .mk-card { padding: 12px; margin-bottom: 10px; }
    .mk-card-title { font-size: 14px; }
    .mk-card-price { font-size: 16px; }
    
    /* 筛选栏滚动 */
    .mk-filters { flex-wrap: wrap; gap: 8px; }
    .mk-filter-group { width: 100%; }
    
    /* 发布表单紧凑 */
    .mk-form-group { margin-bottom: 12px; }
    .mk-input, .mk-select { font-size: 14px; padding: 10px 12px; }
    
    /* 详情页图片全屏 */
    .mk-detail-gallery { margin: 0 -12px; }
    .mk-detail-gallery img { width: 100%; }
    
    /* 卖家信息堆叠 */
    .mk-seller-row { flex-direction: column; gap: 8px; }
    .mk-seller-avatar { flex: none; }
    
    /* 聊天列表紧凑 */
    .mk-chat-list { padding: 8px 0; }
    .mk-chat-item { padding: 12px; }
    
    /* 订单列表单列 */
    .mk-order-list { flex-direction: column; }
    .mk-order-item { flex-direction: column; align-items: flex-start; }
    
    /* 交易流程步骤竖排 */
    .mk-tradein-steps { flex-direction: column; }
    .mk-tradein-step { width: 100%; }
    
    /* 附近列表 */
    .mk-nearby-grid { grid-template-columns: 1fr; }
    
    /* 纠纷表单紧凑 */
    .mk-dispute-form { padding: 16px; }
    .mk-form-row { flex-direction: column; gap: 12px; }
    
    /* 互动中心标签栏 */
    .mk-engagement-tabs { flex-wrap: wrap; }
    .mk-tab { flex: 1; min-width: 80px; }
    
    /* 管理面板单列 */
    .mk-admin-grid { grid-template-columns: 1fr; }
    .mk-admin-stats { grid-template-columns: repeat(2, 1fr); }
}

/* ============================================================
   通用：隐藏桌面专用元素
   ============================================================ */
@media (max-width: 767px) {
    .dr-desktop-only { display: none !important; }
    .mk-desktop-only { display: none !important; }
    .lg\:block { display: none !important; }
    .md\:block { display: none !important; }
    .lg\:flex { display: none !important; }
    .md\:flex { display: none !important; }
    .lg\:grid { display: block !important; }
    .md\:grid { display: block !important; }
}

/* ==== 来源: mobile-app.css ==== */
/* ============================================================
   EduMaster Mobile App UI —— 紧凑原生风格优化
   目标：信息密度高 · 视觉层次清 · 类原生APP体验
   ============================================================ */

/* ---------- 全局基础优化 ---------- */
@media (max-width: 767px) {
    /* 紧凑间距系统 */
    :root {
        --app-padding: 12px;
        --app-gap: 8px;
        --app-radius: 10px;
    }
    
    body {
        -webkit-tap-highlight-color: transparent;
        -webkit-touch-callout: none;
    }
    
    /* 容器紧凑化 */
    .max-w-7xl,
    .max-w-4xl,
    .max-w-3xl {
        padding-left: var(--app-padding) !important;
        padding-right: var(--app-padding) !important;
    }
    
    /* 通用间距压缩 */
    .space-y-4 > * + * { margin-top: 8px !important; }
    .space-y-6 > * + * { margin-top: 10px !important; }
    .space-y-8 > * + * { margin-top: 12px !important; }
    
    .space-x-2 > * + * { margin-left: 6px !important; }
    .space-x-4 > * + * { margin-left: 8px !important; }
    .space-x-6 > * + * { margin-left: 10px !important; }
    
    /* 全局padding压缩 */
    .p-4 { padding: 10px !important; }
    .p-5 { padding: 12px !important; }
    .p-6 { padding: 14px !important; }
    .p-8 { padding: 16px !important; }
    
    .px-4 { padding-left: 12px !important; padding-right: 12px !important; }
    .px-5 { padding-left: 14px !important; padding-right: 14px !important; }
    .px-6 { padding-left: 16px !important; padding-right: 16px !important; }
    .px-8 { padding-left: 18px !important; padding-right: 18px !important; }
    
    .py-2 { padding-top: 6px !important; padding-bottom: 6px !important; }
    .py-3 { padding-top: 8px !important; padding-bottom: 8px !important; }
    .py-4 { padding-top: 10px !important; padding-bottom: 10px !important; }
    .py-5 { padding-top: 12px !important; padding-bottom: 12px !important; }
    .py-6 { padding-top: 14px !important; padding-bottom: 14px !important; }
    .py-8 { padding-top: 16px !important; padding-bottom: 16px !important; }
    
    /* 通用margin压缩 */
    .mt-2 { margin-top: 6px !important; }
    .mt-3 { margin-top: 8px !important; }
    .mt-4 { margin-top: 10px !important; }
    .mt-5 { margin-top: 12px !important; }
    .mt-6 { margin-top: 14px !important; }
    .mt-8 { margin-top: 16px !important; }
    
    .mb-2 { margin-bottom: 6px !important; }
    .mb-3 { margin-bottom: 8px !important; }
    .mb-4 { margin-bottom: 10px !important; }
    .mb-5 { margin-bottom: 12px !important; }
    .mb-6 { margin-bottom: 14px !important; }
    .mb-8 { margin-bottom: 16px !important; }
    
    /* 全局gap压缩 */
    .gap-1 { gap: 4px !important; }
    .gap-2 { gap: 6px !important; }
    .gap-3 { gap: 8px !important; }
    .gap-4 { gap: 10px !important; }
    .gap-5 { gap: 12px !important; }
    .gap-6 { gap: 14px !important; }
    .gap-8 { gap: 16px !important; }
    
    /* 字号紧凑化 */
    .text-xs { font-size: 11px !important; }
    .text-sm { font-size: 12.5px !important; }
    .text-base { font-size: 13.5px !important; }
    .text-lg { font-size: 14.5px !important; }
    .text-xl { font-size: 15.5px !important; }
    .text-2xl { font-size: 17px !important; }
    .text-3xl { font-size: 19px !important; }
    .text-4xl { font-size: 21px !important; }
    .text-5xl { font-size: 24px !important; }
    
    /* 行高紧凑 */
    p, li, td, th, .text-sm, .text-base, .text-lg {
        line-height: 1.4 !important;
    }
}

/* ============================================================
   卡片组件优化
   ============================================================ */
@media (max-width: 767px) {
    /* 通用卡片紧凑 */
    .rounded-xl { border-radius: 10px !important; }
    .rounded-2xl { border-radius: 12px !important; }
    
    /* 卡片内边距 */
    .p-3 { padding: 10px !important; }
    .p-4 { padding: 12px !important; }
    .p-5 { padding: 14px !important; }
    
    /* 卡片标题 */
    .card-title,
    .card-header,
    [class*="card"] h2,
    [class*="card"] h3,
    [class*="card"] h4 {
        font-size: 14px !important;
        margin-bottom: 6px !important;
    }
    
    /* 卡片描述 */
    .card-desc,
    .card-body p,
    [class*="card"] p {
        font-size: 12px !important;
        line-height: 1.4 !important;
    }
}

/* ============================================================
   按钮组件优化
   ============================================================ */
@media (max-width: 767px) {
    /* 按钮紧凑 */
    button,
    .btn,
    [role="button"] {
        padding: 8px 14px !important;
        font-size: 13px !important;
        min-height: 36px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
    }
    
    /* 按钮组紧凑 */
    .btn-group,
    [class*="btn-group"] {
        gap: 6px !important;
    }
    
    /* 点击反馈增强 */
    button:active,
    .btn:active,
    [role="button"]:active {
        transform: scale(0.96) !important;
        opacity: 0.9 !important;
    }
}

/* ============================================================
   列表组件优化
   ============================================================ */
@media (max-width: 767px) {
    /* 列表项紧凑 */
    .list-item,
    [class*="list"] > div,
    [class*="list"] > a,
    [class*="list"] > li {
        padding: 10px 12px !important;
        min-height: 44px !important;
        display: flex !important;
        align-items: center !important;
    }
    
    /* 列表分隔线 */
    .list-item + .list-item,
    [class*="list"] > div + div,
    [class*="list"] > a + a {
        border-top-width: 1px !important;
    }
    
    /* 列表图标紧凑 */
    .list-item svg,
    .list-item img.icon,
    [class*="list"] svg,
    [class*="list"] img.icon {
        width: 18px !important;
        height: 18px !important;
        flex-shrink: 0 !important;
    }
    
    /* 列表文字紧凑 */
    .list-item .title,
    .list-item .name,
    .list-item h3,
    .list-item h4,
    [class*="list"] .title,
    [class*="list"] .name {
        font-size: 13.5px !important;
        font-weight: 500 !important;
    }
    
    .list-item .desc,
    .list-item .subtitle,
    [class*="list"] .desc,
    [class*="list"] .subtitle {
        font-size: 11.5px !important;
        color: #6b7280 !important;
    }
}

/* ============================================================
   导航栏优化
   ============================================================ */
@media (max-width: 767px) {
    /* 顶部导航紧凑 */
    header,
    .navbar,
    .topbar,
    [class*="header"] {
        padding: 8px var(--app-padding) !important;
        height: 48px !important;
    }
    
    /* 导航logo/标题 */
    .navbar-brand,
    .topbar-logo,
    [class*="logo"] {
        font-size: 15px !important;
        height: 28px !important;
    }
    
    /* 导航图标 */
    .navbar-icon,
    .topbar-icon,
    [class*="header"] svg {
        width: 20px !important;
        height: 20px !important;
    }
    
    /* 面包屑紧凑 */
    .breadcrumb {
        padding: 6px var(--app-padding) !important;
        font-size: 12px !important;
    }
}

/* ============================================================
   表单组件优化
   ============================================================ */
@media (max-width: 767px) {
    /* 输入框紧凑 */
    input,
    textarea,
    select,
    .form-control {
        padding: 8px 12px !important;
        font-size: 14px !important;
        height: 36px !important;
        border-radius: 8px !important;
    }
    
    /* 表单标签紧凑 */
    label,
    .form-label {
        font-size: 12px !important;
        margin-bottom: 4px !important;
        color: #374151 !important;
    }
    
    /* 表单组紧凑 */
    .form-group,
    .mb-3,
    .mb-4 {
        margin-bottom: 10px !important;
    }
    
    /* 表单提示文字 */
    .form-text,
    .form-hint,
    .text-muted {
        font-size: 11px !important;
    }
}

/* ============================================================
   徽章标签优化
   ============================================================ */
@media (max-width: 767px) {
    .badge,
    .tag,
    [class*="badge"],
    [class*="tag"] {
        padding: 2px 8px !important;
        font-size: 10px !important;
        border-radius: 4px !important;
    }
    
    /* 芯片标签 */
    .chip,
    [class*="chip"] {
        padding: 3px 10px !important;
        font-size: 11px !important;
    }
}

/* ============================================================
   网格布局优化（核心）
   ============================================================ */
@media (max-width: 767px) {
    /* 默认单列，特殊网格调整 */
    .grid-cols-2 { grid-template-columns: repeat(2, 1fr) !important; gap: 8px !important; }
    .grid-cols-3 { grid-template-columns: repeat(2, 1fr) !important; gap: 8px !important; }
    .grid-cols-4 { grid-template-columns: repeat(2, 1fr) !important; gap: 8px !important; }
    .grid-cols-5 { grid-template-columns: repeat(2, 1fr) !important; gap: 8px !important; }
    .grid-cols-6 { grid-template-columns: repeat(2, 1fr) !important; gap: 8px !important; }
    
    /* 卡片网格紧凑 */
    .grid > div,
    .grid > a,
    [class*="grid"] > div {
        padding: 8px !important;
    }
    
    /* 统计卡片紧凑 */
    .stat-card,
    [class*="stat"] {
        padding: 10px !important;
    }
    
    .stat-card .value,
    .stat-card .number,
    [class*="stat"] .value,
    [class*="stat"] .number {
        font-size: 18px !important;
    }
    
    .stat-card .label,
    [class*="stat"] .label {
        font-size: 11px !important;
    }
}

/* ============================================================
   图片媒体优化
   ============================================================ */
@media (max-width: 767px) {
    /* 图片自适应 */
    img,
    .card-img,
    [class*="cover"] img {
        max-width: 100% !important;
        height: auto !important;
    }
    
    /* 封面图紧凑 */
    .cover-img,
    [class*="cover"] img {
        aspect-ratio: 16/10 !important;
    }
    
    /* 头像紧凑 */
    .avatar,
    [class*="avatar"] img {
        width: 32px !important;
        height: 32px !important;
    }
    
    .avatar-sm,
    [class*="avatar-sm"] img {
        width: 24px !important;
        height: 24px !important;
    }
}

/* ============================================================
   表格优化
   ============================================================ */
@media (max-width: 767px) {
    table {
        font-size: 12px !important;
    }
    
    th, td {
        padding: 6px 8px !important;
    }
    
    /* 横向滚动 */
    .table-wrapper {
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch;
    }
}

/* ============================================================
   分页优化
   ============================================================ */
@media (max-width: 767px) {
    .pagination,
    [class*="pager"] {
        padding: 8px 0 !important;
        gap: 4px !important;
    }
    
    .pagination button,
    .pagination a,
    [class*="pager"] button,
    [class*="pager"] a {
        padding: 6px 12px !important;
        font-size: 12px !important;
        min-width: 32px !important;
        text-align: center !important;
    }
}

/* ============================================================
   Hero区域优化
   ============================================================ */
@media (max-width: 767px) {
    .hero,
    [class*="hero"],
    section:first-of-type {
        padding: 16px var(--app-padding) !important;
        margin-bottom: 12px !important;
    }
    
    .hero h1,
    .hero h2,
    [class*="hero"] h1,
    [class*="hero"] h2 {
        font-size: 20px !important;
        margin-bottom: 8px !important;
        line-height: 1.3 !important;
    }
    
    .hero p,
    .hero .desc,
    [class*="hero"] p,
    [class*="hero"] .desc {
        font-size: 13px !important;
        margin-bottom: 12px !important;
    }
    
    .hero .actions,
    .hero .buttons,
    [class*="hero"] .actions,
    [class*="hero"] .buttons {
        gap: 8px !important;
    }
}

/* ============================================================
   空状态优化
   ============================================================ */
@media (max-width: 767px) {
    .empty-state,
    [class*="empty"],
    .no-data {
        padding: 30px 16px !important;
    }
    
    .empty-state svg,
    .empty-state img,
    [class*="empty"] svg,
    [class*="empty"] img {
        width: 48px !important;
        height: 48px !important;
        margin-bottom: 12px !important;
    }
    
    .empty-state h3,
    .empty-state h4,
    [class*="empty"] h3,
    [class*="empty"] h4 {
        font-size: 14px !important;
        margin-bottom: 6px !important;
    }
    
    .empty-state p,
    [class*="empty"] p {
        font-size: 12px !important;
    }
}

/* ============================================================
   Tab导航优化
   ============================================================ */
@media (max-width: 767px) {
    .tabs,
    [class*="tab-nav"],
    .nav-tabs {
        overflow-x: auto !important;
        scrollbar-width: none !important;
        -ms-overflow-style: none !important;
        padding: 0 var(--app-padding) !important;
    }
    
    .tabs::-webkit-scrollbar,
    [class*="tab-nav"]::-webkit-scrollbar {
        display: none !important;
    }
    
    .tab-item,
    [class*="tab"] a,
    [class*="tab"] button {
        padding: 8px 14px !important;
        font-size: 13px !important;
        white-space: nowrap !important;
        min-width: fit-content !important;
    }
    
    .tab-item.active,
    [class*="tab"].active {
        font-weight: 600 !important;
    }
}

/* ============================================================
   搜索栏优化
   ============================================================ */
@media (max-width: 767px) {
    .search-bar,
    [class*="search"],
    .filter-bar {
        padding: 8px var(--app-padding) !important;
        gap: 8px !important;
    }
    
    .search-bar input,
    .search-bar input[type="search"],
    [class*="search"] input {
        padding: 8px 12px 8px 36px !important;
        font-size: 13px !important;
        height: 36px !important;
        border-radius: 18px !important;
        background: #f3f4f6 !important;
        border: none !important;
    }
    
    .search-bar button,
    [class*="search"] button {
        width: 36px !important;
        height: 36px !important;
        padding: 0 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }
}

/* ============================================================
   悬浮按钮优化
   ============================================================ */
@media (max-width: 767px) {
    .fab,
    [class*="fab"],
    .float-btn {
        width: 44px !important;
        height: 44px !important;
        bottom: 72px !important;
        right: 16px !important;
    }
    
    .fab svg,
    .fab i,
    [class*="fab"] svg,
    [class*="fab"] i {
        width: 22px !important;
        height: 22px !important;
    }
}

/* ============================================================
   底部安全区适配（iPhone X+）
   ============================================================ */
@media (max-width: 767px) {
    body {
        padding-bottom: env(safe-area-inset-bottom, 0px) !important;
    }
    
    /* 底部固定栏适配 */
    .fixed-bottom,
    [class*="bottom-bar"],
    nav[role="navigation"] {
        padding-bottom: env(safe-area-inset-bottom, 0px) !important;
        height: calc(56px + env(safe-area-inset-bottom, 0px)) !important;
    }
}

/* ============================================================
   触摸优化（44px最小点击区）
   ============================================================ */
@media (max-width: 767px) {
    a, button, [role="button"], label {
        min-height: 44px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
    }
    
    /* 链接内边距 */
    a {
        padding: 8px 12px !important;
    }
    
    /* 表单元素点击区 */
    input, select, textarea, button {
        min-height: 44px !important;
    }
    /* 正文/文本容器内的行内链接保持原样（不被触摸优化撑坏） */
    main a, .entry-content a, article a, .prose a,
    .ls-card a, .copyright a, .footer-copyright a,
    .text-gray-500 a, .text-gray-600 a, .text-gray-400 a,
    .comment-content a, .page-content a, .single-content a {
        min-height: auto !important;
        display: inline !important;
        padding: 0 !important;
        align-items: initial !important;
        justify-content: initial !important;
        vertical-align: baseline !important;
    }
}

/* ============================================================
   英文 / 多语言移动端排版保护（翻译后兼容）
   —— 英文文案普遍比中文长，拉丁长单词默认不断行，易撑破
   固定宽度容器、底部 Tab、按钮与卡片。此段在移动端全局
   启用安全换行与省略保护，确保切换英文后 APP 排版不崩。
   ============================================================ */
@media (max-width: 767px) {

    /* 1) 全局安全换行：长单词可断行，杜绝横向溢出 */
    body,
    p, h1, h2, h3, h4, h5, h6,
    a, span, div, li, td, th, label,
    [class*="title"], [class*="desc"], [class*="name"],
    [class*="card"], [class*="item"], [class*="content"] {
        overflow-wrap: break-word;
        word-wrap: break-word;
    }

    /* 2) 底部 Tab 标签：英文长标签截断省略，不挤出容器 */
    #mobile-nav-dock .mobile-tab-item {
        min-width: 0 !important;
        padding: 0 1px !important;
    }
    #mobile-nav-dock .mobile-tab-item span {
        display: block !important;
        max-width: 100% !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
        line-height: 1.2 !important;
        padding: 0 1px !important;
    }

    /* 3) 按钮：过长文案安全断行，避免溢出容器 */
    button, .btn, [role="button"] {
        min-width: 0 !important;
        white-space: normal !important;
        overflow-wrap: break-word !important;
        word-break: break-word !important;
        text-align: center !important;
    }

    /* 4) 弹性/网格子项最小宽度归零，防英文撑破一行 */
    .flex > *, .flex-wrap > *, .grid > *,
    [class*="flex"] > *, [class*="grid"] > * {
        min-width: 0 !important;
    }

    /* 5) 表单控件最小宽度归零，英文不横向溢出 */
    input, select, textarea, .form-control {
        min-width: 0 !important;
    }

    /* 6) 徽章/标签/统计标签等固定宽度文本省略保护 */
    [class*="badge"], [class*="tag"], [class*="chip"],
    [class*="stat"] [class*="label"] {
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }
}

/* 英文模式（html lang=en*）额外收紧：Tab 标签更紧凑 */
@media (max-width: 767px) {
    html[lang^="en"] #mobile-nav-dock .mobile-tab-item span {
        font-size: 9px !important;
        letter-spacing: -0.01em;
    }
}

/* ============================================================
   性能优化（减少重绘）
   ============================================================ */
@media (max-width: 767px) {
    * {
        -webkit-tap-highlight-color: transparent !important;
        -webkit-touch-callout: none !important;
    }
    
    /* 启用硬件加速 */
    .card,
    [class*="card"],
    .item,
    [class*="item"] {
        transform: translateZ(0) !important;
        backface-visibility: hidden !important;
    }
}

/* ==== 来源: dark-mode.css ==== */
/* ============================================================
   edumaster 夜间模式（dark-mode）
   body 加 .dark-mode 后全站切换暗色。
   JS 由 edumaster-bundle.js 的 bindNightMode 处理（点击 data-toggle-night）。
   这里补齐 .dark-mode 的实际样式，否则开关无视觉效果。
   覆盖 Tailwind 常用背景/文字/边框类，作用于 body 后代，特异性更高。
   ============================================================ */

:root { color-scheme: light; }
html.dark-mode {
    color-scheme: dark;
    /* 设计令牌暗色覆盖：使所有 var(--ls-*) 组件自动变暗 */
    --ls-blue-soft:   #14233c;
    --ls-blue-soft-2: #14233c;
    --ls-blue-line:   #2c3f58;
    --ls-gold-soft:   #302714;
    --ls-gold-line:   #4a3d1f;
    --ls-navy-soft:   #16293f;
    --ls-ink:    #f1f5f9;
    --ls-body:   #cbd5e1;
    --ls-muted:  #94a3b8;
    --ls-faint:  #64748b;
    --ls-line:   #2c3f58;
    --ls-line-2: #223349;
    --ls-bg:     #0b1220;
    --ls-bg-2:   #101828;
    --ls-card:   #16202f;
    --ls-invert: #131c2b;
    --ls-success-soft: #0f2e25;
    --ls-danger-soft:  #33161b;
    --ls-warn-soft:    #33250f;
    --ls-info-soft:    #12273a;
    /* 二手市场 market.css */
    --mk-paper:   #0b1220;
    --mk-surface: #16202f;
    --mk-ink:     #f1f5f9;
    --mk-line:    #2c3f58;
    --mk-brand-soft:  #14233c;
    --mk-warn-soft:   #33250f;
    --mk-danger-soft: #33161b;
    --mk-info-soft:   #12273a;
    /* 威客 witkey.css */
    --wk-text:          #f1f5f9;
    --wk-text-sub:      #cbd5e1;
    --wk-text-mute:     #94a3b8;
    --wk-border:        #2c3f58;
    --wk-bg:            #0b1220;
    --wk-card:          #16202f;
    --wk-primary-light: #14233c;
    /* 个人中心/运营 user-dashboard .ls-ov-wrap */
    --ov-text:  #e2e8f0;
    --ov-muted: #94a3b8;
    --ov-border:#2c3f58;
    --ov-bg:    #0b1220;
    --ov-card:  #16202f;
    /* 数字资源 dresources.css */
    --dr-bg:   #0b1220;
    --dr-card: #16202f;
    --dr-text: #f1f5f9;
    --dr-sub:  #cbd5e1;
    --dr-line: #2c3f58;
    /* 学院 school-redesign.css */
    --ls-school-bg:      #0b1220;
    --ls-school-text:    #f1f5f9;
    --ls-school-muted:   #cbd5e1;
    --ls-school-card-bg: #16202f;
    --ls-school-gold-light: #4a3d1f;
    /* 二手市场 market.css 次级/弱文字 + 次级线 */
    --mk-ink-2:  #cbd5e1;
    --mk-ink-3:  #94a3b8;
    --mk-line-2: #223349;
    /* 教师工作台 ao-education.css */
    --ao-bg:        #0b1220;
    --ao-surface:   #16202f;
    --ao-border:    #2c3f58;
    --ao-border-s:  #223349;
    --ao-text:      #f1f5f9;
    --ao-text-2:    #cbd5e1;
    --ao-muted:     #94a3b8;
    --ao-primary-l: #14233c;
    /* 品牌主色暗色可读：#0E2A47/#1B4A77 落在 #16202f 上仅 1.1:1 / 1.8:1。
       改亮后所有直接 var(--ls-navy)/var(--ls-blue) 的文字，以及 :root 里
       重定向到它们的 --kg/--wk/--mk/--lsj/--dr/--ao/--ai/--ach/--ov/--tn/--sd
       主色一并变亮（共 90+ 条 color 规则一次性修复）。
       实底反白按钮见文件末尾「品牌实底在暗色下回压」块。 */
    --ls-navy: #93c5fd;
    --ls-blue: #60a5fa;
}

/* ---- 页面底色（dark-mode 统一挂在 <html>，由 <head> 防闪脚本 + JS 切换共同维护） ---- */
html.dark-mode body {
    background-color: #0b1220 !important;
    color: #d7dde7 !important;
}
body.dark-mode {
    background-color: #0b1220 !important;
    color: #d7dde7 !important;
}

/* ---- 卡片 / 容器背景（白 → 深） ---- */
.dark-mode .bg-white       { background-color: #16202f !important; }
.dark-mode .bg-gray-50     { background-color: #131c2b !important; }
.dark-mode .bg-gray-100    { background-color: #182436 !important; }
.dark-mode .bg-gray-200    { background-color: #223349 !important; }
.dark-mode .bg-gray-300    { background-color: #2c3f58 !important; }
.dark-mode .bg-slate-50    { background-color: #131c2b !important; }
.dark-mode .bg-slate-100   { background-color: #182436 !important; }
.dark-mode .bg-slate-200   { background-color: #223349 !important; }

/* ---- 浅色 soft 背景（bg-*-50 / bg-*-100）转深色半透明 ---- */
.dark-mode .bg-blue-50     { background-color: #14233c !important; }
.dark-mode .bg-indigo-50   { background-color: #171f3a !important; }
.dark-mode .bg-emerald-50  { background-color: #122e2c !important; }
.dark-mode .bg-amber-50    { background-color: #302714 !important; }
.dark-mode .bg-rose-50     { background-color: #321a22 !important; }
.dark-mode .bg-sky-50      { background-color: #11283a !important; }
.dark-mode .bg-violet-50   { background-color: #1d1a36 !important; }
.dark-mode .bg-teal-50     { background-color: #102e2c !important; }
.dark-mode .bg-orange-50   { background-color: #302314 !important; }
.dark-mode .bg-fuchsia-50  { background-color: #2c1636 !important; }
.dark-mode .bg-lime-50     { background-color: #1d2c12 !important; }
.dark-mode .bg-cyan-50     { background-color: #0f2a30 !important; }
.dark-mode .bg-blue-100    { background-color: #14233c !important; }
.dark-mode .bg-indigo-100  { background-color: #171f3a !important; }
.dark-mode .bg-emerald-100 { background-color: #122e2c !important; }
.dark-mode .bg-amber-100   { background-color: #302714 !important; }
.dark-mode .bg-rose-100    { background-color: #321a22 !important; }
.dark-mode .bg-sky-100     { background-color: #11283a !important; }

/* ---- 深色背景保持更深 ---- */
.dark-mode .bg-gray-900    { background-color: #070d1a !important; }
.dark-mode .bg-gray-800    { background-color: #0d1524 !important; }
.dark-mode .bg-slate-800   { background-color: #0d1524 !important; }
.dark-mode .bg-slate-900   { background-color: #070d1a !important; }

/* ---- 文字（深灰系列转浅色，浅灰系列适度） ---- */
.dark-mode .text-gray-900  { color: #f1f5f9 !important; }
.dark-mode .text-gray-800  { color: #e2e8f0 !important; }
.dark-mode .text-gray-700  { color: #cbd5e1 !important; }
.dark-mode .text-gray-600  { color: #b3bdc9 !important; }
.dark-mode .text-gray-500  { color: #94a3b8 !important; }
.dark-mode .text-gray-400  { color: #94a3b8 !important; }
.dark-mode .text-slate-900 { color: #f1f5f9 !important; }
.dark-mode .text-slate-800 { color: #e2e8f0 !important; }
.dark-mode .text-slate-700 { color: #cbd5e1 !important; }
.dark-mode .text-slate-600 { color: #b3bdc9 !important; }
.dark-mode .text-slate-500 { color: #94a3b8 !important; }
.dark-mode .text-slate-400 { color: #94a3b8 !important; }
/* 白字在深底上保持可读（若原为深底上的白字，勿转） */
.dark-mode .text-white     { color: #f8fafc !important; }

/* ---- 边框（浅灰转深） ---- */
.dark-mode .border-gray-100,
.dark-mode .border-gray-200,
.dark-mode .border-gray-300,
.dark-mode .border-slate-100,
.dark-mode .border-slate-200,
.dark-mode .border-slate-300 {
    border-color: #2c3f58 !important;
}
.dark-mode .divide-gray-100 > :not([hidden]) ~ :not([hidden]),
.dark-mode .divide-gray-200 > :not([hidden]) ~ :not([hidden]) {
    border-color: #2c3f58 !important;
}

/* ---- 输入控件 ---- */
.dark-mode input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),
.dark-mode textarea,
.dark-mode select {
    background-color: #16202f !important;
    color: #e2e8f0 !important;
    border-color: #334155 !important;
}
.dark-mode input::placeholder,
.dark-mode textarea::placeholder { color: #94a3b8 !important; }

/* ---- 头部 / 底部导航 ---- */
.dark-mode #main-header,
.dark-mode .ls-topbar,
.dark-mode #mobile-header {
    background-color: #101828 !important;
    border-color: #223349 !important;
}

/* ---- 通用面板标题/副标题在深底可读 ---- */
.dark-mode .text-black   { color: #e5e7eb !important; }
.dark-mode .heading,
.dark-mode h1, .dark-mode h2, .dark-mode h3, .dark-mode h4, .dark-mode h5, .dark-mode h6 {
    color: #f1f5f9 !important;
}

/* ---- 阴影卡片在深底下更自然 ---- */
.dark-mode .shadow-sm,
.dark-mode .shadow,
.dark-mode .shadow-md {
    box-shadow: 0 1px 3px rgba(0,0,0,.4), 0 1px 2px rgba(0,0,0,.3) !important;
}

/* ---- 移动端抽屉/遮罩 ---- */
.dark-mode #mobile-menu-overlay,
.dark-mode .ls-drawer,
.dark-mode .mobile-menu-panel {
    background-color: #101828 !important;
}

/* 夜间开关 pressed 视觉反馈（桌面+移动按钮） */
[data-toggle-night][aria-pressed="true"] {
    background: #16202f !important;
    color: #e2e8f0 !important;
    border-color: #2c3f58 !important;
}
/* 移动端底部操作栏（wk/dr）暗色 */
html.dark-mode .wk-actionbar,
html.dark-mode .dr-actionbar {
    background: #16202f !important;
    border-top-color: #2c3f58 !important;
}
/* ---- 修复白底硬编码与浅色底（暗色） ---- */
html.dark-mode #mobile-nav-dock.mobile-tab-bar {
    background: #101828 !important;
    border-top-color: #223349 !important;
    box-shadow: 0 -4px 20px rgba(0,0,0,.4) !important;
}
html.dark-mode .home-rank-tabs button.bg-gray-900,
html.dark-mode .home-rank-tabs button[aria-pressed="true"],
html.dark-mode .home-rank-tabs button.active {
    background: #16202f !important;
    color: #f1f5f9 !important;
    box-shadow: 0 1px 2px rgba(0,0,0,.4) !important;
}
html.dark-mode .ls-pc-header-actions > * {
    background: #16202f !important;
    color: #93c5fd !important;
    box-shadow: 0 2px 6px rgba(0,0,0,.3) !important;
}
/* 商品详情页组件 */
html.dark-mode .sp-header { background: #101828 !important; border-bottom-color: #223349 !important; }
html.dark-mode .sp-summary-name { color: #f1f5f9 !important; }
html.dark-mode .ls-btn-ghost { background: #16202f !important; color: #cbd5e1 !important; border-color: #2c3f58 !important; }
/* 半透明白 bg-white/xx → 半透明深 */
html.dark-mode .bg-white\/50 { background-color: rgba(13,18,32,0.5) !important; }
html.dark-mode .bg-white\/70 { background-color: rgba(13,18,32,0.7) !important; }
html.dark-mode .bg-white\/80 { background-color: rgba(13,18,32,0.8) !important; }
html.dark-mode .bg-white\/90 { background-color: rgba(13,18,32,0.9) !important; }
html.dark-mode .bg-white\/10 { background-color: rgba(13,18,32,0.1) !important; }
html.dark-mode .bg-white\/15 { background-color: rgba(13,18,32,0.15) !important; }
html.dark-mode .bg-white\/20 { background-color: rgba(13,18,32,0.2) !important; }
html.dark-mode .bg-white\/25 { background-color: rgba(13,18,32,0.25) !important; }
html.dark-mode .bg-white\/30 { background-color: rgba(13,18,32,0.3) !important; }
html.dark-mode .bg-white\/40 { background-color: rgba(13,18,32,0.4) !important; }
/* 彩色浅底 → 深色 */
html.dark-mode .bg-pink-100, html.dark-mode .bg-rose-100 { background-color: #3a1a22 !important; }
html.dark-mode .bg-red-100 { background-color: #3a1a22 !important; }
html.dark-mode .bg-yellow-100, html.dark-mode .bg-amber-100 { background-color: #3a2f1a !important; }
html.dark-mode .bg-purple-100, html.dark-mode .bg-violet-100 { background-color: #2a1f3a !important; }
html.dark-mode .bg-green-100, html.dark-mode .bg-emerald-100 { background-color: #1a3222 !important; }

/* ==== 来源: shop-product.css ==== */
/* ============================================================
   EduMaster - 商品详情页样式（single-shop_product.php）
   作用域限定 .sp-* / .product-*，全局加载不影响其它页面。
   ============================================================ */

/* ---------- 顶部面包屑导航 ---------- */
.sp-header {
    background: #fff;
    border-bottom: 1px solid #eef0f3;
    position: sticky;
    top: 0;
    z-index: 50;
}
.sp-header-inner {
    max-width: 1200px;
    margin: 0 auto;
    padding: 10px 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}
.sp-header-nav {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: #6b7280;
    flex-wrap: wrap;
}
.sp-header-nav a { color: #6b7280; text-decoration: none; }
.sp-header-nav a:hover { color: #2563eb; }
.sp-header-nav span { color: #d1d5db; }
.sp-crumb-current { color: #111827; font-weight: 600; }
.sp-header-actions { flex-shrink: 0; }
.sp-header-btn {
    display: inline-block;
    padding: 6px 14px;
    background: #f3f4f6;
    color: #374151;
    border-radius: 8px;
    font-size: 13px;
    text-decoration: none;
}
.sp-header-btn:hover { background: #e5e7eb; }

/* ---------- 店铺摘要 ---------- */
.sp-summary-wrap {
    max-width: 1200px;
    margin: 16px auto 0;
    padding: 0 16px;
}
.sp-summary {
    background: #fff;
    border: 1px solid #eef0f3;
    border-radius: 14px;
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 16px;
    box-shadow: 0 1px 3px rgba(16,24,40,.04);
}
.sp-summary-avatar {
    width: 56px; height: 56px;
    border-radius: 12px;
    background: #eff6ff;
    display: flex; align-items: center; justify-content: center;
    overflow: hidden; flex-shrink: 0;
}
.sp-summary-logo { width: 100%; height: 100%; object-fit: cover; }
.sp-icon-lg { font-size: 28px; }
.sp-summary-info { flex: 1; min-width: 0; }
.sp-summary-title { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.sp-summary-name { font-size: 16px; font-weight: 700; color: #111827; }
.sp-summary-badge {
    font-size: 11px; color: #16a34a; background: #dcfce7;
    padding: 2px 8px; border-radius: 999px;
}
.sp-summary-rating { font-size: 12px; color: #f59e0b; font-weight: 600; }
.sp-summary-meta {
    margin-top: 6px; display: flex; gap: 12px; flex-wrap: wrap;
    font-size: 12px; color: #6b7280;
}
.sp-desc-text { color: #9ca3af; }
.sp-summary-stats { display: flex; gap: 8px; flex-shrink: 0; }
.sp-summary-stat, .sp-summary-stat-outline {
    display: inline-flex; align-items: center;
    padding: 8px 14px; border-radius: 10px;
    font-size: 13px; font-weight: 600; text-decoration: none; white-space: nowrap;
}
.sp-summary-stat { background: #2563eb; color: #fff; }
.sp-summary-stat:hover { background: #1d4ed8; }
.sp-summary-stat-outline { background: #fff; color: #ef4444; border: 1px solid #fecaca; }
.sp-summary-stat-outline:hover { background: #fef2f2; }

/* ---------- 主布局：主内容 + 侧边栏 ---------- */
.sp-main-layout {
    max-width: 1200px;
    margin: 16px auto 0;
    padding: 0 16px 40px;
    display: grid;
    grid-template-columns: 1fr 320px;
    gap: 24px;
    align-items: start;
}
.product-main-content { min-width: 0; }
.product-sidebar { min-width: 0; }

/* ---------- 通用卡片 ---------- */
.sp-card {
    background: #fff;
    border: 1px solid #eef0f3;
    border-radius: 14px;
    padding: 20px;
    margin-bottom: 20px;
    box-shadow: 0 1px 3px rgba(16,24,40,.04);
}
.sp-card-title-lg {
    display: flex; align-items: center; gap: 8px;
    font-size: 17px; font-weight: 700; color: #111827;
    margin: 0 0 16px;
}
.sp-accent-bar { width: 4px; height: 18px; background: #2563eb; border-radius: 2px; display: inline-block; }
.sp-accent-bar-sm { width: 4px; height: 16px; background: #2563eb; border-radius: 2px; display: inline-block; }
.sp-accent-bar-orange { width: 4px; height: 16px; background: #f97316; border-radius: 2px; display: inline-block; }
.sp-accent-bar-green { width: 4px; height: 16px; background: #16a34a; border-radius: 2px; display: inline-block; }

/* ---------- 产品图文网格 ---------- */
.sp-product-grid {
    display: grid;
    grid-template-columns: 360px 1fr;
    gap: 24px;
}
.product-image-wrap { min-width: 0; }
.sp-gallery {
    border-radius: 12px; overflow: hidden;
    background: #f3f4f6;
    aspect-ratio: 1 / 1;
    display: flex; align-items: center; justify-content: center;
}
.sp-main-image { width: 100%; height: 100%; object-fit: cover; }
.sp-icon-big { font-size: 64px; }
.product-info-wrap { min-width: 0; }

.sp-product-title {
    font-size: 22px; font-weight: 700; color: #111827; margin: 0 0 8px;
    line-height: 1.3;
}
.sp-product-desc { color: #6b7280; font-size: 14px; margin: 0 0 16px; line-height: 1.6; }

.sp-price-box {
    background: linear-gradient(135deg,#fff7ed,#fffbeb);
    border: 1px solid #fde68a;
    border-radius: 12px;
    padding: 14px 16px;
    margin-bottom: 16px;
}
.sp-price-row { display: flex; align-items: baseline; gap: 10px; }
.sp-price-current { font-size: 28px; font-weight: 800; color: #ea580c; }
.sp-price-original { font-size: 15px; color: #9ca3af; }
.sp-price-meta {
    margin-top: 8px; display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
    font-size: 12px; color: #92400e;
}
.sp-price-tag {
    background: #ea580c; color: #fff; padding: 2px 8px; border-radius: 6px; font-weight: 600;
}

/* ---------- 参数 ---------- */
.sp-params {
    display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px 24px;
    padding: 12px 0; border-top: 1px dashed #e5e7eb; margin-bottom: 16px;
}
.sp-param-item { display: flex; align-items: center; gap: 8px; font-size: 13px; }
.sp-param-label { color: #9ca3af; min-width: 42px; }
.sp-param-value { color: #374151; font-weight: 600; }
.sp-stock-instock { color: #16a34a; font-weight: 600; font-size: 13px; }
.sp-stock-out { color: #ef4444; font-weight: 600; font-size: 13px; }
.sp-author-name { color: #2563eb; font-weight: 600; }

/* ---------- 操作按钮 ---------- */
.sp-actions { display: flex; gap: 12px; flex-wrap: wrap; }
.sp-btn-primary, .sp-btn-buy, .sp-btn-fav {
    flex: 1; min-width: 120px; text-align: center;
    padding: 13px 16px; border-radius: 10px; font-size: 15px; font-weight: 700;
    text-decoration: none; transition: opacity .15s;
}
.sp-btn-primary { background: #2563eb; color: #fff; }
.sp-btn-primary:hover { background: #1d4ed8; }
.sp-btn-buy { background: linear-gradient(135deg,#f97316,#ea580c); color: #fff; }
.sp-btn-buy:hover { opacity: .92; }
.sp-btn-fav {
    flex: 0 0 auto; min-width: 96px;
    background: #fff; color: #ef4444; border: 1px solid #fecaca;
    display: inline-flex; align-items: center; justify-content: center; gap: 6px;
}

/* ---------- 产品详情 / 标签 ---------- */
.sp-content { font-size: 14px; color: #374151; line-height: 1.8; }
.sp-content img { max-width: 100%; height: auto; border-radius: 8px; }
.sp-desc-color { color: #4b5563; }
.sp-content-empty { color: #9ca3af; padding: 12px 0; }
.sp-footer { margin-top: 16px; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 13px; }
.sp-footer-label { color: #9ca3af; }
.sp-tag {
    background: #eff6ff; color: #2563eb; padding: 4px 10px; border-radius: 999px;
    font-size: 12px; text-decoration: none;
}
.sp-tag:hover { background: #dbeafe; }

/* ---------- 侧边栏卡片 ---------- */
.sp-sidebar-card {
    background: #fff; border: 1px solid #eef0f3; border-radius: 14px;
    padding: 18px; margin-bottom: 20px; box-shadow: 0 1px 3px rgba(16,24,40,.04);
}
.sp-sidebar-title {
    display: flex; align-items: center; gap: 8px;
    font-size: 15px; font-weight: 700; color: #111827; margin: 0 0 14px;
}
.sp-seller-card { display: flex; align-items: center; gap: 12px; }
.sp-seller-avatar { width: 48px; height: 48px; border-radius: 50%; object-fit: cover; }
.sp-seller-name { font-size: 15px; font-weight: 700; color: #111827; }
.sp-seller-meta { font-size: 12px; color: #16a34a; margin-top: 2px; }
.sp-seller-stats { display: flex; gap: 8px; margin: 14px 0; }
.sp-seller-stat {
    flex: 1; text-align: center; background: #f9fafb; border-radius: 10px; padding: 10px 4px;
}
.sp-seller-stat-val { font-size: 16px; font-weight: 800; color: #111827; }
.sp-seller-stat-val.green { color: #16a34a; }
.sp-seller-stat-val.yellow { color: #f59e0b; }
.sp-seller-stat-label { font-size: 11px; color: #9ca3af; margin-top: 2px; }
.sp-view-all {
    display: block; text-align: center; padding: 10px;
    border: 1px solid #e5e7eb; border-radius: 10px; color: #2563eb;
    font-size: 13px; font-weight: 600; text-decoration: none;
}
.sp-view-all:hover { background: #eff6ff; }

/* ---------- 相关推荐 / 热销排行 ---------- */
.sp-related-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.sp-related-item { text-decoration: none; color: inherit; }
.sp-r-card {
    border: 1px solid #f1f3f5; border-radius: 10px; overflow: hidden; background: #fff;
    transition: box-shadow .15s;
}
.sp-related-item:hover .sp-r-card { box-shadow: 0 4px 12px rgba(16,24,40,.08); }
.sp-related-img { width: 100%; aspect-ratio: 1/1; object-fit: cover; background: #f3f4f6; display: block; }
.sp-related-name { font-size: 13px; color: #374151; padding: 8px 10px 2px; line-height: 1.4;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.sp-related-price { font-size: 14px; font-weight: 700; color: #ea580c; padding: 0 10px 10px; }

.sp-rank-list { display: flex; flex-direction: column; gap: 10px; }
.sp-rank-item { display: flex; align-items: center; gap: 10px; text-decoration: none; padding: 8px; border-radius: 10px; }
.sp-rank-item:hover { background: #f9fafb; }
.sp-rank-item img { width: 44px; height: 44px; border-radius: 8px; object-fit: cover; background: #f3f4f6; }
.sp-rank-title { font-size: 13px; color: #374151; line-height: 1.4;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.sp-rank-price { font-size: 13px; font-weight: 700; color: #ea580c; }
.sp-rank-empty, .sp-rank-empty { color: #9ca3af; font-size: 13px; padding: 8px 0; }

/* ---------- 评价 ---------- */
.sp-review-summary {
    display: flex; align-items: center; gap: 16px;
    background: #f9fafb; border-radius: 12px; padding: 16px; margin-bottom: 16px;
}
.sp-review-score-num { font-size: 32px; font-weight: 800; color: #111827; line-height: 1; }
.sp-review-score-label { font-size: 12px; color: #9ca3af; margin-top: 4px; }
.sp-review-flex { flex: 1; }
.sp-review-subtitle { font-size: 14px; font-weight: 600; color: #374151; }
.sp-review-stars { color: #f59e0b; font-size: 16px; margin-top: 4px; letter-spacing: 2px; }
.sp-review-list { display: flex; flex-direction: column; gap: 12px; }
.sp-review-item { border-bottom: 1px solid #f1f3f5; padding-bottom: 12px; }
.sp-review-header { display: flex; align-items: center; gap: 10px; }
.sp-review-avatar { width: 40px; height: 40px; border-radius: 50%; overflow: hidden; flex-shrink: 0; }
.sp-review-avatar img { width: 100%; height: 100%; object-fit: cover; }
.sp-review-author { font-size: 14px; font-weight: 600; color: #111827; }
.sp-review-date { font-size: 12px; color: #9ca3af; margin-top: 2px; }
.sp-review-rating { margin-left: auto; color: #f59e0b; font-size: 14px; letter-spacing: 1px; }
.sp-review-text { font-size: 14px; color: #4b5563; line-height: 1.7; margin-top: 8px; }
.sp-review-empty { text-align: center; color: #9ca3af; padding: 20px 0; }
.sp-review-empty-icon { font-size: 28px; margin-bottom: 6px; }

.sp-review-form { margin-top: 18px; border-top: 1px dashed #e5e7eb; padding-top: 16px; }
.sp-review-form-title { font-size: 15px; font-weight: 700; color: #111827; margin: 0 0 12px; }
.sp-form-row { margin-bottom: 12px; }
.sp-review-label { display: block; font-size: 13px; color: #6b7280; margin-bottom: 6px; }
.sp-star-rating { display: flex; gap: 4px; }
.sp-star-rating span {
    width: 32px; height: 32px; display: flex; align-items: center; justify-content: center;
    font-size: 22px; color: #d1d5db; cursor: pointer; border-radius: 6px;
}
.sp-star-rating span:hover, .sp-star-rating span.active { color: #f59e0b; background: #fffbeb; }
.sp-form-textarea {
    width: 100%; border: 1px solid #e5e7eb; border-radius: 10px; padding: 10px 12px;
    font-size: 14px; resize: vertical; box-sizing: border-box;
}
.sp-form-textarea:focus { outline: none; border-color: #2563eb; box-shadow: 0 0 0 3px rgba(37,99,235,.12); }
.sp-submit-btn {
    background: #2563eb; color: #fff; border: none; border-radius: 10px;
    padding: 11px 28px; font-size: 14px; font-weight: 700; cursor: pointer;
}
.sp-submit-btn:hover { background: #1d4ed8; }

/* ---------- 底部操作条（未登录时的登录提示；移动端固定吸底） ---------- */
.sp-footer-bar {
    display: flex; align-items: center; justify-content: space-between; gap: 12px;
    background: #fff; border: 1px solid #e5e7eb; border-radius: 12px;
    padding: 12px 16px; margin-top: 18px;
}
.sp-footer-bar-text { font-size: 13px; color: #6b7280; }
.sp-footer-bar-btn {
    background: #2563eb; color: #fff; text-decoration: none;
    padding: 10px 20px; border-radius: 10px; font-size: 14px; font-weight: 700;
}
.sp-footer-bar-btn:hover { background: #1d4ed8; }

/* ---------- 商品卖点 ---------- */
.sp-highlights { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }
.sp-highlight-item {
    display: inline-flex; align-items: center; gap: 4px;
    background: #ecfdf5; color: #047857; border: 1px solid #a7f3d0;
    padding: 4px 11px; border-radius: 999px; font-size: 12.5px; font-weight: 600; line-height: 1.4;
}

/* ---------- 服务承诺 ---------- */
.sp-service-strip { display: flex; flex-wrap: wrap; gap: 10px; margin: 14px 0 4px; }
.sp-service-badge {
    display: inline-flex; align-items: center; gap: 5px;
    font-size: 12.5px; color: #374151; background: #f9fafb; border: 1px solid #e5e7eb;
    padding: 5px 11px; border-radius: 8px; line-height: 1.4;
}
.sp-service-icon { font-size: 13px; }

/* ---------- 营销活动标签 ---------- */
.sp-promo-tags { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.sp-promo-tag {
    display: inline-flex; align-items: center; font-size: 12px; font-weight: 700;
    padding: 3px 9px; border-radius: 6px; line-height: 1.5;
}
.sp-promo-fullcut { background: #fef2f2; color: #dc2626; border: 1px solid #fecaca; }
.sp-promo-points { background: #eff6ff; color: #2563eb; border: 1px solid #bfdbfe; }
.sp-promo-limit  { background: #fff7ed; color: #ea580c; border: 1px solid #fed7aa; }

/* ---------- 商品视频 ---------- */
.sp-video-wrap { border-radius: 12px; overflow: hidden; background: #000; }
.sp-video { width: 100%; max-height: 480px; display: block; background: #000; }

/* ---------- 规格参数 ---------- */
.sp-spec-table { width: 100%; border-collapse: collapse; font-size: 13.5px; }
.sp-spec-table tr { border-bottom: 1px solid #f1f3f5; }
.sp-spec-table tr:last-child { border-bottom: none; }
.sp-spec-table th {
    text-align: left; width: 30%; padding: 11px 12px; color: #6b7280; font-weight: 500;
    background: #f9fafb; vertical-align: top;
}
.sp-spec-table td { padding: 11px 12px; color: #374151; }

/* ---------- 配送信息 ---------- */
.sp-logi-list { display: flex; flex-direction: column; }
.sp-logi-item {
    display: flex; align-items: center; gap: 12px;
    padding: 11px 2px; border-bottom: 1px dashed #eef0f3; font-size: 13.5px;
}
.sp-logi-item:last-child { border-bottom: none; }
.sp-logi-label { color: #9ca3af; min-width: 56px; }
.sp-logi-value { color: #374151; font-weight: 600; }

/* ============================================================
   响应式：平板 / 手机
   ============================================================ */
@media (max-width: 992px) {
    .sp-main-layout { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
    .sp-summary { flex-wrap: wrap; }
    .sp-summary-stats { width: 100%; }
    .sp-summary-stat, .sp-summary-stat-outline { flex: 1; justify-content: center; }

    .sp-product-grid { grid-template-columns: 1fr; }
    .sp-gallery { aspect-ratio: 4 / 3; max-height: 320px; }

    .sp-params { grid-template-columns: 1fr 1fr; }

    .sp-card { padding: 16px; }
    .sp-product-title { font-size: 19px; }
    .sp-price-current { font-size: 24px; }

    .sp-actions { position: sticky; bottom: 0; }
    .sp-btn-primary, .sp-btn-buy { flex: 1; }

    /* 移动端底部固定吸底操作条 */
    .sp-footer-bar {
        position: fixed; left: 0; right: 0; bottom: 0; z-index: 60;
        background: #fff; border: 1px solid #e5e7eb; border-radius: 0;
        padding: 10px 16px calc(10px + env(safe-area-inset-bottom));
        box-shadow: 0 -2px 10px rgba(16,24,40,.06);
    }
    /* 给底部固定条留出空间 */
    .product-main { padding-bottom: 80px; }
}

/* ==== 来源: course-detail.css ==== */
/* ============================================================
   课程详情页样式（course / content_edu 共用 single-content_edu.php）
   v2 — Tab 导航 + 考证推荐 + 亮点/目标列表 + 全面移动端适配
   ============================================================ */

.course-detail {
    max-width: 1280px;
    margin: 0 auto;
    background: #ffffff;
    min-height: 100vh;
    padding-bottom: 28px;
    border: 1px solid #eceef3;
    border-radius: 0 0 16px 16px;
    box-shadow: 0 4px 24px rgba(17, 24, 39, 0.06);
}
@media (min-width: 1600px) {
    .course-detail { max-width: 1440px; }
}

/* ---------- 头部 ---------- */
.course-header {
    position: relative;
    padding: 40px 28px 32px;
    background: linear-gradient(135deg, #4f46e5 0%, #6366f1 50%, #3b82f6 100%);
    color: #fff;
    border-radius: 0 0 24px 24px;
}
.course-header .back {
    display: inline-block;
    margin-bottom: 16px;
    padding: 6px 14px;
    font-size: 13px;
    color: #fff;
    background: rgba(255, 255, 255, 0.18);
    border-radius: 999px;
    text-decoration: none;
    transition: background .2s;
}
.course-header .back:hover { background: rgba(255, 255, 255, 0.32); }
.course-header .title {
    margin: 0 0 14px;
    font-size: 1.9rem;
    line-height: 1.35;
    font-weight: 800;
    color: #fff;
}
.course-header .meta {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    font-size: 13px;
    color: rgba(255, 255, 255, 0.92);
}
.course-header .meta-item { display: inline-flex; align-items: center; gap: 4px; }

/* ---------- 信息条：4 列网格，上移覆盖头部 ---------- */
.course-info-bar {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin: -28px 20px 22px;
    padding: 18px;
    background: #fff;
    border-radius: 16px;
    box-shadow: 0 8px 24px rgba(79, 70, 229, 0.12);
}
.course-info-bar .item {
    text-align: center;
    padding: 12px 8px;
    border-radius: 12px;
    background: #f7f8fc;
}
.course-info-bar .value { font-size: 1.25rem; font-weight: 800; color: #4f46e5; }
.course-info-bar .value small { font-size: 12px; font-weight: 500; color: #6b7280; margin-left: 2px; }
.course-info-bar .label { margin-top: 4px; font-size: 12px; color: #888; }

/* 价格区原价删除线 */
.price-val { display: flex; flex-direction: column; align-items: center; line-height: 1.2; }
.price-now { font-size: 1.4rem; font-weight: 800; color: #e11d48; }
.price-free { font-size: 1.4rem; font-weight: 800; color: #10b981; }
.price-orig { font-size: 13px; font-weight: 400; color: #9ca3af; text-decoration: line-through; margin-top: 2px; }

/* ---------- Tab 导航（sticky） ---------- */
.course-tabs {
    position: sticky;
    top: 0;
    z-index: 100;
    background: #fff;
    border-bottom: 2px solid #f0f1f5;
    margin: 0 20px 0;
    border-radius: 12px 12px 0 0;
}
.tab-nav {
    display: flex;
    gap: 4px;
    padding: 6px 0;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}
.tab-nav::-webkit-scrollbar { display: none; }
.tab-btn {
    flex: 0 0 auto;
    padding: 10px 18px;
    font-size: 14px;
    font-weight: 600;
    color: #6b7280;
    background: transparent;
    border: none;
    border-radius: 10px;
    cursor: pointer;
    white-space: nowrap;
    transition: all .2s;
}
.tab-btn:hover { color: #4f46e5; background: #eef2ff; }
.tab-btn.active {
    color: #fff;
    background: linear-gradient(135deg, #4f46e5, #6366f1);
    box-shadow: 0 4px 12px rgba(79, 70, 229, 0.3);
}

/* ---------- Tab 面板 ---------- */
.tab-panel { display: none; animation: fadeTab .25s ease; }
.tab-panel.active { display: block; }
@keyframes fadeTab { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }

/* ---------- 内容区 ---------- */
.course-content { padding: 16px 20px 0; }
.course-section {
    padding: 20px;
    margin-bottom: 16px;
    background: #fff;
    border: 1px solid #eef0f5;
    border-radius: 16px;
    box-shadow: 0 2px 10px rgba(17, 24, 39, 0.04);
}
.course-section h3 {
    margin: 0 0 14px;
    font-size: 17px;
    font-weight: 700;
    color: #1f2937;
    padding-left: 12px;
    border-left: 4px solid #4f46e5;
}
.course-section .desc { font-size: 15px; line-height: 1.8; color: #374151; word-break: break-word; max-width: 820px; }
.course-section .desc p { margin: 0 0 12px; }
.course-section .desc img { max-width: 100%; height: auto; border-radius: 12px; display: block; margin: 14px auto; }
.course-section .desc h1,
.course-section .desc h2,
.course-section .desc h3,
.course-section .desc h4 { margin: 18px 0 10px; color: #111827; }

/* 富文本兜底 */
.course-section .desc table { width: 100%; border-collapse: collapse; margin: 16px 0; font-size: 14px; background: #fff; border-radius: 12px; overflow: hidden; box-shadow: 0 1px 3px rgba(0,0,0,.05); }
.course-section .desc th, .course-section .desc td { border: 1px solid #e5e7eb; padding: 10px 12px; text-align: left; vertical-align: top; }
.course-section .desc th { background: #f9fafb; font-weight: 700; color: #111827; }
.course-section .desc tr:nth-child(even) td { background: #fafbfc; }
.course-section .desc ul, .course-section .desc ol { margin: 12px 0; padding-left: 24px; }
.course-section .desc li { margin: 6px 0; }
.course-section .desc strong { color: #111827; font-weight: 700; }
.course-section .desc code { display: inline-block; padding: 2px 6px; background: #f3f4f6; border-radius: 6px; font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace; font-size: 13px; color: #dc2626; }
.course-section .desc pre { background: #1f2937; color: #f3f4f6; padding: 16px; border-radius: 12px; overflow-x: auto; font-size: 13px; line-height: 1.6; }
.course-section .desc pre code { background: transparent; color: inherit; padding: 0; }

/* ---------- 密码保护提示 ---------- */
.course-content.course-content-password {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 50vh;
    padding-top: 40px;
    padding-bottom: 60px;
}
.course-password-section {
    width: 100%;
    max-width: 460px;
    margin: 0 auto;
    text-align: center;
    padding: 36px 28px;
}
.course-password-section .password-lock {
    width: 64px;
    height: 64px;
    margin: 0 auto 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 30px;
    line-height: 1;
    background: #eef2ff;
    border-radius: 50%;
}
.course-password-section h3 {
    border-left: 0;
    padding-left: 0;
    margin-bottom: 8px;
}
.course-password-section .password-hint {
    margin: 0 0 22px;
    font-size: 14px;
    color: #6b7280;
}
.course-password-section .post-password-form { text-align: left; }
.course-password-section .post-password-form p {
    margin: 0 0 12px;
    font-size: 14px;
    color: #4b5563;
}
.course-password-section .post-password-form label {
    display: flex;
    flex-direction: column;
    gap: 6px;
    font-size: 14px;
    color: #374151;
}
.course-password-section .post-password-form input[type="password"] {
    width: 100%;
    box-sizing: border-box;
    padding: 12px 14px;
    font-size: 15px;
    color: #111827;
    background: #f9fafb;
    border: 1px solid #d1d5db;
    border-radius: 10px;
    outline: none;
    transition: border-color .2s, box-shadow .2s;
}
.course-password-section .post-password-form input[type="password"]:focus {
    border-color: #4f46e5;
    box-shadow: 0 0 0 3px rgba(79, 70, 229, 0.12);
}
.course-password-section .post-password-form input[type="submit"] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    padding: 12px 20px;
    margin-top: 8px;
    font-size: 15px;
    font-weight: 700;
    color: #fff;
    background: #4f46e5;
    border: 0;
    border-radius: 10px;
    cursor: pointer;
    transition: background .2s;
}
.course-password-section .post-password-form input[type="submit"]:hover { background: #4338ca; }

/* ---------- 亮点/目标列表 ---------- */
.feature-list { display: flex; flex-direction: column; gap: 10px; }
.feature-item {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 12px 16px;
    background: linear-gradient(135deg, #fefce8 0%, #fef9c3 100%);
    border: 1px solid #fde68a;
    border-radius: 12px;
    transition: transform .15s;
}
.feature-item:hover { transform: translateX(4px); }
.feature-icon {
    flex: 0 0 24px;
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    font-weight: 800;
    color: #d97706;
    background: #fff;
    border-radius: 50%;
    box-shadow: 0 2px 6px rgba(217, 119, 6, 0.2);
}
.feature-text { font-size: 14px; line-height: 1.6; color: #422006; font-weight: 500; }

/* 学习目标列表（绿色调） */
.outcome-list .feature-item {
    background: linear-gradient(135deg, #ecfdf5 0%, #d1fae5 100%);
    border-color: #6ee7b7;
}
.outcome-list .feature-icon { color: #059669; box-shadow: 0 2px 6px rgba(5, 150, 105, 0.2); }
.outcome-list .feature-icon.check { font-size: 13px; }
.outcome-list .feature-text { color: #064e3b; }

/* ---------- 先修要求 ---------- */
.prereq-box {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 14px 18px;
    background: #fff7ed;
    border: 1px solid #fed7aa;
    border-radius: 12px;
    font-size: 14px;
    color: #9a3412;
    line-height: 1.6;
}
.prereq-icon { flex: 0 0 auto; font-size: 18px; }

/* ---------- 分类标签 ---------- */
.category-tags { display: flex; flex-wrap: wrap; gap: 8px; }
.category-tag {
    font-size: 12px;
    padding: 5px 14px;
    background: #eef2ff;
    color: #4f46e5;
    border-radius: 999px;
    font-weight: 500;
}

/* ---------- Meta Strip（语言/机构） ---------- */
.course-meta-strip {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    padding: 14px 20px;
    background: #f8fafc;
    border-radius: 12px;
}
.meta-strip-item { font-size: 13px; color: #475569; }

/* ---------- 讲师卡 ---------- */
.teacher-card {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 20px;
    background: linear-gradient(135deg, #f0f4ff 0%, #e0e7ff 100%);
    border-radius: 16px;
}
.teacher-avatar {
    width: 64px;
    height: 64px;
    flex: 0 0 64px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 28px;
    background: #fff;
    border-radius: 50%;
    box-shadow: 0 4px 12px rgba(79, 70, 229, 0.15);
    overflow: hidden;
}
.teacher-avatar img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; }
.teacher-info { flex: 1; min-width: 0; }
.teacher-name { font-size: 17px; font-weight: 700; color: #1f2937; }
.teacher-title { margin-top: 4px; font-size: 13px; color: #6b7280; line-height: 1.5; }
.teacher-stats { margin-top: 8px; display: flex; gap: 12px; }
.teacher-stat-item { font-size: 12px; color: #4f46e5; font-weight: 600; }

/* ---------- 章节列表 ---------- */
.chapter-list, .outline-text-list { display: flex; flex-direction: column; gap: 10px; }
.chapter-item {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px 16px;
    background: #f9fafb;
    border: 1px solid #eef0f5;
    border-radius: 12px;
    transition: transform .15s, box-shadow .15s, border-color .15s;
    cursor: pointer;
}
.chapter-item:hover {
    transform: translateX(4px);
    box-shadow: 0 4px 12px rgba(79, 70, 229, 0.08);
    border-color: #c7d2fe;
}
.chapter-num {
    flex: 0 0 32px;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    font-weight: 700;
    color: #fff;
    background: linear-gradient(135deg, #4f46e5, #6366f1);
    border-radius: 50%;
}
.chapter-title {
    flex: 1;
    font-size: 14px;
    color: #374151;
    font-weight: 500;
}
.chapter-dur {
    font-size: 12px;
    color: #9ca3af;
    flex: 0 0 auto;
    background: #fff;
    padding: 3px 10px;
    border-radius: 999px;
    border: 1px solid #e5e7eb;
}

/* ---------- 考证推荐 ---------- */
/* 本课证书 badge */
.course-cert-own {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 16px 20px;
    margin-bottom: 18px;
    background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%);
    border: 1px solid #93c5fd;
    border-radius: 14px;
}
.cert-own-icon {
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(59, 130, 246, 0.15);
}
.cert-own-label { font-size: 12px; color: #3b82f6; font-weight: 600; }
.cert-own-name { font-size: 16px; font-weight: 700; color: #1e40af; margin-top: 2px; }

/* 考证卡片网格 */
.cert-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 16px;
}
.cert-card {
    display: flex;
    flex-direction: column;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 16px;
    overflow: hidden;
    transition: transform .2s, box-shadow .2s;
}
.cert-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 28px rgba(17, 24, 39, 0.1);
}
.cert-card-top {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px;
    background: linear-gradient(135deg, #f5f3ff 0%, #ede9fe 100%);
    border-bottom: 1px solid #e9d5ff;
}
.cert-card-icon {
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 2px 8px rgba(139, 92, 246, 0.15);
}
.cert-card-name { font-size: 15px; font-weight: 700; color: #5b21b6; line-height: 1.4; }
.cert-card-body { padding: 14px 16px; flex: 1; }
.cert-card-row { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; font-size: 13px; }
.cert-label { color: #6b7280; font-weight: 500; flex: 0 0 auto; }
.cert-val { color: #374151; font-weight: 500; }
.cert-badge {
    font-size: 12px;
    font-weight: 600;
    padding: 3px 10px;
    border-radius: 999px;
    background: #ede9fe;
    color: #5b21b6;
}
.cert-card-desc { font-size: 13px; line-height: 1.6; color: #6b7280; margin: 8px 0 0; }
.cert-card-link {
    display: block;
    text-align: center;
    padding: 10px 16px;
    font-size: 14px;
    font-weight: 600;
    color: #4f46e5;
    background: #f5f3ff;
    border-top: 1px solid #e9d5ff;
    text-decoration: none;
    transition: background .2s;
}
.cert-card-link:hover { background: #ede9fe; }

/* ---------- 底部操作栏 ---------- */
.course-buy {
    position: relative;
    margin: 24px 20px 0;
    width: auto;
    max-width: 1000px;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    padding: 14px 20px;
    background: #fff;
    border: 1px solid #eceef3;
    border-radius: 16px;
    box-shadow: 0 2px 12px rgba(17, 24, 39, 0.06);
}
.course-buy .btn { flex: 0 0 auto; }
.course-price { font-size: 1.25rem; font-weight: 800; color: #4f46e5; }

/* ---------- 按钮 ---------- */
.course-detail .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 12px 24px;
    font-size: 15px;
    font-weight: 700;
    border-radius: 12px;
    border: 1px solid transparent;
    cursor: pointer;
    text-decoration: none;
    line-height: 1.2;
    transition: background .2s, transform .1s;
    white-space: nowrap;
}
.course-detail .btn:active { transform: scale(0.98); }
.course-detail .btn-primary { background: #4f46e5; color: #fff; }
.course-detail .btn-primary:hover { background: #4338ca; }
.course-detail .btn-outline { background: #fff; color: #4f46e5; border-color: #c7d2fe; }
.course-detail .btn-outline:hover { background: #eef2ff; }

/* ---------- 关联招生计划兜底 ---------- */
.course-section .bg-gradient-to-br { background-image: linear-gradient(to bottom right, #eff6ff, #eef2ff); }
.course-section .from-blue-50 { --tw-gradient-from: #eff6ff; }
.course-section .to-indigo-50 { --tw-gradient-to: #eef2ff; }

/* ---------- 相关推荐 ---------- */
.related-content-wrap {
    max-width: 1280px;
    margin: 0 auto;
    padding-left: 24px;
    padding-right: 24px;
}
@media (min-width: 1600px) {
    .related-content-wrap { max-width: 1440px; }
}
.related-content-wrap h3 { text-align: center; }

/* ============================================================
   移动端适配（<= 768px）
   ============================================================ */
@media (max-width: 768px) {
    .course-detail {
        border-radius: 0;
        border-left: 0;
        border-right: 0;
        box-shadow: none;
        padding-bottom: 84px;
    }

    .course-header {
        padding: 28px 16px 28px;
        border-radius: 0 0 20px 20px;
    }
    .course-header .back { margin-bottom: 12px; padding: 5px 12px; font-size: 12px; }
    .course-header .title { margin-bottom: 12px; font-size: 1.35rem; line-height: 1.4; }
    .course-header .meta { gap: 8px 12px; font-size: 12px; }

    .course-info-bar {
        grid-template-columns: repeat(2, 1fr);
        gap: 8px;
        margin: -22px 12px 16px;
        padding: 12px;
        border-radius: 14px;
    }
    .course-info-bar .item {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 8px;
        padding: 10px 14px;
        border-radius: 10px;
        text-align: left;
    }
    .course-info-bar .value { font-size: 15px; line-height: 1.3; white-space: nowrap; }
    .course-info-bar .value small { font-size: 11px; }
    .course-info-bar .label { margin-top: 0; font-size: 11px; color: #9ca3af; white-space: nowrap; }
    .price-now, .price-free { font-size: 1.1rem; }
    .price-orig { font-size: 11px; }

    /* Tab 导航：横滑 */
    .course-tabs {
        margin: 0 12px 0;
        border-radius: 12px 12px 0 0;
    }
    .tab-btn { padding: 8px 14px; font-size: 13px; }

    .course-content { padding: 12px 12px 0; }
    .course-section { padding: 14px; margin-bottom: 12px; border-radius: 14px; }
    .course-content.course-content-password { min-height: 40vh; padding-top: 28px; padding-bottom: 40px; }
    .course-password-section { padding: 28px 20px; }
    .course-password-section .password-lock { width: 56px; height: 56px; font-size: 26px; }
    .course-password-section h3 { font-size: 16px; }
    .course-password-section .password-hint { font-size: 13px; }
    .course-section h3 { margin-bottom: 10px; font-size: 15px; padding-left: 10px; border-left-width: 3px; }
    .course-section .desc { font-size: 14px; line-height: 1.75; }
    .course-section .desc table { font-size: 13px; }
    .course-section .desc th, .course-section .desc td { padding: 8px 10px; }

    /* 亮点/目标 */
    .feature-item { padding: 10px 12px; gap: 8px; }
    .feature-icon { flex: 0 0 22px; width: 22px; height: 22px; font-size: 12px; }
    .feature-text { font-size: 13px; }

    /* 先修要求 */
    .prereq-box { padding: 12px 14px; font-size: 13px; }
    .prereq-icon { font-size: 16px; }

    /* 讲师卡 */
    .teacher-card { gap: 12px; padding: 14px; }
    .teacher-avatar { width: 52px; height: 52px; flex: 0 0 52px; font-size: 24px; }
    .teacher-name { font-size: 15px; }
    .teacher-title { font-size: 12px; }

    /* 章节列表 */
    .chapter-item { padding: 12px 14px; gap: 10px; }
    .chapter-num { flex: 0 0 28px; width: 28px; height: 28px; font-size: 12px; }
    .chapter-title { font-size: 13px; }
    .chapter-dur { font-size: 11px; padding: 2px 8px; }

    /* 考证推荐 */
    .course-cert-own { padding: 12px 14px; gap: 10px; }
    .cert-own-icon { flex: 0 0 40px; width: 40px; height: 40px; font-size: 20px; }
    .cert-own-name { font-size: 14px; }
    .cert-grid { grid-template-columns: 1fr; gap: 12px; }
    .cert-card-top { padding: 12px 14px; gap: 10px; }
    .cert-card-icon { flex: 0 0 36px; width: 36px; height: 36px; font-size: 18px; }
    .cert-card-name { font-size: 14px; }
    .cert-card-body { padding: 12px 14px; }
    .cert-card-row { font-size: 12px; }
    .cert-card-desc { font-size: 12px; }
    .cert-card-link { padding: 8px 14px; font-size: 13px; }

    /* Meta strip */
    .course-meta-strip { padding: 10px 14px; gap: 10px; }
    .meta-strip-item { font-size: 12px; }

    /* 底部操作栏：吸底 */
    .course-buy {
        position: fixed;
        left: 50%;
        transform: translateX(-50%);
        bottom: 0;
        width: 100%;
        max-width: 760px;
        margin: 0;
        padding: 10px 12px;
        gap: 10px;
        border-radius: 14px 14px 0 0;
        border: 0;
        border-top: 1px solid #eceef3;
        border-left: 1px solid #eceef3;
        border-right: 1px solid #eceef3;
        box-shadow: 0 -6px 24px rgba(17, 24, 39, 0.08);
        z-index: 99998;
    }
    .course-detail .btn { padding: 11px 16px; font-size: 14px; border-radius: 10px; flex: 1 1 auto; min-width: 0; }
    .course-detail .btn-outline { flex: 0 0 auto; }
    .course-price { font-size: 1rem; }

    .related-content-wrap { padding-left: 12px; padding-right: 12px; }
}

/* 超小屏（<= 380px）额外收紧 */
@media (max-width: 380px) {
    .course-header .title { font-size: 1.15rem; }
    .course-info-bar { grid-template-columns: 1fr; gap: 6px; margin: -18px 8px 14px; padding: 8px; }
    .course-info-bar .item { padding: 8px 12px; }
    .course-info-bar .value { font-size: 14px; }
    .cert-card-top { padding: 10px 12px; }
}

/* ==== 来源: cart.css ==== */
/* ============================================================
   购物车抽屉 & 购物车页 兜底样式
   背景：购物车抽屉(#cart-drawer / #cart-overlay / #cart-content)定义在 footer.php，
   使用了 bg-gray-900/30、z-[100] 等「任意值 Tailwind 类」。
   若 tailwind-output.css 构建时未扫描 footer.php，这些类会缺失，
   导致遮罩无色、层级不对、甚至抽屉一直盖屏表现为「空白」。
   本文件用显式规则兜底，保证购物车在任何情况下都正常显示。
   选择器均为 #id 或 .cart-item（仅购物车使用），不会与主题其它页面冲突。
   ============================================================ */

/* 抽屉容器：默认隐藏，.visible 时显示 */
#cart-drawer {
    position: fixed;
    inset: 0;
    z-index: 100;
    visibility: hidden;
    opacity: 0;
    transition: visibility .3s, opacity .3s;
}
#cart-drawer.visible { visibility: visible; opacity: 1; }

/* 遮罩层（兜底 Tailwind 缺失的 bg-gray-900/30 + backdrop-blur-sm） */
#cart-overlay {
    position: absolute;
    inset: 0;
    background: rgba(17, 24, 39, 0.3);
    -webkit-backdrop-filter: blur(2px);
    backdrop-filter: blur(2px);
    opacity: 0;
    transition: opacity .3s;
}
#cart-drawer.visible #cart-overlay { opacity: 1; }

/* 右侧抽屉面板（兜底 Tailwind 缺失的 max-w-sm / translate-x-full / shadow-2xl / z-[100]） */
#cart-content {
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    max-width: 384px;
    height: 100%;
    background: #fff;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.18);
    transform: translateX(100%);
    transition: transform .3s;
    display: flex;
    flex-direction: column;
}
#cart-drawer.visible #cart-content { transform: translateX(0); }

/* AI 聊天窗兜底（footer.php 同样用了 z-[95] 任意值类） */
#ai-chat-window {
    z-index: 95;
}

/* 购物车页(route-cart.php)商品卡片兜底：防止 Tailwind 类缺失时整块空白 */
.cart-item {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: #f9fafb;
    border-radius: 12px;
}

/* ==== 来源: jobs.css ==== */
/* ============================================================
   招聘求职中心 —— 一体化招聘门户设计系统
   文件：assets/css/jobs.css
   作用域：全部使用 lsj- 前缀，不依赖 Tailwind，FTP 上传即生效。
   风格：专业稳重商务蓝 · 薪资红 · 热门琥珀 · 高密度信息 · 移动端类 APP。
   ============================================================ */

:root {
    --lsj-primary: #1f4fb0;
    --lsj-primary-dark: #173b85;
    --lsj-primary-soft: rgba(31, 79, 176, .08);
    --lsj-primary-line: rgba(31, 79, 176, .18);
    --lsj-hot: #e23b3b;          /* 薪资 / 紧急：中国招聘惯例用红 */
    --lsj-hot-soft: rgba(226, 59, 59, .08);
    --lsj-hot-line: rgba(226, 59, 59, .28);
    --lsj-amber: #e8920a;        /* 热门标签 */
    --lsj-amber-soft: rgba(232, 146, 10, .10);
    --lsj-bg: #f4f6fa;
    --lsj-card: #ffffff;
    --lsj-text: #1a2230;
    --lsj-sub: #5a6577;
    --lsj-mute: #94a0b3;
    --lsj-border: #e9edf3;
    --lsj-border-strong: #dde3ec;
    --lsj-tag-bg: #f1f4f9;
    --lsj-tag-text: #5a6577;
    --lsj-radius: 16px;
    --lsj-radius-sm: 12px;
    --lsj-shadow: 0 1px 2px rgba(16, 24, 40, .04), 0 8px 22px rgba(16, 24, 40, .05);
    --lsj-shadow-hover: 0 6px 18px rgba(23, 59, 133, .12), 0 16px 40px rgba(16, 24, 40, .08);
}

/* ---------- 容器 ---------- */
.lsj-app {
    background: var(--lsj-bg);
    min-height: 60vh;
    padding: 28px 0 64px;
}
.lsj-wrap {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}
@media (max-width: 640px) {
    .lsj-app { padding: 16px 0 96px; }
    .lsj-wrap { padding: 0 14px; }
}

/* ---------- 顶部 Hero ---------- */
.lsj-head {
    position: relative;
    background:
        radial-gradient(120% 140% at 100% 0%, rgba(31, 79, 176, .10), transparent 55%),
        linear-gradient(135deg, #ffffff, #f7f9fd);
    border: 1px solid var(--lsj-border);
    border-radius: var(--lsj-radius);
    padding: 26px 28px 28px;
    box-shadow: var(--lsj-shadow);
    overflow: hidden;
}
.lsj-head-top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
    flex-wrap: wrap;
}
.lsj-head-left { flex: 1 1 420px; min-width: 0; }
.lsj-bread {
    font-size: 12px;
    letter-spacing: 1.5px;
    color: var(--lsj-primary);
    font-weight: 600;
    text-transform: uppercase;
    margin-bottom: 8px;
}
.lsj-head h1 {
    font-size: 28px;
    font-weight: 800;
    color: var(--lsj-text);
    margin: 0 0 8px;
    letter-spacing: .5px;
}
.lsj-sub {
    font-size: 14px;
    line-height: 1.7;
    color: var(--lsj-sub);
    margin: 0 0 18px;
    max-width: 640px;
}
.lsj-stat-row { display: flex; gap: 30px; flex-wrap: wrap; }
.lsj-stat b {
    display: block;
    font-size: 22px;
    font-weight: 800;
    color: var(--lsj-primary);
    line-height: 1.15;
    font-variant-numeric: tabular-nums;
}
.lsj-stat span { font-size: 12.5px; color: var(--lsj-mute); margin-top: 2px; display: block; }
.lsj-stat--hot b { color: var(--lsj-hot); }

.lsj-head-cta { display: flex; flex-direction: column; gap: 10px; flex-shrink: 0; }
.lsj-btn {
    display: inline-flex; align-items: center; gap: 7px;
    padding: 11px 20px; border-radius: 999px;
    font-size: 14px; font-weight: 700; text-decoration: none;
    transition: transform .15s, box-shadow .15s, background .15s, color .15s;
    white-space: nowrap;
}
.lsj-btn svg { width: 17px; height: 17px; }
.lsj-btn-solid { background: var(--lsj-primary); color: #fff; box-shadow: 0 6px 16px rgba(31, 79, 176, .25); }
.lsj-btn-solid:hover { background: var(--lsj-primary-dark); transform: translateY(-1px); }
.lsj-btn-ghost { background: #fff; color: var(--lsj-primary); border: 1px solid var(--lsj-primary-line); }
.lsj-btn-ghost:hover { background: var(--lsj-primary-soft); transform: translateY(-1px); }

/* ---------- 搜索栏 ---------- */
.lsj-search {
    display: flex;
    align-items: center;
    gap: 8px;
    background: #fff;
    border: 1px solid var(--lsj-border-strong);
    border-radius: 999px;
    padding: 7px 7px 7px 18px;
    margin-top: 20px;
    box-shadow: var(--lsj-shadow);
    transition: border-color .18s, box-shadow .18s;
}
.lsj-search:focus-within {
    border-color: var(--lsj-primary);
    box-shadow: 0 0 0 3px var(--lsj-primary-soft);
}
.lsj-search-ico { color: var(--lsj-primary); opacity: .8; flex-shrink: 0; display: inline-flex; }
.lsj-search input[type="text"] {
    flex: 1; min-width: 0; border: 0; outline: 0; background: transparent;
    font-size: 14.5px; color: var(--lsj-text); padding: 9px 0;
}
.lsj-search input::placeholder { color: var(--lsj-mute); }
.lsj-search button {
    flex-shrink: 0; border: 0; cursor: pointer;
    background: var(--lsj-primary); color: #fff;
    font-size: 14px; font-weight: 700; letter-spacing: 2px;
    padding: 10px 26px; border-radius: 999px;
    transition: background .18s;
}
.lsj-search button:hover { background: var(--lsj-primary-dark); }

/* ---------- 类型 Tab ---------- */
.lsj-tabs {
    display: flex; gap: 4px; margin: 20px 0 14px;
    border-bottom: 1px solid var(--lsj-border);
    overflow-x: auto; scrollbar-width: none;
}
.lsj-tabs::-webkit-scrollbar { display: none; }
.lsj-tab {
    position: relative; flex-shrink: 0; padding: 12px 16px 14px;
    font-size: 15px; font-weight: 700; color: var(--lsj-sub);
    text-decoration: none; white-space: nowrap; transition: color .15s;
}
.lsj-tab:hover { color: var(--lsj-text); }
.lsj-tab::after {
    content: ''; position: absolute; left: 16px; right: 16px; bottom: -1px;
    height: 3px; border-radius: 3px 3px 0 0; background: transparent; transition: background .15s;
}
.lsj-tab.is-active { color: var(--lsj-primary); }
.lsj-tab.is-active::after { background: var(--lsj-primary); }

/* ---------- 职位分类导航栏 ---------- */
.lsj-catnav {
    background: var(--lsj-card); border: 1px solid var(--lsj-border);
    border-radius: var(--lsj-radius); padding: 16px 18px 18px; margin-bottom: 18px;
    box-shadow: var(--lsj-shadow);
}
.lsj-catnav-head {
    display: flex; align-items: center; gap: 8px;
    font-size: 14px; font-weight: 700; color: var(--lsj-text); margin-bottom: 13px;
}
.lsj-catnav-head svg { color: var(--lsj-primary); }
.lsj-catnav-grid {
    display: grid; gap: 9px;
    grid-template-columns: repeat(auto-fill, minmax(104px, 1fr));
}
.lsj-cat {
    display: flex; align-items: center; justify-content: space-between; gap: 6px;
    padding: 10px 12px; border-radius: 10px; text-decoration: none;
    background: var(--lsj-tag-bg); border: 1px solid transparent;
    transition: all .15s;
}
.lsj-cat:hover { background: #fff; border-color: var(--lsj-primary-line); transform: translateY(-1px); }
.lsj-cat-name { font-size: 13.5px; color: var(--lsj-text); font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lsj-cat-count { font-size: 11.5px; color: var(--lsj-mute); background: #fff; border-radius: 999px; padding: 1px 7px; flex-shrink: 0; }
.lsj-cat.is-active { background: var(--lsj-primary); border-color: var(--lsj-primary); }
.lsj-cat.is-active .lsj-cat-name { color: #fff; }
.lsj-cat.is-active .lsj-cat-count { color: var(--lsj-primary); background: rgba(255, 255, 255, .9); }

/* ---------- 内容区块（热门 / 最新 / 企业 / 资讯） ---------- */
.lsj-block { margin-bottom: 24px; }
.lsj-block-head {
    display: flex; align-items: center; justify-content: space-between;
    margin-bottom: 14px; gap: 12px;
}
.lsj-block-title {
    display: flex; align-items: center; gap: 9px;
    font-size: 18px; font-weight: 800; color: var(--lsj-text); margin: 0;
}
.lsj-block-title svg { color: var(--lsj-primary); }
.lsj-block-more {
    font-size: 13px; color: var(--lsj-sub); text-decoration: none; font-weight: 600; white-space: nowrap;
    transition: color .15s;
}
.lsj-block-more:hover { color: var(--lsj-primary); }

/* 职位网格 */
.lsj-job-grid { display: grid; grid-template-columns: 1fr; gap: 14px; }
@media (min-width: 880px) { .lsj-job-grid { grid-template-columns: 1fr 1fr; gap: 16px; } }

/* 企业展示网格 */
.lsj-co-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
@media (min-width: 720px) { .lsj-co-grid { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1040px) { .lsj-co-grid { grid-template-columns: repeat(4, 1fr); } }
.lsj-co-card {
    display: flex; gap: 12px; align-items: center; text-decoration: none; color: inherit;
    background: var(--lsj-card); border: 1px solid var(--lsj-border);
    border-radius: var(--lsj-radius-sm); padding: 14px; transition: border-color .16s, box-shadow .16s, transform .16s;
}
.lsj-co-card:hover { border-color: var(--lsj-primary-line); box-shadow: var(--lsj-shadow-hover); transform: translateY(-2px); }
.lsj-co-logo {
    width: 46px; height: 46px; border-radius: 12px; background: var(--lsj-tag-bg);
    color: var(--lsj-primary); display: flex; align-items: center; justify-content: center;
    font-size: 18px; font-weight: 800; flex-shrink: 0; overflow: hidden;
}
.lsj-co-logo img { width: 100%; height: 100%; object-fit: cover; }
.lsj-co-info { min-width: 0; }
.lsj-co-name { font-size: 14.5px; font-weight: 700; color: var(--lsj-text); display: flex; align-items: center; gap: 6px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lsj-co-meta { font-size: 12.5px; color: var(--lsj-sub); margin-top: 3px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lsj-co-tags { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 7px; }

/* 行业资讯 */
.lsj-news { list-style: none; margin: 0; padding: 0; background: var(--lsj-card); border: 1px solid var(--lsj-border); border-radius: var(--lsj-radius); overflow: hidden; }
.lsj-news-item + .lsj-news-item { border-top: 1px solid var(--lsj-border); }
.lsj-news-link { display: block; padding: 13px 16px; text-decoration: none; transition: background .15s; }
.lsj-news-link:hover { background: var(--lsj-bg); }
.lsj-news-title { display: block; font-size: 14.5px; font-weight: 600; color: var(--lsj-text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; transition: color .15s; }
.lsj-news-link:hover .lsj-news-title { color: var(--lsj-primary); }
.lsj-news-meta { display: flex; gap: 10px; align-items: baseline; margin-top: 4px; }
.lsj-news-date { font-size: 12px; color: var(--lsj-mute); flex-shrink: 0; font-variant-numeric: tabular-nums; }
.lsj-news-desc { font-size: 12.5px; color: var(--lsj-sub); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ---------- 子筛选 chips ---------- */
.lsj-filters { display: flex; gap: 7px; margin-bottom: 16px; overflow-x: auto; scrollbar-width: none; }
.lsj-filters::-webkit-scrollbar { display: none; }
.lsj-chip {
    flex-shrink: 0; padding: 7px 14px; font-size: 13px; color: var(--lsj-sub);
    background: #fff; border: 1px solid var(--lsj-border); border-radius: 999px;
    text-decoration: none; white-space: nowrap; transition: all .15s;
}
.lsj-chip:hover { color: var(--lsj-text); border-color: var(--lsj-border-strong); }
.lsj-chip.is-active { color: #fff; background: var(--lsj-primary); border-color: var(--lsj-primary); }

/* ---------- 主体布局 ---------- */
.lsj-body { display: flex; gap: 24px; align-items: flex-start; }
.lsj-main { flex: 1 1 auto; min-width: 0; }
.lsj-side { width: 304px; flex: 0 0 304px; }

.lsj-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.lsj-count { font-size: 13.5px; color: var(--lsj-sub); }
.lsj-count b { color: var(--lsj-text); font-weight: 800; }

/* ---------- 卡片列表 ---------- */
.lsj-list { display: grid; grid-template-columns: 1fr; gap: 12px; }
@media (min-width: 1180px) { .lsj-list { grid-template-columns: 1fr 1fr; gap: 14px; } }

.lsj-card {
    position: relative; overflow: hidden;
    display: block; background: var(--lsj-card);
    border: 1px solid var(--lsj-border); border-radius: var(--lsj-radius-sm);
    padding: 16px 18px; text-decoration: none; color: inherit;
    transition: border-color .16s, box-shadow .16s, transform .16s;
}
.lsj-card:hover { border-color: var(--lsj-primary-line); box-shadow: var(--lsj-shadow-hover); transform: translateY(-2px); }

/* 职位卡片 */
.lsj-job { display: flex; gap: 14px; }
.lsj-logo {
    width: 46px; height: 46px; border-radius: 12px; background: var(--lsj-tag-bg);
    color: var(--lsj-primary); display: flex; align-items: center; justify-content: center;
    font-size: 18px; font-weight: 800; flex-shrink: 0; overflow: hidden;
}
.lsj-logo img { width: 100%; height: 100%; object-fit: cover; }
.lsj-job-main { flex: 1; min-width: 0; }
.lsj-job-top { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.lsj-job-title { font-size: 15.5px; font-weight: 700; color: var(--lsj-text); margin: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lsj-job:hover .lsj-job-title { color: var(--lsj-primary); }
.lsj-job-pay { text-align: right; flex-shrink: 0; }
.lsj-job-salary { display: block; font-size: 16px; font-weight: 800; color: var(--lsj-hot); line-height: 1.2; font-variant-numeric: tabular-nums; }
.lsj-job-date { display: block; font-size: 11.5px; color: var(--lsj-mute); margin-top: 3px; }
.lsj-job-meta { font-size: 12.5px; color: var(--lsj-sub); margin-top: 6px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lsj-job-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }

/* 热门 / 急招 标识 */
.lsj-job.is-hot { border-color: var(--lsj-hot-line); background: linear-gradient(180deg, var(--lsj-hot-soft), #fff 60%); }
.lsj-ribbon {
    position: absolute; top: 0; right: 0;
    background: var(--lsj-hot); color: #fff; font-size: 11px; font-weight: 700;
    padding: 3px 10px; border-bottom-left-radius: 10px; letter-spacing: .5px;
}

/* 任务卡片 */
.lsj-task .lsj-job-salary { color: var(--lsj-amber); }

/* 标签 */
.lsj-tag {
    font-size: 11.5px; color: var(--lsj-tag-text); background: var(--lsj-tag-bg);
    border-radius: 6px; padding: 3px 8px; white-space: nowrap;
}
.lsj-tag--primary { color: var(--lsj-primary); background: var(--lsj-primary-soft); }
.lsj-tag--green { color: #0f9d58; background: rgba(15, 157, 88, .10); }
.lsj-tag--blue { color: #2563eb; background: rgba(37, 99, 235, .10); }
.lsj-tag--purple { color: #7c3aed; background: rgba(124, 58, 237, .10); }
.lsj-tag--orange { color: #e8730c; background: rgba(232, 115, 12, .10); }

/* 企业卡片 */
.lsj-company { display: flex; gap: 13px; align-items: flex-start; }
.lsj-company .lsj-logo { width: 48px; height: 48px; border-radius: 13px; }
.lsj-company-name { font-size: 15.5px; font-weight: 700; color: var(--lsj-text); margin: 0; display: flex; align-items: center; gap: 6px; }
.lsj-company:hover .lsj-company-name { color: var(--lsj-primary); }
.lsj-company-meta { font-size: 12.5px; color: var(--lsj-sub); margin-top: 4px; }
.lsj-verified { display: inline-block; font-size: 11px; color: #fff; background: var(--lsj-primary); border-radius: 6px; padding: 1px 7px; font-weight: 600; }
.lsj-company-site { font-size: 12px; color: var(--lsj-primary); text-decoration: none; white-space: nowrap; flex-shrink: 0; align-self: center; }

/* 简历卡片 */
.lsj-resume { display: flex; gap: 13px; align-items: flex-start; }
.lsj-avatar {
    width: 46px; height: 46px; border-radius: 50%; background: var(--lsj-primary-soft);
    color: var(--lsj-primary); display: flex; align-items: center; justify-content: center;
    font-size: 18px; font-weight: 800; flex-shrink: 0;
}
.lsj-resume-name { font-size: 15.5px; font-weight: 700; color: var(--lsj-text); margin: 0; }
.lsj-resume:hover .lsj-resume-name { color: var(--lsj-primary); }
.lsj-resume-pay { font-size: 14.5px; font-weight: 800; color: #7c3aed; text-align: right; flex-shrink: 0; }

/* ---------- 侧边栏 ---------- */
.lsj-panel {
    background: var(--lsj-card); border: 1px solid var(--lsj-border);
    border-radius: var(--lsj-radius-sm); padding: 16px 18px; margin-bottom: 16px;
}
.lsj-panel-title {
    font-size: 14.5px; font-weight: 800; color: var(--lsj-text); margin: 0 0 12px;
    display: flex; align-items: center; gap: 8px;
}
.lsj-panel-title::before { content: ''; width: 3px; height: 15px; border-radius: 2px; background: var(--lsj-primary); }
.lsj-side-sticky { position: sticky; top: 90px; }

/* 快捷入口 */
.lsj-quick { display: flex; flex-direction: column; gap: 2px; }
.lsj-quick-item {
    display: flex; align-items: center; justify-content: space-between;
    padding: 10px 10px; border-radius: 9px; text-decoration: none;
    color: var(--lsj-sub); font-size: 13.5px; transition: background .15s, color .15s;
}
.lsj-quick-item:hover { background: var(--lsj-bg); color: var(--lsj-text); }
.lsj-quick-item b { color: var(--lsj-mute); font-weight: 700; font-size: 13px; font-variant-numeric: tabular-nums; }

/* 入驻企业 */
.lsj-co-item { display: flex; align-items: center; gap: 10px; padding: 8px; border-radius: 9px; text-decoration: none; transition: background .15s; }
.lsj-co-item:hover { background: var(--lsj-bg); }
.lsj-co-logo {
    width: 36px; height: 36px; border-radius: 10px; background: var(--lsj-tag-bg);
    color: var(--lsj-primary); display: flex; align-items: center; justify-content: center;
    font-size: 15px; font-weight: 800; flex-shrink: 0; overflow: hidden;
}
.lsj-co-logo img { width: 100%; height: 100%; object-fit: cover; }
.lsj-co-name { flex: 1; min-width: 0; font-size: 13.5px; font-weight: 700; color: var(--lsj-text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lsj-co-ind { font-size: 12px; color: var(--lsj-mute); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* 求职 / 招聘 CTA */
.lsj-cta {
    background: linear-gradient(135deg, var(--lsj-primary), var(--lsj-primary-dark));
    border-radius: var(--lsj-radius-sm); padding: 18px 18px; color: #fff; margin-bottom: 16px;
    box-shadow: 0 8px 22px rgba(31, 79, 176, .18);
}
.lsj-cta h4 { margin: 0 0 6px; font-size: 15px; font-weight: 800; }
.lsj-cta p { margin: 0 0 13px; font-size: 12.5px; opacity: .9; line-height: 1.6; }
.lsj-cta a {
    display: inline-block; background: #fff; color: var(--lsj-primary);
    font-size: 13.5px; font-weight: 800; padding: 9px 18px; border-radius: 999px; text-decoration: none;
    transition: transform .15s;
}
.lsj-cta a:hover { transform: translateY(-1px); }
.lsj-cta--alt {
    background: linear-gradient(135deg, #fff, #f7f9fd);
    border: 1px solid var(--lsj-border); color: var(--lsj-text); box-shadow: var(--lsj-shadow);
}
.lsj-cta--alt h4 { color: var(--lsj-text); }
.lsj-cta--alt p { color: var(--lsj-sub); opacity: 1; }
.lsj-cta--alt a { background: var(--lsj-primary); color: #fff; }

/* ---------- 分页 ---------- */
.lsj-pager { display: flex; justify-content: center; gap: 6px; margin-top: 24px; flex-wrap: wrap; }
.lsj-page {
    min-width: 36px; height: 36px; padding: 0 11px;
    display: inline-flex; align-items: center; justify-content: center;
    border: 1px solid var(--lsj-border); border-radius: 10px;
    font-size: 13.5px; color: var(--lsj-sub); text-decoration: none; transition: all .15s;
}
.lsj-page:hover { border-color: var(--lsj-primary-line); color: var(--lsj-primary); }
.lsj-page.is-active { background: var(--lsj-primary); border-color: var(--lsj-primary); color: #fff; }

/* ---------- 空状态 ---------- */
.lsj-empty {
    text-align: center; padding: 52px 20px; color: var(--lsj-mute);
    background: var(--lsj-card); border: 1px dashed var(--lsj-border-strong); border-radius: var(--lsj-radius-sm);
}
.lsj-empty b { display: block; font-size: 15.5px; color: var(--lsj-sub); font-weight: 700; margin-bottom: 4px; }

/* ---------- 移动端：APP 化单列 + 底部导航 ---------- */
@media (max-width: 1023px) {
    .lsj-body { flex-direction: column; gap: 18px; }
    .lsj-side { width: 100%; flex: 1 1 auto; }
    .lsj-side-sticky { position: static; }
    .lsj-main { order: 1; }
    .lsj-side { order: 2; }
}
@media (max-width: 768px) {
    /* 修复：手机端 head 容器高度塌陷 + overflow 裁剪，导致 h1/副标题/统计卡看不见。
       强制容器自适应内容高度并取消裁剪，保证"台州人才招聘网"等标题完整显示。 */
    .lsj-head { height: auto !important; min-height: auto !important; overflow: visible !important; }
    .lsj-head { padding: 20px 16px 22px; }
    .lsj-head-top { flex-direction: column; }
    /* 阻止 head-left flex:1 拉伸把按钮挤到容器底部，消除统计与按钮之间的大段空白 */
    .lsj-head-left { flex: 0 0 auto; }
    .lsj-head h1 { font-size: 23px; }
    .lsj-head-cta { flex-direction: row; width: 100%; }
    .lsj-head-cta .lsj-btn { flex: 1; justify-content: center; }
    .lsj-stat-row { gap: 22px; }
    .lsj-stat b { font-size: 19px; }
    .lsj-search { padding-left: 15px; }
    .lsj-search button { padding: 10px 18px; letter-spacing: 1px; }
    .lsj-card { padding: 14px; }
    .lsj-logo, .lsj-resume .lsj-avatar { width: 42px; height: 42px; }
    .lsj-job-title, .lsj-company-name, .lsj-resume-name { font-size: 14.5px; }
    .lsj-job-tags { margin-top: 8px; }
    /* 移动端招聘卡片排版优化：标题独占一行可完整显示（不截断），薪资+日期移至下一行右对齐 */
    .lsj-job-top { flex-wrap: wrap; row-gap: 4px; }
    .lsj-job-title { white-space: normal; line-height: 1.4; }
    .lsj-job-pay { width: 100%; text-align: right; }
    .lsj-co-grid { grid-template-columns: 1fr 1fr; }
}

/* 移动端底部导航（类 APP） */
.lsj-mnav { display: none; }
@media (max-width: 768px) {
    .lsj-mnav {
        display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 80;
        background: rgba(255, 255, 255, .96); backdrop-filter: blur(10px);
        border-top: 1px solid var(--lsj-border); box-shadow: 0 -4px 18px rgba(16, 24, 40, .08);
        padding-bottom: env(safe-area-inset-bottom, 0px);
    }
    .lsj-mnav a {
        flex: 1; display: flex; flex-direction: column; align-items: center; gap: 2px;
        padding: 9px 0 8px; text-decoration: none; color: var(--lsj-mute); font-size: 11px;
        transition: color .15s;
    }
    .lsj-mnav a svg { width: 21px; height: 21px; }
    .lsj-mnav a.is-active { color: var(--lsj-primary); font-weight: 700; }
}

/* ==== 来源: kaogong.css ==== */
/* ==========================================================================
   考公刷题平台 —— 作用域样式表
   作用域：.ls-kg-（全局入队，靠前缀隔离，不影响其它页面）
   设计基调：藏青主色 / 纸面白底 / 克制的分隔线 / 不用渐变与玻璃拟态
   ========================================================================== */

.ls-kg-root {
    --kg-primary: #1f3a5f;
    --kg-primary-h: #16293f;
    --kg-primary-l: #2f5486;
    --kg-accent: #c0392b;
    --kg-ok: #1e8e4e;
    --kg-warn: #b8860b;
    --kg-err: #c0392b;

    --kg-text: #1c2530;
    --kg-text-2: #56616f;
    --kg-text-3: #8b95a1;
    --kg-line: #e3e7ec;
    --kg-line-2: #eef1f4;
    --kg-bg: #f5f6f8;
    --kg-card: #ffffff;
    --kg-soft: #f0f3f7;

    --kg-r: 8px;
    --kg-r-s: 5px;
    --kg-shadow: 0 1px 2px rgba(28, 37, 48, .06);
    --kg-shadow-h: 0 4px 14px rgba(28, 37, 48, .09);

    background: var(--kg-bg);
    color: var(--kg-text);
    font-size: 15px;
    line-height: 1.7;
    -webkit-font-smoothing: antialiased;
    font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", sans-serif;
    min-height: 60vh;
    padding-bottom: 40px;
}

.ls-kg-root *,
.ls-kg-root *::before,
.ls-kg-root *::after { box-sizing: border-box; }

.ls-kg-wrap { max-width: 1180px; margin: 0 auto; padding: 0 16px; }
.ls-kg-wrap-narrow { max-width: 860px; margin: 0 auto; padding: 0 16px; }

/* ---------- 平台导航 ---------- */
.ls-kg-nav {
    background: var(--kg-primary);
    color: #fff;
    position: sticky;
    top: 0;
    z-index: 60;
}
.ls-kg-nav-in {
    max-width: 1180px; margin: 0 auto; padding: 0 16px;
    display: flex; align-items: center; gap: 6px; height: 52px;
}
.ls-kg-logo {
    font-size: 17px; font-weight: 700; color: #fff; text-decoration: none;
    margin-right: 18px; letter-spacing: .5px; white-space: nowrap;
}
.ls-kg-logo:hover { color: #fff; opacity: .9; }
.ls-kg-nav-links { display: flex; gap: 2px; flex: 1; overflow-x: auto; scrollbar-width: none; }
.ls-kg-nav-links::-webkit-scrollbar { display: none; }
.ls-kg-nav-links a {
    color: rgba(255, 255, 255, .78); text-decoration: none; font-size: 14px;
    padding: 7px 13px; border-radius: var(--kg-r-s); white-space: nowrap; transition: all .15s;
}
.ls-kg-nav-links a:hover { color: #fff; background: rgba(255, 255, 255, .1); }
.ls-kg-nav-links a.is-active { color: #fff; background: rgba(255, 255, 255, .16); font-weight: 600; }
.ls-kg-nav-user { display: flex; align-items: center; gap: 10px; white-space: nowrap; }
.ls-kg-nav-user img { width: 28px; height: 28px; border-radius: 50%; }
.ls-kg-nav-user a { color: rgba(255, 255, 255, .85); text-decoration: none; font-size: 13px; }
.ls-kg-nav-user a:hover { color: #fff; }

/* ---------- 通用卡片 / 标题 ---------- */
.ls-kg-card {
    background: var(--kg-card); border: 1px solid var(--kg-line);
    border-radius: var(--kg-r); box-shadow: var(--kg-shadow);
}
.ls-kg-card-pad { padding: 18px 20px; }

.ls-kg-sec { margin-top: 26px; }
.ls-kg-sec-hd {
    display: flex; align-items: baseline; justify-content: space-between;
    margin-bottom: 12px; gap: 12px;
}
.ls-kg-sec-hd h2 {
    font-size: 17px; font-weight: 700; margin: 0; color: var(--kg-text);
    padding-left: 10px; border-left: 3px solid var(--kg-primary); line-height: 1.3;
}
.ls-kg-sec-hd .ls-kg-more { font-size: 13px; color: var(--kg-text-3); text-decoration: none; }
.ls-kg-sec-hd .ls-kg-more:hover { color: var(--kg-primary); }

/* ---------- 按钮 ---------- */
.ls-kg-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 6px;
    padding: 9px 18px; border-radius: var(--kg-r-s); border: 1px solid var(--kg-line);
    background: var(--kg-card); color: var(--kg-text); font-size: 14px; font-weight: 500;
    cursor: pointer; text-decoration: none; transition: all .15s; line-height: 1.4;
}
.ls-kg-btn:hover { border-color: var(--kg-primary); color: var(--kg-primary); }
.ls-kg-btn-primary { background: var(--kg-primary); border-color: var(--kg-primary); color: #fff; }
.ls-kg-btn-primary:hover { background: var(--kg-primary-h); border-color: var(--kg-primary-h); color: #fff; }
.ls-kg-btn-ghost { background: transparent; border-color: rgba(255, 255, 255, .4); color: #fff; }
.ls-kg-btn-ghost:hover { background: rgba(255, 255, 255, .12); color: #fff; border-color: #fff; }
.ls-kg-btn-lg { padding: 12px 26px; font-size: 15px; }
.ls-kg-btn-sm { padding: 5px 12px; font-size: 13px; }
.ls-kg-btn:disabled, .ls-kg-btn.is-disabled { opacity: .5; cursor: not-allowed; }
.ls-kg-btn-block { width: 100%; }

/* ---------- 首页头部 ---------- */
.ls-kg-hero { background: var(--kg-primary); color: #fff; padding: 30px 0 34px; }
.ls-kg-hero h1 { font-size: 25px; font-weight: 700; margin: 0 0 8px; color: #fff; letter-spacing: .5px; }
.ls-kg-hero p { margin: 0; color: rgba(255, 255, 255, .74); font-size: 14px; }
.ls-kg-hero-grid { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; flex-wrap: wrap; }
.ls-kg-hero-actions { display: flex; gap: 10px; flex-wrap: wrap; }

.ls-kg-hero-stats { display: flex; gap: 30px; margin-top: 20px; flex-wrap: wrap; }
.ls-kg-hero-stat b { display: block; font-size: 24px; font-weight: 700; line-height: 1.2; color: #fff; }
.ls-kg-hero-stat span { font-size: 12px; color: rgba(255, 255, 255, .62); }

/* ---------- 统计条 ---------- */
.ls-kg-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.ls-kg-stat {
    background: var(--kg-card); border: 1px solid var(--kg-line); border-radius: var(--kg-r);
    padding: 15px 16px;
}
.ls-kg-stat b { display: block; font-size: 22px; font-weight: 700; line-height: 1.25; color: var(--kg-text); }
.ls-kg-stat b em { font-style: normal; font-size: 13px; font-weight: 500; color: var(--kg-text-3); margin-left: 2px; }
.ls-kg-stat span { font-size: 12px; color: var(--kg-text-3); }
.ls-kg-stat.is-hl b { color: var(--kg-primary); }

/* ---------- 筛选器 ---------- */
.ls-kg-filter { background: var(--kg-card); border: 1px solid var(--kg-line); border-radius: var(--kg-r); padding: 4px 16px; }
.ls-kg-filter-row {
    display: flex; gap: 10px; padding: 11px 0; border-bottom: 1px solid var(--kg-line-2);
    align-items: flex-start;
}
.ls-kg-filter-row:last-child { border-bottom: 0; }
.ls-kg-filter-label {
    flex: 0 0 62px; font-size: 13px; color: var(--kg-text-3); padding-top: 4px; line-height: 1.6;
}
.ls-kg-filter-opts { display: flex; flex-wrap: wrap; gap: 4px; flex: 1; }
.ls-kg-filter-opts a {
    font-size: 13px; color: var(--kg-text-2); text-decoration: none;
    padding: 3px 11px; border-radius: 20px; transition: all .13s; line-height: 1.7;
}
.ls-kg-filter-opts a:hover { color: var(--kg-primary); background: var(--kg-soft); }
.ls-kg-filter-opts a.is-on { background: var(--kg-primary); color: #fff; font-weight: 500; }
.ls-kg-filter-opts a.is-sub { padding-left: 8px; opacity: .88; }
.ls-kg-filter-opts a.is-sub::before { content: ''; }

.ls-kg-filter-bar {
    display: flex; align-items: center; justify-content: space-between;
    gap: 12px; margin: 14px 0 12px; flex-wrap: wrap;
}
.ls-kg-filter-count { font-size: 13px; color: var(--kg-text-3); }
.ls-kg-filter-count b { color: var(--kg-primary); font-size: 15px; }
.ls-kg-sortbar { display: flex; gap: 3px; }
.ls-kg-sortbar a {
    font-size: 13px; color: var(--kg-text-2); text-decoration: none;
    padding: 5px 12px; border-radius: var(--kg-r-s);
}
.ls-kg-sortbar a.is-on { background: var(--kg-card); color: var(--kg-primary); font-weight: 600; border: 1px solid var(--kg-line); }

/* ---------- 题目列表项 ---------- */
.ls-kg-qlist { display: grid; gap: 10px; }
.ls-kg-qitem {
    background: var(--kg-card); border: 1px solid var(--kg-line); border-radius: var(--kg-r);
    padding: 15px 18px; transition: all .15s; position: relative;
}
.ls-kg-qitem:hover { border-color: #cfd6de; box-shadow: var(--kg-shadow-h); }
.ls-kg-qitem-hd { display: flex; gap: 8px; align-items: center; margin-bottom: 7px; flex-wrap: wrap; }
.ls-kg-qitem-title {
    font-size: 15px; font-weight: 500; color: var(--kg-text); text-decoration: none;
    display: block; line-height: 1.65; margin-bottom: 8px;
}
.ls-kg-qitem-title:hover { color: var(--kg-primary); }
.ls-kg-qitem-meta {
    display: flex; gap: 14px; font-size: 12px; color: var(--kg-text-3); flex-wrap: wrap; align-items: center;
}

/* 标签 */
.ls-kg-tag {
    display: inline-block; font-size: 11px; padding: 1px 7px; border-radius: 3px;
    background: var(--kg-soft); color: var(--kg-text-2); line-height: 1.8; white-space: nowrap;
}
.ls-kg-tag-cat { background: #e8eef6; color: var(--kg-primary); }
.ls-kg-tag-easy { background: #e6f4ec; color: var(--kg-ok); }
.ls-kg-tag-medium { background: #fdf3e0; color: var(--kg-warn); }
.ls-kg-tag-hard { background: #fbeae8; color: var(--kg-err); }
.ls-kg-tag-year { background: #f0f0f2; color: #5a6472; }
.ls-kg-tag-done { background: #eef1f4; color: var(--kg-text-3); }

/* ---------- 做题区 ---------- */
.ls-kg-stage { display: grid; grid-template-columns: 1fr 250px; gap: 16px; align-items: start; }
.ls-kg-stage-main { min-width: 0; }
.ls-kg-stage-side { position: sticky; top: 68px; }

.ls-kg-q {
    background: var(--kg-card); border: 1px solid var(--kg-line);
    border-radius: var(--kg-r); padding: 22px 24px;
}
.ls-kg-q-hd {
    display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
    padding-bottom: 12px; margin-bottom: 16px; border-bottom: 1px solid var(--kg-line-2);
}
.ls-kg-q-no { font-size: 13px; color: var(--kg-text-3); font-weight: 600; margin-right: 2px; }
.ls-kg-q-body { font-size: 16px; line-height: 1.85; color: var(--kg-text); margin-bottom: 18px; }
.ls-kg-q-body p { margin: 0 0 10px; }
.ls-kg-q-body p:last-child { margin-bottom: 0; }
.ls-kg-q-body img { max-width: 100%; height: auto; }

.ls-kg-opts { display: grid; gap: 9px; }
.ls-kg-opt {
    display: flex; gap: 11px; align-items: flex-start;
    padding: 12px 15px; border: 1px solid var(--kg-line); border-radius: var(--kg-r-s);
    cursor: pointer; transition: all .13s; background: var(--kg-card); user-select: none;
}
.ls-kg-opt:hover { border-color: var(--kg-primary-l); background: #fafbfc; }
.ls-kg-opt-key {
    flex: 0 0 24px; height: 24px; border-radius: 50%; border: 1px solid var(--kg-line);
    display: flex; align-items: center; justify-content: center;
    font-size: 12px; font-weight: 600; color: var(--kg-text-2); background: var(--kg-card);
    transition: all .13s;
}
.ls-kg-opt-text { flex: 1; font-size: 15px; line-height: 1.65; padding-top: 1px; }
.ls-kg-opt.is-picked { border-color: var(--kg-primary); background: #f2f6fb; }
.ls-kg-opt.is-picked .ls-kg-opt-key { background: var(--kg-primary); border-color: var(--kg-primary); color: #fff; }
.ls-kg-opt.is-right { border-color: var(--kg-ok); background: #f1f9f4; }
.ls-kg-opt.is-right .ls-kg-opt-key { background: var(--kg-ok); border-color: var(--kg-ok); color: #fff; }
.ls-kg-opt.is-wrong { border-color: var(--kg-err); background: #fdf3f2; }
.ls-kg-opt.is-wrong .ls-kg-opt-key { background: var(--kg-err); border-color: var(--kg-err); color: #fff; }
.ls-kg-opt.is-locked { cursor: default; }
.ls-kg-opt.is-locked:hover { border-color: var(--kg-line); background: var(--kg-card); }
.ls-kg-opt.is-locked.is-right:hover { border-color: var(--kg-ok); background: #f1f9f4; }
.ls-kg-opt.is-locked.is-wrong:hover { border-color: var(--kg-err); background: #fdf3f2; }

.ls-kg-fill { width: 100%; padding: 11px 14px; border: 1px solid var(--kg-line); border-radius: var(--kg-r-s); font-size: 15px; font-family: inherit; }
.ls-kg-fill:focus { outline: none; border-color: var(--kg-primary); }

.ls-kg-q-ft {
    display: flex; align-items: center; justify-content: space-between;
    gap: 12px; margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--kg-line-2); flex-wrap: wrap;
}
.ls-kg-q-tools { display: flex; gap: 8px; }
.ls-kg-icon-btn {
    background: none; border: 0; color: var(--kg-text-3); cursor: pointer;
    font-size: 13px; padding: 5px 8px; border-radius: var(--kg-r-s);
}
.ls-kg-icon-btn:hover { color: var(--kg-primary); background: var(--kg-soft); }
.ls-kg-icon-btn.is-on { color: var(--kg-accent); }

/* 判分结果 */
.ls-kg-result { margin-top: 16px; border-radius: var(--kg-r-s); overflow: hidden; border: 1px solid var(--kg-line); }
.ls-kg-result-hd {
    padding: 11px 16px; font-size: 14px; font-weight: 600;
    display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
}
.ls-kg-result.is-right .ls-kg-result-hd { background: #eaf6ef; color: var(--kg-ok); }
.ls-kg-result.is-wrong .ls-kg-result-hd { background: #fbeeec; color: var(--kg-err); }
.ls-kg-result-hd small { font-weight: 400; color: var(--kg-text-2); font-size: 12px; margin-left: auto; }
.ls-kg-result-bd { padding: 15px 16px; background: var(--kg-card); font-size: 14px; line-height: 1.85; color: var(--kg-text-2); }
.ls-kg-result-bd h4 { font-size: 13px; color: var(--kg-text); margin: 0 0 8px; font-weight: 600; }
.ls-kg-result-bd p { margin: 0 0 10px; }
.ls-kg-result-bd p:last-child { margin-bottom: 0; }

/* 侧栏答题卡 */
.ls-kg-panel { background: var(--kg-card); border: 1px solid var(--kg-line); border-radius: var(--kg-r); padding: 15px 16px; }
.ls-kg-panel + .ls-kg-panel { margin-top: 12px; }
.ls-kg-panel h3 { font-size: 14px; font-weight: 600; margin: 0 0 12px; color: var(--kg-text); }
.ls-kg-panel-list { display: grid; gap: 9px; font-size: 13px; }
.ls-kg-panel-row { display: flex; justify-content: space-between; color: var(--kg-text-2); }
.ls-kg-panel-row b { color: var(--kg-text); font-weight: 600; }

.ls-kg-sheet { display: grid; grid-template-columns: repeat(auto-fill, minmax(34px, 1fr)); gap: 6px; }
.ls-kg-sheet a, .ls-kg-sheet button {
    aspect-ratio: 1; display: flex; align-items: center; justify-content: center;
    border: 1px solid var(--kg-line); border-radius: var(--kg-r-s); background: var(--kg-card);
    font-size: 12px; color: var(--kg-text-2); text-decoration: none; cursor: pointer;
    transition: all .12s; padding: 0; font-family: inherit;
}
.ls-kg-sheet a:hover, .ls-kg-sheet button:hover { border-color: var(--kg-primary); color: var(--kg-primary); }
.ls-kg-sheet .is-done { background: #eef1f4; color: var(--kg-text-3); }
.ls-kg-sheet .is-answered { background: var(--kg-primary); border-color: var(--kg-primary); color: #fff; }
.ls-kg-sheet .is-right { background: #e6f4ec; border-color: #b7e0c7; color: var(--kg-ok); }
.ls-kg-sheet .is-wrong { background: #fbeae8; border-color: #f0c4be; color: var(--kg-err); }
.ls-kg-sheet .is-cur { outline: 2px solid var(--kg-primary); outline-offset: 1px; font-weight: 700; }
.ls-kg-sheet .is-marked::after {
    content: ''; position: absolute; width: 6px; height: 6px; background: var(--kg-warn);
    border-radius: 50%; margin: -14px 0 0 22px;
}
.ls-kg-sheet-legend { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 12px; font-size: 11px; color: var(--kg-text-3); }
.ls-kg-sheet-legend i { display: inline-block; width: 9px; height: 9px; border-radius: 2px; margin-right: 4px; vertical-align: -1px; }

/* ---------- 考场 ---------- */
.ls-kg-exam-bar {
    position: sticky; top: 0; z-index: 70; background: var(--kg-primary); color: #fff;
    padding: 10px 0;
}
.ls-kg-exam-bar-in {
    max-width: 1180px; margin: 0 auto; padding: 0 16px;
    display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap;
}
.ls-kg-exam-title { font-size: 15px; font-weight: 600; color: #fff; }
.ls-kg-exam-title small { display: block; font-size: 12px; color: rgba(255, 255, 255, .6); font-weight: 400; }
.ls-kg-clock {
    font-size: 22px; font-weight: 700; font-variant-numeric: tabular-nums;
    letter-spacing: 1px; padding: 2px 14px; border-radius: var(--kg-r-s);
    background: rgba(255, 255, 255, .12);
}
.ls-kg-clock.is-urgent { background: var(--kg-accent); animation: kgPulse 1.4s ease-in-out infinite; }
@keyframes kgPulse { 0%, 100% { opacity: 1; } 50% { opacity: .62; } }
.ls-kg-clock-hint { font-size: 11px; color: rgba(255, 255, 255, .55); text-align: center; margin-top: 2px; }

/* ---------- 成绩报告 ---------- */
.ls-kg-score-card {
    background: var(--kg-primary); color: #fff; border-radius: var(--kg-r);
    padding: 26px 28px; display: flex; align-items: center; gap: 34px; flex-wrap: wrap;
}
.ls-kg-score-num { line-height: 1; }
.ls-kg-score-num b { font-size: 52px; font-weight: 700; letter-spacing: -1px; }
.ls-kg-score-num i { font-style: normal; font-size: 18px; color: rgba(255, 255, 255, .62); }
.ls-kg-score-num span { display: block; font-size: 12px; color: rgba(255, 255, 255, .62); margin-top: 8px; }
.ls-kg-score-meta { display: flex; gap: 32px; flex-wrap: wrap; }
.ls-kg-score-meta div b { display: block; font-size: 19px; font-weight: 700; }
.ls-kg-score-meta div span { font-size: 12px; color: rgba(255, 255, 255, .62); }
.ls-kg-badge-pass {
    display: inline-block; padding: 3px 12px; border-radius: 20px; font-size: 12px; font-weight: 600;
    background: rgba(255, 255, 255, .16);
}

/* 模块得分条 */
.ls-kg-bars { display: grid; gap: 13px; }
.ls-kg-bar-row { display: grid; grid-template-columns: 96px 1fr 62px; gap: 12px; align-items: center; font-size: 13px; }
.ls-kg-bar-name { color: var(--kg-text-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ls-kg-bar-track { height: 8px; background: var(--kg-soft); border-radius: 4px; overflow: hidden; }
.ls-kg-bar-fill { height: 100%; background: var(--kg-primary); border-radius: 4px; transition: width .5s ease; }
.ls-kg-bar-fill.is-low { background: var(--kg-err); }
.ls-kg-bar-fill.is-mid { background: var(--kg-warn); }
.ls-kg-bar-fill.is-high { background: var(--kg-ok); }
.ls-kg-bar-val { text-align: right; color: var(--kg-text); font-weight: 600; font-variant-numeric: tabular-nums; }

/* 趋势柱 */
.ls-kg-trend { display: flex; align-items: flex-end; gap: 5px; height: 96px; }
.ls-kg-trend-col { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 5px; min-width: 0; }
.ls-kg-trend-bar {
    width: 100%; background: var(--kg-primary); border-radius: 2px 2px 0 0; min-height: 2px;
    transition: height .4s ease;
}
.ls-kg-trend-bar.is-zero { background: var(--kg-line); }
.ls-kg-trend-lbl { font-size: 10px; color: var(--kg-text-3); white-space: nowrap; }

/* ---------- 今日任务 ---------- */
.ls-kg-plan { display: grid; gap: 10px; }
.ls-kg-plan-item {
    display: flex; align-items: center; gap: 14px; padding: 14px 16px;
    background: var(--kg-card); border: 1px solid var(--kg-line); border-radius: var(--kg-r);
    text-decoration: none; color: inherit; transition: all .15s;
}
.ls-kg-plan-item:hover { border-color: var(--kg-primary-l); box-shadow: var(--kg-shadow-h); }
.ls-kg-plan-item.is-done { opacity: .62; }
.ls-kg-plan-ico {
    flex: 0 0 38px; height: 38px; border-radius: var(--kg-r-s); background: var(--kg-soft);
    display: flex; align-items: center; justify-content: center; font-size: 17px;
}
.ls-kg-plan-main { flex: 1; min-width: 0; }
.ls-kg-plan-main b { display: block; font-size: 14px; font-weight: 600; margin-bottom: 3px; }
.ls-kg-plan-main span { font-size: 12px; color: var(--kg-text-3); }
.ls-kg-plan-prog { flex: 0 0 90px; text-align: right; }
.ls-kg-plan-prog b { font-size: 15px; font-weight: 700; color: var(--kg-primary); font-variant-numeric: tabular-nums; }
.ls-kg-plan-prog span { font-size: 12px; color: var(--kg-text-3); }
.ls-kg-plan-track { height: 4px; background: var(--kg-soft); border-radius: 2px; margin-top: 5px; overflow: hidden; }
.ls-kg-plan-track i { display: block; height: 100%; background: var(--kg-primary); border-radius: 2px; }

/* ---------- 模块入口网格 ---------- */
.ls-kg-mods { display: grid; grid-template-columns: repeat(auto-fill, minmax(215px, 1fr)); gap: 12px; }
.ls-kg-mod {
    background: var(--kg-card); border: 1px solid var(--kg-line); border-radius: var(--kg-r);
    padding: 17px 18px; text-decoration: none; color: inherit; transition: all .15s; display: block;
}
.ls-kg-mod:hover { border-color: var(--kg-primary); box-shadow: var(--kg-shadow-h); transform: translateY(-1px); }
.ls-kg-mod b { display: block; font-size: 15px; font-weight: 600; margin-bottom: 5px; color: var(--kg-text); }
.ls-kg-mod p { margin: 0 0 10px; font-size: 12px; color: var(--kg-text-3); line-height: 1.6; }
.ls-kg-mod-stat { font-size: 12px; color: var(--kg-primary); font-weight: 600; }
.ls-kg-mod-sub { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 8px; }
.ls-kg-mod-sub span { font-size: 11px; color: var(--kg-text-3); background: var(--kg-soft); padding: 1px 7px; border-radius: 3px; }

/* ---------- 试卷列表 ---------- */
.ls-kg-papers { display: grid; grid-template-columns: repeat(auto-fill, minmax(272px, 1fr)); gap: 12px; }
.ls-kg-paper {
    background: var(--kg-card); border: 1px solid var(--kg-line); border-radius: var(--kg-r);
    padding: 17px 18px; display: flex; flex-direction: column; gap: 10px;
}
.ls-kg-paper:hover { border-color: #cfd6de; box-shadow: var(--kg-shadow-h); }
.ls-kg-paper h3 { font-size: 15px; font-weight: 600; margin: 0; line-height: 1.55; }
.ls-kg-paper h3 a { color: var(--kg-text); text-decoration: none; }
.ls-kg-paper h3 a:hover { color: var(--kg-primary); }
.ls-kg-paper-meta { font-size: 12px; color: var(--kg-text-3); display: flex; gap: 14px; flex-wrap: wrap; }
.ls-kg-paper-ft { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: auto; }
.ls-kg-paper-best { font-size: 12px; color: var(--kg-text-3); }
.ls-kg-paper-best b { color: var(--kg-primary); font-size: 14px; }

/* ---------- 错题本 ---------- */
.ls-kg-wrong-item {
    background: var(--kg-card); border: 1px solid var(--kg-line); border-radius: var(--kg-r);
    padding: 16px 18px;
}
.ls-kg-wrong-item + .ls-kg-wrong-item { margin-top: 10px; }
.ls-kg-wrong-hd { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-bottom: 8px; }
.ls-kg-wrong-times { font-size: 11px; padding: 1px 7px; border-radius: 3px; background: #fbeae8; color: var(--kg-err); }
.ls-kg-wrong-q { font-size: 15px; line-height: 1.7; margin-bottom: 10px; color: var(--kg-text); }
.ls-kg-wrong-ans { display: flex; gap: 20px; font-size: 13px; margin-bottom: 10px; flex-wrap: wrap; }
.ls-kg-wrong-ans span { color: var(--kg-text-3); }
.ls-kg-wrong-ans b { font-weight: 600; }
.ls-kg-wrong-ans .mine { color: var(--kg-err); }
.ls-kg-wrong-ans .right { color: var(--kg-ok); }
.ls-kg-wrong-exp {
    font-size: 13px; line-height: 1.8; color: var(--kg-text-2);
    background: var(--kg-soft); padding: 12px 14px; border-radius: var(--kg-r-s); margin-bottom: 10px;
}
.ls-kg-wrong-ft { display: flex; gap: 8px; align-items: center; justify-content: space-between; flex-wrap: wrap; }
.ls-kg-wrong-next { font-size: 12px; color: var(--kg-text-3); }

/* ---------- 社区 ---------- */
.ls-kg-topic {
    display: flex; gap: 14px; padding: 15px 18px; background: var(--kg-card);
    border: 1px solid var(--kg-line); border-radius: var(--kg-r); transition: all .15s;
}
.ls-kg-topic + .ls-kg-topic { margin-top: 9px; }
.ls-kg-topic:hover { border-color: #cfd6de; }
.ls-kg-topic-avatar { flex: 0 0 40px; }
.ls-kg-topic-avatar img { width: 40px; height: 40px; border-radius: 50%; display: block; }
.ls-kg-topic-main { flex: 1; min-width: 0; }
.ls-kg-topic-main h3 { font-size: 15px; font-weight: 600; margin: 0 0 5px; line-height: 1.55; }
.ls-kg-topic-main h3 a { color: var(--kg-text); text-decoration: none; }
.ls-kg-topic-main h3 a:hover { color: var(--kg-primary); }
.ls-kg-topic-excerpt { font-size: 13px; color: var(--kg-text-2); line-height: 1.7; margin: 0 0 7px; }
.ls-kg-topic-meta { font-size: 12px; color: var(--kg-text-3); display: flex; gap: 14px; flex-wrap: wrap; }

.ls-kg-reply { display: flex; gap: 12px; padding: 14px 0; border-bottom: 1px solid var(--kg-line-2); }
.ls-kg-reply:last-child { border-bottom: 0; }
.ls-kg-reply img { width: 34px; height: 34px; border-radius: 50%; flex: 0 0 34px; }
.ls-kg-reply-main { flex: 1; min-width: 0; }
.ls-kg-reply-hd { display: flex; gap: 10px; align-items: baseline; margin-bottom: 4px; }
.ls-kg-reply-hd b { font-size: 13px; font-weight: 600; }
.ls-kg-reply-hd span { font-size: 12px; color: var(--kg-text-3); }
.ls-kg-reply-bd { font-size: 14px; line-height: 1.8; color: var(--kg-text-2); }
.ls-kg-reply-bd p { margin: 0 0 8px; }
.ls-kg-reply-bd p:last-child { margin-bottom: 0; }
.ls-kg-reply-ft { margin-top: 6px; display: flex; gap: 14px; }

.ls-kg-editor textarea {
    width: 100%; min-height: 92px; padding: 12px 14px; border: 1px solid var(--kg-line);
    border-radius: var(--kg-r-s); font-size: 14px; font-family: inherit; line-height: 1.7; resize: vertical;
}
.ls-kg-editor textarea:focus { outline: none; border-color: var(--kg-primary); }
.ls-kg-editor input[type=text] {
    width: 100%; padding: 10px 14px; border: 1px solid var(--kg-line);
    border-radius: var(--kg-r-s); font-size: 15px; font-family: inherit; margin-bottom: 10px;
}
.ls-kg-editor input[type=text]:focus { outline: none; border-color: var(--kg-primary); }
.ls-kg-editor-ft { display: flex; justify-content: space-between; align-items: center; margin-top: 10px; gap: 12px; }
.ls-kg-editor-ft small { color: var(--kg-text-3); font-size: 12px; }

/* ---------- 空状态 / 提示 ---------- */
.ls-kg-empty { text-align: center; padding: 46px 20px; color: var(--kg-text-3); }
.ls-kg-empty b { display: block; font-size: 15px; color: var(--kg-text-2); margin-bottom: 6px; font-weight: 600; }
.ls-kg-empty p { margin: 0 0 16px; font-size: 13px; }

.ls-kg-note {
    background: #fdf8ec; border: 1px solid #f0e2c0; border-radius: var(--kg-r-s);
    padding: 12px 15px; font-size: 13px; color: #7a5c15; line-height: 1.7;
}
.ls-kg-note-info { background: #eef4fb; border-color: #cfdff2; color: #2b4f7a; }

/* ---------- 分页 ---------- */
.ls-kg-pager { display: flex; justify-content: center; gap: 5px; margin-top: 24px; flex-wrap: wrap; }
.ls-kg-pager a, .ls-kg-pager span {
    min-width: 34px; height: 34px; padding: 0 11px; display: flex; align-items: center; justify-content: center;
    border: 1px solid var(--kg-line); border-radius: var(--kg-r-s); background: var(--kg-card);
    color: var(--kg-text-2); text-decoration: none; font-size: 13px;
}
.ls-kg-pager a:hover { border-color: var(--kg-primary); color: var(--kg-primary); }
.ls-kg-pager .current { background: var(--kg-primary); border-color: var(--kg-primary); color: #fff; font-weight: 600; }

/* ---------- 轻提示 ---------- */
.ls-kg-toast {
    position: fixed; left: 50%; bottom: 76px; transform: translateX(-50%) translateY(12px);
    background: rgba(28, 37, 48, .93); color: #fff; padding: 10px 20px; border-radius: 20px;
    font-size: 14px; z-index: 9999; opacity: 0; pointer-events: none; transition: all .22s;
}
.ls-kg-toast.is-show { opacity: 1; transform: translateX(-50%) translateY(0); }

/* ---------- 移动端底部导航 ---------- */
.ls-kg-tabbar { display: none; }

/* ==========================================================================
   新增：考场 / 报告 / 仪表盘 / 错题本 / 社区
   ========================================================================== */

/* 考场标题副信息 */
.ls-kg-exam-title span { display: block; font-size: 12px; color: rgba(255, 255, 255, .6); font-weight: 400; margin-top: 2px; }

/* ---------- 成绩报告 ---------- */
.ls-kg-score-card.is-fail { background: #6b2230; }
.ls-kg-score-main { display: flex; flex-direction: column; gap: 6px; }
.ls-kg-score-side { display: flex; gap: 18px; flex-wrap: wrap; align-items: flex-start; margin-left: auto; }
.ls-kg-score-cell { display: flex; flex-direction: column; align-items: center; min-width: 54px; }
.ls-kg-score-cell b { font-size: 20px; font-weight: 700; line-height: 1.2; }
.ls-kg-score-cell span { font-size: 11px; color: rgba(255, 255, 255, .6); margin-top: 2px; }
.ls-kg-score-cell-wide { align-items: flex-start; }
.ls-kg-score-cell-wide b { font-size: 22px; }
.ls-kg-score-meta > span:not(.ls-kg-badge-pass) { font-size: 13px; color: rgba(255, 255, 255, .62); }
.ls-kg-badge-pass.is-pass { background: rgba(30, 142, 78, .25); color: #cdeedd; }
.ls-kg-badge-pass.is-fail { background: rgba(192, 57, 43, .28); color: #f6cfc9; }
.ls-kg-report-actions { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 14px; }

/* 趋势柱当前点 + 数值 */
.ls-kg-trend-bar.is-cur { background: var(--kg-accent); }
.ls-kg-trend-val { font-size: 11px; color: var(--kg-text-2); font-weight: 600; }

/* 选项标记徽标（回顾 / 错题本共用） */
.ls-kg-opt-flag { font-style: normal; font-size: 10px; margin-left: auto; color: var(--kg-ok); opacity: .85; }
.ls-kg-opt-flag.is-wrong { color: var(--kg-err); }

/* 逐题回顾 */
.ls-kg-review { display: grid; gap: 12px; }
.ls-kg-review-item { background: var(--kg-card); border: 1px solid var(--kg-line); border-radius: var(--kg-r); padding: 16px 18px; border-left: 4px solid var(--kg-line); }
.ls-kg-review-item.is-right { border-left-color: var(--kg-ok); }
.ls-kg-review-item.is-wrong { border-left-color: var(--kg-err); }
.ls-kg-review-item.is-blank { border-left-color: var(--kg-warn); }
.ls-kg-review-hd { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 10px; }
.ls-kg-review-hd .ls-kg-more { margin-left: auto; }
.ls-kg-mark { font-size: 11px; padding: 2px 9px; border-radius: 20px; font-weight: 600; }
.ls-kg-mark.is-right { background: #e6f4ec; color: var(--kg-ok); }
.ls-kg-mark.is-wrong { background: #fbeae8; color: var(--kg-err); }
.ls-kg-mark.is-blank { background: #fdf3e0; color: var(--kg-warn); }
.ls-kg-review-body { font-size: 15px; line-height: 1.75; margin-bottom: 12px; color: var(--kg-text); }
.ls-kg-review-opts { display: grid; gap: 8px; margin-bottom: 12px; }
.ls-kg-review-opt { display: flex; gap: 11px; align-items: flex-start; padding: 10px 14px; border: 1px solid var(--kg-line); border-radius: var(--kg-r-s); background: var(--kg-card); }
.ls-kg-review-opt .ls-kg-opt-key { flex: 0 0 24px; height: 24px; border-radius: 50%; border: 1px solid var(--kg-line); display: flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 600; color: var(--kg-text-2); }
.ls-kg-review-opt.is-right { border-color: var(--kg-ok); background: #f1f9f4; }
.ls-kg-review-opt.is-right .ls-kg-opt-key { background: var(--kg-ok); border-color: var(--kg-ok); color: #fff; }
.ls-kg-review-opt.is-wrong { border-color: var(--kg-err); background: #fdf3f2; }
.ls-kg-review-opt.is-wrong .ls-kg-opt-key { background: var(--kg-err); border-color: var(--kg-err); color: #fff; }
.ls-kg-review-fill { display: flex; gap: 24px; flex-wrap: wrap; margin-bottom: 12px; font-size: 14px; }
.ls-kg-review-fill span { color: var(--kg-text-3); }
.ls-kg-review-fill b { font-weight: 600; }
.ls-kg-review-fill b.is-right { color: var(--kg-ok); }
.ls-kg-review-fill b.is-wrong { color: var(--kg-err); }
.ls-kg-review-exp { font-size: 13px; line-height: 1.8; color: var(--kg-text-2); background: var(--kg-soft); padding: 12px 14px; border-radius: var(--kg-r-s); }

/* ---------- 仪表盘 ---------- */
.ls-kg-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; align-items: start; }
.ls-kg-radar-wrap { display: flex; gap: 18px; align-items: center; flex-wrap: wrap; }
.ls-kg-radar { width: 260px; height: 260px; flex: 0 0 260px; }
.ls-kg-radar-grid line, .ls-kg-radar-grid circle { fill: none; stroke: #e3e7ec; stroke-width: 1; }
.ls-kg-radar-poly { fill: rgba(31, 58, 95, .14); stroke: var(--kg-primary); stroke-width: 2; }
.ls-kg-radar text { font-size: 11px; fill: var(--kg-text-2); }
.ls-kg-radar-legend { display: flex; flex-direction: column; gap: 6px; font-size: 13px; color: var(--kg-text-2); }
.ls-kg-dot { display: inline-block; width: 9px; height: 9px; border-radius: 50%; margin-right: 6px; vertical-align: 0; }
.ls-kg-dot.is-high { background: var(--kg-ok); }
.ls-kg-dot.is-mid { background: var(--kg-warn); }
.ls-kg-dot.is-low { background: var(--kg-err); }
.ls-kg-plan-fill { display: block; height: 100%; background: var(--kg-primary); border-radius: 2px; }
.ls-kg-bar-link { text-decoration: none; color: inherit; }
.ls-kg-bar-link:hover .ls-kg-bar-name { color: var(--kg-primary); }

/* ---------- 错题本 ---------- */
.ls-kg-wrong-list { display: grid; gap: 10px; }
.ls-kg-wrong-opts { display: grid; gap: 8px; margin-bottom: 10px; }
.ls-kg-wrong-opt { display: flex; gap: 11px; align-items: flex-start; padding: 10px 14px; border: 1px solid var(--kg-line); border-radius: var(--kg-r-s); background: var(--kg-card); }
.ls-kg-wrong-opt .ls-kg-opt-key { flex: 0 0 24px; height: 24px; border-radius: 50%; border: 1px solid var(--kg-line); display: flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 600; color: var(--kg-text-2); }
.ls-kg-wrong-opt.is-right { border-color: var(--kg-ok); background: #f1f9f4; }
.ls-kg-wrong-opt.is-right .ls-kg-opt-key { background: var(--kg-ok); border-color: var(--kg-ok); color: #fff; }
.ls-kg-wrong-opt.is-wrong { border-color: var(--kg-err); background: #fdf3f2; }
.ls-kg-wrong-opt.is-wrong .ls-kg-opt-key { background: var(--kg-err); border-color: var(--kg-err); color: #fff; }
.ls-kg-wrong-next.is-due { color: var(--kg-accent); font-weight: 600; }
.ls-kg-wrong-next.is-mastered { color: var(--kg-ok); }
.ls-kg-btn-ok { background: var(--kg-ok); border-color: var(--kg-ok); color: #fff; }
.ls-kg-btn-ok:hover { background: #19793f; border-color: #19793f; color: #fff; }
.ls-kg-btn-danger { background: #fff; border-color: #f0c4be; color: var(--kg-err); }
.ls-kg-btn-danger:hover { background: #fdf3f2; border-color: var(--kg-err); color: var(--kg-err); }

/* ---------- 社区 ---------- */
.ls-kg-community-grid { display: grid; grid-template-columns: 1fr 280px; gap: 16px; align-items: start; }
.ls-kg-community-main { min-width: 0; }
.ls-kg-community-side { position: sticky; top: 68px; }
.ls-kg-topics { display: grid; gap: 9px; }
.ls-kg-topic-avatar { width: 40px; height: 40px; border-radius: 50%; display: block; object-fit: cover; }
.ls-kg-topic-detail-hd { margin-bottom: 12px; }
.ls-kg-topic-detail-hd h1 { font-size: 20px; margin: 8px 0 10px; line-height: 1.4; }
.ls-kg-topic-content { font-size: 15px; line-height: 1.9; color: var(--kg-text); }
.ls-kg-topic-content p { margin: 0 0 12px; }
.ls-kg-topic-content img { max-width: 100%; height: auto; }
.ls-kg-replies { display: grid; gap: 0; }
.ls-kg-reply-body { font-size: 14px; line-height: 1.8; color: var(--kg-text-2); }
.ls-kg-reply-body p { margin: 0 0 8px; }
.ls-kg-reply-body p:last-child { margin-bottom: 0; }
.ls-kg-vote { background: none; border: 1px solid var(--kg-line); border-radius: 20px; padding: 3px 12px; font-size: 12px; color: var(--kg-text-2); cursor: pointer; transition: all .15s; }
.ls-kg-vote:hover { border-color: var(--kg-primary); color: var(--kg-primary); }
.ls-kg-vote.is-on { border-color: var(--kg-primary); color: var(--kg-primary); background: var(--kg-soft); }
.ls-kg-select { width: 100%; padding: 10px 14px; border: 1px solid var(--kg-line); border-radius: var(--kg-r-s); font-size: 15px; font-family: inherit; margin-bottom: 10px; background: var(--kg-card); }
.ls-kg-select:focus { outline: none; border-color: var(--kg-primary); }
.ls-kg-search { display: flex; gap: 6px; }
.ls-kg-search input[type=text] { padding: 7px 12px; border: 1px solid var(--kg-line); border-radius: var(--kg-r-s); font-size: 13px; font-family: inherit; width: 160px; }
.ls-kg-search input[type=text]:focus { outline: none; border-color: var(--kg-primary); }
.ls-kg-panel-row img { border-radius: 50%; }
a.ls-kg-panel-row { text-decoration: none; color: inherit; }
a.ls-kg-panel-row:hover { color: var(--kg-primary); }

@media (max-width: 1024px) {
    .ls-kg-grid-2 { grid-template-columns: 1fr; }
    .ls-kg-community-grid { grid-template-columns: 1fr; }
    .ls-kg-community-side { position: static; }
}
@media (max-width: 768px) {
    .ls-kg-radar { width: 220px; height: 220px; flex-basis: 220px; }
    .ls-kg-score-side { width: 100%; margin-left: 0; }
    .ls-kg-community-side { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
    .ls-kg-community-side .ls-kg-panel { margin: 0; }
    .ls-kg-community-side .ls-kg-panel + .ls-kg-panel { margin-top: 0; }
}

/* ==========================================================================
   响应式
   ========================================================================== */

@media (max-width: 1024px) {
    .ls-kg-stage { grid-template-columns: 1fr; }
    .ls-kg-stage-side { position: static; }
}

@media (max-width: 768px) {
    .ls-kg-root { font-size: 14.5px; padding-bottom: 68px; }
    .ls-kg-wrap, .ls-kg-wrap-narrow { padding: 0 12px; }

    .ls-kg-nav-in { height: 48px; }
    .ls-kg-logo { font-size: 16px; margin-right: 10px; }
    .ls-kg-nav-links { display: none; }
    .ls-kg-nav-user { margin-left: auto; }

    .ls-kg-hero { padding: 22px 0 24px; }
    .ls-kg-hero h1 { font-size: 20px; }
    .ls-kg-hero-grid { flex-direction: column; align-items: stretch; gap: 16px; }
    .ls-kg-hero-actions .ls-kg-btn { flex: 1; }
    .ls-kg-hero-stats { gap: 0; justify-content: space-between; }
    .ls-kg-hero-stat b { font-size: 20px; }

    .ls-kg-stats { grid-template-columns: repeat(2, 1fr); gap: 9px; }
    .ls-kg-stat { padding: 12px 13px; }
    .ls-kg-stat b { font-size: 19px; }

    .ls-kg-sec { margin-top: 20px; }
    .ls-kg-sec-hd h2 { font-size: 16px; }

    .ls-kg-filter { padding: 2px 13px; }
    .ls-kg-filter-row { flex-direction: column; gap: 6px; padding: 10px 0; }
    .ls-kg-filter-label { flex: none; padding-top: 0; font-size: 12px; }
    .ls-kg-filter-opts { gap: 3px; }
    .ls-kg-filter-opts a { font-size: 12.5px; padding: 3px 10px; }

    .ls-kg-q { padding: 16px 15px; border-radius: var(--kg-r); }
    .ls-kg-q-body { font-size: 15.5px; line-height: 1.8; }
    .ls-kg-opt { padding: 11px 12px; gap: 9px; }
    .ls-kg-opt-text { font-size: 14.5px; }
    .ls-kg-q-ft { flex-direction: column-reverse; align-items: stretch; gap: 10px; }
    .ls-kg-q-ft .ls-kg-btn { width: 100%; padding: 12px; }
    .ls-kg-q-tools { justify-content: space-around; }

    .ls-kg-score-card { padding: 20px; gap: 20px; }
    .ls-kg-score-num b { font-size: 42px; }
    .ls-kg-score-meta { gap: 22px; }
    .ls-kg-score-meta div b { font-size: 17px; }

    .ls-kg-bar-row { grid-template-columns: 76px 1fr 48px; gap: 9px; font-size: 12.5px; }
    .ls-kg-mods { grid-template-columns: repeat(2, 1fr); gap: 9px; }
    .ls-kg-mod { padding: 14px; }
    .ls-kg-mod b { font-size: 14px; }
    .ls-kg-papers { grid-template-columns: 1fr; }

    .ls-kg-exam-bar-in { gap: 8px; }
    .ls-kg-exam-title { font-size: 13px; flex: 1; min-width: 0; }
    .ls-kg-clock { font-size: 19px; padding: 2px 11px; }

    .ls-kg-plan-item { padding: 12px 13px; gap: 11px; }
    .ls-kg-plan-ico { flex-basis: 34px; height: 34px; font-size: 15px; }
    .ls-kg-plan-prog { flex-basis: 66px; }

    .ls-kg-trend { height: 76px; gap: 3px; }
    .ls-kg-trend-lbl { font-size: 9px; }

    .ls-kg-sheet { grid-template-columns: repeat(auto-fill, minmax(38px, 1fr)); }

    /* 移动端底部导航 */
    .ls-kg-tabbar {
        display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 90;
        background: var(--kg-card); border-top: 1px solid var(--kg-line);
        padding-bottom: env(safe-area-inset-bottom);
    }
    .ls-kg-tabbar a {
        flex: 1; display: flex; flex-direction: column; align-items: center; gap: 2px;
        padding: 7px 0 6px; text-decoration: none; color: var(--kg-text-3); font-size: 11px;
    }
    .ls-kg-tabbar a i { font-style: normal; font-size: 18px; line-height: 1.15; }
    .ls-kg-tabbar a.is-active { color: var(--kg-primary); font-weight: 600; }
    .ls-kg-tabbar-badge {
        position: absolute; margin: -4px 0 0 15px; min-width: 15px; height: 15px; padding: 0 4px;
        background: var(--kg-accent); color: #fff; border-radius: 8px;
        font-size: 10px; line-height: 15px; text-align: center; font-weight: 600;
    }
}

@media (max-width: 400px) {
    .ls-kg-mods { grid-template-columns: 1fr; }
    .ls-kg-hero-stats { flex-wrap: wrap; gap: 12px 0; }
    .ls-kg-hero-stat { flex: 0 0 50%; }
    .ls-kg-score-num b { font-size: 36px; }
}

/* 打印：错题本导出 */
@media print {
    .ls-kg-nav, .ls-kg-tabbar, .ls-kg-btn, .ls-kg-filter, .ls-kg-pager { display: none !important; }
    .ls-kg-root { background: #fff; padding: 0; }
    .ls-kg-wrong-item { break-inside: avoid; border-color: #ccc; }
}

/* ==== 来源: exam-hub.css ==== */
/* ==========================================================================
   多考试类型中枢（Exam Hub）—— 作用域样式表
   作用域：.ls-eh-（全局入队，靠前缀隔离，不影响其它页面）
   设计基调：与考公模块一致 —— 纸面白底 / 克制分隔线 / 不用渐变与玻璃拟态。
   主色由各类考试注入：--eh-main（主色）、--eh-tint（浅底色），
   因此公考=藏青、学历=暗金、考证=墨绿、技能=紫灰，各类界面观感不同。
   ========================================================================== */

.ls-eh-root {
    --eh-main: #1B4A77;
    --eh-tint: #EEF3F8;

    --eh-text: #1c2530;
    --eh-text-2: #56616f;
    --eh-text-3: #8b95a1;
    --eh-line: #e3e7ec;
    --eh-line-2: #eef1f4;
    --eh-bg: #f5f6f8;
    --eh-card: #ffffff;
    --eh-ok: #1e8e4e;
    --eh-warn: #b8860b;

    --eh-r: 8px;
    --eh-r-s: 5px;
    --eh-shadow: 0 1px 2px rgba(28, 37, 48, .06);
    --eh-shadow-h: 0 4px 14px rgba(28, 37, 48, .09);

    background: var(--eh-bg);
    color: var(--eh-text);
    font-size: 15px;
    line-height: 1.7;
    -webkit-font-smoothing: antialiased;
    font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", sans-serif;
    min-height: 60vh;
    padding-bottom: 40px;
}

.ls-eh-root *,
.ls-eh-root *::before,
.ls-eh-root *::after { box-sizing: border-box; }

.ls-eh-wrap { max-width: 1180px; margin: 0 auto; padding: 0 16px; }

/* ---------- 顶部：当前考试横幅 ---------- */
.ls-eh-hero {
    background: var(--eh-main);
    color: #fff;
    padding: 22px 0 24px;
}
.ls-eh-hero-in { max-width: 1180px; margin: 0 auto; padding: 0 16px; }
.ls-eh-crumb { font-size: 12.5px; opacity: .78; margin-bottom: 8px; }
.ls-eh-crumb a { color: #fff; text-decoration: none; }
.ls-eh-crumb a:hover { text-decoration: underline; }
.ls-eh-crumb span { margin: 0 6px; opacity: .6; }
.ls-eh-hero h1 { margin: 0 0 6px; font-size: 24px; line-height: 1.35; font-weight: 600; letter-spacing: .2px; }
.ls-eh-hero p { margin: 0; font-size: 13.5px; opacity: .82; }

.ls-eh-hero-meta { margin-top: 14px; display: flex; flex-wrap: wrap; gap: 8px; }
.ls-eh-chip {
    display: inline-flex; align-items: center; gap: 5px;
    background: rgba(255, 255, 255, .14);
    border: 1px solid rgba(255, 255, 255, .18);
    color: #fff; font-size: 12.5px; line-height: 1;
    padding: 6px 11px; border-radius: 20px;
}

/* ---------- 大类切换条 ---------- */
.ls-eh-tabs {
    background: var(--eh-card);
    border-bottom: 1px solid var(--eh-line);
    position: sticky; top: 0; z-index: 20;
}
.ls-eh-tabs-in {
    max-width: 1180px; margin: 0 auto; padding: 0 16px;
    display: flex; gap: 4px; overflow-x: auto; -webkit-overflow-scrolling: touch;
}
.ls-eh-tabs-in::-webkit-scrollbar { height: 0; }
.ls-eh-tab {
    flex: 0 0 auto;
    padding: 14px 16px; font-size: 14.5px; font-weight: 500;
    color: var(--eh-text-2); text-decoration: none;
    border-bottom: 2px solid transparent; white-space: nowrap;
    transition: color .15s, border-color .15s;
}
.ls-eh-tab:hover { color: var(--eh-main); }
.ls-eh-tab.is-on { color: var(--eh-main); border-bottom-color: var(--eh-main); font-weight: 600; }
.ls-eh-tab b { font-weight: 600; }
.ls-eh-tab i {
    font-style: normal; font-size: 12px; margin-left: 5px;
    color: var(--eh-text-3);
}

/* ---------- 区块标题 ---------- */
.ls-eh-sec { padding: 26px 0 4px; }
.ls-eh-sec-hd { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.ls-eh-sec-hd h2 { margin: 0; font-size: 17px; font-weight: 600; }
.ls-eh-sec-hd p { margin: 4px 0 0; font-size: 13px; color: var(--eh-text-3); }
.ls-eh-more { font-size: 13px; color: var(--eh-main); text-decoration: none; white-space: nowrap; }
.ls-eh-more:hover { text-decoration: underline; }

/* ---------- 大类卡片（首页） ---------- */
.ls-eh-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; margin-bottom: 8px; }
.ls-eh-gcard {
    background: var(--eh-card); border: 1px solid var(--eh-line);
    border-radius: var(--eh-r); padding: 20px; text-decoration: none; color: inherit;
    display: block; transition: box-shadow .16s, border-color .16s, transform .16s;
    border-top: 3px solid var(--gc, var(--eh-main));
}
.ls-eh-gcard:hover { box-shadow: var(--eh-shadow-h); border-color: var(--eh-line); transform: translateY(-2px); }
.ls-eh-gcard h3 { margin: 0 0 6px; font-size: 17px; font-weight: 600; color: var(--gc, var(--eh-main)); }
.ls-eh-gcard p { margin: 0 0 12px; font-size: 13px; color: var(--eh-text-2); line-height: 1.6; }
.ls-eh-gcard-ft { display: flex; align-items: center; justify-content: space-between; font-size: 12.5px; color: var(--eh-text-3); }
.ls-eh-gcard-ft b { color: var(--eh-text); font-weight: 600; }

/* ---------- 考试列表 ---------- */
.ls-eh-exams { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.ls-eh-exam {
    background: var(--eh-card); border: 1px solid var(--eh-line);
    border-radius: var(--eh-r); padding: 16px 17px;
    display: flex; flex-direction: column; min-height: 132px;
    transition: box-shadow .16s, border-color .16s;
}
.ls-eh-exam:hover { box-shadow: var(--eh-shadow-h); border-color: var(--eh-main); }
.ls-eh-exam-hd { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
.ls-eh-exam h4 { margin: 0; font-size: 15.5px; font-weight: 600; }
.ls-eh-exam-n {
    flex: 0 0 auto; font-size: 12px; color: var(--eh-text-3);
    background: var(--eh-tint); border-radius: 10px; padding: 2px 8px; line-height: 1.7;
}
.ls-eh-exam p {
    margin: 7px 0 12px; font-size: 12.5px; color: var(--eh-text-2);
    line-height: 1.55; flex: 1 1 auto;
}
.ls-eh-exam-ft { display: flex; gap: 8px; }
.ls-eh-btn {
    display: inline-flex; align-items: center; justify-content: center;
    height: 34px; padding: 0 14px; border-radius: var(--eh-r-s);
    font-size: 13.5px; text-decoration: none; border: 1px solid transparent;
    cursor: pointer; transition: background .15s, border-color .15s, color .15s;
    font-family: inherit;
}
.ls-eh-btn-primary { background: var(--eh-main); color: #fff; }
.ls-eh-btn-primary:hover { filter: brightness(1.08); color: #fff; }
.ls-eh-btn-ghost { background: transparent; color: var(--eh-main); border-color: var(--eh-line); }
.ls-eh-btn-ghost:hover { border-color: var(--eh-main); background: var(--eh-tint); }
.ls-eh-btn[disabled],
.ls-eh-btn.is-off { opacity: .5; pointer-events: none; }

/* ---------- 科目模块（按考试展开） ---------- */
.ls-eh-subj {
    background: var(--eh-card); border: 1px solid var(--eh-line);
    border-radius: var(--eh-r); margin-bottom: 12px; overflow: hidden;
}
.ls-eh-subj-hd {
    display: flex; align-items: center; justify-content: space-between; gap: 12px;
    padding: 14px 17px; border-bottom: 1px solid var(--eh-line-2);
    background: var(--eh-tint);
}
.ls-eh-subj-hd h4 { margin: 0; font-size: 15px; font-weight: 600; }
.ls-eh-subj-hd span { font-size: 12.5px; color: var(--eh-text-2); }
.ls-eh-subj-bd { padding: 12px 17px 15px; display: flex; flex-wrap: wrap; gap: 8px; }
.ls-eh-mod {
    display: inline-flex; align-items: center; gap: 6px;
    border: 1px solid var(--eh-line); border-radius: 18px;
    padding: 6px 13px; font-size: 13px; color: var(--eh-text-2);
    text-decoration: none; background: var(--eh-card);
    transition: border-color .15s, color .15s, background .15s;
}
.ls-eh-mod:hover { border-color: var(--eh-main); color: var(--eh-main); background: var(--eh-tint); }
.ls-eh-mod b { font-weight: 600; color: var(--eh-text-3); font-size: 12px; }
.ls-eh-mod.is-empty b { color: #c2c8d0; }

/* ---------- 空状态 ---------- */
.ls-eh-empty {
    background: var(--eh-card); border: 1px solid var(--eh-line);
    border-radius: var(--eh-r); padding: 34px 24px; text-align: center;
}
.ls-eh-empty b { display: block; font-size: 15.5px; margin-bottom: 6px; }
.ls-eh-empty p { margin: 0 0 16px; font-size: 13.5px; color: var(--eh-text-2); }
.ls-eh-empty-acts { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }

/* ---------- 通用小件 ---------- */
.ls-eh-tag {
    display: inline-block; font-size: 12px; line-height: 1.7;
    padding: 1px 8px; border-radius: 3px;
    background: var(--eh-tint); color: var(--eh-main);
}
.ls-eh-tag-ok { background: rgba(30, 142, 78, .1); color: var(--eh-ok); }
.ls-eh-tag-warn { background: rgba(184, 134, 11, .12); color: var(--eh-warn); }
.ls-eh-divider { height: 1px; background: var(--eh-line); margin: 22px 0; border: 0; }

/* ---------- 移动端 ---------- */
@media (max-width: 900px) {
    .ls-eh-exams { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
    .ls-eh-root { font-size: 14.5px; }
    .ls-eh-wrap { padding: 0 12px; }
    .ls-eh-hero { padding: 16px 0 18px; }
    .ls-eh-hero-in { padding: 0 12px; }
    .ls-eh-hero h1 { font-size: 20px; }
    .ls-eh-grid { grid-template-columns: 1fr; gap: 10px; }
    .ls-eh-gcard { padding: 16px; }
    .ls-eh-exams { grid-template-columns: 1fr; gap: 10px; }
    .ls-eh-exam { min-height: 0; }
    /* 移动端大点击区 */
    .ls-eh-btn { height: 40px; padding: 0 16px; font-size: 14px; }
    .ls-eh-mod { padding: 8px 14px; font-size: 13.5px; }
    .ls-eh-tab { padding: 12px 13px; font-size: 14px; }
    .ls-eh-tabs-in { padding: 0 12px; }
}


/* ---- 自动批量：暗色下清除字面 background:#fff（各模块统一） ---- */
html.dark-mode .ls-btn-ghost { background: #16202f !important; }
html.dark-mode .ls-chip { background: #16202f !important; }
html.dark-mode .ls-list-item { background: #16202f !important; }
html.dark-mode .ls-stat { background: #16202f !important; }
html.dark-mode .ls-input, html.dark-mode .ls-textarea, html.dark-mode .ls-select { background: #16202f !important; }
html.dark-mode #mobile-nav-dock.mobile-tab-bar { background: #16202f !important; }
html.dark-mode .sp-header { background: #16202f !important; }
html.dark-mode .sp-summary { background: #16202f !important; }
html.dark-mode .sp-summary-stat-outline { background: #16202f !important; }
html.dark-mode .sp-card { background: #16202f !important; }
html.dark-mode .sp-btn-fav { background: #16202f !important; }
html.dark-mode .sp-sidebar-card { background: #16202f !important; }
html.dark-mode .sp-r-card { background: #16202f !important; }
html.dark-mode .sp-footer-bar { background: #16202f !important; }
html.dark-mode .course-detail { background: #16202f !important; }
html.dark-mode .course-info-bar { background: #16202f !important; }
html.dark-mode .course-tabs { background: #16202f !important; }
html.dark-mode .course-section { background: #16202f !important; }
html.dark-mode .course-section .desc table { background: #16202f !important; }
html.dark-mode .feature-icon { background: #16202f !important; }
html.dark-mode .teacher-avatar { background: #16202f !important; }
html.dark-mode .chapter-dur { background: #16202f !important; }
html.dark-mode .cert-own-icon { background: #16202f !important; }
html.dark-mode .cert-card { background: #16202f !important; }
html.dark-mode .cert-card-icon { background: #16202f !important; }
html.dark-mode .course-buy { background: #16202f !important; }
html.dark-mode .course-detail .btn-outline { background: #16202f !important; }
html.dark-mode #cart-content { background: #16202f !important; }
html.dark-mode .lsj-btn-ghost { background: #16202f !important; }
html.dark-mode .lsj-search { background: #16202f !important; }
html.dark-mode .lsj-cat:hover { background: #16202f !important; }
html.dark-mode .lsj-cat-count { background: #16202f !important; }
html.dark-mode .lsj-chip { background: #16202f !important; }
html.dark-mode .lsj-cta a { background: #16202f !important; }
html.dark-mode .ls-kg-btn-danger { background: #16202f !important; }
html.dark-mode .dr-btn-ghost { background: #16202f !important; }
html.dark-mode .dr-btn-warn { background: #16202f !important; }
html.dark-mode .dr-btn-danger { background: #16202f !important; }
html.dark-mode .dr-topbar { background: #16202f !important; }
html.dark-mode .dr-hero { background: #16202f !important; }
html.dark-mode .dr-searchbar { background: #16202f !important; }
html.dark-mode .dr-stage-card { background: #16202f !important; }
html.dark-mode .dr-netdisk-card { background: #16202f !important; }
html.dark-mode .dr-chip { background: #16202f !important; }
html.dark-mode .dr-card { background: #16202f !important; }
html.dark-mode .dr-filters { background: #16202f !important; }
html.dark-mode .dr-select { background: #16202f !important; }
html.dark-mode .dr-pager button { background: #16202f !important; }
html.dark-mode .dr-tag { background: #16202f !important; }
html.dark-mode .dr-form-row input, html.dark-mode .dr-form-row select, html.dark-mode .dr-form-row textarea, html.dark-mode .dr-form textarea { background: #16202f !important; }
html.dark-mode .dr-points-hero-main .dr-btn-primary { background: #16202f !important; }
html.dark-mode .dr-task-item { background: #16202f !important; }
html.dark-mode .dr-invite-row input { background: #16202f !important; }
html.dark-mode .dr-pkg-card { background: #16202f !important; }
html.dark-mode .dr-order-item { background: #16202f !important; }
html.dark-mode .dr-tab { background: #16202f !important; }
html.dark-mode .dr-list-row { background: #16202f !important; }
html.dark-mode .dr-cash-box { background: #16202f !important; }
html.dark-mode .dr-modal-panel { background: #16202f !important; }
html.dark-mode .dr-admin-row { background: #16202f !important; }
html.dark-mode .opc-card { background: #16202f !important; }
html.dark-mode .opc-stat { background: #16202f !important; }
html.dark-mode .opc-tier { background: #16202f !important; }
html.dark-mode .opc-tier .opc-tier-btn { background: #16202f !important; }
html.dark-mode .opc-field input, html.dark-mode .opc-field textarea, html.dark-mode .opc-field select { background: #16202f !important; }
html.dark-mode .opc-btn.ghost { background: #16202f !important; }
html.dark-mode .opc-btn.danger { background: #16202f !important; }
html.dark-mode .opc-qr { background: #16202f !important; }
html.dark-mode .opc-ai-scene { background: #16202f !important; }
html.dark-mode .opc-proj-row { background: #16202f !important; }
html.dark-mode .ls-ops-oa-card { background: #16202f !important; }
html.dark-mode .ls-ops-oa-kpi { background: #16202f !important; }
html.dark-mode .ls-ops-oa-dashboard .ls-dashboard-grid { background: #16202f !important; }
html.dark-mode .ls-ops-oa-dashboard .ls-dash-card { background: #16202f !important; }
html.dark-mode .ls-pa-tabs { background: #16202f !important; }
html.dark-mode .ls-pa-toolbar { background: #16202f !important; }
html.dark-mode .ls-pa-input { background: #16202f !important; }
html.dark-mode .ls-pa-bulk-inline { background: #16202f !important; }
html.dark-mode .ls-pa-list { background: #16202f !important; }
html.dark-mode .ls-pa-pager { background: #16202f !important; }
html.dark-mode .ls-pa-pager-link { background: #16202f !important; }
html.dark-mode .ls-pa-modal-box { background: #16202f !important; }
html.dark-mode .ls-reports-filter { background: #16202f !important; }
html.dark-mode .ls-reports-field input[type="date"], html.dark-mode .ls-reports-field select { background: #16202f !important; }
html.dark-mode .ls-reports-preset { background: #16202f !important; }
html.dark-mode .ls-reports-stat { background: #16202f !important; }
html.dark-mode .ls-reports-panel { background: #16202f !important; }
html.dark-mode .ls-school-card { background: #16202f !important; }
html.dark-mode .ls-school-modcard { background: #16202f !important; }
html.dark-mode .ls-school-card input[type=text], html.dark-mode .ls-school-card input[type=date], html.dark-mode .ls-school-card input[type=datetime-local], html.dark-mode .ls-school-card textarea, html.dark-mode .ls-school-card select { background: #16202f !important; }
html.dark-mode .ls-school-notice-item { background: #16202f !important; }
html.dark-mode .ls-school-filter__btn { background: #16202f !important; }
html.dark-mode .ls-ov-modal { background: #16202f !important; }
html.dark-mode .ls-ov-checkin-btn { background: #16202f !important; }
html.dark-mode .ls-ov-btn-outline { background: #16202f !important; }
html.dark-mode .wk-hero { background: #16202f !important; }
html.dark-mode .wk-searchbar { background: #16202f !important; }
html.dark-mode .wk-task { background: #16202f !important; }
html.dark-mode .wk-worker { background: #16202f !important; }
html.dark-mode .wk-btn-outline { background: #16202f !important; }
html.dark-mode .wk-input, html.dark-mode .wk-textarea, html.dark-mode .wk-select { background: #16202f !important; }
html.dark-mode .wk-detail-head { background: #16202f !important; }
html.dark-mode .wk-tl-dot { background: #16202f !important; }
html.dark-mode .wk-ms-card { background: #16202f !important; }
html.dark-mode .wk-app-item { background: #16202f !important; }
html.dark-mode .wk-stat { background: #16202f !important; }
html.dark-mode .wk-pager a, html.dark-mode .wk-pager span { background: #16202f !important; }
html.dark-mode .wk-modal-box { background: #16202f !important; }
html.dark-mode .wk-modal-head { background: #16202f !important; }
html.dark-mode .wk-modal-foot { background: #16202f !important; }
html.dark-mode .wk-zone-card { background: #16202f !important; }
html.dark-mode .ls-dashboard-section { background: #16202f !important; }
html.dark-mode .ls-dashboard-grid { background: #16202f !important; }
html.dark-mode .ls-dash-card { background: #16202f !important; }
html.dark-mode .ls-stat-card { background: #16202f !important; }
html.dark-mode .ls-modal-box { background: #16202f !important; }
html.dark-mode .ls-admin-table { background: #16202f !important; }
html.dark-mode .ls-edu-card, html.dark-mode .ls-skill-card, html.dark-mode .ls-shop-card { background: #16202f !important; }
html.dark-mode .ls-option-field { background: #16202f !important; }
html.dark-mode .edu-card { background: #16202f !important; }
html.dark-mode .edu-item { background: #16202f !important; }
html.dark-mode .shop-card-admin { background: #16202f !important; }
html.dark-mode .stat-item { background: #16202f !important; }
html.dark-mode .product-item { background: #16202f !important; }
html.dark-mode .skill-card { background: #16202f !important; }
html.dark-mode .skill-item { background: #16202f !important; }
html.dark-mode .ls-role-welcome { background: #16202f !important; }
html.dark-mode .ls-role-card { background: #16202f !important; }
html.dark-mode body.login #loginform, html.dark-mode body.login #lostpasswordform, html.dark-mode body.login #registerform, html.dark-mode body.login #resetpassform { background: #16202f !important; }
html.dark-mode body.login .input, html.dark-mode body.login input[type="text"], html.dark-mode body.login input[type="password"], html.dark-mode body.login input[type="email"] { background: #16202f !important; }
html.dark-mode body.login .message, html.dark-mode body.login #login_error, html.dark-mode body.login .success { background: #16202f !important; }
html.dark-mode .ls-dashboard-unified { background: #16202f !important; }
html.dark-mode .ls-unified-alert { background: #16202f !important; }
html.dark-mode .ls-unified-grid .ls-dash-card { background: #16202f !important; }
html.dark-mode .ls-theme-options-wrap .ls-to-section { background: #16202f !important; }
html.dark-mode .ls-theme-options-wrap .ls-option-field input[type="text"], html.dark-mode .ls-theme-options-wrap .ls-option-field input[type="url"], html.dark-mode .ls-theme-options-wrap .ls-option-field input[type="number"], html.dark-mode .ls-theme-options-wrap .ls-option-field input[type="password"], html.dark-mode .ls-theme-options-wrap .ls-option-field input[type="time"], html.dark-mode .ls-theme-options-wrap .ls-option-field textarea, html.dark-mode .ls-theme-options-wrap .ls-option-field select { background: #16202f !important; }
html.dark-mode .ls-theme-options-wrap .ls-ops-provider { background: #16202f !important; }
html.dark-mode .ls-dash-section { background: #16202f !important; }
html.dark-mode .ls-dash-grid { background: #16202f !important; }
html.dark-mode .aoi-sub { background: #16202f !important; }
html.dark-mode .aoi-room { background: #16202f !important; }
html.dark-mode body.login #login { background: #16202f !important; }
html.dark-mode body.login .input, html.dark-mode body.login input[type="text"], html.dark-mode body.login input[type="password"] { background: #16202f !important; }


/* ============================================================
   ==== 暗色补丁 4：品牌实底反白回压 + 激活态恢复 ====
   本块刻意放在自动批量暗色块（background:#16202f !important）之后，
   以保证等特异性时本块胜出；全部带 !important 压过批量块。
   ============================================================ */

/* ---- 4.1 品牌实底 + 反白字（浅色下是 #1B4A77/#0E2A47，暗色下主色已改亮）----
   :root 把 --kg/--wk/--mk/--lsj/--dr/--ao/--ai/--ach/--ov/--tn/--sd 主色
   重定向到 --ls-navy/--ls-blue，暗色下两者已提亮以便文字可读，
   于是"实底反白"的控件会退化成浅底白字。这里统一回压到 #2563eb：
   白字 5.2:1，压在 #16202f 卡片上 3.1:1。 */
html.dark-mode .ls-btn-primary,
html.dark-mode .lsj-btn-solid,
html.dark-mode .lsj-chip.is-active,
html.dark-mode .lsj-cta--alt a,
html.dark-mode .lsj-page.is-active,
html.dark-mode .lsj-search button,
html.dark-mode .lsj-cat.is-active,
html.dark-mode .lsj-verified,
html.dark-mode .dr-btn-primary,
html.dark-mode .dr-chip.active,
html.dark-mode .dr-fab a,
html.dark-mode .dr-pager button.active,
html.dark-mode .dr-tab.active,
html.dark-mode .ao-btn,
html.dark-mode .ao-btn-primary,
html.dark-mode .ao-rank-no,
html.dark-mode .mk-btn-primary,
html.dark-mode .mk-nav .mk-btn-publish,
html.dark-mode .mk-tradein-step h3 .num,
html.dark-mode .mk-toast.success,
html.dark-mode .ls-ov-btn-primary,
html.dark-mode .ls-ov-modal-save,
html.dark-mode .ls-ov-profile-edit-btn,
html.dark-mode .wk-chip.active,
html.dark-mode .wk-msg.is-self .wk-msg-bubble,
html.dark-mode .wk-ms-seq,
html.dark-mode .wk-pager .current,
html.dark-mode .ls-kg-btn-primary,
html.dark-mode .ls-kg-filter-opts a.is-on,
html.dark-mode .ls-kg-opt.is-picked .ls-kg-opt-key,
html.dark-mode .ls-kg-pager .current,
html.dark-mode .ls-kg-sheet .is-answered,
html.dark-mode .ls-school-filter__btn.is-active,
html.dark-mode .ls-pa-pager-link.active,
html.dark-mode .ls-reports-preset.active,
html.dark-mode .opc-ai-scene.active,
html.dark-mode .opc-tier.hot .opc-tier-btn {
    background: #2563eb !important;
    border-color: #2563eb !important;
    color: #fff !important;
}

/* 悬停态压深一档 */
html.dark-mode .ls-btn-primary:hover,
html.dark-mode .ls-route .hover\:bg-gray-800:hover,
html.dark-mode .lsj-btn-solid:hover,
html.dark-mode .dr-btn-primary:hover,
html.dark-mode .ao-btn:hover,
html.dark-mode .ao-btn-primary:hover,
html.dark-mode .ls-kg-btn-primary:hover,
html.dark-mode .ls-school-filter__btn.is-active:hover {
    background: #1d4ed8 !important;
    border-color: #1d4ed8 !important;
    color: #fff !important;
}

/* .ls-route 里被改成品牌蓝的工具类底色（文字沿用 text-white） */
html.dark-mode .ls-route .bg-blue-600,
html.dark-mode .ls-route .bg-purple-600 { background-color: #2563eb !important; }
html.dark-mode .ls-route .hover\:bg-gray-900:hover { background-color: #2563eb !important; }

/* 金色按钮：金底 + 品牌深蓝字，暗色下 --ls-navy 已提亮，文字必须压回深色 */
html.dark-mode .ls-btn-gold,
html.dark-mode .ls-btn-gold:hover { color: #131c2b !important; }

/* 考公大块面：hero / 顶栏 / 分数卡用稍深的蓝，白字更稳 */
html.dark-mode .ls-kg-hero,
html.dark-mode .ls-kg-nav,
html.dark-mode .ls-kg-score-card,
html.dark-mode .ls-kg-exam-bar {
    background: #1d4ed8 !important;
    border-color: #1d4ed8 !important;
    color: #fff !important;
}

/* 招聘分类计数气泡：原为白底蓝字，暗色下必须反相 */
html.dark-mode .lsj-cat.is-active .lsj-cat-count {
    background: rgba(0, 0, 0, .3) !important;
    color: #fff !important;
}

/* ---- 4.2 激活/完成态被批量块抹平的回压 ---- */
html.dark-mode .wk-ms-card.is-paid {
    background: #0f2e25 !important;
    border-color: #1d5c3f !important;
}
html.dark-mode .wk-tl-item.done .wk-tl-dot {
    background: var(--wk-success) !important;
    border-color: var(--wk-success) !important;
}