/* 速查表（t-20261027-i1dr B16）：背包里的整门课速查表。
   考场白纸，一支蓝笔：纸是 --surface，字是墨，蓝笔只画结构（单元条、主题下划线、术语），黄笔只标易错和学生记的重点。
   块型来自 Markdown 语法，大小全用 em：同一份样式在 A4 纸上（--cs-pt 磅，7 / 6.5 / 6）和右栏、手机的单栏阅读里（界面字号）都成立。
   只引用 kaopy.css 的 token；打印文档链接 kaopy.css（浅色）+ 这一份，所以这里不依赖别的样式文件。 */

.cheat-pane.is-on { padding: 14px 14px 28px; }

.cs-frame { display: grid; gap: 8px; min-width: 0; }
/* 刚生成好：纸淡入，180ms（只用于状态变化，减少动态时没有） */
.cs-frame.is-fresh { animation: cs-in 180ms ease-out both; }
@keyframes cs-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
.cs-tools { display: flex; justify-content: flex-end; gap: 4px; min-height: 32px; }
.cs-tool { position: relative; display: grid; place-items: center; width: 32px; height: 32px; padding: 0; border: 1px solid transparent; border-radius: 50%; background: transparent; color: var(--muted); cursor: pointer; transition: background-color 140ms ease, color 140ms ease, border-color 140ms ease, transform 120ms ease; }
.cs-tool:hover { border-color: var(--border); background: var(--surface-subtle); color: var(--accent-strong); }
.cs-tool:active { transform: scale(.92); }
.cs-tool:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
.cs-tool[aria-pressed="true"] { border-color: var(--border); background: var(--accent-soft); color: var(--accent-strong); }
.cs-tool--busy { cursor: default; }
.cs-tool--busy:hover { border-color: transparent; background: transparent; }
.cs-notice { margin: 0; }

/* ---------- 块型：em 为单位，纸上与单栏阅读共用 ---------- */
.cs-doc { --cs-size: var(--fs-ui); color: var(--ink); font: 400 var(--cs-size)/1.6 var(--font-sans); overflow-wrap: anywhere; word-break: normal; }
/* --cs-pt（磅数）由排版时写在每张纸上：7 / 6.5 / 6 */
.cs-doc.is-paper { --cs-pt: 7; --cs-size: calc(var(--cs-pt) * 1pt); line-height: 1.25; }
.cs-doc .cs-b { margin: 0 0 .8em; }
.cs-doc.is-paper .cs-b { margin-bottom: .55em; }

/* 单元条：蓝笔在左边画一道粗线，底是浅蓝 */
.cs-doc .cs-unit { margin: .5em 0 .55em; padding: .22em .5em .22em .6em; border-left: .3em solid var(--accent); background: var(--accent-soft); color: var(--accent-strong); font-size: 1.14em; font-weight: 600; line-height: 1.3; }
.cs-doc.is-paper .cs-unit { margin-top: .35em; margin-bottom: .45em; line-height: 1.22; }
.cs-doc .cs-col > .cs-b:first-child, .cs-doc.cs-measure > .cs-b:first-child { margin-top: 0; }
/* 主题条：墨字加一道蓝笔下划线 */
.cs-doc .cs-topic { margin: .2em 0 .5em; padding-bottom: .14em; border-bottom: .07em solid var(--accent); color: var(--ink); font-size: 1.05em; font-weight: 600; line-height: 1.3; }
.cs-doc.is-paper .cs-topic { margin-bottom: .4em; line-height: 1.22; }
.cs-doc .cs-topic--marks { border-bottom-color: var(--marker); }
/* 术语：段首的 **术语** 蓝笔写，后面接定义 */
.cs-doc .cs-def { font-size: 1em; }
.cs-doc .cs-def > strong:first-child { color: var(--accent-strong); font-weight: 600; }
.cs-doc :is(h4, h5, h6).cs-def { color: var(--accent-strong); font-weight: 600; }
.cs-doc .cs-line > strong, .cs-doc .cs-list strong { font-weight: 600; }
/* 列表项开头的粗体术语也用蓝笔写，和段首的术语一个样子 */
.cs-doc .cs-list li > strong:first-child { color: var(--accent-strong); }
.cs-doc .cs-line code, .cs-doc .cs-list code { font-family: var(--font-mono); font-size: .92em; }
.cs-doc mark { padding: 0 .08em; background: var(--mark-hl); color: inherit; }

/* 列表：步骤的数字蓝笔写，圆点用灰 */
.cs-doc .cs-list { padding: 0 0 0 1.3em; }
.cs-doc .cs-list li { margin: 0; padding: 0; }
.cs-doc .cs-list li::marker { color: var(--muted); }
.cs-doc ol.cs-list li::marker { color: var(--accent-strong); font-weight: 600; font-variant-numeric: tabular-nums; }
.cs-doc .cs-list .cs-list, .cs-doc .cs-list li > p { margin: 0; }

