/* Detailed graph traces, with readable local and shared state. */
.dfs-workspace{display:grid;grid-template-columns:minmax(0,1fr) 265px;align-items:start}.dfs-workspace>*{min-width:0}.dfs-stack-panel{padding:18px;border-left:1px solid #dbe4f0;background:#f7fafc}.dfs-stack-panel h4{margin:0;font-size:17px}.dfs-stack-panel>p{font-size:12px;color:#46536b;line-height:1.5;margin:8px 0 15px}.dfs-frame{padding:12px;margin:10px 0;border:1px solid #c6d6e3;border-radius:9px;background:white}.dfs-frame.top{border:2px solid #0b7285;background:#eaf7f7}.dfs-frame.waiting{background:#f1f4f8}.dfs-frame>strong{display:block;color:#0b7285;font:600 14px "IBM Plex Mono",monospace}.dfs-frame>span{display:block;margin:5px 0;font-size:12px;color:#46536b}.dfs-frame dl{display:grid;grid-template-columns:1fr 1fr;gap:5px;margin:9px 0 0;font-size:12px}.dfs-frame dt{color:#46536b}.dfs-frame dd{margin:0;font-family:"IBM Plex Mono",monospace}.stack-base{border-top:3px solid #101c33;padding:8px;text-align:center;font:11px "IBM Plex Mono",monospace;letter-spacing:.08em}.dfs-empty{padding:20px 0;color:#46536b;font-size:14px}.trace-code{margin:16px;border:1px solid #263954;border-radius:9px;overflow:hidden;background:#101c33;color:#edf4ff;font:13px/1.7 "IBM Plex Mono",monospace}.trace-code>div{padding:9px 12px;display:flex;gap:12px;border-left:3px solid transparent}.trace-code b{color:#9faec5;flex:0 0 16px}.trace-code .active{background:#234953;border-left-color:#60c7cc}.structure-strip{flex-wrap:wrap}.trace-table{margin:16px 18px}.trace-table table{width:100%}.trace-table caption{text-align:left;padding:8px 0;font-size:13px;color:#46536b}.trace-slider{display:block;width:calc(100% - 36px);margin:4px 18px 18px;height:24px;accent-color:#0b7285}.controls button:disabled{opacity:.45;cursor:not-allowed}.controls button:focus-visible,.trace-slider:focus-visible{outline:3px solid #d99b32;outline-offset:3px}.lab-readout{grid-template-columns:1fr}.controls{justify-content:flex-start}.controls button,.controls select{min-height:42px}.lab-message{line-height:1.6}.lab-head{flex-wrap:wrap}.dfs-workspace .lab-stage{min-height:370px}.dfs-workspace canvas{height:340px}
@media(max-width:1100px){.dfs-workspace{grid-template-columns:1fr}.dfs-stack-panel{border-left:0;border-top:1px solid #dbe4f0}#dfs-call-stack{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:10px;align-items:start}.dfs-frame{margin:0}.trace-code{font-size:12px}}
@media(max-width:600px){.trace-table{margin:12px 10px}.trace-table th,.trace-table td{padding:8px}.lab-head,.lab-readout,.dfs-stack-panel{padding:14px}.structure-strip{padding:10px 14px}.trace-code{margin:12px}.lab-stage{padding:8px}.dfs-frame dl{grid-template-columns:1fr 1.2fr}}
@media print{.trace-slider{display:none}.dfs-frame{break-inside:avoid}}
.dfs-frame{padding:10px;margin:8px 0}.dfs-frame dl{font-size:11px;line-height:1.4;gap:4px;grid-template-columns:84px minmax(0,1fr)}.dfs-frame>span{margin:4px 0;font-size:11px}.dfs-stack-panel>p{margin:6px 0 10px}.dfs-stack-panel{padding:14px}#dfs-call-stack{max-height:610px;overflow-y:auto;padding:2px}.dfs-adjacency-reference{padding:12px 18px;border-top:1px solid #dbe4f0;font-size:13px}.dfs-adjacency-reference summary{cursor:pointer;color:#0b7285;font-weight:600}.dfs-adjacency-reference .trace-table{margin:10px 0}.dfs-stack-panel h4{font-size:16px}
@media(max-width:1100px){#dfs-call-stack{display:flex;flex-direction:column;gap:8px}.dfs-frame{margin:0;width:100%}.dfs-frame dl{grid-template-columns:1fr 1.5fr}}
/* Teaching hierarchy: concept, procedure, trace, interpretation. */
.chapter-learning-path{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:26px 0 18px}.chapter-learning-path a{padding:18px;border:1px solid #cbdfe6;border-radius:10px;background:#fff;display:flex;flex-direction:column;gap:8px;text-decoration:none}.chapter-learning-path a:hover{background:#edf7f9;border-color:#0b7285}.chapter-learning-path span{color:#0b7285;font:600 11px "IBM Plex Mono",monospace;text-transform:uppercase;letter-spacing:.06em}.chapter-learning-path strong{font:600 17px/1.4 "Space Grotesk",sans-serif;color:#101c33}.chapter-learning-path small{color:#46536b;font-size:13px}.chapter-conventions{font-size:14px;color:#46536b;padding:16px 0;border-top:1px solid #dbe4f0;border-bottom:1px solid #dbe4f0;line-height:1.8}.lesson-lead{font-size:18px;line-height:1.75;color:#243954}.lesson-steps{padding-left:24px;margin:18px 0 24px}.lesson-steps li{margin-bottom:12px;padding-left:6px}.trace-guidance{padding:14px 20px;background:#f1f7fa;border-bottom:1px solid #dbe4f0}.trace-guidance strong{font-size:13px;color:#085a68}.trace-guidance p{font-size:14px;color:#46536b;line-height:1.65;margin:5px 0 0;max-width:80ch}.implementation{border:1px solid #dbe4f0;border-radius:9px;margin:22px 0;background:#fff}.implementation summary{padding:14px 18px;font-weight:600;color:#085a68;cursor:pointer}.implementation pre{margin:0;border-radius:0 0 9px 9px}.concept-list{margin:20px 0;border-top:1px solid #dbe4f0}.concept-list>div{display:grid;grid-template-columns:180px minmax(0,1fr);gap:20px;padding:16px 0;border-bottom:1px solid #dbe4f0}.concept-list dt{font-weight:600;color:#101c33}.concept-list dd{margin:0;color:#46536b;line-height:1.7}.chapter-review{margin:44px 0;padding:24px;background:#edf6f8;border:1px solid #c7dfe5;border-radius:12px}.chapter-review h2{margin:8px 0 20px;font-size:24px}.chapter-review p{margin:16px 0 0;font-size:15px;line-height:1.7}.chapter-body>.chapter-section{margin-top:48px}.chapter-section>h2{letter-spacing:-.02em}
@media(max-width:700px){.chapter-learning-path{grid-template-columns:1fr}.chapter-learning-path a{padding:14px}.concept-list>div{grid-template-columns:1fr;gap:6px}.lesson-lead{font-size:16px}.chapter-review{padding:16px}.trace-guidance{padding:14px}}
@media print{.chapter-learning-path{display:none}.trace-guidance{break-inside:avoid}.chapter-review{background:white}}
/* Articulation-point DFS explorer. */
.ap-toolbar{display:flex;align-items:center;gap:12px;padding:16px 18px;border-bottom:1px solid #dbe4f0;flex-wrap:wrap}.ap-toolbar label{font-weight:600;font-size:14px}.ap-toolbar select{font:inherit;font-size:14px;padding:10px;border:1px solid #b7ccd6;border-radius:7px;background:white;max-width:100%;min-width:0}.ap-legend{display:flex;gap:8px 18px;flex-wrap:wrap;padding:12px 18px;font-size:12px;color:#46536b}.ap-legend span:nth-child(1){color:#087b80}.ap-legend span:nth-child(2){color:#7450b6}.ap-legend span:nth-child(3){color:#925600}.ap-legend span:nth-child(4){color:#ad3434}.ap-workspace{display:grid;grid-template-columns:minmax(0,1fr) 190px;border-block:1px solid #dbe4f0}.ap-graph-scroll{overflow-x:auto;min-width:0;background:#f7fafc;align-self:center}.ap-graph-scroll svg{display:block;width:100%;min-width:480px}.ap-graph-scroll line{stroke-width:2;stroke:#c7d4df}.ap-graph-scroll .tree-edge{stroke:#0b8588;stroke-width:3}.ap-graph-scroll .back-edge{stroke:#8155ba;stroke-width:3;stroke-dasharray:7 5}.ap-graph-scroll .examined{stroke:#c07811;stroke-width:4}.ap-node rect{fill:white;stroke:#b7cbd8;stroke-width:1.5}.ap-node.current rect{fill:#fff3da;stroke:#c07811;stroke-width:3}.ap-node.changed rect{fill:#e2f4ef}.ap-node.cut rect{stroke:#b73939;stroke-width:3}.ap-node text{text-anchor:middle;fill:#17314b;font-family:"IBM Plex Mono",monospace}.ap-node-name{font-weight:600;font-size:16px}.ap-node-values{font-size:12px}.ap-state{padding:14px;border-left:1px solid #dbe4f0;background:#f3f7fa}.ap-state h4{margin:0 0 12px;font-size:14px}.ap-state h4 small{display:block;font-weight:400;color:#46536b;margin-top:5px}.ap-frame{padding:10px;margin-bottom:8px;border:1px solid #c4d4df;border-radius:8px;background:#fff}.ap-frame.top{background:#e7f5f5;border-color:#0b8588}.ap-frame strong{font:600 13px "IBM Plex Mono",monospace;color:#085a68}.ap-frame span{display:block;font:11px/1.7 "IBM Plex Mono",monospace;color:#46536b}.ap-state>p,.ap-empty{font-size:12px;color:#46536b}.ap-stack-base{border-top:2px solid #17314b;padding:7px 0;font:10px "IBM Plex Mono",monospace;text-align:center}.ap-decision{padding:18px 20px;background:#edf7f8;border-bottom:1px solid #bedbe1}.ap-decision>span{display:block;text-transform:uppercase;letter-spacing:.09em;font:600 11px "IBM Plex Mono",monospace;color:#0b7285;margin-bottom:8px}.ap-decision>strong{display:block;font:600 17px/1.6 "IBM Plex Mono",monospace;color:#143c4c;overflow-wrap:anywhere}.ap-decision p{font-size:14px;line-height:1.7;margin:8px 0 0!important}.ap-reference{padding:14px 18px;border-top:1px solid #dbe4f0}.ap-reference summary{font-weight:600;font-size:14px;color:#0b7285;cursor:pointer}.ap-value-changed{background:#e2f4ef}.ap-scroll-hint{display:none}#lowlink-stack{max-height:430px;overflow-y:auto}#lowlink-lab .trace-slider{margin-top:14px}
@media(max-width:1000px){.ap-workspace{grid-template-columns:1fr}.ap-state{border-left:0;border-top:1px solid #dbe4f0}#lowlink-stack{display:flex;flex-wrap:wrap;gap:8px}.ap-frame{flex:1 1 135px;margin:0}.ap-state h4 small{display:inline;margin-left:7px}.ap-scroll-hint{display:block;font-size:12px;color:#46536b;padding:0 16px}.ap-decision>strong{font-size:14px}.ap-toolbar select{width:100%}}
@media print{.ap-toolbar,.ap-scroll-hint{display:none}.ap-graph-scroll svg{min-width:0}}
/* Consistent, readable playback across every graph demonstration. */
.lab{isolation:isolate}.lab-message{min-height:3.2em}.controls{gap:8px;flex-wrap:wrap}.controls select{max-width:100%;font:inherit;font-size:13px;border:1px solid #b7ccd6;border-radius:7px;padding:8px;background:#fff}.trace-slider{cursor:pointer}.trace-slider:disabled{opacity:.4;cursor:default}.lab-stage:has(#stack-canvas){overflow-x:auto}#stack-canvas{min-width:650px}#cycle-stack{padding:0 0 14px}.lab canvas{display:block}.quiz-option:focus-visible,.repr-tabs button:focus-visible{outline:3px solid #d99b32;outline-offset:3px}
@media(prefers-reduced-motion:reduce){.lab *{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
#topo-structure{display:block}.trace-state-row{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:8px 0}.trace-state-row+ .trace-state-row{border-top:1px solid #dbe4f0}.trace-state-row>strong{flex:0 0 100%;font-size:12px;color:#46536b}.dense-scroll-hint{display:none}@media(max-width:700px){.dense-scroll-hint{display:block;padding:0 14px;font-size:12px;color:#46536b}}
.lab [hidden]{display:none!important}
/* Restrained palette and one readout surface, without nested accent bars. */
.chapter-interaction-polish .lab{background:#fff;border-color:#cbdbe4;box-shadow:0 6px 20px rgb(20 49 75 / 5%)}.chapter-interaction-polish .lab::before{background:#0b7285;height:3px}.chapter-interaction-polish .lab .lab-readout{background:#f5f9fb;border-left:0;box-shadow:none}.chapter-interaction-polish .lab .lab-message{background:transparent;border-left:0;padding:0;box-shadow:none;font-size:15px}.chapter-interaction-polish .lab .status{color:#085a68;background:#edf7f8;border-color:#c4dde2}.chapter-interaction-polish .lab button.primary{background:#0b7285;border-color:#0b7285;box-shadow:none}.chapter-interaction-polish .lab button.primary:hover{background:#085a68}.chapter-interaction-polish .lab .chip{box-shadow:none;border-radius:7px}.chapter-interaction-polish .lab .lab-stage{background-image:linear-gradient(#eaf0f4 1px,transparent 1px),linear-gradient(90deg,#eaf0f4 1px,transparent 1px);background-size:32px 32px}
.chapter-interaction-polish .lab{--ip-accent:#0b7285;--ip-accent-2:#096578;--ip-soft:#f0f8f9;--ip-border:#c4dde2}.chapter-interaction-polish .lab .lab-readout{border-left:0!important;background:#f5f9fb!important}.chapter-interaction-polish .lab .lab-message{border-left:0!important;background:transparent!important}
