/* ==========================================================================
   数据标注 · 32 学时课程地图（plan.html / lectures.html 第 00 讲共用）
   视觉语言与全站一致：暖纸底、发丝线、无静态投影；颜色只用 CSS 变量，
   暗色主题下自动跟随（四幕色另做一轮提亮，否则暗底上发闷）。
   ========================================================================== */

.ap{max-width:1140px;margin:0 auto;}
.ap *{box-sizing:border-box;}

/* 四幕配色：只在这里定义一次，暗色主题统一提亮（用 data-act 而非内联变量，
   否则内联样式会压过主题覆盖） */
[data-act="a1"]{--ac:#b06a24;--ac-soft:#f8ecda;}
[data-act="a2"]{--ac:#7c4a63;--ac-soft:#f3e6ec;}
[data-act="a3"]{--ac:#3f6e6a;--ac-soft:#e3efee;}
[data-act="a4"]{--ac:#5b6b8c;--ac-soft:#e7eaf1;}
[data-theme="dark"] [data-act="a1"]{--ac:#E0A56A;--ac-soft:#3A2A22;}
[data-theme="dark"] [data-act="a2"]{--ac:#C79BB4;--ac-soft:#33263A;}
[data-theme="dark"] [data-act="a3"]{--ac:#8FBDB6;--ac-soft:#1E2A28;}
[data-theme="dark"] [data-act="a4"]{--ac:#9BAAC9;--ac-soft:#252A38;}

/* ---------- 头部：五个数字 + 一句话主线 ---------- */
.ap-head{margin:0 0 8px;}
.ap-kpi{display:flex;flex-wrap:wrap;gap:8px;}
.ap-kpi span{display:inline-flex;align-items:baseline;gap:3px;font-size:12px;color:var(--muted);
  background:var(--white);border:1px solid var(--line);border-radius:999px;padding:4px 12px;}
.ap-kpi span b{font-size:15px;color:var(--brand);font-weight:800;letter-spacing:-.02em;}
.ap-line{margin:14px 0 0;font-size:14.5px;line-height:1.85;color:var(--ink-2);
  padding:12px 15px;background:var(--surface);border-left:3px solid var(--brand);border-radius:0 9px 9px 0;}
.ap-line b{color:var(--brand);}

/* ---------- 小节标题 ---------- */
.ap-sec{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin:30px 0 12px;
  padding-bottom:8px;border-bottom:1px solid var(--line);}
.ap-sec h3{margin:0;font-size:16px;letter-spacing:-.01em;color:var(--ink);}
.ap-sec h3 span{display:inline-block;margin-right:8px;font-size:11px;font-weight:700;letter-spacing:.04em;
  color:var(--brand);background:var(--brand-soft);border-radius:5px;padding:2px 7px;vertical-align:2px;}
.ap-sec small{margin-left:auto;font-size:11.8px;color:var(--muted);}
.ap-note{margin:10px 0 0;font-size:12.6px;line-height:1.8;color:var(--muted);}

/* ---------- 图 1：学时带 ---------- */
.ap-strip{display:flex;gap:5px;margin-top:4px;}
.ap-cell{flex:1 1 0;min-width:0;display:flex;flex-direction:column;justify-content:center;gap:2px;
  padding:9px 7px;border:1px solid var(--line);border-radius:9px;background:var(--white);
  text-decoration:none;transition:.15s ease;position:relative;overflow:hidden;}
.ap-cell::before{content:"";position:absolute;inset:0 auto 0 0;width:3px;background:var(--ac);}
.ap-cell .n{font-size:12.5px;font-weight:800;color:var(--ac);letter-spacing:.02em;line-height:1.1;}
.ap-cell .h{font-size:10px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.ap-cell:hover{transform:translateY(-2px);border-color:var(--ac);box-shadow:0 6px 16px -10px rgba(16,32,46,.35);}
.ap-cell:hover .h{color:var(--ink-2);}
.ap-legend{display:flex;flex-wrap:wrap;gap:6px 16px;margin-top:10px;font-size:11.8px;color:var(--muted);}
.ap-legend .lg{display:inline-flex;align-items:center;gap:6px;}
.ap-legend i{width:9px;height:9px;border-radius:3px;background:var(--ac);flex:none;}

/* ---------- 图 2：四幕 ---------- */
.ap-act{position:relative;margin:0 0 20px;padding:0 0 0 18px;border-left:2px solid var(--ac);}
.ap-act-h{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 12px;}
.ap-act-no{width:26px;height:26px;flex:none;border-radius:8px;background:var(--ac-soft);color:var(--ac);
  font-size:12.5px;font-weight:800;display:flex;align-items:center;justify-content:center;}
.ap-act-h b{font-size:14.5px;color:var(--ink);margin-right:8px;}
.ap-act-h small{font-size:11.6px;color:var(--muted);}
.ap-act-want{margin-left:auto;font-size:11.8px;color:var(--ac);background:var(--ac-soft);
  border-radius:999px;padding:3px 11px;white-space:nowrap;}
.ap-lecs{display:grid;grid-template-columns:repeat(auto-fill,minmax(196px,1fr));gap:10px;}

.ap-lec{display:flex;flex-direction:column;gap:0;border:1px solid var(--line);border-radius:12px;
  background:var(--white);padding:11px 12px 12px;position:relative;transition:.16s ease;}
.ap-lec:hover{border-color:var(--ac);transform:translateY(-2px);box-shadow:0 10px 22px -16px rgba(16,32,46,.4);}
.ap-lec-top{display:flex;align-items:center;justify-content:space-between;gap:8px;}
.ap-lec-top .no{font-size:13px;font-weight:800;color:var(--ac);letter-spacing:.03em;}
.ap-lec-top .hrs{font-size:10.6px;color:var(--muted);}

/* 微示意：统一 120×72 视框，描边继承幕色 */
.ap-lec-art{margin:8px 0 10px;color:var(--ac);}
.ap-lec-art svg{width:100%;height:auto;max-height:74px;display:block;fill:none;
  stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;}

.ap-lec h3{margin:0 0 5px;font-size:13.6px;line-height:1.5;color:var(--ink);letter-spacing:-.005em;}
.ap-lec .hook{margin:0;font-size:12.2px;line-height:1.65;color:var(--muted);}
.ap-lec-meta{display:flex;flex-wrap:wrap;gap:5px;margin:9px 0 0;}
.ap-lec-meta .cs{font-size:10.8px;color:var(--ac);background:var(--ac-soft);border-radius:5px;padding:2px 7px;}
.ap-lec-meta .must{font-size:10.8px;color:var(--warn);background:var(--warn-soft);border-radius:5px;padding:2px 7px;}
.ap-lec-xy{margin:9px 0 0;padding-top:8px;border-top:1px dashed var(--line);
  font-size:11.5px;line-height:1.62;color:var(--ink-2);}
.ap-lec-xy i{display:block;font-style:normal;font-size:10.2px;font-weight:700;letter-spacing:.06em;
  color:var(--muted);margin-bottom:2px;}
.ap-lec-go{margin:9px 0 0;font-size:11.8px;color:var(--ac);text-decoration:none;font-weight:600;}
.ap-lec-go:hover{text-decoration:underline;}

/* ---------- 图 3：乡音计划贯穿线 ---------- */
.ap-case{overflow-x:auto;padding-bottom:4px;}
.ap-case ol{display:flex;margin:0;padding:22px 0 0;list-style:none;position:relative;min-width:100%;}
.ap-case ol::before{content:"";position:absolute;left:6px;right:6px;top:11px;height:0;
  border-top:1px dashed var(--line-2);}
.ap-case li{flex:1 0 94px;position:relative;padding:0 8px 0 0;}
.ap-case li .dot{position:absolute;left:0;top:-15px;width:9px;height:9px;border-radius:50%;
  background:var(--ac);border:2px solid var(--white);box-sizing:content-box;}
.ap-case a{display:block;text-decoration:none;color:inherit;}
.ap-case b{display:block;font-size:12.2px;color:var(--ink);margin-bottom:3px;}
.ap-case small{display:block;font-size:11px;line-height:1.56;color:var(--muted);}
.ap-case i{display:block;margin-top:4px;font-style:normal;font-size:10px;color:var(--ac);letter-spacing:.06em;}
.ap-case a:hover b{color:var(--ac);}

/* ---------- 图 4：考核 ---------- */
.ap-assess{margin-top:2px;}
.ap-ar{display:grid;grid-template-columns:82px minmax(0,1fr) 46px minmax(0,1.1fr);gap:10px;
  align-items:center;padding:9px 0;border-bottom:1px dashed var(--line);}
.ap-ar:last-child{border-bottom:0;}
.ap-ar .k{font-size:12.6px;font-weight:700;color:var(--ink);}
.ap-ar .bar{height:7px;border-radius:999px;background:var(--surface);overflow:hidden;}
.ap-ar .bar i{display:block;height:100%;border-radius:999px;background:var(--brand);}
.ap-ar .p{font-size:12.4px;font-weight:700;color:var(--brand);text-align:right;}
.ap-ar .d{font-size:11.8px;color:var(--muted);}
.ap-deliver{display:grid;grid-template-columns:1fr 1fr;gap:7px 18px;margin:16px 0 0;padding:0;list-style:none;}
.ap-deliver li{position:relative;padding-left:20px;font-size:12.4px;line-height:1.66;color:var(--ink-2);}
.ap-deliver li::before{content:"";position:absolute;left:2px;top:6px;width:9px;height:9px;
  border-left:1.8px solid var(--ok);border-bottom:1.8px solid var(--ok);transform:rotate(-45deg);}

/* ---------- 内嵌版（阅读室第 00 讲）：去掉外链与多余留白 ---------- */
.ap-compact .ap-sec:first-child{margin-top:22px;}
.ap-compact .ap-lec-go{display:none;}
.ap-compact{margin-bottom:26px;}

/* ---------- 暗色下卡片底色跟随面板色 ---------- */
[data-theme="dark"] .ap-cell{background:var(--surface);}

/* ---------- 响应式 ---------- */
@media (max-width:900px){
  .ap-lecs{grid-template-columns:repeat(auto-fill,minmax(168px,1fr));}
  .ap-strip{flex-wrap:wrap;}
  .ap-cell{flex:1 1 68px;}
  .ap-deliver{grid-template-columns:1fr;}
}
@media (max-width:640px){
  .ap-kpi span{font-size:11.4px;padding:3px 10px;}
  .ap-sec small{margin-left:0;width:100%;}
  .ap-lecs{grid-template-columns:1fr 1fr;gap:8px;}
  .ap-lec{padding:9px 10px 10px;}
  .ap-lec h3{font-size:12.8px;}
  .ap-lec .hook{font-size:11.4px;}
  .ap-act-want{display:none;}
  .ap-ar{grid-template-columns:70px minmax(0,1fr) 42px;grid-template-areas:"k bar p" "d d d";}
  .ap-ar .k{grid-area:k;} .ap-ar .bar{grid-area:bar;} .ap-ar .p{grid-area:p;} .ap-ar .d{grid-area:d;}
}
@media (max-width:420px){
  .ap-lecs{grid-template-columns:1fr;}
  /* 学时带在手机上改为多行小格：只留讲次号，学时信息交给图例与说明行 */
  .ap-cell{flex:1 1 58px;padding:8px 5px;}
  .ap-cell .n{font-size:12px;}
  .ap-cell .h{display:none;}
}
@media (prefers-reduced-motion:reduce){
  .ap-cell,.ap-lec{transition:none;}
  .ap-cell:hover,.ap-lec:hover{transform:none;}
}
