/* Knowledge map as a mind map: one component, laid out by its own width.
   Branch colours (--map-branch-N, defined with the theme in kaopy.css) only
   tell units apart; they carry no plan or mastery meaning. */
.knowledge-map-overview { container-type: inline-size; min-height: 0; }
body.knowledge-map-printing { --km-print-content-width: 100%; }
.km { --br: var(--map-branch-1); position: relative; display: flex; flex-direction: column; height: 100%; min-height: 0; color: var(--ink); font-size: var(--fs-ui); line-height: 1.5; }
.km-empty { margin: 0; padding: 12px; color: var(--muted); font-size: var(--fs-caption); line-height: 1.55; }
.km-no { margin-right: 6px; color: var(--muted); font-variant-numeric: tabular-nums; }
.km-muted { margin: 0; color: var(--muted); font-size: var(--fs-caption); }
.km-link { padding: 0; border: 0; background: none; color: var(--accent-strong); font: inherit; text-align: left; cursor: pointer; overflow-wrap: anywhere; }
.km-link:hover { text-decoration: underline; }
.km-tag { margin-left: 6px; padding: 0 6px; border: 1px solid var(--border); border-radius: var(--r-pill); color: var(--muted); font-size: var(--fs-caption); white-space: nowrap; }

/* Header: status and coverage, facts only (developer mode); students see only the maximize button. */
.km-head { display: flex; align-items: flex-start; gap: 8px; padding: 10px 12px 8px; border-bottom: 1px solid var(--border); background: var(--surface); font-size: var(--fs-caption); }
.km-head.is-bare { justify-content: flex-end; padding: 0 4px 4px; border-bottom: 0; background: none; }
/* 左栏里放大钮不单占一行：放回左栏标题行（.sidebar-heading，高 48）的右端 */
#leftPanel .km-head.is-bare { position: absolute; top: -38px; right: 10px; z-index: 4; padding: 0; }
.km-head__text { display: grid; flex: 1; gap: 6px; min-width: 0; }
.km-head__actions { display: flex; flex: none; align-items: center; gap: 6px; }
.km-status { display: flex; align-items: center; gap: 6px; margin: 0; color: var(--ink); }
.km-status__dot { flex: none; width: 8px; height: 8px; border-radius: 50%; background: var(--success); }
.km-head[data-map-status="building"] .km-status__dot { background: var(--accent); animation: km-pulse 1.4s infinite; }
.km-head[data-map-status="stale"] .km-status__dot { background: var(--marker); }
@keyframes km-pulse { 50% { opacity: .3; } }
.km-cov { margin: 0; color: var(--muted); }
.km-cov summary { display: inline-flex; align-items: center; gap: 7px; list-style: none; cursor: pointer; }
.km-cov summary::-webkit-details-marker { display: none; }
.km-cov summary::before {
  content: '';
  width: 6px;
  height: 6px;
  flex: none;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  transform: rotate(-45deg);
  transition: transform 150ms ease;
}
.km-cov[open] summary::before { transform: rotate(45deg); }
.km-cov summary:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.km-cov ul { display: grid; gap: 2px; margin: 4px 0 0; padding-left: 18px; }
.km-maximize { display: inline-flex; flex: none; align-items: center; justify-content: center; width: 28px; height: 28px; border: 1px solid transparent; border-radius: var(--r-sm); background: transparent; color: var(--muted); cursor: pointer; }
.km-maximize:hover { background: var(--surface-subtle); color: var(--ink); }

.km-body { position: relative; flex: 1; min-height: 0; }
.km-scroll { height: 100%; overflow: auto; }

