.knowledge-graph{margin-top:34px;background:#173a31;border:1px solid #2d5549;border-radius:20px;overflow:hidden;box-shadow:0 22px 65px rgba(12,38,31,.2)}
.graph-copy{display:flex;align-items:end;gap:16px;padding:22px 24px 15px;border-bottom:1px solid rgba(190,220,207,.13);background:linear-gradient(110deg,#173a31,#1d463b)}.graph-copy .eyebrow{align-self:center;color:#71d7c9}.graph-copy h2{font:600 18px/1.4 var(--serif);margin:0;color:#f1f7f4}.graph-copy p{margin:0 0 2px auto;color:#a9c1b8;font-size:10px}.graph-stage{position:relative;height:330px;overflow:hidden;background:radial-gradient(circle at 48% 42%,#214c40 0,#16382f 55%,#102b25 100%)}.graph-stage:before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 18% 24%,rgba(92,161,124,.12),transparent 28%),radial-gradient(circle at 82% 74%,rgba(79,227,216,.07),transparent 30%)}.graph-stage:after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(8,30,24,.3),transparent 13%,transparent 87%,rgba(8,30,24,.3))}.graph-stage canvas{position:relative;z-index:1;display:block;width:100%;height:100%;cursor:crosshair}.graph-legend{position:absolute;left:18px;bottom:14px;display:flex;gap:13px;z-index:2;padding:6px 9px;border:1px solid rgba(211,231,222,.1);border-radius:12px;background:rgba(8,31,25,.58);backdrop-filter:blur(8px);font-size:8px;color:#bed1ca}.graph-legend span{display:flex;align-items:center;gap:5px}.graph-legend i{width:7px;height:7px;border-radius:50%;background:#58eadc;box-shadow:0 0 0 3px rgba(88,234,220,.2),0 0 11px rgba(88,234,220,.45)}.graph-legend span:last-child i{background:#f0c65e;box-shadow:0 0 0 3px rgba(240,198,94,.18),0 0 11px rgba(240,198,94,.38)}
.graph-stage.is-node-hovered canvas{cursor:pointer}
.graph-stage canvas:focus-visible{outline:2px solid rgba(231,245,143,.72);outline-offset:-5px}
.graph-hint{position:absolute;right:18px;bottom:15px;z-index:2;margin:0;color:#91ada3;font-size:8px;pointer-events:none}
.graph-inspector{position:absolute;z-index:4;right:16px;top:16px;width:min(245px,calc(100% - 32px));padding:17px 18px 16px;border:1px solid rgba(201,229,217,.2);border-radius:15px;background:rgba(10,36,29,.92);box-shadow:0 18px 42px rgba(5,24,19,.28);backdrop-filter:blur(14px);color:#edf7f3}
.graph-inspector[hidden]{display:none}
.graph-inspector>span{display:block;color:#78d8ca;font-size:8px;font-weight:700;letter-spacing:1.2px}
.graph-inspector>strong{display:block;margin-top:7px;font:600 17px/1.4 var(--serif)}
.graph-inspector>p{margin:7px 0 13px;color:#adc5bc;font-size:10px;line-height:1.65}
.graph-inspector>a,.graph-inspector>#graphInspectorAction{display:inline-flex;align-items:center;min-height:34px;padding:0;border:0;background:none;color:#dff196;font-size:10px;font-weight:700;text-decoration:none;cursor:pointer}
.graph-inspector>a[hidden],.graph-inspector>#graphInspectorAction[hidden]{display:none}
.graph-inspector-close{position:absolute;right:7px;top:6px;width:34px;min-width:34px;height:34px;min-height:34px;border:0;background:none;color:#8eaaa0;font-size:18px;cursor:pointer}
@media(max-width:780px){.knowledge-graph{margin-top:25px;border-radius:16px}.graph-copy{display:block;padding:17px 17px 13px}.graph-copy h2{font-size:16px;margin-top:5px}.graph-copy p{font-size:9px;margin-top:5px}.graph-stage{height:285px}.graph-legend{left:11px;bottom:10px}.graph-stage:after{display:none}}
@media(max-width:560px){.graph-hint{display:none}.graph-inspector{top:auto;right:11px;bottom:43px;width:calc(100% - 22px)}}
@media(prefers-reduced-motion:reduce){.graph-stage canvas{cursor:default}}
