.column-graph{grid-row:2 / 5;grid-column:1;display:flex;flex-direction:column;min-height:420px;flex:1;overflow:hidden;background:#fafcfb}.column-graph[hidden]{display:none}.graph-toolbar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:14px 20px;background:#fff;border-bottom:1px solid var(--line,#d8e2de)}.graph-toolbar h2{font-size:18px;margin:0 12px 0 0}.graph-toolbar label{display:flex;align-items:center;gap:5px;font-size:13px}.graph-toolbar small{color:#677b73}.graph-main{display:flex;min-height:360px;flex:1;position:relative}.graph-sidebar{width:205px;flex-shrink:0;padding:14px;border-right:1px solid #d8e2de;background:#fff;overflow:auto}.graph-sidebar input{width:100%;padding:10px;border:1px solid #c6d6ce;border-radius:8px;margin-bottom:10px}.graph-sidebar nav{display:grid;gap:4px}.graph-sidebar button{text-align:left;border:0;background:transparent;border-radius:6px;padding:9px;color:#3e5e52;overflow-wrap:anywhere}.graph-sidebar button:hover,.graph-sidebar button.selected{background:#e4f1ec}.list-collapsed .graph-sidebar{display:none}.graph-canvas{position:relative;flex:1;min-width:0;min-height:400px}.graph-canvas svg{width:100%;height:100%;position:absolute;inset:0;touch-action:none;background-image:radial-gradient(#dbe5df 1px,transparent 1px);background-size:20px 20px}.graph-canvas svg:focus-visible{outline:2px solid #267b67;outline-offset:-3px}.graph-node{cursor:pointer}.graph-node rect{fill:#fff;stroke:#b9cfc5;stroke-width:1.5}.graph-node:hover rect,.graph-node:focus rect,.graph-node.selected rect{stroke:#18715e;stroke-width:2.5}.graph-node.dim{opacity:.45}.graph-node.affected rect{stroke:#a67425;stroke-width:3;stroke-dasharray:5 3}.graph-node text{pointer-events:none;fill:#263e34}.graph-node-name{font-size:16px;font-weight:600}.graph-node .graph-node-type,.graph-node .graph-node-meta{font-size:12px;fill:#74877d}.graph-node:focus{outline:none}.graph-edge{cursor:pointer}.graph-edge-line{fill:none;stroke:#9aada3;stroke-width:1.8}.graph-edge-hit{fill:none;stroke:transparent;stroke-width:16}.graph-edge.document-edge .graph-edge-line{stroke-dasharray:5 5}.graph-edge.related .graph-edge-line,.graph-edge:hover .graph-edge-line,.graph-edge:focus .graph-edge-line{stroke:#18715e;stroke-width:3}.graph-edge:focus{outline:none}#graph-arrow path{fill:#7d9a8a}.graph-footer{display:flex;justify-content:space-between;gap:12px;padding:10px 20px;border-top:1px solid #d8e2de;color:#708279;font-size:12px;flex-wrap:wrap}#graph-impact{margin:0;padding:10px 20px;background:#fff4dc;color:#795419;font-size:13px}#graph-empty{position:absolute;left:24px;top:24px;color:#73867b;pointer-events:none}.graph-legend{margin-left:auto}#column-impact-preview{margin-bottom:16px}@media(max-width:760px){.graph-toolbar{padding:10px;gap:6px}.graph-toolbar h2{width:100%}.graph-sidebar{width:145px;padding:8px}.graph-toolbar .button{padding:7px;font-size:12px}.graph-footer{padding:10px}.graph-canvas{min-height:430px}.graph-legend{margin-left:0}.graph-sidebar button{font-size:12px}.column-graph{min-height:640px}}

.column-graph{min-width:0;overflow:clip}.graph-view,.graph-view .workspace,.graph-main,.graph-canvas{overflow:clip}.mobile-graph-entry{display:none}@media(max-width:820px){.mobile-graph-entry{display:inline-flex}}
.graph-view .workspace{grid-template-columns:minmax(0,1fr)}
.graph-canvas svg, .graph-canvas svg * { user-select: none; -webkit-user-select: none; }

.graph-toolbar .button { font-size: 14px; line-height: 1.4; min-height: 38px; padding: 8px 12px; }
.graph-toolbar small, .graph-toolbar label { font-size: 14px; }
.graph-toolbar [data-graph-action="in"], .graph-toolbar [data-graph-action="out"] { min-width: 38px; font-size: 18px; padding: 5px 10px; }
.graph-edge-line { stroke-linecap: round; stroke-linejoin: round; marker-end: url(#graph-arrow); }
.graph-edge.related .graph-edge-line, .graph-edge:hover .graph-edge-line, .graph-edge:focus .graph-edge-line { stroke-width: 2.4; marker-end: url(#graph-arrow-active); }
#graph-arrow-active path { fill: #18715e; }
.graph-edge.chosen .graph-edge-line { stroke: #18715e; stroke-width: 2.4; marker-end: url(#graph-arrow-active); }
#graph-arrow path { fill: #9aada3; }
.graph-edge-settings { position: absolute; z-index: 2; top: 12px; right: 12px; width: min(300px, calc(100% - 24px)); padding: 14px; border: 1px solid #b9cfc5; border-radius: 10px; background: #fff; box-shadow: 0 4px 18px rgb(16 44 40 / 12%); }
.graph-edge-settings[hidden] { display: none; }
.graph-edge-settings header { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-size: 14px; }
.graph-edge-settings .icon-button { width: 30px; height: 30px; min-height: 30px; font-size: 20px; }
.graph-edge-settings p { margin: 8px 0 12px; font-size: 13px; color: #536c61; overflow-wrap: anywhere; }
.graph-edge-settings select { width: 100%; padding: 9px 10px; border: 1px solid #b9cfc5; border-radius: 6px; background: #fff; color: #263e34; font: inherit; font-size: 14px; }

.graph-edge-settings{right:auto;max-height:calc(100% - 16px);overflow:auto}
.graph-alignment-guides{pointer-events:none}
.graph-alignment-guides line{stroke:#b76075;stroke-width:1;stroke-dasharray:5 3;vector-effect:non-scaling-stroke}

.graph-port-handle{cursor:grab;outline:none}.graph-port-hit{fill:transparent;stroke:none;pointer-events:all}.graph-port-dot{fill:#fff;stroke:#176b59;stroke-width:2;vector-effect:non-scaling-stroke;pointer-events:none;opacity:0}.graph-port-handle:hover .graph-port-dot,.graph-port-handle:focus .graph-port-dot,.graph-port-handle.selected .graph-port-dot{opacity:1}.graph-port-handle:active{cursor:grabbing}.graph-edge{cursor:grab}
.graph-port-target{fill:#e0f3ea;stroke:#176b59;stroke-width:1.5;vector-effect:non-scaling-stroke;pointer-events:none}
.graph-port-target.near{fill:#176b59}
.graph-port-controls{display:flex;gap:12px;margin-top:12px}.graph-port-controls label{flex:1;font-size:14px}
.graph-edge-settings .graph-port-help{font-size:12px;margin-bottom:0}

.graph-materials{width:330px;max-width:40vw;flex-shrink:0;overflow:auto;max-height:calc(100vh - 250px);padding:16px;background:#fff;border-right:1px solid #d8e2de;font-size:14px}
.graph-materials[hidden]{display:none}.graph-materials header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
.graph-materials input,.graph-materials select{width:100%;padding:10px;margin-bottom:10px;border:1px solid #c6d6ce;border-radius:8px;font:inherit;background:#fff}
.graph-record-pages{display:flex;gap:10px;align-items:center;justify-content:space-between}.graph-record-pages button{border:1px solid #c6d6ce;background:#fff;border-radius:6px;padding:4px 12px;font-size:20px}
.graph-material-group,.graph-input-summary{margin-top:14px;padding:12px;border:1px solid #d8e2de;border-radius:10px}.graph-material-group summary{font-weight:600;cursor:pointer}.graph-material-file{margin-top:10px;padding:10px;border-radius:8px;background:#f7faf8;overflow-wrap:anywhere}.graph-material-file.highlighted{background:#e1f2ea;outline:2px solid #23816a}
.graph-material-file small{display:block;color:#64786d;margin:6px 0}.graph-material-name{border:0;background:none;font:inherit;text-align:left;color:#155b49;cursor:pointer;padding:0;overflow-wrap:anywhere}
.graph-reader-chip{display:inline-block;margin:4px 4px 0 0;border:1px solid #c6d6ce;border-radius:6px;background:white;font:inherit;font-size:13px;padding:5px;cursor:pointer}
.graph-input-summary{background:#f1f8f4}.graph-input-summary p{overflow-wrap:anywhere;line-height:1.6}.graph-materials small{color:#64786d;line-height:1.6}.graph-materials p{line-height:1.6}
.graph-node.material-related rect{stroke:#18715e;stroke-width:3}.graph-node.material-muted{opacity:.4}.graph-edge.material-related .graph-edge-line{stroke:#18715e;stroke-width:3}
@media(max-width:900px){.graph-main:has(.graph-materials:not([hidden])) .graph-sidebar{display:none}.graph-materials{width:285px;max-width:45vw}}

.graph-main:has(.graph-materials:not([hidden])) .graph-sidebar{display:none}
.graph-input-summary>button{display:block;margin:10px 0;border:1px solid #c6d6ce;border-radius:6px;padding:7px 10px;background:white;color:#155b49;font:inherit}