/* Nodes shared by both layouts. */
.km-node { position: relative; z-index: 1; border-radius: var(--r-sm); color: var(--ink); font: inherit; line-height: 1.35; text-align: left; cursor: pointer; }
.km-node--root {
  padding: 9px 14px;
  border: 1px solid color-mix(in srgb, var(--accent) 38%, var(--border));
  border-radius: var(--r-md);
  background: var(--accent-soft);
  color: var(--accent-strong);
  font-weight: 700;
}
.km-node--unit { width: 100%; padding: 7px 12px; border: 2px solid var(--br); background: color-mix(in srgb, var(--br) 10%, var(--surface)); font-weight: 600; }
.km-node--root .km-no, .km-node--unit .km-no { color: inherit; opacity: .7; }
.km-subunit { position: relative; z-index: 1; display: flex; align-items: center; gap: 6px; width: 100%; padding: 5px 8px 5px 10px; border: 1px solid var(--border-strong); border-left: 4px solid var(--br); border-radius: var(--r-sm); background: var(--surface); }
.km-subunit::before { content: ''; flex: none; width: 7px; height: 7px; border-radius: 50%; background: var(--muted); }
.km-subunit[data-mastery="learned"]::before { background: var(--success); }
/* 有做错的题不单独标红（人类 10/22）：和学过同一个绿点 */
.km-subunit[data-mastery="weak"]::before { background: var(--success); }
.km-subunit[data-mastery="untouched"]::before { background: var(--border-strong); }
.km-subunit__title { flex: 1; min-width: 0; padding: 1px 0; border: 0; background: none; color: var(--ink); font: inherit; line-height: 1.35; text-align: left; cursor: pointer; }
.km-subunit:hover { background: var(--accent-soft); }
.km-badge { flex: none; padding: 0 7px; border: 1px solid color-mix(in srgb, var(--br) 40%, var(--surface)); border-radius: var(--r-pill); background: color-mix(in srgb, var(--br) 14%, var(--surface)); color: var(--ink); font: inherit; font-size: var(--fs-caption); cursor: pointer; }
.km-points { display: flex; flex-wrap: wrap; gap: 6px; padding: 6px 0 6px 10px; border-left: 2px solid var(--br); }
.km-chip { position: relative; z-index: 1; padding: 1px 10px; border: 1px solid color-mix(in srgb, var(--br) 35%, var(--border)); border-radius: var(--r-pill); background: var(--surface); color: var(--muted); font: inherit; font-size: var(--fs-caption); text-align: left; cursor: pointer; }
.km-chip:hover { background: var(--accent-soft); color: var(--ink); }
/* 重点（t-20261009-htuw mapnode）：计划标了重点的小节和知识点，名字下半部垫黄色荧光笔，字用墨色 600；其余知识点用辅助色 400。
   和左栏计划、计划窗口、阅读层的加粗是同一支笔（plan.css .pt-txt、reading-content.css strong），分支色、编号、掌握圆点都不动。
   浮窗里的标题和目录行也用这一条 */
:is(.km-chip, .km-leaf, .km-pop__row, .km-pop__title).is-key, .km-subunit.is-key .km-subunit__title { color: var(--ink); font-weight: 600; }
:is(.km-chip, .km-leaf, .km-pop__row, .km-pop__title).is-key .km-txt, .km-subunit.is-key .km-txt {
  padding: 0 .08em; background: linear-gradient(transparent 35%, var(--plan-marker) 35%, var(--plan-marker) 93%, transparent 93%);
  -webkit-box-decoration-break: clone; box-decoration-break: clone;
}
:is(.km-chip, .km-leaf).is-key .km-no { color: var(--muted); }
.km-node.is-selected, .km-subunit.is-selected, .km-chip.is-selected, .km-leaf.is-selected { outline: 2px solid var(--accent); outline-offset: 2px; }
/* 指针停着、浮窗看一眼时（is-peek），和浮窗目录行指着的节点（is-hint）：同悬停的淡蓝底 */
:is(.km-chip, .km-leaf).is-peek, :is(.km-chip, .km-leaf).is-hint, .km-subunit:has(.is-peek, .is-hint), .km-tree .km-subunit:has(.is-peek, .is-hint) { background: var(--accent-soft); color: var(--ink); }
:is(.km-node--unit, .km-node--root).is-peek, :is(.km-node--unit, .km-node--root).is-hint { box-shadow: 0 0 0 3px color-mix(in srgb, var(--br, var(--ink)) 22%, transparent); }
.km-node:focus-visible, .km-subunit__title:focus-visible, .km-badge:focus-visible, .km-chip:focus-visible, .km-fold:focus-visible, .km-leaf:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

