.teaching-trace{--trace-bg:#fff;--trace-soft:#f5f5f7;--trace-ink:var(--text,#202024);--trace-line:var(--border,#d9d9df);--trace-mark:#e6eefb;border:1px solid var(--trace-line);border-radius:12px;margin:28px 0;padding:24px;color:var(--trace-ink);background:var(--trace-bg);font-size:14px;min-width:0}
[data-theme="dark"] .teaching-trace{--trace-bg:#161618;--trace-soft:#222226;--trace-mark:#26384f}
.trace-header>span{font-size:12px;color:var(--muted)}.trace-header h3{font-size:22px;line-height:1.4;margin:9px 0}.trace-header p,.trace-explanation{line-height:1.9;margin:10px 0 20px}
.teaching-trace button,.teaching-trace select{font:inherit;color:inherit}.teaching-trace button{cursor:pointer}.teaching-trace button:disabled{cursor:default;opacity:.5}.teaching-trace :focus-visible{outline:2px solid var(--blue,#1468c5);outline-offset:3px}
.trace-scenario,.trace-value-row,.trace-motion,.trace-network-input,.trace-network-output,.trace-footer{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.trace-scenario{justify-content:space-between;margin:20px 0}.trace-scenario label{display:flex;gap:10px;align-items:center}.trace-scenario select{max-width:100%;border:1px solid var(--trace-line);background:var(--trace-bg);padding:7px;border-radius:5px}
.trace-scenario button,.trace-footer button,.trace-update>button{border:1px solid var(--trace-line);background:transparent;border-radius:6px;padding:8px 12px}.trace-footer{justify-content:space-between;border-top:1px solid var(--trace-line);padding-top:18px;margin-top:22px}
.trace-record{display:flex;gap:7px;flex-wrap:wrap;padding:12px 0 18px}.trace-quantity{display:inline-flex;gap:8px;align-items:center;flex-wrap:wrap;border:1px solid transparent;border-radius:4px;background:transparent;padding:4px 5px;font-size:inherit;max-width:100%}.trace-quantity code{font-size:12px}.trace-record .trace-quantity{flex-direction:column;align-items:flex-start;border-color:var(--trace-line);padding:7px 10px}.trace-quantity strong{font:600 14px ui-monospace,SFMono-Regular,Consolas,monospace}.trace-corresponding{background:var(--trace-mark)!important;box-shadow:inset 0 -2px 0 var(--blue,#1468c5)}
.trace-steps{display:flex;gap:5px;border-block:1px solid var(--trace-line);padding:12px 0;flex-wrap:wrap}.trace-steps button{display:flex;align-items:center;gap:6px;border:0;background:transparent;padding:7px 9px;border-radius:5px;text-align:left;font-size:12px}.trace-steps button span{font-variant-numeric:tabular-nums;color:var(--muted)}.trace-steps .trace-current{background:var(--trace-ink);color:var(--trace-bg)}.trace-current span{color:inherit!important}.trace-status{margin:18px 0 8px;font-size:12px;color:var(--muted)}
.trace-environment{margin:24px 0}.trace-corridor{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px;border-bottom:2px solid var(--trace-ink);padding:10px 0}.trace-corridor>div{display:flex;flex-direction:column;text-align:center;gap:10px;min-width:0}.trace-corridor span{font-size:22px;height:30px}.trace-corridor .trace-exit span{font-size:13px;line-height:30px}.trace-start{font-weight:bold}.trace-arrival{color:var(--blue,#1468c5)}.trace-motion{justify-content:center;margin:18px 0}.teaching-trace figcaption{font-size:12px;line-height:1.8;color:var(--muted);margin-top:10px}
.trace-networks{display:grid;grid-template-columns:1fr;gap:16px}.trace-network{margin:0;padding:16px 12px;border:1px solid var(--trace-line);border-radius:7px;min-width:0}.trace-network header{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:14px}.trace-network header span{font-size:12px;color:var(--muted)}.trace-network svg{display:block;width:100%;max-width:610px;margin:12px auto;height:auto;overflow:visible}.trace-frozen{border-style:dashed}.trace-network-input>span{color:var(--muted);font-size:12px}.trace-network-output{justify-content:flex-end}.trace-edges line{stroke:var(--trace-line);stroke-width:1.4}.trace-edges .trace-selected-edge{stroke:var(--trace-ink);stroke-width:2}.trace-nodes circle{fill:var(--trace-bg);stroke:var(--trace-ink);stroke-width:1.5}.trace-nodes text,.trace-dimensions text{fill:var(--trace-ink);font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:13px}.trace-selected-node circle{stroke-width:2.5}.trace-dimensions text{font-family:inherit;font-size:12px}.trace-weights{margin-top:16px}.trace-weights summary{cursor:pointer}.trace-weight{margin:12px 0}.trace-weight code{font-size:12px;overflow-wrap:anywhere}.trace-weight table{width:auto!important;margin-top:6px!important}.trace-weight td{text-align:right!important;font-family:ui-monospace,monospace;padding:6px 12px!important}.trace-gradient-values{display:flex;gap:20px;flex-wrap:wrap}
.trace-qrow{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:20px 0}.trace-qrow>div{padding:15px;border:1px solid var(--trace-line);display:flex;flex-direction:column;gap:12px;border-radius:6px}.trace-picked{background:var(--trace-mark)}.trace-qrow small{font-size:12px;color:var(--muted);line-height:1.8}.trace-index-path{line-height:2;overflow-wrap:anywhere}.trace-index-path code{white-space:normal}.trace-target-path>div{border:1px dashed var(--trace-line);padding:16px;margin:14px 0;border-radius:6px}.trace-target-path .trace-loss-path{border-style:solid}.trace-target-path p{line-height:1.8;font-size:13px}.trace-value-row{margin:14px 0}.trace-update>p{line-height:1.9}.teaching-trace table{width:100%;border-collapse:collapse;margin:18px 0;font-size:13px}.teaching-trace th,.teaching-trace td{border-bottom:1px solid var(--trace-line);padding:12px 8px;text-align:left;font-variant-numeric:tabular-nums}.trace-update>button{margin:0 6px 12px 0}
.trace-formulas,.trace-code{margin-top:24px;min-width:0}.trace-formulas h4,.trace-code h4{font-size:13px;margin:0 0 12px}.trace-equation{display:flex;align-items:center;flex-wrap:wrap;gap:3px;margin:8px 0;max-width:100%;overflow-x:auto;padding:4px 0}.trace-equation .katex{font-size:1.05em}.trace-equation>span{max-width:100%;overflow-x:auto;padding:4px 0}.trace-equation .trace-quantity{padding:3px;border:0}.trace-code pre{overflow:auto;background:var(--trace-soft);border:1px solid var(--trace-line);border-radius:6px;padding:16px;font-size:12px;line-height:1.9;tab-size:4;max-width:100%;margin:0}.trace-code code{white-space:pre;font-family:ui-monospace,SFMono-Regular,Consolas,monospace}.trace-code-var{color:inherit!important;font:inherit!important;background:transparent;border:0;border-radius:2px;padding:0;line-height:inherit;text-decoration:underline;text-decoration-style:dotted;text-underline-offset:3px}
@media(max-width:650px){.teaching-trace{padding:16px 12px;margin-inline:0}.trace-header h3{font-size:19px}.trace-steps button{flex:1 1 120px}.trace-scenario{align-items:flex-start;flex-direction:column}.trace-record{gap:5px}.trace-record .trace-quantity{padding:6px}.trace-record .trace-quantity code{font-size:11px}.trace-qrow{grid-template-columns:1fr}.trace-network{padding:12px 6px}.trace-network svg{min-width:340px}.trace-network{overflow-x:auto}.trace-target-path>div{padding:12px}.trace-code pre{padding:10px}.teaching-trace th,.teaching-trace td{padding:9px 5px;font-size:12px}}