/* 易错框：黄笔涂底，左边一道黄线 */
.cs-doc .cs-pitfall { padding: .32em .55em .32em .6em; border-left: .24em solid var(--marker); background: var(--marker-soft); }
.cs-doc .cs-pitfall > p { margin: 0; }
.cs-doc .cs-pitfall > p + p { margin-top: .25em; }
.cs-doc .cs-pitfall strong { font-weight: 600; }

/* 对比表：三线表，没有竖线 */
.cs-doc .cs-compare { overflow-x: auto; }
.cs-doc.is-paper .cs-compare { overflow: visible; }
.cs-doc .cs-compare table { width: 100%; border-collapse: collapse; font-size: .97em; line-height: 1.3; }
/* 窄栏里自动分列会把短列挤成一个字宽、竖着排：每格至少三个字宽 */
.cs-doc .cs-compare th, .cs-doc .cs-compare td { min-width: 3em; padding: .2em .32em; border-bottom: .05em solid var(--border); text-align: left; vertical-align: top; }
.cs-doc .cs-compare th { border-top: .08em solid var(--ink); border-bottom: .06em solid var(--ink); background: var(--surface-subtle); font-weight: 600; }
.cs-doc .cs-compare tbody tr:last-child td { border-bottom: .08em solid var(--ink); }

/* 公式 */
.cs-doc .cs-math { font-size: 1em; }
.cs-doc .cs-math--inline { display: inline; margin: 0 .1em; }
.cs-doc .cs-math--display { max-width: 100%; margin: .1em 0; overflow-x: auto; text-align: center; }
.cs-doc .katex-display { margin: .2em 0; }
.cs-doc.is-paper .cs-math--display { overflow-x: hidden; }
.cs-doc.is-paper .katex { font-size: 1.04em; }
.cs-doc .cs-formula { margin-bottom: .5em; }
.cs-doc.is-paper .cs-formula { margin-bottom: .4em; }

/* 链接：蓝笔字加一道点线；资料页码缩成上标 */
.cs-doc a.cs-link { border-bottom: .06em dotted color-mix(in srgb, var(--accent) 70%, transparent); color: var(--accent-strong); text-decoration: none; cursor: pointer; }
.cs-doc a.cs-link:hover { background: var(--accent-soft); }
.cs-doc a.cs-link:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }
.cs-doc .cs-link__page { margin-left: .1em; color: var(--faint); font-size: .75em; font-weight: 400; }

/* 图：栏宽的图，图注在下面；单栏阅读里是笔记图同一张卡（带放大） */
.cs-doc .cs-figure { max-width: 100%; }
/* 跨两栏的图盖住它下面那条栏线（栏线是后一栏的左边，画在后一栏之上） */
.cs-doc.is-paper .cs-figure { position: relative; z-index: 1; max-width: none; background: var(--surface); }
.cs-doc .cs-fig__stage .canvas-visual-card { margin: 0; max-width: none; font-size: inherit; }
.cs-doc.is-paper .cs-fig__stage .canvas-visual-card figcaption { display: none; }
.cs-doc.is-paper .cs-fig__stage { max-width: none; }
.cs-doc .cs-fig__cap { margin: .25em 0 0; color: var(--muted); font-size: .85em; line-height: 1.25; }
.cs-doc.is-read .cs-fig__stage .canvas-visual-card { max-width: 100%; }