/* 左栏宽排时的「展开全部 / 收起」（地图窗口里不出现） */
.km-toolbar { display: flex; gap: 6px; padding: 8px 12px 0; }
.km-toolbar button { padding: 1px 12px; border: 1px solid var(--border); border-radius: var(--r-pill); background: var(--surface); color: var(--muted); font: inherit; font-size: var(--fs-caption); font-weight: 600; cursor: pointer; }
.km-toolbar button:hover { background: var(--surface-subtle); color: var(--ink); }
/* Wide: left-to-right map, details slide in from the right. */
.km-grid { position: relative; display: grid; grid-template-columns: 150px 210px 250px minmax(260px, 1fr); align-items: center; column-gap: 44px; row-gap: 10px; padding: 16px 20px 32px; }
.km-cell { min-width: 0; }
.km-cell--root { align-self: center; }
.km-wires { position: absolute; top: 0; left: 0; overflow: visible; pointer-events: none; }
.km-wires path { fill: none; stroke-opacity: .55; }

/* Narrow (the sidebar, the phone drawer): vertical branch tree, details as a bottom sheet.
   每个单元一块分支色描边块（和地图窗口同一个 .km-node--unit），块尾的箭头收起 / 展开小节；
   小节和知识点挂在淡色树线上（和地图窗口的连线同色：分支色 55%），小节行尾的箭头代替「+N」。 */
.km-tree { padding: 12px 12px 28px; }
.km-node--tree-root { display: block; margin: 0 auto 4px; }
.km-branch { --line: color-mix(in srgb, var(--br) 55%, var(--surface)); margin-top: 10px; }
.km-branch__head { position: relative; }
.km-branch__head .km-node--unit { padding-right: 36px; }
.km-fold, .km-tree .km-badge { display: inline-flex; flex: none; align-items: center; justify-content: center; width: 24px; height: 24px; padding: 0; border: 0; border-radius: var(--r-sm); background: none; color: var(--muted); cursor: pointer; }
.km-fold { position: absolute; top: 50%; right: 6px; z-index: 2; transform: translateY(-50%); }
.km-fold:hover, .km-tree .km-badge:hover { color: var(--ink); }
.km-fold svg, .km-tree .km-badge svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; transition: transform 150ms ease; }
.km-fold[aria-expanded="true"] svg, .km-tree .km-badge[aria-expanded="true"] svg { transform: rotate(90deg); }
.km-branch__subunits, .km-branch__points { display: flex; flex-direction: column; margin-left: 16px; padding-left: 16px; }
.km-branch__subunits { padding-top: 2px; }
.km-branch__subunit, .km-leaf { --mid: 14px; position: relative; }
.km-leaf { --mid: 12px; }
/* 每行一段「└」接到首行中间；不是最后一行的，竖线接着往下到下一行 */
.km-branch__subunit::before, .km-leaf::before { content: ''; position: absolute; top: 0; left: -16px; width: 11px; height: calc(var(--mid) + 1px); border-bottom: 1.5px solid var(--line); border-left: 1.5px solid var(--line); border-bottom-left-radius: 6px; }
.km-branch__subunit:not(:last-child)::after, .km-leaf:not(:last-child)::after { content: ''; position: absolute; top: 0; bottom: 0; left: -16px; border-left: 1.5px solid var(--line); }
/* 标题换行时，圆点、箭头和树线都对齐首行 */
.km-tree .km-subunit { align-items: flex-start; min-height: 30px; padding: 3px 0 3px 6px; border: 0; border-radius: var(--r-sm); background: none; }
.km-tree .km-subunit::before { margin-top: 8px; }
.km-tree .km-subunit:hover { background: var(--accent-soft); }
.km-leaf { display: block; width: 100%; min-height: 24px; padding: 3px 6px; border: 0; border-radius: var(--r-sm); background: none; color: var(--muted); font: inherit; font-size: var(--fs-caption); line-height: 1.5; text-align: left; cursor: pointer; }
.km-leaf:hover { background: var(--accent-soft); color: var(--ink); }

/* 节点浮窗（t-20261009-htuw mapnode）：一页「章节扉页」。玻璃底（浮层才用玻璃，同对话里的引用预览），顶边一条分支色；
   系统框架（上级、小标题、页码、计划行）是品牌层无衬线，模型写的名字和介绍是阅读层（标题用阅读层标题字、介绍用宋体正文）。
   有下级的节点（课程、单元、小节）宽 400，编号放大成章号；知识点宽 360，编号跟在名字前。
   位置由 knowledge-map-mindmap.js placePop 写 left / top；手机宽度是底部抽屉（is-sheet）。 */
