/* ============================================================
   项目管理实践平台 · 课程学习页样式（course.css）
   ------------------------------------------------------------
   与参考产品（数智化综合实训平台 · 课程学习）的版式对齐：
   顶部课程条 + 页签、概览环 + 三口径、工具条、章卡 → 单元 → 任务、
   右窄栏（能力图谱 / 主讲老师 / 公告）。

   配色不照搬对方的紫色主题，改用本平台的令牌（--c-primary /
   --c-violet / --c-mint / --c-rose），否则这两个页面并排会像两个产品。
   前缀统一 cs-（course study），避免与 styles.css / lms.css 撞名。
   ============================================================ */

.cs-page{--cs-vio:#7c3aed;--cs-ink:#16233a;--cs-ink2:#5b6b82;--cs-ink3:#94a3b8;
  --cs-line:#e3eaf3;--cs-bg:#f7f9fd}

/* ---------------- 顶部课程条 ---------------- */
.cs-bar{display:flex;align-items:center;gap:14px;flex-wrap:wrap;background:var(--panel,#fff);
  border:1px solid var(--line,#e3eaf3);border-radius:var(--r,12px);padding:10px 14px;margin-bottom:10px;
  box-shadow:var(--sh-1,0 1px 2px rgba(16,36,72,.05))}
.cs-id{display:flex;align-items:center;gap:9px;min-width:0}
.cs-id .dot{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;color:#fff;
  font-weight:600;font-size:14px;background:linear-gradient(135deg,#1d4ed8,#06b6d4);flex:0 0 auto}
.cs-id b{font-size:14px;font-weight:600;color:var(--cs-ink)}
.cs-id em{font-style:normal;font-size:11.6px;color:var(--cs-ink3)}
.cs-tabs{display:flex;align-items:center;gap:2px;background:var(--cs-bg);border-radius:10px;padding:3px;flex-wrap:wrap}
.cs-tabs button{border:0;background:transparent;color:var(--cs-ink2);font-size:12.6px;padding:6px 12px;
  border-radius:8px;cursor:pointer;position:relative;font-family:inherit;white-space:nowrap}
.cs-tabs button:hover{color:var(--cs-vio)}
.cs-tabs button.on{background:#fff;color:var(--cs-vio);font-weight:600;box-shadow:0 1px 3px rgba(16,36,72,.10)}
.cs-tabs .nbadge{position:absolute;top:1px;right:2px;min-width:14px;height:14px;line-height:14px;
  border-radius:8px;background:var(--c-rose,#f43f5e);color:#fff;font-size:10px;padding:0 3px;text-align:center}
.cs-bar .sp{flex:1}
.cs-teacher{font-size:11.6px;color:var(--cs-ink3);white-space:nowrap}

/* ---------------- 概览卡 ---------------- */
.cs-overall{display:flex;align-items:center;gap:20px;flex-wrap:wrap;background:var(--panel,#fff);
  border:1px solid var(--line,#e3eaf3);border-radius:var(--r,12px);padding:14px 18px;margin-bottom:10px}
.cs-ov-score{display:flex;align-items:center;gap:12px;flex:0 0 auto}
.cs-ov-score .big{font-size:24px;font-weight:600;line-height:1.15;color:var(--cs-ink)}
.cs-ov-score .big .unit{display:block;font-size:11.5px;font-weight:400;color:var(--cs-ink3);margin-top:2px}
.cs-ov-score .lbl{font-size:11.6px;color:var(--cs-ink3);margin-top:3px;max-width:190px;overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap}
.cs-ov-main{flex:1;min-width:260px}
.cs-ov-line{display:flex;align-items:center;gap:10px}
.cs-ov-line .cs-bar-t{flex:1;height:8px;border-radius:5px;background:#eef3fa;overflow:hidden}
.cs-ov-line .cs-bar-t i{display:block;height:100%;border-radius:5px;background:linear-gradient(90deg,#2563eb,#06b6d4)}
.cs-ov-line-t{font-size:12.2px;color:var(--cs-ink2);white-space:nowrap}
.cs-meta{font-size:11.8px;color:var(--cs-ink2);line-height:2;margin-top:7px}
.cs-meta b{color:var(--cs-ink);font-variant-numeric:tabular-nums}
.cs-meta .why{display:inline-block;margin-left:4px;padding:0 5px;border-radius:5px;background:#eef3fa;
  color:var(--cs-ink3);font-size:10.5px;cursor:help}
.cs-ov-aside{display:flex;flex-direction:column;gap:5px;align-items:flex-end;flex:0 0 auto}
.cs-chip{font-size:11px;color:var(--cs-ink2);background:var(--cs-bg);border:1px solid var(--cs-line);
  border-radius:999px;padding:2px 9px;white-space:nowrap}

/* ---------------- 工具条 ---------------- */
.cs-tools{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin-bottom:10px}
.cs-continue{display:inline-flex;align-items:center;gap:7px;border:0;border-radius:9px;padding:8px 13px;
  background:linear-gradient(135deg,#1d4ed8,#2563eb 46%,#06b6d4);color:#fff;font-size:12.6px;
  font-family:inherit;cursor:pointer;box-shadow:0 3px 10px rgba(37,99,235,.26);max-width:100%}
.cs-continue em{font-style:normal;opacity:.9;font-size:11.8px;max-width:280px;overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap}
.cs-continue[disabled]{background:#e7edf6;color:#93a3b8;box-shadow:none;cursor:not-allowed}
.cs-search{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--cs-line);border-radius:9px;
  padding:0 10px;background:#fff;height:33px}
.cs-search input{border:0;outline:0;font-size:12.4px;width:170px;font-family:inherit;background:transparent}
.cs-filters{display:inline-flex;gap:4px;background:var(--cs-bg);border-radius:9px;padding:3px}
.cs-filters button{border:0;background:transparent;font-size:12.2px;color:var(--cs-ink2);padding:5px 10px;
  border-radius:7px;cursor:pointer;font-family:inherit;white-space:nowrap}
.cs-filters button.on{background:#fff;color:var(--cs-vio);font-weight:600;box-shadow:0 1px 2px rgba(16,36,72,.09)}
.cs-filters b{margin-left:4px;font-weight:500;color:var(--cs-ink3);font-variant-numeric:tabular-nums}
.cs-tools .sp{flex:1}
.cs-foldall{border:1px solid var(--cs-line);background:#fff;border-radius:8px;padding:5px 11px;
  font-size:12px;color:var(--cs-ink2);cursor:pointer;font-family:inherit}
.cs-foldall:hover{border-color:#c7dbff;color:var(--c-primary)}

/* ---------------- 两栏 ---------------- */
.cs-grid{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:12px;align-items:start}
@media (max-width:1180px){.cs-grid{grid-template-columns:minmax(0,1fr)}}

/* ---------------- 章卡 ---------------- */
.cs-chap{background:var(--panel,#fff);border:1px solid var(--line,#e3eaf3);border-radius:var(--r,12px);
  margin-bottom:10px;overflow:hidden}
.cs-chap-hd{display:flex;align-items:center;gap:12px;padding:11px 14px;background:linear-gradient(180deg,#fff,#fbfdff);
  border-bottom:1px solid var(--line-2,#eef3fa);cursor:pointer}
.cs-chap-hd .ch-no{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;flex:0 0 auto;
  font-weight:600;font-size:13px;color:#fff;background:var(--c,#94a3b8)}
.cs-chap-hd .ch-tt{flex:1;min-width:0}
.cs-chap-hd h3{font-size:13.4px;font-weight:600;color:var(--cs-ink);margin:0}
.cs-chap-hd .ch-desc{font-size:11.6px;color:var(--cs-ink3);margin:2px 0 0;overflow:hidden;
  text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical}
.cs-chap-hd .ch-prog{display:flex;align-items:center;gap:8px;flex:0 0 auto}
.cs-chap-hd .ch-prog-t{font-size:11.6px;color:var(--cs-ink3);text-align:right;min-width:52px}
.cs-chap-hd .ch-prog-t b{display:block;font-size:12.6px;color:var(--cs-ink);font-variant-numeric:tabular-nums}
.cs-chap-hd .ch-fold{border:0;background:transparent;color:var(--cs-ink3);cursor:pointer;padding:4px;
  border-radius:6px;line-height:0}
.cs-chap-hd .ch-fold:hover{background:var(--cs-bg);color:var(--cs-vio)}
.cs-chap.folded .ch-fold svg{transform:rotate(-90deg)}
.cs-chap-bd{padding:4px 14px 12px}
.cs-chap.folded .cs-chap-bd{display:none}

.cs-sec{display:flex;align-items:center;gap:7px;margin:10px 0 4px;font-size:11.6px;color:var(--cs-ink3)}
.cs-sec::after{content:'';flex:1;height:1px;background:var(--line-2,#eef3fa)}

/* ---------------- 单元行 ---------------- */
.cs-unit{display:flex;gap:10px;align-items:flex-start;padding:9px 0;border-bottom:1px dashed var(--line-2,#eef3fa)}
.cs-unit:last-child{border-bottom:0}
.cs-unit-ic{width:24px;height:24px;border-radius:7px;display:grid;place-items:center;flex:0 0 auto;
  font-size:11.6px;color:#fff;background:#c7d2e2;margin-top:1px}
.cs-unit.st-done .cs-unit-ic{background:var(--c-mint,#10b981)}
.cs-unit.st-doing .cs-unit-ic{background:var(--c-amber,#f59e0b)}
.cs-unit-b{flex:1;min-width:0}
.cs-unit-t{font-size:13px;font-weight:550;color:var(--cs-ink);display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.cs-unit-t .sub{font-weight:400;font-size:11.4px;color:var(--cs-ink3)}
.cs-unit .u-meta{font-size:11.4px;color:var(--cs-ink3);margin-top:2px}
.cs-unit .u-sum{font-size:11.8px;color:var(--cs-ink2);margin-top:2px;overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap}
.cs-unit-p{display:flex;align-items:center;gap:7px;margin-top:5px;font-size:11.4px;color:var(--cs-ink3)}
.cs-unit-p .u-bar{flex:1;max-width:180px;height:5px;border-radius:3px;background:#eef3fa;overflow:hidden}
.cs-unit-p .u-bar i{display:block;height:100%;background:var(--c-violet,#7c3aed)}
.cs-unit-r{flex:0 0 auto;display:flex;flex-direction:column;gap:5px;align-items:flex-end}
.cs-start{border:1px solid var(--cs-line);background:#fff;border-radius:8px;padding:5px 10px;font-size:12px;
  color:var(--c-primary);cursor:pointer;font-family:inherit;display:inline-flex;align-items:center;gap:3px}
.cs-start:hover{background:var(--c-primary-l,#eff4ff);border-color:#c7dbff}
.cs-start.ghost{color:var(--cs-vio);border-color:#e0d7fb;background:#faf7ff}
.cs-stamp{display:inline-flex;align-items:center;gap:4px;font-size:11.4px;color:var(--c-mint,#10b981);
  border:1px solid #b7e6d3;background:#ecfdf5;border-radius:999px;padding:2px 9px}
.cs-panel{margin:8px 0 4px;padding:12px 14px;border-left:3px solid var(--c-violet,#7c3aed);
  background:#fbfaff;border-radius:0 9px 9px 0}
.cs-panel .body{font-size:12.8px;line-height:1.95;color:var(--cs-ink2)}
.cs-panel .body p{margin:0 0 6px}
.cs-panel .body strong{color:var(--cs-ink)}
.cs-panel .foot{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin-top:10px}

/* ---------------- 任务行（本章实训） ---------------- */
.cs-task{display:flex;align-items:center;gap:9px;padding:7px 0;font-size:12.4px;
  border-bottom:1px dashed var(--line-2,#eef3fa);cursor:pointer}
.cs-task:last-child{border-bottom:0}
.cs-task:hover{background:var(--cs-bg)}
.cs-task .ix{width:20px;height:20px;border-radius:6px;background:#eef3fa;color:var(--cs-ink3);
  display:grid;place-items:center;font-size:11px;flex:0 0 auto}
.cs-task.done .ix{background:#ecfdf5;color:var(--c-mint,#10b981)}
.cs-task .t{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--cs-ink)}
.cs-task .sc{font-size:11.6px;color:var(--cs-ink3);font-variant-numeric:tabular-nums}

/* ---------------- 标签 ---------------- */
.cs-tag{display:inline-block;font-size:11px;border-radius:999px;padding:1px 8px;line-height:1.7;white-space:nowrap}
.cs-tag.gray{background:#f1f5f9;color:#64748b}
.cs-tag.vio{background:#f5f3ff;color:#7c3aed}
.cs-tag.green{background:#ecfdf5;color:#059669}
.cs-tag.red{background:#fff1f2;color:#e11d48}
.cs-tag.amber{background:#fffbeb;color:#b45309}
.cs-tag.blue{background:#eff4ff;color:#2563eb}

/* ---------------- 右侧卡片 ---------------- */
.cs-card{background:var(--panel,#fff);border:1px solid var(--line,#e3eaf3);border-radius:var(--r,12px);
  margin-bottom:10px;overflow:hidden}
.cs-card-hd{display:flex;align-items:center;gap:7px;padding:9px 13px;border-bottom:1px solid var(--line-2,#eef3fa);
  font-size:12.6px;font-weight:600;color:var(--cs-ink);background:linear-gradient(180deg,#fff,#fbfdff)}
.cs-card-hd .hd-x{margin-left:auto;font-size:11px;font-weight:400;color:var(--cs-ink3)}
.cs-card-bd{padding:11px 13px}
.cs-abil{display:flex;flex-direction:column;gap:9px}
.cs-abil .row{font-size:12px;color:var(--cs-ink2)}
.cs-abil .row .hd{display:flex;justify-content:space-between;margin-bottom:3px}
.cs-abil .row .hd b{color:var(--cs-ink);font-variant-numeric:tabular-nums}
.cs-abil .row .bar{height:6px;border-radius:4px;background:#eef3fa;overflow:hidden}
.cs-abil .row .bar i{display:block;height:100%;border-radius:4px}
.cs-abil-foot{font-size:11.4px;color:var(--cs-ink3);margin-top:10px;padding-top:9px;border-top:1px dashed var(--line-2,#eef3fa)}
.cs-teacher{display:flex;align-items:center;gap:10px}
.cs-teacher .av{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;color:#fff;
  font-size:13px;background:linear-gradient(135deg,#7c3aed,#2563eb);flex:0 0 auto}
.cs-teacher b{display:block;font-size:12.8px;color:var(--cs-ink)}
.cs-teacher span{font-size:11.4px;color:var(--cs-ink3)}
.cs-trow{display:flex;justify-content:space-between;font-size:11.8px;color:var(--cs-ink3);margin-top:6px}
.cs-note{display:flex;gap:7px;font-size:11.9px;color:var(--cs-ink2);line-height:1.75;margin-bottom:7px}
.cs-note:last-child{margin-bottom:0}
.cs-note i{width:5px;height:5px;border-radius:50%;background:#c7d2e2;margin-top:7px;flex:0 0 auto}
.cs-note.ok i{background:var(--c-mint,#10b981)}
.cs-note.warn i{background:var(--c-amber,#f59e0b)}
.cs-empty{text-align:center;color:var(--cs-ink3);font-size:12px;padding:18px 8px;line-height:1.9}
.cs-empty .t{color:var(--cs-ink2);font-size:12.6px}
.cs-empty .s{font-size:11.4px;margin-top:3px}

/* ---------------- 门禁提示条 ---------------- */
.cs-gate{display:flex;gap:9px;align-items:flex-start;border-radius:10px;padding:10px 13px;margin-bottom:10px;
  font-size:12.4px;line-height:1.85;border-left:3px solid var(--g,#2563eb);background:var(--gb,#eff6ff)}
.cs-gate b{color:var(--gc,#2563eb)}
.cs-gate button{margin-top:7px}

/* ---------------- 通用页签容器 ---------------- */
.cs-tabpage{background:var(--panel,#fff);border:1px solid var(--line,#e3eaf3);border-radius:var(--r,12px);
  padding:14px 16px}
.cs-tabpage h4{font-size:13px;font-weight:600;color:var(--cs-ink);margin:0 0 3px}
.cs-tabpage .lead{font-size:11.8px;color:var(--cs-ink3);margin-bottom:12px;line-height:1.8}
.cs-resgrp{margin-bottom:16px}
.cs-resgrp h5{font-size:12.4px;font-weight:600;color:var(--cs-ink);margin:0 0 8px;display:flex;gap:8px;align-items:center}
.cs-resgrp h5 .cnt{font-size:11px;font-weight:400;color:var(--cs-ink3)}
.cs-res{display:flex;align-items:center;gap:10px;padding:8px 10px;border:1px solid var(--cs-line);
  border-radius:9px;margin-bottom:7px;cursor:pointer;background:#fff}
.cs-res:hover{border-color:#c7dbff;background:var(--c-primary-l,#eff4ff)}
.cs-res .ic{width:28px;height:28px;border-radius:8px;display:grid;place-items:center;flex:0 0 auto;
  background:#eff4ff;color:var(--c-primary)}
.cs-res .b{flex:1;min-width:0}
.cs-res .b b{display:block;font-size:12.6px;color:var(--cs-ink)}
.cs-res .b span{font-size:11.4px;color:var(--cs-ink3);display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

.cs-qa{border:1px solid var(--cs-line);border-radius:10px;padding:10px 12px;margin-bottom:9px}
.cs-qa .q{font-size:12.8px;color:var(--cs-ink);line-height:1.8}
.cs-qa .meta{font-size:11.3px;color:var(--cs-ink3);margin-top:4px;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.cs-qa .a{margin-top:8px;padding:8px 10px;background:#f7fbf8;border-left:2px solid var(--c-mint,#10b981);
  border-radius:0 7px 7px 0;font-size:12.4px;color:var(--cs-ink2);line-height:1.85}
.cs-qa .a b{color:var(--cs-ink)}
.cs-qa.pending{background:#fffdf7;border-color:#f3e2bd}
.cs-form textarea{width:100%;min-height:70px;border:1px solid var(--cs-line);border-radius:9px;padding:8px 10px;
  font-family:inherit;font-size:12.6px;resize:vertical;outline:0}
.cs-form textarea:focus{border-color:#9dbdf7;box-shadow:0 0 0 3px rgba(37,99,235,.10)}
.cs-form .row{display:flex;gap:8px;align-items:center;margin-top:8px;flex-wrap:wrap}

.cs-kv{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.cs-kv .i{border:1px solid var(--cs-line);border-radius:9px;padding:9px 11px}
.cs-kv .i .k{font-size:11.4px;color:var(--cs-ink3)}
.cs-kv .i .v{font-size:17px;font-weight:600;color:var(--cs-ink);font-variant-numeric:tabular-nums}
.cs-kv .i .v small{font-size:11.5px;font-weight:400;color:var(--cs-ink3);margin-left:3px}

.cs-bars{display:flex;flex-direction:column;gap:10px}
.cs-bars .r .hd{display:flex;justify-content:space-between;font-size:12.2px;color:var(--cs-ink2);margin-bottom:4px}
.cs-bars .r .hd b{color:var(--cs-ink);font-variant-numeric:tabular-nums}
.cs-bars .r .tr{height:8px;border-radius:5px;background:#e7eef8;overflow:hidden;position:relative;
  box-shadow:inset 0 0 0 1px rgba(148,163,184,.14)}
.cs-bars .r .tr i{display:block;height:100%;border-radius:5px}
.cs-bars .r .tr u{position:absolute;top:-3px;width:2px;height:14px;background:#94a3b8;border-radius:1px}
.cs-bars .lg{display:flex;gap:14px;font-size:11.4px;color:var(--cs-ink3);margin-top:10px}
.cs-bars .lg span{display:inline-flex;align-items:center;gap:5px}
.cs-bars .lg i{width:9px;height:9px;border-radius:3px;display:inline-block}
.cs-bars .lg u{width:2px;height:10px;background:#94a3b8;display:inline-block}

.cs-tbl{width:100%;border-collapse:collapse;font-size:12.4px}
.cs-tbl th{text-align:left;font-weight:500;color:var(--cs-ink3);font-size:11.6px;padding:6px 8px;
  border-bottom:1px solid var(--cs-line)}
.cs-tbl td{padding:7px 8px;border-bottom:1px solid var(--line-2,#eef3fa);color:var(--cs-ink2)}
.cs-tbl tr:last-child td{border-bottom:0}
.cs-tbl b{color:var(--cs-ink)}
.cs-grp{margin-bottom:14px}
.cs-grp h5{font-size:12.2px;font-weight:600;color:var(--cs-ink);margin:0 0 7px;display:flex;gap:7px;align-items:center}
.cs-mem{display:inline-flex;align-items:center;gap:6px;background:var(--cs-bg);border:1px solid var(--cs-line);
  border-radius:999px;padding:3px 10px 3px 4px;font-size:12px;color:var(--cs-ink2);margin:0 6px 6px 0}
.cs-mem .av{width:20px;height:20px;border-radius:50%;background:#c7d2e2;color:#fff;font-size:10px;
  display:grid;place-items:center}
.cs-mem.me{border-color:#bcd7ff;background:#eff4ff;color:var(--c-primary-d,#1d4ed8)}
.cs-mem.me .av{background:var(--c-primary,#2563eb)}
.cs-note-line{font-size:11.6px;color:var(--cs-ink3);margin-top:10px;line-height:1.85}

/* ============================================================
   章详情（点章进去的「本章执行」页）
   —— 版式对齐参考产品的「任务执行」：左主区（目录 + 讲义 + 任务）、
      右窄栏（开始学习 / 系统操作 / 完成条件 / 章节位置）。
      配色仍走平台令牌，不照搬对方的紫色主题。
   ============================================================ */

/* 章头整体可点；折叠只由右侧箭头负责 */
.cs-chap-hd .ch-main{display:flex;align-items:center;gap:12px;flex:1;min-width:0;cursor:pointer;
  border-radius:9px;padding:3px 5px;margin:-3px -5px;transition:background .15s}
.cs-chap-hd .ch-main:hover{background:#f4f7fd}
.cs-chap-hd .ch-main:focus-visible{outline:2px solid var(--cs-vio);outline-offset:2px}
.cs-chap-hd .ch-go{margin-left:9px;font-size:11.2px;font-weight:500;color:var(--cs-vio);
  white-space:nowrap;opacity:.9}
.cs-chap-hd .ch-go span{margin-left:2px}
.cs-chap-ft{display:flex;justify-content:flex-end;padding-top:9px;margin-top:9px;
  border-top:1px dashed var(--cs-line)}

/* 面包屑 */
.cs-exec{margin-top:2px}
.cs-crumb{display:flex;align-items:center;gap:7px;font-size:12.2px;color:var(--cs-ink3);margin:0 0 9px}
.cs-crumb .cs-back{border:0;background:transparent;color:var(--cs-ink2);cursor:pointer;
  font:inherit;padding:3px 7px;border-radius:7px}
.cs-crumb .cs-back:hover{background:var(--cs-bg);color:var(--cs-vio)}
.cs-crumb .sep{color:#c9d5e5}
.cs-crumb .cur{color:var(--cs-ink);font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* 章头横条 */
.cs-xhd{display:flex;align-items:center;gap:13px;background:var(--panel,#fff);
  border:1px solid var(--line,#e3eaf3);border-radius:var(--r,12px);padding:12px 15px;margin-bottom:10px}
.cs-xhd .ch-no{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;flex:0 0 auto;
  font-size:15px;font-weight:700;color:var(--c,#4f46e5);background:#f1f5ff}
.cs-xhd .xhd-t{flex:1;min-width:0}
.cs-xhd h2{font-size:15px;font-weight:650;color:var(--cs-ink);margin:0}
.cs-xhd p{margin:3px 0 0;font-size:11.8px;color:var(--cs-ink3);overflow:hidden;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.cs-xhd .xhd-r{display:flex;align-items:center;gap:9px;flex:0 0 auto}
.cs-xhd .xhd-n{font-size:11.6px;color:var(--cs-ink3);line-height:1.5}
.cs-xhd .xhd-n b{display:block;font-size:14px;color:var(--cs-ink);font-variant-numeric:tabular-nums}

/* 门禁提示（章级） */
.cs-xnote{font-size:12px;line-height:1.75;border-radius:9px;padding:8px 12px;margin-bottom:10px;
  background:#eff6ff;color:#2563eb;border-left:3px solid #2563eb}
.cs-xnote.warn{background:#fef2f2;color:#dc2626;border-left-color:#dc2626}

/* 两栏 */
.cs-xgrid{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:12px;align-items:start}
.cs-xmain,.cs-xside{display:flex;flex-direction:column;gap:10px;min-width:0}

/* 单元目录行 */
.cs-xrow{display:flex;align-items:center;gap:9px;width:100%;text-align:left;border:1px solid transparent;
  background:transparent;border-radius:9px;padding:8px 9px;cursor:pointer;font:inherit}
.cs-xrow:hover{background:var(--cs-bg)}
.cs-xrow.on{background:#f1f5ff;border-color:#dbe4fb}
.cs-xrow .ix{width:20px;height:20px;border-radius:6px;display:grid;place-items:center;flex:0 0 auto;
  font-size:11px;font-weight:600;color:var(--cs-ink3);background:#f1f5fb}
.cs-xrow.on .ix{background:var(--cs-vio);color:#fff}
.cs-xrow .t{flex:1;min-width:0;font-size:12.8px;color:var(--cs-ink);line-height:1.45}
.cs-xrow .t em{display:block;font-style:normal;font-size:11.2px;color:var(--cs-ink3);margin-top:1px}

/* 讲义正文 */
.cs-xbody{font-size:13px;line-height:1.95;color:#243349;margin:9px 0 4px;padding:11px 13px;
  background:#fafcff;border:1px solid var(--cs-line);border-radius:9px}
.cs-xbody p{margin:0 0 8px}
.cs-xbody p:last-child{margin-bottom:0}
.cs-xbody strong,.cs-xbody b{color:var(--cs-ink)}
.cs-xft{display:flex;align-items:center;gap:7px;margin-top:10px;flex-wrap:wrap}
.cs-xft .sp{flex:1}

/* 右栏 */
.cs-xsteps{margin:0;padding-left:18px;font-size:12.4px;color:var(--cs-ink2);line-height:1.8}
.cs-xsteps li{margin-bottom:5px}
.cs-xsteps li b{color:var(--cs-ink)}
.cs-xsteps li span{display:block;font-size:11.4px;color:var(--cs-ink3)}

.cs-xmod{display:flex;align-items:center;gap:8px;padding:7px 8px;border-radius:9px}
.cs-xmod:hover{background:var(--cs-bg)}
.cs-xmod .m{flex:1;min-width:0;font-size:12.4px;line-height:1.45}
.cs-xmod .m b{display:block;color:var(--cs-ink);font-weight:600}
.cs-xmod .m .muted{font-size:11px}

.cs-xkv{display:flex;align-items:baseline;justify-content:space-between;gap:8px;
  font-size:12.2px;color:var(--cs-ink3);margin-bottom:4px}
.cs-xkv b{color:var(--cs-ink);font-size:12.4px;font-variant-numeric:tabular-nums}
.cs-xnav{display:flex;justify-content:space-between;gap:6px;margin-top:10px}

/* 卡片里的进度条（.cs-bar-t 原本只在概览行里有样式） */
.cs-xmain .cs-bar-t,.cs-xside .cs-bar-t{height:8px;border-radius:5px;background:#e7eef8;
  overflow:hidden;margin:2px 0 0}
.cs-xmain .cs-bar-t i,.cs-xside .cs-bar-t i{display:block;height:100%;border-radius:5px;
  background:linear-gradient(90deg,#2563eb,#06b6d4)}

@media (max-width:1080px){
  .cs-xgrid{grid-template-columns:minmax(0,1fr)}
}

/* 系统操作：当前单元对应的模块单独强调 */
.cs-xmod.cur{background:#f6f9ff;border:1px solid #e2ebfb}
.cs-xmod.cur:hover{background:#eef4ff}
.cs-xsub{font-size:11.2px;color:var(--cs-ink3);padding:8px 8px 3px;border-top:1px dashed var(--cs-line);margin-top:4px}

/* ============================================================
   课程三级结构（章 → 单元 → 任务）+ 任务执行页 + 课程资源管理
   版式与交互对齐参考产品：单元行显示任务数与完成度，点任务进任务页。
   ============================================================ */

/* 单元块 */
.cs-ublk{margin:8px 0;border:1px solid var(--cs-line);border-radius:10px;overflow:hidden;background:#fff}
.cs-ublk-hd{display:flex;align-items:center;gap:10px;padding:8px 10px;background:#f8fbff;cursor:pointer}
.cs-ublk-hd:hover{background:#f1f6ff}
.cs-ublk .u-code{font-size:11px;font-weight:700;color:var(--cs-vio);background:#eef2ff;
  border-radius:6px;padding:3px 6px;flex:0 0 auto;letter-spacing:.3px}
.cs-ublk .u-tt{flex:1;min-width:0}
.cs-ublk .u-tt b{display:block;font-size:12.9px;color:var(--cs-ink);font-weight:600}
.cs-ublk .u-tt em{display:block;font-style:normal;font-size:11.3px;color:var(--cs-ink3);margin-top:1px}
.cs-ublk .u-prog{display:flex;align-items:center;gap:6px;flex:0 0 auto;font-size:11.6px;color:var(--cs-ink3)}
.cs-ublk .ch-fold{border:0;background:transparent;color:var(--cs-ink3);cursor:pointer;padding:3px;border-radius:6px}
.cs-ublk .ch-fold:hover{background:#e8effc;color:var(--cs-vio)}
.cs-ublk.folded .cs-ublk-bd{display:none}
.cs-ublk.folded .ch-fold svg{transform:rotate(-90deg)}
.cs-ublk-bd{padding:4px 6px 6px}

/* 任务行 */
.cs-trow{display:flex;align-items:center;gap:9px;width:100%;text-align:left;border:1px solid transparent;
  background:transparent;border-radius:8px;padding:7px 8px;cursor:pointer;font:inherit}
.cs-trow:hover{background:#f6f9ff;border-color:#e6eefb}
.cs-trow .ix{width:20px;height:20px;border-radius:6px;display:grid;place-items:center;flex:0 0 auto;
  font-size:11px;font-weight:600;color:var(--cs-ink3);background:#f1f5fb}
.cs-trow .t{flex:1;min-width:0;font-size:12.7px;color:var(--cs-ink);line-height:1.45}
.cs-trow .t em{display:block;font-style:normal;font-size:11.2px;color:var(--cs-ink3);margin-top:1px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cs-trow .mt{flex:0 0 auto;font-size:11px;color:var(--cs-ink3)}
.cs-trow .st{display:flex;gap:4px;flex:0 0 auto}
.cs-trow .go{color:#c3d0e2;font-size:15px;line-height:1}
.cs-trow:hover .go{color:var(--cs-vio)}

/* 任务执行页 */
.cs-tp{display:flex;flex-direction:column;gap:0}
.cs-tp-bar{display:flex;align-items:center;gap:10px;background:#fff;border:1px solid var(--cs-line);
  border-radius:12px;padding:9px 12px;margin-bottom:10px;flex-wrap:wrap}
.cs-tp-bar .bc{display:flex;align-items:center;gap:6px;font-size:12.2px;color:var(--cs-ink3);min-width:0}
.cs-tp-bar .bc b{color:var(--cs-ink);font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cs-tp-bar .sep{color:#c9d5e5}
.cs-tp-bar .sp{flex:1}
.cs-tp-body{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:12px;align-items:start}
.cs-tp-left{background:#fff;border:1px solid var(--cs-line);border-radius:12px;overflow:hidden}
.cs-tp-left .tp-hd{padding:11px 13px;border-bottom:1px solid var(--cs-line);background:linear-gradient(180deg,#fff,#fafcff)}
.cs-tp-left .tp-hd .k{font-size:11px;color:var(--cs-ink3);letter-spacing:.5px}
.cs-tp-left .tp-hd .t{font-size:14px;font-weight:650;color:var(--cs-ink);margin:2px 0 4px}
.cs-tp-left .tp-hd .meta{display:flex;gap:12px;flex-wrap:wrap;font-size:11.4px;color:var(--cs-ink3)}
.tp-subtabs{display:flex;gap:4px;padding:7px 9px;border-bottom:1px solid var(--cs-line);flex-wrap:wrap}
.tp-subtabs button{border:0;background:transparent;font:inherit;font-size:12.2px;color:var(--cs-ink2);
  padding:5px 10px;border-radius:7px;cursor:pointer}
.tp-subtabs button:hover{background:var(--cs-bg)}
.tp-subtabs button.on{background:#eef2ff;color:var(--cs-vio);font-weight:600}
.tp-pane{padding:11px 13px;max-height:340px;overflow:auto}
.tp-h5{font-size:12px;font-weight:650;color:var(--cs-ink);margin:12px 0 6px}
.tp-pane > .tp-h5:first-child{margin-top:0}
.tp-pos{margin-top:10px;font-size:11.6px;color:var(--cs-ink3);line-height:1.8;
  background:#f8fafd;border-radius:8px;padding:8px 10px}
.tp-sub{font-size:12.4px;color:var(--cs-ink2);line-height:1.75;margin-bottom:8px}
.tp-ul{margin:0 0 4px;padding-left:18px;font-size:12.3px;color:var(--cs-ink2);line-height:1.85}
.tp-ul.warn li{color:#b45309}
.tp-pt{margin-bottom:7px}
.tp-pt b{display:block;font-size:12.3px;color:var(--cs-ink)}
.tp-pt span{font-size:12px;color:var(--cs-ink2);line-height:1.75}
.tp-steps{padding:10px 13px 12px;border-top:1px solid var(--cs-line)}
.cs-step{margin-bottom:9px}
.cs-step .h{display:flex;align-items:center;gap:7px;font-size:12.3px;font-weight:600;color:var(--cs-ink)}
.cs-step .h .n{width:18px;height:18px;border-radius:5px;background:#eef2ff;color:var(--cs-vio);
  display:grid;place-items:center;font-size:11px}
.cs-step ul{margin:4px 0 0 25px;padding:0;font-size:12.1px;color:var(--cs-ink2);line-height:1.8}
.tp-foot{display:flex;align-items:center;gap:9px;margin-top:8px;flex-wrap:wrap}
.tp-learn{border:1px solid var(--cs-vio);background:var(--cs-vio);color:#fff;border-radius:9px;
  height:32px;padding:0 14px;font:inherit;font-size:12.4px;cursor:pointer}
.tp-learn:hover{filter:brightness(1.06)}
.tp-learn.ghost{background:#fff;color:var(--cs-vio)}
.tp-foot .hint{font-size:11.4px;color:var(--cs-ink3)}

.cs-tp-right{background:#fff;border:1px solid var(--cs-line);border-radius:12px;padding:13px}
.cs-tp-right h2{font-size:14px;font-weight:650;color:var(--cs-ink);margin:0 0 10px;text-align:center}
.tp-op{border:1px solid var(--cs-line);border-radius:10px;padding:10px 12px;margin-bottom:9px}
.tp-op .h{display:flex;align-items:center;gap:7px;font-size:12.6px;font-weight:600;color:var(--cs-ink);margin-bottom:6px}
.tp-op .h .n{width:18px;height:18px;border-radius:50%;background:var(--cs-vio);color:#fff;
  display:grid;place-items:center;font-size:11px}
.tp-op .b{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.tp-op .b .txt{flex:1;min-width:0;font-size:12.1px;color:var(--cs-ink2);line-height:1.8}
.tp-enter{border:0;background:var(--cs-vio);color:#fff;border-radius:8px;height:30px;padding:0 12px;
  font:inherit;font-size:12.2px;cursor:pointer;flex:0 0 auto}
.tp-judge{border:1px solid var(--cs-line);border-radius:10px;padding:10px 12px;background:#fbfdff}
.tp-judge .row{display:flex;justify-content:space-between;font-size:12.2px;color:var(--cs-ink3);margin-bottom:5px}
.tp-judge .row b{color:var(--cs-ink)}
.tp-judge .note{font-size:11.6px;color:var(--cs-ink3);line-height:1.7;margin-top:5px}
.cs-tp-foot{display:flex;align-items:center;gap:8px;margin-top:10px;flex-wrap:wrap}
.cs-tp-foot .hint{font-size:11.6px;color:var(--cs-ink3)}
.cs-tp-foot .sp{flex:1}
.stars{font-style:normal;color:#f59e0b;letter-spacing:1px}
.stars s{text-decoration:none;color:#dbe3ee}

/* 任务目录 */
.cs-tdir{display:flex;align-items:center;gap:8px;padding:6px 8px;border-radius:8px;font-size:12.3px;color:var(--cs-ink);cursor:pointer}
.cs-tdir:hover{background:var(--cs-bg)}
.cs-tdir.on{background:#eef2ff}
.cs-tdir .ix{width:18px;height:18px;border-radius:5px;background:#f1f5fb;display:grid;place-items:center;
  font-size:10.6px;color:var(--cs-ink3);flex:0 0 auto}
.cs-tdir.on .ix{background:var(--cs-vio);color:#fff}
.cs-tdir .t{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cs-tdir .go{font-size:11.2px;color:var(--cs-vio)}

/* 任务资料 / 课程资源行 */
.cs-mfile{display:flex;align-items:center;gap:9px;padding:7px 8px;border-radius:8px}
.cs-mfile:hover{background:var(--cs-bg)}
.cs-mfile .ic{width:24px;height:24px;border-radius:7px;background:#eef2ff;color:var(--cs-vio);
  display:grid;place-items:center;flex:0 0 auto}
.cs-mfile .b{flex:1;min-width:0}
.cs-mfile .b b{display:block;font-size:12.4px;color:var(--cs-ink)}
.cs-mfile .b em{display:block;font-style:normal;font-size:11.1px;color:var(--cs-ink3);margin-top:1px}
.cs-mrow{display:flex;align-items:center;gap:9px;padding:8px 9px;border-radius:9px;border:1px solid transparent}
.cs-mrow:hover{background:#f8fbff;border-color:#e6eefb}
.cs-mrow .ic{width:26px;height:26px;border-radius:8px;background:#eef2ff;color:var(--cs-vio);
  display:grid;place-items:center;flex:0 0 auto}
.cs-mrow .b{flex:1;min-width:0}
.cs-mrow .b b{display:block;font-size:12.6px;color:var(--cs-ink)}
.cs-mrow .b em{display:block;font-style:normal;font-size:11.2px;color:var(--cs-ink3);margin-top:2px;line-height:1.6}
.cs-mrow .mt{font-size:11.2px;color:var(--cs-ink3);flex:0 0 auto}

@media (max-width:1100px){
  .cs-tp-body{grid-template-columns:minmax(0,1fr)}
}

/* 课程资源管理：上传表单用两列网格，标签在上、控件在下 ——
   .cs-form 原本是给「一行到底」的简单表单用的，字段一多就挤成一条。 */
[data-mr-uppanel] .cs-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 14px}
[data-mr-uppanel] .cs-form > label{display:flex;flex-direction:column;gap:5px;
  font-size:11.6px;color:var(--cs-ink3)}
[data-mr-uppanel] .cs-form .inp{width:100%}
[data-mr-uppanel] input[type=file]{font-size:12px;color:var(--cs-ink2)}
@media (max-width:900px){
  [data-mr-uppanel] .cs-form{grid-template-columns:minmax(0,1fr)}
}

/* 团队页的「实训轮次」一行（原名 cs-trow，与任务行类名相撞，已改名） */
.cs-krow{display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:7px 10px;border:1px solid var(--cs-line);border-radius:9px;font-size:12.3px;color:var(--cs-ink3)}
.cs-krow b{color:var(--cs-ink)}

/* ---------------- 教学案例库（cs-case） ----------------
   自成一块：案例卡片是"可挑选的教学包"，用卡片网格而不是表格 ——
   教师挑案例看的是情境与难度，不是字段对齐。 */
.cs-cases{--ci:#16233a;--ci2:#5b6b82;--ci3:#94a3b8;--cl:#e3eaf3;--cp:#2563eb}
.cs-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(148px,1fr));gap:10px;margin:0 0 12px}
.cs-stat{background:#fff;border:1px solid var(--line,#e3eaf3);border-radius:11px;padding:11px 13px}
.cs-stat .l{font-size:11.6px;color:var(--ci3)}
.cs-stat .n{font-size:19px;font-weight:700;color:var(--ci);margin:2px 0;line-height:1.3}
.cs-stat .s{font-size:11.2px;color:var(--ci3)}
.cs-casegrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(330px,1fr));gap:12px}
.cs-casecard{background:#fff;border:1px solid var(--line,#e3eaf3);border-radius:12px;padding:13px 14px;
  display:flex;flex-direction:column;gap:6px;cursor:pointer;transition:border-color .15s,box-shadow .15s,transform .15s}
.cs-casecard:hover{border-color:var(--cp);box-shadow:0 4px 14px rgba(37,99,235,.09);transform:translateY(-1px)}
.cs-casecard-top{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.cs-casecard h4{margin:2px 0 0;font-size:14.5px;line-height:1.5;color:var(--ci)}
.cs-casesub{font-size:12px;color:var(--ci3)}
.cs-casesum{margin:2px 0 4px;font-size:12.4px;color:var(--ci2);line-height:1.75;
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.cs-casefoot{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:auto;
  padding-top:8px;border-top:1px dashed #eef3fa}
.cs-casefiles,.cs-casemins{font-size:11.4px;color:var(--ci3)}
.cs-casehd{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin-bottom:6px}
.cs-csec{margin:12px 0 4px}
.cs-csec h5{display:flex;align-items:center;gap:6px;margin:0 0 6px;font-size:12.4px;font-weight:600;color:var(--ci2)}
.cs-fileline{display:flex;align-items:center;gap:9px;padding:8px 10px;border:1px solid var(--line,#e3eaf3);
  border-radius:9px;margin-bottom:6px;background:#fcfdff}
.cs-fileline>svg{width:16px;height:16px;color:var(--cp);flex:0 0 auto}
.cs-fileline .b{flex:1;min-width:0}
.cs-fileline .b b{display:block;font-size:12.8px;font-weight:600;color:var(--ci)}
.cs-fileline .b span{display:block;font-size:11.2px;color:var(--ci3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* ---------------- 学习任务编辑器（教师） ----------------
   抽屉里的表单：两列 / 三列栅格，长文本整行。 */
.cs-editform{display:flex;flex-direction:column;gap:11px}
.cs-editform .row2{display:grid;grid-template-columns:1fr 1fr;gap:11px 14px}
.cs-editform .row3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:11px 14px}
.cs-ef{display:flex;flex-direction:column;gap:4px}
.cs-ef>span{font-size:12px;color:#5b6b82;font-weight:600}
.cs-ef>em{font-size:11.2px;color:#94a3b8;font-style:normal}
.cs-ef .inp{width:100%;box-sizing:border-box}
.cs-hintline{font-size:11.8px;color:#5b6b82;background:#f7fafd;border:1px dashed #dbe6f3;
  border-radius:9px;padding:8px 11px}
@media (max-width:720px){
  .cs-editform .row2,.cs-editform .row3{grid-template-columns:1fr}
}

/* ---------------- 任务页课时视频 ----------------
   <video> 用 16:9 自适应宽度；不支持的格式给一行灰底提示 + 下载按钮。 */
.cs-mvid{margin:0 0 10px;border:1px solid #e3eaf3;border-radius:11px;overflow:hidden;background:#0b1220}
.cs-mvid video,.cs-mvid audio{display:block;width:100%;max-height:320px;background:#0b1220}
.cs-mvid audio{background:#f7fafd;padding:8px 10px}
.cs-mvid .cap{display:flex;align-items:center;gap:8px;padding:7px 11px;background:#fff;flex-wrap:wrap}
.cs-mvid .cap b{font-size:12.6px;color:#16233a;font-weight:600}
.cs-mvid .cap span{font-size:11.4px;color:#94a3b8}
.cs-mvid.no{display:flex;align-items:center;gap:10px;padding:11px 12px;background:#fff;border-color:#e3eaf3}
.cs-mvid.no .ic{flex:0 0 auto;color:#2563eb}
.cs-mvid.no .b{flex:1;min-width:0}
.cs-mvid.no .b b{display:block;font-size:12.8px;color:#16233a}
.cs-mvid.no .b em{display:block;font-size:11.4px;color:#94a3b8;font-style:normal;line-height:1.6}

/* ---------------- 案例封面与审核轨迹 ----------------
   封面 16:9；无图时用类型色块（--cover）保证卡片高度一致。 */
.cs-casecover{height:96px;border-radius:10px;overflow:hidden;background:
  linear-gradient(135deg,var(--cover,#2563eb),color-mix(in srgb,var(--cover,#2563eb) 62%,#fff));
  display:flex;align-items:center;justify-content:center;margin-bottom:2px}
.cs-casecover span{font-size:20px;font-weight:700;color:rgba(255,255,255,.92);letter-spacing:2px}
.cs-casecover.has-img{background:#eef3fa}
.cs-casecover img{width:100%;height:100%;object-fit:cover;display:block}
.cs-casedetailcover{height:132px;border-radius:11px;overflow:hidden;margin-bottom:10px;background:
  linear-gradient(135deg,var(--cover,#2563eb),color-mix(in srgb,var(--cover,#2563eb) 62%,#fff));
  display:flex;align-items:center;justify-content:center}
.cs-casedetailcover span{font-size:26px;font-weight:700;color:rgba(255,255,255,.92);letter-spacing:3px}
.cs-casedetailcover.has-img{background:#eef3fa}
.cs-casedetailcover img{width:100%;height:100%;object-fit:cover;display:block}
.cs-revstage{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 9px}
.cs-revacts{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:0 0 10px}
.cs-revtrail{border-left:2px solid #e3eaf3;padding-left:12px;margin:2px 0 4px}
.cs-revrow{position:relative;padding:6px 0 7px;font-size:12px;color:#5b6b82;display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.cs-revrow::before{content:'';position:absolute;left:-17px;top:11px;width:8px;height:8px;border-radius:50%;
  background:#c7d6e6;box-shadow:0 0 0 2px #fff}
.cs-revrow .lv{font-weight:600;color:#16233a}
.cs-revrow .ac{padding:1px 7px;border-radius:20px;font-size:11px;background:#eef3fa;color:#475569}
.cs-revrow .ac.ok{background:#e8f6ee;color:#0f7a46}
.cs-revrow .ac.no{background:#fdeceb;color:#b3261e}
.cs-revrow .at{color:#94a3b8;font-family:var(--mono,monospace);font-size:11px}
.cs-revrow .note{flex-basis:100%;color:#475569;line-height:1.7;background:#f7fafd;border-radius:7px;padding:5px 9px}

/* 案例 → 项目实例：四个数字并排，点生成前先看清会生成什么 */
.cs-genstats{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:8px;margin:0 0 8px}
.cs-genstat{background:#f7fafd;border:1px solid #e3eaf3;border-radius:9px;padding:8px 10px}
.cs-genstat span{display:block;font-size:11.2px;color:#94a3b8}
.cs-genstat b{display:block;font-size:12.8px;color:#16233a;margin-top:2px}

/* ---------------- 任务内容的版本历史 ----------------
   放在编辑抽屉底部：改坏了当场就能往回转，不必去翻备份。 */
.cs-revbox{margin-top:4px;border-top:1px dashed #e3eaf3;padding-top:9px}
.cs-revbox .hd{font-size:12px;font-weight:600;color:#5b6b82;margin-bottom:6px}
.cs-revitem{display:flex;align-items:center;gap:9px;padding:7px 9px;border:1px solid #eef3fa;
  border-radius:8px;margin-bottom:5px;background:#fcfdff}
.cs-revitem .v{flex:0 0 auto;font-family:var(--mono,monospace);font-size:11px;color:#1d4ed8;
  background:#eef3fa;border-radius:5px;padding:1px 6px}
.cs-revitem .b{flex:1;min-width:0}
.cs-revitem .b b{display:block;font-size:12.4px;color:#16233a}
.cs-revitem .b em{display:block;font-size:11.2px;color:#94a3b8;font-style:normal;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
select.inp[multiple]{height:auto;padding:6px 8px}

/* 企业导师名单选择：两列勾选，一行一人 */
.cs-mentorgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:7px;margin-top:6px}
.cs-mentorpick{display:flex;align-items:center;gap:7px;padding:7px 9px;border:1px solid #e3eaf3;
  border-radius:8px;cursor:pointer;background:#fff}
.cs-mentorpick:hover{border-color:#2563eb}
.cs-mentorpick input{flex:0 0 auto}
.cs-mentorpick .n{font-size:12.6px;color:#16233a;font-weight:600}
.cs-mentorpick .r{font-size:11.2px;color:#94a3b8;margin-left:auto}

/* 版本区：计数、对比、调整保留数 */
.cs-revhint{font-weight:400;color:#94a3b8;margin-left:8px;font-size:11.2px}
.cs-revmore{margin-left:8px;border:0;background:none;color:#1d4ed8;font-size:11.4px;cursor:pointer;padding:0}
.cs-revmore:hover{text-decoration:underline}
/* 冷归档提示：热表之外的更早版本，可整包下载 */
.cs-archline{margin-top:7px;padding:7px 9px;border:1px dashed #dbe7f7;border-radius:8px;
  background:#f7faff;font-size:11.6px;color:#5b6b82;line-height:1.7}
.cs-archline b{color:#1d4ed8}
.cs-archline a{white-space:nowrap}

/* 课时视频的已选顺序（上移/下移/设主） */
.cs-morder{margin-top:6px;border:1px solid #eef3fa;border-radius:8px;overflow:hidden}
.cs-mrow{display:flex;align-items:center;gap:8px;padding:5px 9px;font-size:12px;
  border-bottom:1px solid #f4f7fc;background:#fcfdff}
.cs-mrow:last-child{border-bottom:0}
.cs-mrow .n{width:18px;height:18px;border-radius:50%;background:#eef3fa;color:#1d4ed8;
  font-size:11px;display:flex;align-items:center;justify-content:center;flex:0 0 auto}
.cs-mrow .t{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#16233a}
.cs-mrow .btn[disabled]{opacity:.35;cursor:not-allowed}

/* 纯文本预览（txt / md / csv / json） */
.cs-prevtext{max-height:66vh;overflow:auto;margin:0;background:#f7f9fc;border:1px solid #eef3fa;
  border-radius:8px;padding:10px 12px;font-size:12px;line-height:1.7;color:#16233a;
  white-space:pre-wrap;word-break:break-word}
.cs-difflist{display:flex;flex-direction:column;gap:7px}
.cs-diffrow{display:grid;grid-template-columns:96px 1fr 20px 1fr;gap:8px;align-items:center;
  padding:7px 9px;border:1px solid #eef3fa;border-radius:8px;background:#fcfdff;font-size:12px}
.cs-diffrow .lab{color:#5b6b82;font-weight:600}
.cs-diffrow .old{color:#94a3b8;text-decoration:line-through}
.cs-diffrow .arrow{text-align:center;color:#94a3b8}
.cs-diffrow .new{color:#0f7a46}
@media (max-width:720px){.cs-diffrow{grid-template-columns:80px 1fr;}}

/* ---------------- 案例回收站 ----------------
   一条一行：标题 + 来源信息在左，剩余天数与操作用右对齐。
   剩余 ≤3 天用红色标签，避免"以为还在、其实明天就清了"。 */
.cs-reclist{display:flex;flex-direction:column;gap:7px}
.cs-recitem{display:flex;align-items:center;gap:10px;padding:9px 11px;
  border:1px solid #eef3fa;border-radius:9px;background:#fcfdff}
.cs-recitem:hover{border-color:#c7dbff;background:#f8fbff}
.cs-recitem .b{flex:1;min-width:0}
.cs-recitem .b b{display:block;font-size:13px;color:#16233a}
.cs-recitem .b em{display:block;font-size:11.4px;color:#94a3b8;font-style:normal;margin-top:2px}
.cs-recitem .btn{flex:0 0 auto}

/* ---------------- 资源页的折叠条 ----------------
   每章默认露 8 条，其余折叠。按钮做成文字链（不是大按钮），
   因为它是"延伸阅读"性质的操作，不该和上面的筛选抢注意力。 */
.cs-resmore{display:flex;gap:14px;padding:6px 2px 0}
.cs-resmore .cs-revmore{background:none;border:0;color:#1d4ed8;font-size:12.2px;cursor:pointer;padding:0}
.cs-resmore .cs-revmore:hover{text-decoration:underline}

/* ============================================================
   资源卡片（带封面）

   1162 份资料如果只有一行行的文件名，看不出"这份是什么"。
   这里把每一份做成卡片：封面（章节主题插画）+ 格式角标 + 标题 + 元信息。
   封面图在 web/img/covers/，同一章共用一张 —— 视觉上形成"这章的资料"这
   一个整体，而不是散落的附件。
   ============================================================ */
.cs-reslist{margin-bottom:10px}
.cs-resgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(188px,1fr));
  gap:12px;margin:2px 0 6px}
.cs-rc{border:1px solid var(--cs-line);border-radius:12px;background:#fff;overflow:hidden;
  display:flex;flex-direction:column;cursor:pointer;transition:box-shadow .16s,border-color .16s,transform .16s}
.cs-rc:hover{border-color:#c7dbff;box-shadow:0 10px 22px -14px rgba(37,99,235,.5);transform:translateY(-2px)}
.cs-rc .cv{position:relative;aspect-ratio:16/10;background:#eef4ff;overflow:hidden}
.cs-rc .cv img{width:100%;height:100%;object-fit:cover;display:block;
  transition:transform .35s ease}
.cs-rc:hover .cv img{transform:scale(1.04)}
.cs-rc .cv .ext{position:absolute;left:8px;top:8px;font-size:10px;font-weight:700;letter-spacing:.4px;
  padding:2px 6px;border-radius:5px;background:rgba(255,255,255,.94);color:#1d4ed8;
  box-shadow:0 1px 4px rgba(15,23,42,.10)}
.cs-rc .cv .cover-link{position:absolute;inset:0;border:0;padding:0;background:transparent;
  display:grid;place-items:center;cursor:pointer;color:#fff;text-decoration:none}
.cs-rc .cv .cover-link .play,.cs-rc .cv .cover-link .zoom{width:34px;height:34px;border-radius:50%;
  background:rgba(17,24,39,.55);backdrop-filter:blur(2px);display:grid;place-items:center;
  opacity:0;transform:scale(.9);transition:opacity .16s,transform .16s}
.cs-rc .cv .cover-link .play svg,.cs-rc .cv .cover-link .zoom svg{width:15px;height:15px}
.cs-rc:hover .cv .cover-link .play,.cs-rc:hover .cv .cover-link .zoom{opacity:1;transform:scale(1)}
.cs-rc .cv .cover-link .play{opacity:1;transform:none}      /* 视频：播放键常显，一眼看出能点 */
.cs-rc .bd{padding:9px 10px 10px;display:flex;flex-direction:column;gap:4px;flex:1;min-width:0}
.cs-rc .bd b{font-size:12.5px;line-height:1.45;color:var(--cs-ink);font-weight:600;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:36px}
.cs-rc .bd .mt{font-size:11px;color:var(--cs-ink3);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cs-rc .bd .ft{display:flex;gap:5px;align-items:center;margin-top:auto;padding-top:3px;flex-wrap:wrap}
.cs-rc .bd .ft .btn{padding:1px 8px;font-size:10.8px;height:22px;line-height:20px;border-radius:6px}
.cs-rc .bd .ft .dl{font-size:10.8px;color:var(--cs-ink3)}
.cs-rc .bd .ft .dl:hover{color:var(--c-primary)}

/* 分组标题上的章节封面缩略 */
.cs-resgrp h5 .cg{width:34px;height:22px;border-radius:5px;object-fit:cover;
  border:1px solid var(--cs-line);flex:0 0 auto}

/* 学习页：章节卡标题前的章封面 */
.cs-chap-hd .ch-cv{width:66px;height:41px;border-radius:8px;overflow:hidden;flex:0 0 auto;
  border:1px solid var(--line-2,#eef3fa);background:#eef4ff}
.cs-chap-hd .ch-cv img{width:100%;height:100%;object-fit:cover;display:block}

@media (max-width:720px){
  .cs-resgrid{grid-template-columns:repeat(auto-fill,minmax(148px,1fr));gap:9px}
  .cs-chap-hd .ch-cv{display:none}
}

/* 案例卡/案例详情没上传封面时，用「案例」主题插图打底 + 类型角标 */
.cs-casecover,.cs-casedetailcover{position:relative}
.cs-casecover .cover-tag,.cs-casedetailcover .cover-tag{position:absolute;left:8px;bottom:8px;
  font-size:10.5px;padding:2px 8px;border-radius:6px;background:rgba(17,24,39,.55);
  color:#fff;letter-spacing:.6px;backdrop-filter:blur(2px)}
.cs-casedetailcover .cover-tag{font-size:11.5px;left:10px;bottom:10px}