/* 学生记的重点：黄笔画线，原文涂荧光；批注、出处接在下面 */
.cs-doc .cs-mark { position: relative; display: flex; gap: .5em; padding: .12em 0 .12em .6em; border-left: .22em solid var(--marker); }
.cs-doc .cs-mark.is-page { align-items: flex-start; }
.cs-doc .cs-mark__body { display: grid; flex: 1; gap: .25em; min-width: 0; }
.cs-doc .cs-mark__text { margin: 0; }
.cs-doc .cs-mark__text > mark { background: linear-gradient(transparent 45%, var(--mark-hl) 45%, var(--mark-hl) 92%, transparent 92%); -webkit-box-decoration-break: clone; box-decoration-break: clone; }
.cs-doc .cs-mark__note { margin: 0; color: var(--muted); font-size: .92em; line-height: 1.35; }
.cs-doc .cs-mark__src { display: flex; align-items: center; gap: .4em; min-width: 0; color: var(--faint); font-size: .88em; line-height: 1.3; }
.cs-doc .cs-mark__src > svg { flex: none; width: 1.1em; height: 1.2em; }
.cs-doc.is-paper .cs-mark__src > svg { display: none; }
.cs-doc .cs-mark__name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cs-doc .cs-mark__at { flex: none; color: var(--muted); white-space: nowrap; }
.cs-doc .cs-mark__page { position: relative; flex: none; width: 54px; aspect-ratio: 3 / 4; overflow: hidden; border: 1px solid var(--border); border-radius: var(--r-xs); background: var(--surface); }
.cs-doc .cs-mark__page.is-slide { width: 72px; aspect-ratio: 4 / 3; }
.cs-doc .cs-mark__page > img { width: 100%; height: 100%; object-fit: cover; object-position: top center; }
.cs-doc .cs-mark__page.is-slide > img { object-fit: contain; }
.cs-doc .cs-mark__go { flex: none; align-self: flex-start; display: grid; place-items: center; width: 28px; height: 28px; padding: 0; border: 1px solid transparent; border-radius: 50%; background: transparent; color: var(--muted); cursor: pointer; transition: background-color 140ms ease, color 140ms ease, border-color 140ms ease; }
.cs-doc .cs-mark__go:hover { border-color: var(--border); background: var(--surface-subtle); color: var(--accent-strong); }
.cs-doc .cs-mark__go:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
/* 纸上不占宽：箭头浮在这一条右上角，指到才出来（打印文档里没有） */
.cs-doc.is-paper .cs-mark__go { position: absolute; top: 0; right: 0; width: 2em; height: 2em; background: var(--surface); opacity: 0; transition: opacity 140ms ease; }
.cs-doc.is-paper .cs-mark__go .icon { width: 1.2em; height: 1.2em; }
.cs-doc.is-paper .cs-mark:hover .cs-mark__go, .cs-doc.is-paper .cs-mark__go:focus-visible { opacity: 1; }

/* 没生成 / 生成中 / 没生成出来：和笔记同一张空页，在纸上只占生成内容的位置 */
.cs-doc .cs-blank { padding: 8px 0 12px; }
.cs-frame > .cs-blank { padding-top: 32px; }

/* ---------- 纸：A4 横向，五栏，窗口里一页一页排开 ---------- */
.cs-stack { display: grid; gap: 14px; justify-items: start; min-width: 0; overflow-x: auto; padding: 2px 2px 6px; }
.cs-sheet { position: relative; flex: none; margin-inline: auto; overflow: hidden; border: 1px solid var(--border-strong); border-radius: var(--r-xs); background: var(--surface); }
.cs-page { position: absolute; top: 0; left: 0; box-sizing: border-box; width: 297mm; height: 210mm; padding: 6mm 6mm 9.5mm; overflow: hidden; transform-origin: 0 0; background: var(--surface); }
.cs-cols { display: flex; gap: 2.4mm; height: 194.5mm; }
.cs-col { position: relative; display: flex; flex: 1 1 0; flex-direction: column; min-width: 0; height: 100%; }
.cs-col > * { flex: none; }
.cs-col + .cs-col::before { content: ''; position: absolute; top: 0; bottom: 0; left: -1.2mm; border-left: .2mm solid var(--border); }
.cs-page__foot { position: absolute; right: 6mm; bottom: 3.2mm; left: 6mm; color: var(--faint); font-size: 5pt; line-height: 1; text-align: right; }
/* 量高用的和打印用的隐藏容器 */
.cs-measure { position: fixed; top: 0; left: -10000px; display: flex; flex-direction: column; visibility: hidden; pointer-events: none; }
.cs-offscreen { position: fixed; top: 0; left: -10000px; pointer-events: none; }

/* 打印文档：一页一张纸，不缩放；色块照印 */
.cs-print, html:has(> body.cs-print) { height: auto; background: var(--surface); }
.cs-print .cs-page { position: relative; break-after: page; break-inside: avoid; }
.cs-print .cs-page:last-child { break-after: auto; }
.cs-print .cs-mark__go { display: none; }
.cs-unit, .cs-pitfall, .cs-compare th, .cs-mark mark, .cs-doc mark { -webkit-print-color-adjust: exact; print-color-adjust: exact; }

@media (max-width: 1023px) {
  .cheat-pane.is-on { padding: 10px 12px 28px; }
  .cs-tools { min-height: 40px; }
  .cs-tool { width: 40px; height: 40px; }
  .cs-doc .cs-mark__go { width: 36px; height: 36px; }
}
@media (prefers-reduced-motion: reduce) {
  .cs-frame.is-fresh { animation: none; }
  .cs-tool, .cs-doc .cs-mark__go { transition: none; }
  .cs-tool:active { transform: none; }
}