.km-pop {
  --br: var(--map-branch-1);
  position: fixed; z-index: var(--z-menu); display: none; flex-direction: column; width: 360px; max-width: calc(100vw - 20px); max-height: min(620px, calc(100dvh - 20px));
  overflow: hidden; border: 1px solid var(--border); border-radius: var(--r-md);
  background: color-mix(in srgb, var(--surface) 96%, transparent); -webkit-backdrop-filter: blur(22px) saturate(1.5); backdrop-filter: blur(22px) saturate(1.5);
  box-shadow: var(--shadow-pop); color: var(--ink); font-family: var(--font-sans); font-size: var(--fs-ui); line-height: 1.5; text-align: left;
}
.km-pop::before { content: ''; flex: none; height: 3px; background: var(--br); }
.km-pop.is-open { display: flex; }
.km-pop[data-level="parent"] { width: 400px; }
.km-pop:focus { outline: none; }
.km-pop:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.km-pop.is-entering { animation: km-pop-in 160ms cubic-bezier(.2, .8, .2, 1); }
.km-pop.is-entering[data-side="left"] { animation-name: km-pop-in-left; }
@keyframes km-pop-in { from { opacity: 0; transform: translateX(-6px); } }
@keyframes km-pop-in-left { from { opacity: 0; transform: translateX(6px); } }
.km-pop__scroll { min-height: 0; overflow: auto; padding: 14px 18px 18px; overscroll-behavior: contain; }
/* 关闭：钉住的浮窗和手机抽屉才有；看一眼的浮窗指针离开就收 */
.km-pop__close { position: absolute; top: 9px; right: 9px; z-index: 1; display: grid; place-items: center; width: 28px; height: 28px; padding: 0; border: 0; border-radius: 50%; background: none; color: var(--muted); font: inherit; font-size: 18px; line-height: 1; cursor: pointer; visibility: hidden; }
.km-pop.is-pinned .km-pop__close, .km-pop.is-sheet .km-pop__close { visibility: visible; }
.km-pop__close:hover { background: var(--surface-subtle); color: var(--ink); }
.km-pop__close:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }
.km-pop__head { margin-right: 30px; }
.km-pop__num { margin: 0; color: var(--reading-heading); font-family: 'Kaopy Reading Latin', var(--font-sans); font-size: 30px; font-weight: 600; line-height: 1.15; font-variant-numeric: tabular-nums; }
.km-pop__title { margin: 2px 0 0; color: var(--reading-ink-strong); font-family: 'Kaopy Reading Latin', var(--font-sans); font-size: 19px; font-weight: 600; line-height: 1.45; text-wrap: pretty; }
.km-pop[data-level="point"] .km-pop__title { font-size: 17px; }
.km-pop__title .km-no { margin-right: 8px; color: var(--reading-heading); }
.km-pop__intro { margin: 10px 0 0; padding-top: 10px; border-top: 1px solid var(--reading-rule); color: var(--reading-ink); font-family: var(--reading-book); font-size: 15px; line-height: 1.8; white-space: pre-wrap; overflow-wrap: anywhere; }
.km-pop__sec { margin-top: 16px; }
.km-pop__sec h4 { margin: 0 0 6px; color: var(--faint); font-size: var(--fs-caption); font-weight: 600; }
/* 目录：一行一个下级，像书的目录；点了换到它，指针停上去地图上那个节点亮一下 */
.km-pop__toc { display: grid; gap: 1px; margin: 0; padding: 0; list-style: none; }
.km-pop__toc.is-nested { margin: 0 0 4px 21px; }
.km-pop__row { display: flex; align-items: baseline; width: calc(100% + 12px); margin-left: -6px; padding: 3px 6px; border: 0; border-radius: var(--r-xs); background: none; color: var(--muted); font: inherit; line-height: 1.5; text-align: left; cursor: pointer; }
.km-pop__row:hover, .km-pop__row:focus-visible { background: var(--surface-subtle); color: var(--ink); }
.km-pop__row:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
.km-pop__row .km-no { flex: none; color: var(--faint); }
.km-pop__toc.is-nested .km-pop__row { font-size: var(--fs-caption); }
.km-pop__row.is-unit { color: var(--ink); font-weight: 600; }
.km-pop__row.is-unit::before { content: ''; flex: none; align-self: center; width: 3px; height: 14px; margin-right: 8px; border-radius: 2px; background: var(--br); }
.km-pop__dot { flex: none; align-self: center; width: 7px; height: 7px; margin-right: 8px; border-radius: 50%; background: var(--border-strong); }
.km-pop__dot:is([data-mastery="learned"], [data-mastery="weak"]) { background: var(--success); }
/* 笔记（t-20261021-uvpy）：排在资料上面。已生成是一张小页（笔记同一张阅读层的纸）+ 小节名；没生成是灰色虚线空页带「＋」；生成中空页里转圈 */
.km-note { display: flex; align-items: center; gap: 10px; width: calc(100% + 12px); margin-left: -6px; padding: 4px 6px; border: 0; border-radius: var(--r-xs);
  background: none; color: var(--ink); font: inherit; text-align: left; }
