.opening-graph-panel{margin-top:28px;padding:0;min-width:0;overflow:hidden}
.opening-graph-heading{display:flex;align-items:center;justify-content:space-between;gap:20px}
.opening-graph-heading h2{margin:0 0 8px}
.opening-graph-heading p{margin:0;line-height:1.5}
.opening-graph-controls{flex-wrap:nowrap;gap:6px}
.opening-graph-controls button{padding:.5rem .8rem;min-width:38px}
.opening-graph-legend{display:flex;flex-wrap:wrap;gap:20px;margin:22px 0 14px;font-size:.8rem;color:var(--muted)}
.opening-graph-legend>span{display:inline-flex;align-items:center;gap:7px}
.graph-key{display:inline-block;width:12px;height:12px;border:1.5px solid #476458;border-radius:50%}
.graph-key-white{background:white}.graph-key-black{background:#243b35}.graph-key-merge{border:2px solid #c88b35;background:white}
.opening-graph-viewer{height:clamp(420px,65vh,680px);width:100%;position:relative;overflow:hidden;border:1px solid var(--line);border-radius:10px;background:linear-gradient(180deg,#fcfdfb,#f3f8f0);cursor:grab;touch-action:none}
.opening-graph-viewer.is-dragging{cursor:grabbing}
.opening-graph-viewer:focus-visible{outline:3px solid #d99a31;outline-offset:3px}
.opening-graph-viewer svg{display:block;width:100%;height:100%;user-select:none}
.graph-edge{fill:none;stroke:#91ad9b;stroke-width:1.1;vector-effect:non-scaling-stroke}
.graph-node circle{stroke:#476458;stroke-width:1.25;vector-effect:non-scaling-stroke}
.graph-node.white circle{fill:white}.graph-node.black circle{fill:#243b35;stroke:#243b35}
.graph-node.start circle{fill:#237354;stroke:#237354}
.graph-node.merged circle{stroke:#c88b35;stroke-width:2.5}
.graph-start-label{fill:#476458;font:650 14px system-ui,sans-serif;text-anchor:middle;pointer-events:none}
.opening-graph-scene.has-highlight .graph-node,.opening-graph-scene.has-highlight .graph-edge{opacity:.16}
.opening-graph-scene.has-highlight .is-related{opacity:1}
.opening-graph-scene.has-highlight .graph-edge.is-related{stroke:#237354;stroke-width:1.7}
.opening-graph-help{font-size:.78rem;line-height:1.5;margin:12px 0 0}
@media(max-width:650px){.opening-graph-panel{padding:0}.opening-graph-heading{align-items:flex-start;flex-direction:column;gap:14px}.opening-graph-legend{gap:14px;margin-top:18px}.opening-graph-viewer{height:480px}}