/* 第 13 课专用：修片台（排除法看板、案例卡、三个最小复现）。只在 /u/u13/ 里加载。 */

/* ---------------------------------------------------------------- 排除法看板 */
.u13-board { display: grid; gap: 18px 28px; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); }
@media (max-width: 760px) { .u13-board { grid-template-columns: 1fr; } }
.u13-h { font-family: var(--font-sans); font-size: 12.5px; letter-spacing: 0.08em; color: var(--muted); font-weight: 600; margin: 0 0 8px; }
.u13-strip-svg { display: block; width: 100%; max-width: 360px; height: auto; margin: 0 0 6px; }
.u13-strip-svg .u13-rail { stroke: var(--line-2); stroke-width: 1.5; }
.u13-strip-svg .u13-node-bg { fill: var(--card); stroke: var(--line); }
.u13-strip-svg .u13-node.none .u13-node-mark, .u13-strip-svg .u13-node.off .u13-node-mark { opacity: 0.22; }
.u13-strip-svg .u13-node.none .u13-node-t, .u13-strip-svg .u13-node.off .u13-node-t { fill: var(--muted); text-decoration: line-through; }
.u13-strip-svg .u13-node.on .u13-node-bg { stroke: var(--ink); stroke-width: 1.5; }
.u13-strip-svg .u13-node.hot .u13-node-bg { stroke: var(--safelight); stroke-width: 3; }
.u13-strip-svg .u13-node-t { font-size: 10.5px; fill: var(--ink-2); font-family: var(--font-sans); }
.u13-suspects { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line); }
.u13-sus { display: grid; grid-template-columns: 5.2em minmax(0, 1fr) auto; gap: 4px 10px; align-items: baseline; padding: 8px 0; border-bottom: 1px solid var(--line); font-size: 14.5px; line-height: 1.5; }
.u13-sus .stage { font-size: 13px; color: var(--ink-2); }
.u13-sus-tag { font-size: 12.5px; color: var(--muted); white-space: nowrap; font-family: var(--font-mono); letter-spacing: 0; }
.u13-sus.is-cleared .u13-sus-name { text-decoration: line-through; text-decoration-color: var(--muted); color: var(--muted); }
.u13-sus.is-confirmed { background: var(--accent-soft); }
.u13-sus.is-confirmed .u13-sus-tag { color: var(--safelight); font-weight: 600; }
.u13-tally { min-height: 0; margin-top: 12px; }
.u13-tests { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.u13-test { border: 1px solid var(--line); border-radius: 6px; padding: 10px 12px; background: var(--paper); }
.u13-test.is-first { border-style: dashed; }
.u13-test.is-done { background: var(--card); border-color: var(--line-2); }
.u13-test-h { display: flex; gap: 10px; align-items: baseline; }
.u13-test-n { font-family: var(--font-mono); font-size: 12px; color: var(--safelight); white-space: nowrap; letter-spacing: 0.04em; }
.u13-test-t { font-size: 15px; font-weight: 600; line-height: 1.5; }
.u13-test-meta { font-size: 13px; color: var(--muted); margin: 4px 0 6px; }
.u13-test-res { font-size: 14.5px; margin: 4px 0 2px; line-height: 1.6; }
.u13-test-clr { font-size: 13px; color: var(--muted); margin: 0; }
.u13-guess { color: var(--ink-2); }
.u13-q { font-size: 14px; font-weight: 600; margin: 4px 0 6px; }
.u13-guess-row { display: flex; flex-wrap: wrap; gap: 6px; }
.u13-guess-row .lk-btn, .u13-do { min-height: 40px; font-size: 14px; }

/* ---------------------------------------------------------------- 最小复现 */
.chart .u13-frustum { fill: color-mix(in srgb, var(--accent) 12%, transparent); stroke: var(--accent); stroke-width: 1.2; }
.chart .u13-grid { stroke: var(--grid); stroke-width: 1; }
.chart .u13-sphere { fill: color-mix(in srgb, var(--st-7) 18%, transparent); stroke: var(--st-7); stroke-width: 1.5; stroke-dasharray: 5 3; }
.chart .u13-sphere.out { stroke: var(--safelight); fill: color-mix(in srgb, var(--safelight) 12%, transparent); }
.chart .u13-coach { fill: var(--ink); }
.chart .u13-coach.gone { fill: none; stroke: var(--ink); stroke-dasharray: 3 2; }
.chart .u13-cam { fill: var(--ink); }
.chart .u13-view { fill: #b9c7d8; stroke: var(--line-2); }
.chart .u13-court { fill: #c8875c; }
.chart .u13-coach-v { fill: #2b2e36; }
.chart .u13-gone-t { fill: #1b1c1f; }
.chart .u13-cut { stroke: var(--safelight); stroke-width: 2; }

/* ---------------------------------------------------------------- 案例卡 */
.fixcard { margin: 44px 0 14px; padding: 0 0 6px; border-top: 3px solid var(--ink); }
.fixcard-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; padding: 12px 0 4px; }
.fixcard-no { font-family: var(--font-mono); font-size: 12.5px; letter-spacing: 0.1em; color: var(--safelight); }
.fixcard-title { font-family: var(--font-serif); font-weight: 600; font-size: 21px; line-height: 1.45; margin: 0; }
.fixcard-where { font-size: 14px; color: var(--muted); }
.fixcard .quote { font-size: 15.5px; border-left: 2px solid var(--line-2); padding: 2px 0 2px 12px; color: var(--ink-2); margin: 8px 0 14px; }
.fixcard .step { display: block; font-family: var(--font-mono); font-size: 12px; letter-spacing: 0.12em; color: var(--muted); margin: 22px 0 6px; }
.fixcard details.then { margin: 16px 0 8px; border: 1px solid var(--line); border-radius: 6px; background: var(--card); }
.fixcard details.then > summary { min-height: 44px; display: flex; align-items: center; padding: 0 16px; cursor: pointer; font-weight: 600; }
.fixcard details.then > div { padding: 0 16px 10px; }
.fixcard details.then figure { margin: 10px 0 12px; }

/* 两张并排的真帧 */
.u13-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.u13-pair > div { min-width: 0; }
.u13-pair img { display: block; width: 100%; height: auto; background: var(--paper-2); }
.u13-pair .cap { font-family: var(--font-mono); font-size: 12px; color: var(--muted); margin-top: 4px; letter-spacing: 0; }
@media (max-width: 480px) { .u13-pair { grid-template-columns: 1fr; } }

/* 预测门里的八环选项：排成两行小方块（lk 把每个选项渲成 .lk-predict-opt 按钮） */
[data-lk="predict"].stagepick .lk-predict-opts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
[data-lk="predict"].stagepick .lk-predict-opt { min-height: 44px; padding: 8px 10px; text-align: left; }
@media (max-width: 520px) { [data-lk="predict"].stagepick .lk-predict-opts { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
[data-lk="predict"].stagepick.four-opt .lk-predict-opts { grid-template-columns: 1fr; }


/* 指令四要素 */
.four { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; margin: 12px 0 18px; border-top: 1px solid var(--ink); }
.four > div { padding: 10px 12px 10px 0; border-bottom: 1px solid var(--line); border-top: 3px solid var(--c, transparent); margin-top: -2px; }
.four > div:nth-child(1) { --c: var(--st-5); } .four > div:nth-child(2) { --c: var(--st-1); } .four > div:nth-child(3) { --c: var(--st-4); } .four > div:nth-child(4) { --c: var(--st-6); }
.four b { display: block; font-family: var(--font-serif); font-size: 16px; }
.four span { font-size: 13.5px; color: var(--muted); line-height: 1.55; display: block; margin-top: 2px; }
@media (max-width: 640px) { .four { grid-template-columns: 1fr 1fr; } }
.instr { font-size: 15.5px; background: var(--paper-2); border-left: 2px solid var(--ink); padding: 10px 14px; margin: 6px 0 16px; }
.instr .k { font-family: var(--font-mono); font-size: 11.5px; letter-spacing: 0.08em; color: var(--muted); display: block; margin-bottom: 2px; }
.instr mark { background: none; padding: 0; border-bottom: 2px solid var(--c, var(--accent)); color: inherit; }
.instr mark.m1 { --c: var(--st-5); } .instr mark.m2 { --c: var(--st-1); } .instr mark.m3 { --c: var(--st-4); } .instr mark.m4 { --c: var(--st-6); }

.honesty-lite { font-size: 14px; color: var(--muted); margin: 6px 0 14px; }

/* ---------------------------------------------------------------- 复现 C-5：逐帧碰撞检查（labs/u14-collide.js） */
.cl-host { background: var(--paper-2); border-radius: 4px; }
.chart.cl-svg { touch-action: pan-y; }
.chart .cl-part { fill: color-mix(in srgb, var(--ink) 12%, var(--card)); stroke: var(--ink-2); stroke-width: 1.2; stroke-linejoin: round; }
.chart .cl-part.is-hit { fill: color-mix(in srgb, var(--safelight) 26%, var(--card)); stroke: var(--safelight); stroke-width: 2; }
.chart .cl-pack { fill: color-mix(in srgb, var(--ink) 22%, var(--card)); stroke: var(--ink-2); stroke-width: 1; }
.chart .cl-wing { fill: var(--st-6); stroke: color-mix(in srgb, var(--st-6) 60%, var(--ink)); stroke-width: 1; }
.chart .cl-wing.is-hit { stroke: var(--safelight); stroke-width: 2; }
.chart .cl-box { fill: none; stroke: var(--muted); stroke-width: 1; stroke-dasharray: 3 3; opacity: 0.55; }
.chart .cl-box.is-on { stroke: var(--accent); opacity: 1; }
.chart .cl-box-wing { stroke: var(--st-6); opacity: 0.8; }
.chart .cl-trail { fill: none; stroke: var(--st-6); stroke-width: 1.4; stroke-dasharray: 2 4; opacity: 0.7; }
.chart .cl-t { font-size: 12px; paint-order: stroke; stroke: var(--paper-2); stroke-width: 3px; stroke-linejoin: round; }
.chart .cl-track { fill: var(--paper-2); stroke: var(--line-2); stroke-width: 1; }
.chart .cl-hitbar { fill: var(--safelight); }
.chart .cl-sample { fill: var(--muted); }
.chart .cl-sample.is-hit { fill: var(--safelight); }
.chart .cl-cursor { stroke: var(--ink); stroke-width: 2; }
.chart.cl-tl { cursor: pointer; touch-action: none; margin-top: 6px; }

/* 案例卡里的实验台：宽屏时和正文外的 .wide 一样伸到 960 */
@media (min-width: 1000px) {
  .fixcard > .bench.wide { margin-left: calc((var(--measure) - var(--wide)) / 2); margin-right: calc((var(--measure) - var(--wide)) / 2); }
}

/* ---------------------------------------------------------------- 复现 C-5：配乐的最后 30 秒（第 15 课） */
.chart .au-box { fill: var(--paper-2); stroke: var(--line); stroke-width: 1; }
.chart .au-frame { fill: none; stroke: var(--line-2); stroke-width: 1; }
.chart .au-tick { stroke: var(--line-2); stroke-width: 1; }
.chart .au-curve { fill: none; stroke: var(--chart-b); stroke-width: 1.6; stroke-linejoin: round; }
.chart .au-heard { fill: color-mix(in srgb, var(--accent) 16%, transparent); }
.chart .au-mark { stroke: var(--safelight); stroke-width: 1.2; stroke-dasharray: 3 3; }
.chart .au-zoomwin { fill: none; stroke: var(--ink); stroke-width: 1.5; }
.chart .au-asr { fill: var(--safelight); }
.chart .au-spec { image-rendering: pixelated; }