button.km-note { cursor: pointer; }
button.km-note:hover, button.km-note:focus-visible { background: var(--surface-subtle); outline: none; }
button.km-note:hover .km-note__title { color: var(--accent-strong); }
.km-note__page { position: relative; display: grid; flex: none; place-items: center; width: 30px; height: 40px; border: 1px solid var(--border-strong); border-radius: 3px;
  background: var(--reading-paper); box-shadow: inset 0 9px 0 -7px var(--surface), inset 0 10px 0 -7px var(--border), inset 0 16px 0 -13px var(--surface), inset 0 17px 0 -13px var(--border); }
.km-note.is-blank .km-note__page { border-style: dashed; background: var(--surface-subtle); box-shadow: none; color: var(--muted); }
.km-note.is-blank .km-note__page b { font-size: 18px; font-weight: 400; line-height: 1; }
button.km-note.is-blank:hover .km-note__page { border-color: var(--accent); color: var(--accent-strong); }
.km-note.is-blank .km-note__title { color: var(--muted); }
.km-note__title { flex: 1; min-width: 0; }
.km-note__spin { display: block; width: 14px; height: 14px; border: 2px solid var(--border); border-top-color: var(--accent); border-radius: 50%; animation: km-note-spin 900ms linear infinite; }
@keyframes km-note-spin { to { transform: rotate(360deg); } }
.km-note__line { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 6px 0 0; color: var(--marker-ink); font-size: var(--fs-caption); }
.km-note__line.is-failed { color: var(--danger); }
.km-note__retry { padding: 0 8px; border: 1px solid var(--border); border-radius: var(--r-xs); background: var(--surface); color: var(--accent-strong); font: inherit; line-height: 1.7; cursor: pointer; }
.km-note__retry:hover { background: var(--accent-soft); }
.km-note__retry:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }
@media (prefers-reduced-motion: reduce) { .km-note__spin { animation: km-note-spin 1600ms linear infinite !important; } }
/* 在计划里：计划单元的标题照计划写，正在学用左栏「进行中」的淡蓝块 */
.km-pop__plan { display: grid; gap: 2px; margin: 0; padding: 0; list-style: none; }
.km-pop__plan-row { display: flex; align-items: baseline; gap: 8px; width: calc(100% + 12px); margin-left: -6px; padding: 3px 6px; border: 0; border-radius: var(--r-xs); background: none; color: var(--ink); font: inherit; text-align: left; }
button.km-pop__plan-row { cursor: pointer; }
button.km-pop__plan-row:hover { background: var(--surface-subtle); }
button.km-pop__plan-row:hover .km-pop__plan-title { color: var(--accent-strong); }
.km-pop__plan-title { flex: 1; min-width: 0; }
.km-pop__plan-state { flex: none; padding: 0 8px; border-radius: var(--r-pill); background: var(--surface-subtle); color: var(--muted); font-size: var(--fs-caption); }
.km-pop__plan-state.is-current { background: var(--accent-soft); color: var(--accent-strong); }
/* 在资料里：每份资料一行资料名，下面一手牌。每个连续页段的首页是一张 4:3 的卡（课件页的比例），像扑克牌一样从左往右排开、
   每张盖住上一张的大半，整手微微成扇形（中间那张正，两边各转 2.5° 一档、往下沉一点）；左上角写这一段的页码，被盖住时也露在外面。
   卡少时卡面大一点：一张 184、两张 156、三张起 132。整手右移 10px（第一张转过角度、前面的卡让开时不出资料名左缘），卡与卡的间距最多 58px，放不下时按浮窗宽度收紧，右边留出让开的余地。
   白纸只垫在页图自己的范围（canvas 先铺白再画页）：16:9 的课件放进 4:3 卡里，上下空出来的是卡面底色，深色下不出现白条。
   抬起（鼠标移到卡露出来的那一条上是 is-lift，Tab 到是 :focus-visible）：这张转正、上移 10px、放大到 1.04、放到最前，后面的卡往右让开 14px、前面的往左 4px。
   页图是原页渲染的整页（课件 1440×1080 或 1920×1080，书页 1191×1684），取到后按卡宽缩成小图（canvas）：横版整页放进卡里，竖版按卡宽铺满、从页顶起 */
.km-pop__mats { display: grid; gap: 12px; margin: 0; padding: 0; list-style: none; font-size: var(--fs-caption); }
.km-pop__mats li { --card-w: 132px; min-width: 0; }
.km-pop__mats li[data-cards="1"] { --card-w: 184px; }
.km-pop__mats li[data-cards="2"] { --card-w: 156px; }
.km-pop__mat { display: grid; grid-template-columns: 16px minmax(0, 1fr); column-gap: 8px; align-items: center; margin: 0; }
.km-file { width: 16px; height: 16px; fill: none; stroke: var(--muted); stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.km-pop__mat-name { min-width: 0; overflow: hidden; color: var(--ink); text-overflow: ellipsis; white-space: nowrap; }
/* --n（这手几张）、--i（第几张）由 knowledge-map-mindmap.js 写在 style 上 */
.km-hand { --n: 1; position: relative; isolation: isolate; height: calc(var(--card-w) * .75 + 26px); margin-top: 2px; }
.km-hand[hidden] { display: none; }
.km-card {
  --i: 0;
  --mid: calc(var(--i) - (var(--n) - 1) / 2);
  position: absolute; top: 12px; z-index: calc(var(--i) + 1);
  left: calc(10px + min(calc(var(--i) * 58px), calc((100% - var(--card-w) - 28px) * var(--i) / max(var(--n) - 1, 1))));
  width: var(--card-w); aspect-ratio: 4 / 3; padding: 0; overflow: hidden;
  border: 1px solid var(--border-strong); border-radius: 6px; background: var(--surface-subtle);
  box-shadow: var(--shadow-pop); cursor: pointer;
  transform-origin: 50% 100%; rotate: calc(var(--mid) * 2.5deg); translate: 0 calc(var(--mid) * var(--mid) * 1.5px);
  transition: translate 180ms cubic-bezier(.2, .8, .2, 1), rotate 180ms cubic-bezier(.2, .8, .2, 1), scale 180ms cubic-bezier(.2, .8, .2, 1);
}
.km-card canvas { position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: contain; animation: km-card-in 140ms ease-out; }
.km-card.is-tall canvas { object-fit: cover; object-position: top; }
@keyframes km-card-in { from { opacity: 0; } }
.km-card__no { position: absolute; top: 5px; left: 5px; z-index: 1; padding: 0 5px; border-radius: var(--r-xs); background: color-mix(in srgb, var(--surface) 94%, transparent); box-shadow: 0 0 0 1px var(--border); color: var(--ink); font-size: 11px; font-weight: 600; line-height: 18px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.km-card:is(.is-lift, :focus-visible) { z-index: 9; rotate: 0deg; translate: 0 -10px; scale: 1.04; }
.km-card:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.km-card:is(.is-lift, :focus-visible) ~ .km-card { translate: 14px calc(var(--mid) * var(--mid) * 1.5px); }
.km-card:has(~ .km-card:is(.is-lift, :focus-visible)) { translate: -4px calc(var(--mid) * var(--mid) * 1.5px); }
.km-pop__more { display: block; height: 22px; margin-top: -4px; padding: 0; border: 0; background: none; color: var(--muted); font: inherit; cursor: pointer; }
.km-pop__more:hover { color: var(--accent-strong); }
.km-pop__pg { margin: 5px 0 0 24px; padding: 0 6px; border: 1px solid var(--accent-soft); border-radius: var(--r-xs); background: var(--surface); color: var(--accent-strong); font: inherit; line-height: 1.6; cursor: pointer; }
.km-pop__pg:hover { background: var(--accent-soft); }
.km-pop__more:focus-visible, .km-pop__pg:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }
@media (prefers-reduced-motion: reduce) { .km-card { transition: none; } .km-card canvas { animation: none; } }
/* 手机宽度：底部抽屉，盖住地图下半截，上面的节点照样能看到 */
.km-pop.is-sheet { top: auto !important; right: 0; bottom: 0; left: 0 !important; width: auto; max-width: none; max-height: 78dvh; border-width: 1px 0 0; border-radius: var(--r-md) var(--r-md) 0 0; }
.km-pop.is-sheet.is-entering { animation-name: km-sheet-in; animation-duration: 200ms; }
@keyframes km-sheet-in { from { transform: translateY(24px); opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .km-pop.is-entering { animation: none; } }

/* 对话里的知识地图小组件：框是 plan.css 的 .chat-widget（与计划卡同高 152、圆角 20），宽约 320；
   左边分支色的树，右边「知识地图」+ 课程名 + 前三个单元名。 */
.knowledge-map-widget { display: grid; grid-template-columns: 58% minmax(0, 1fr); gap: 12px; width: 320px; max-width: 100%; }
.kmw-art { width: 100%; height: 100%; overflow: visible; }
/* --c 是这一枝的分支色、--dl 是长出来的错开时间，都由 knowledgeMapArt 逐枝写上 */
.kmw-branch { --c: var(--map-branch-1); --dl: 0ms; }
.kmw-br { fill: none; stroke: var(--c); stroke-width: 2; stroke-linecap: round; }
.kmw-nd { fill: var(--c); }
.kmw-root { fill: var(--ink); }
/* 空枝：还没有知识点时同样画法的淡灰枝，没有动画；第一批存下后换成真枝 */
.kmw-branch.is-empty { --c: var(--border-strong); }
.kmw-root.is-empty { fill: var(--border-strong); }
.kmw-branch.is-grow .kmw-br { stroke-dasharray: 1; stroke-dashoffset: 1; animation: kmw-grow 520ms cubic-bezier(.2,.8,.2,1) forwards; animation-delay: var(--dl); }
.kmw-branch.is-grow .kmw-nd { opacity: 0; animation: kmw-node-in 200ms ease forwards; animation-delay: calc(var(--dl) + 380ms); }
.kmw-branch.is-lit .kmw-br { animation: kmw-lit 1200ms ease; }
.kmw-branch.is-lit .kmw-nd.is-new { transform-box: fill-box; transform-origin: center; animation: kmw-pop 1200ms ease; }
@keyframes kmw-grow { to { stroke-dashoffset: 0; } }
@keyframes kmw-node-in { to { opacity: 1; } }
@keyframes kmw-lit { 15%, 65% { stroke-width: 4; } }
@keyframes kmw-pop { 0% { transform: scale(0); } 30%, 65% { transform: scale(1.6); } 100% { transform: scale(1); } }
.kmw-text { display: flex; flex-direction: column; min-width: 0; padding: 2px 0; }
.kmw-text strong { font-size: 15px; font-weight: 600; line-height: 1.4; }
.kmw-course { color: var(--muted); font-size: var(--fs-caption); line-height: 1.5; }
/* 读资料、画地图时的一行状态；存成以后为空、不占位 */
.kmw-status { color: var(--muted); font-size: var(--fs-caption); line-height: 1.5; animation: km-pulse 1.6s ease-in-out infinite; }
.kmw-status:empty { display: none; }
.kmw-progress { --kmw-progress-done: 0%; --kmw-progress-current: 100%; display: grid; gap: 4px; margin-top: 3px; color: var(--muted); font-size: var(--fs-caption); line-height: 1.35; }
.kmw-progress[hidden] { display: none; }
.kmw-progress__track { position: relative; display: block; height: 5px; overflow: hidden; border-radius: 999px; background: var(--border); }
.kmw-progress__done, .kmw-progress__current { position: absolute; inset: 0 auto 0 0; display: block; }
.kmw-progress__done { width: var(--kmw-progress-done); background: var(--accent); }
.kmw-progress__current { left: var(--kmw-progress-done); width: var(--kmw-progress-current); background: linear-gradient(90deg, color-mix(in srgb, var(--accent) 28%, transparent), color-mix(in srgb, var(--accent) 72%, transparent), color-mix(in srgb, var(--accent) 28%, transparent)); background-size: 200% 100%; animation: kmw-progress-scan 1.4s linear infinite; }
@keyframes kmw-progress-scan { to { background-position: -200% 0; } }
.kmw-units { display: -webkit-box; margin-top: auto; overflow: hidden; color: var(--faint); font-size: var(--fs-caption); line-height: 1.5; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
@media (max-width: 767px) { .knowledge-map-widget { grid-template-columns: 46% minmax(0, 1fr); } }
@media (prefers-reduced-motion: reduce) {
  .kmw-branch.is-grow .kmw-br, .kmw-branch.is-grow .kmw-nd, .kmw-branch.is-lit .kmw-br, .kmw-branch.is-lit .kmw-nd { animation: none; stroke-dashoffset: 0; opacity: 1; }
  .kmw-status { animation: none; }
  .kmw-progress__current { animation: none; background: color-mix(in srgb, var(--accent) 48%, transparent); }
}

/* The source a map node points to, highlighted in the material page. */
.material-source-excerpt { margin: 10px 0; }
.material-source-excerpt h4 { margin: 0 0 4px; color: var(--muted); font-size: var(--fs-caption); font-weight: 600; }
.seg-text.is-source-target { border-left: 3px solid var(--accent); background: var(--accent-soft); }

@media (prefers-reduced-motion: reduce) {
  .km-head[data-map-status="building"] .km-status__dot { animation: none; }
}

@media print {
  html, body { margin: 0 !important; overflow: visible !important; background: #fff !important; }
  body.knowledge-map-printing > :not(dialog.knowledge-map-page-overlay) { display: none !important; }
  body.knowledge-map-printing dialog.knowledge-map-page-overlay {
    position: static !important;
    inset: auto !important;
    display: block !important;
    width: var(--km-print-content-width) !important;
    height: auto !important;
    max-width: none !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    background: #fff !important;
    box-sizing: border-box !important;
  }
  body.knowledge-map-printing dialog.knowledge-map-page-overlay::backdrop { background: transparent !important; }
  body.knowledge-map-printing .knowledge-map-page-overlay__panel {
    display: block !important;
    width: var(--km-print-content-width) !important;
    overflow: visible !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: #fff !important;
    box-shadow: none !important;
    animation: none !important;
  }
  body.knowledge-map-printing .knowledge-map-page-overlay__header,
  body.knowledge-map-printing .km-cov,
  body.knowledge-map-printing .km-maximize,
  body.knowledge-map-printing .km-pop { display: none !important; }
  body.knowledge-map-printing .km-badge { visibility: hidden; }
  body.knowledge-map-printing .knowledge-map-page-overlay__body,
  body.knowledge-map-printing .knowledge-map-overview,
  body.knowledge-map-printing .km,
  body.knowledge-map-printing .km-body,
  body.knowledge-map-printing .km-scroll {
    width: var(--km-print-content-width) !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
  }
  body.knowledge-map-printing .km {
    --ink: #172033;
    --muted: #5c667a;
    --faint: #778196;
    --surface: #fff;
    --surface-subtle: #f6f8fb;
    --border: #d8dee9;
    --border-strong: #aeb8c8;
    --accent: #4263eb;
    --accent-soft: #edf1ff;
    --success: #27864d;
    --danger: #c43d4f;
    --marker: #b66a00;
    --map-branch-1: #4263eb;
    --map-branch-2: #7c4dca;
    --map-branch-3: #008b8b;
    --map-branch-4: #b35c00;
    color: #172033 !important;
  }
  body.knowledge-map-printing .km-head {
    box-sizing: border-box;
    padding: 10px 12px 8px;
    border-color: #d8dee9;
    background: #fff;
  }
  body.knowledge-map-printing .km-grid {
    width: auto;
    break-inside: avoid;
    page-break-inside: avoid;
  }
}

/* t-20261027-i1dr b7 气泡和窗口里的建图行：一条细轨，或没生成完的短话加重试；还没存下任何一批时窗口里是淡灰空枝加这一行 */
.km-build { display: flex; align-items: center; gap: 10px; padding: 8px 14px; }
.km-build .map-track { flex: 1; border-radius: 2px; }
.km-build__fail { flex: 1; color: var(--danger); font-size: var(--fs-caption); font-weight: 600; }
.km-buildempty { display: grid; justify-items: center; gap: 14px; padding: 40px 20px 20px; }
.km-buildempty .kmw-art { width: 148px; height: 102px; }
.km-buildempty .km-build { width: min(100%, 260px); padding-inline: 0; }
.knowledge-map-page-overlay .km-buildempty { padding-top: min(18vh, 150px); }
.knowledge-map-page-overlay .km-buildempty .kmw-art { width: 240px; height: 166px; }
.knowledge-map-page-overlay .km-buildempty .km-build { width: min(100%, 320px); }
.km--build-empty { position: relative; }