/* Relationship explorer — scoped, lightweight cards and a quiet diagram canvas. */
.relation-explorer{--rel-ink:var(--text,#1e293b);--rel-muted:var(--text-secondary,#475569);--rel-accent:var(--primary,#4f46e5);color:var(--rel-ink);background:#fff;border:1px solid var(--border,#e2e8f0);border-radius:16px;margin-top:16px;overflow:hidden;min-width:0}
.relation-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:22px 24px 18px}.relation-heading h3{font-size:17px;font-weight:700;letter-spacing:-.3px;margin:0 0 6px}.relation-heading p{font-size:12px;color:var(--rel-muted);margin:0;line-height:1.6}.relation-count{white-space:nowrap;font-size:12px;color:var(--rel-accent);background:#f1f0ff;border:1px solid #e7e4ff;padding:7px 11px;border-radius:20px;font-weight:600}
.relation-toolbar{display:flex;gap:10px;padding:0 24px 20px;align-items:center}.relation-toolbar input{flex:1;min-width:120px;max-width:320px;width:auto;margin:0;height:38px;border:1px solid var(--border);border-radius:9px;padding:0 12px;font-size:13px;background:#fff}.relation-toolbar select{width:auto;min-width:100px;height:38px;border-radius:9px;margin:0;font-size:12px}.relation-segment{display:flex;gap:3px;padding:3px;background:#f1f4f8;border:1px solid #e8edf3;border-radius:10px;margin-left:auto;flex-shrink:0}.relation-segment button{border:0;background:transparent;color:var(--rel-muted);padding:6px 13px;min-height:30px;border-radius:7px;font:inherit;font-size:12px;cursor:pointer}.relation-segment button.active{background:white;color:var(--rel-accent);box-shadow:0 1px 4px #17255412;font-weight:650}
.relation-canvas{display:block;position:relative;overflow:hidden;height:458px;background-color:#f8fafc;background-image:radial-gradient(#d8e0ed 1px,transparent 1px);background-size:18px 18px;border-top:1px solid #e9edf4;border-bottom:1px solid #e9edf4;touch-action:none;cursor:grab}.relation-canvas:active{cursor:grabbing}.relation-world{position:absolute;left:0;top:0;transform-origin:0 0}.relation-edges{position:absolute;inset:0;overflow:visible;pointer-events:none}.relation-edges path{fill:none;stroke:#cbd5e1;stroke-width:1.5}.relation-edges path.active{stroke:#9a94ee;stroke-width:1.8}.relation-lane{position:absolute;top:17px;width:224px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px;letter-spacing:.4px;color:#64748b}
.relation-explorer .relation-node{display:flex;align-items:center;gap:11px;border:1px solid #dce3ed;border-radius:12px;background:#fff;color:var(--rel-ink);padding:14px;text-align:left;font-family:inherit;box-shadow:0 3px 10px #26334d06;min-width:0;margin:0;cursor:pointer;touch-action:none;transition:border-color .15s,box-shadow .15s}.relation-explorer .relation-node:hover{border-color:#b8b2f6;box-shadow:0 5px 18px #4f46e510}.relation-explorer .relation-node.is-selected{border-color:#8c83ee;box-shadow:0 0 0 2px #4f46e50c,0 4px 12px #4f46e509}.relation-explorer .relation-node.is-center{background:linear-gradient(120deg,#faf9ff,#fff);border-color:#c8c2f2;border-left:3px solid var(--rel-accent);cursor:grab}
.relation-avatar{display:flex;align-items:center;justify-content:center;flex:0 0 38px;width:38px;height:38px;border-radius:11px;font-weight:650;font-size:16px;background:#efedff;color:#6255c7}.relation-avatar.teacher{color:#28756e;background:#eaf4f1}.relation-node-copy{display:flex;flex-direction:column;gap:3px;min-width:0;flex:1}.relation-node-kind{font-size:10px;color:#64748b;line-height:1.2}.relation-node-copy strong{font-size:14px;font-weight:650;line-height:1.4;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.relation-node-tags{font-size:11px;color:var(--rel-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.4}.relation-node-arrow{color:#8993a6;font-size:19px;flex:none}
.relation-branch-empty{position:absolute;width:224px;border:1px dashed #d3dce8;border-radius:12px;padding:20px;color:#64748b;font-size:13px;text-align:center;box-sizing:border-box}.relation-branch-empty small{display:block;font-size:11px;margin-top:7px}
.relation-canvas-tools{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;padding:10px 16px;background:#fff;border-bottom:1px solid #edf0f5}.relation-canvas-tools>span{font-size:11px;color:#64748b}.relation-zoom-controls{display:flex;align-items:center;gap:5px}.relation-control{border:1px solid #e0e5ef;background:#fff;color:var(--rel-muted);border-radius:7px;min-height:32px;min-width:32px;padding:5px 10px;font-size:12px;font-family:inherit;cursor:pointer;white-space:nowrap}.relation-control:hover:not(:disabled){border-color:#b9b2ef;color:var(--rel-accent);background:#faf9ff}.relation-control:disabled{opacity:.45;cursor:default}.relation-zoom{font-size:11px;color:#64748b;text-align:center;min-width:40px;font-variant-numeric:tabular-nums}
.relation-insight{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:17px 22px;background:#fcfcff}.relation-insight>div{display:flex;flex-wrap:wrap;align-items:center;gap:10px;min-width:0}.relation-insight strong{font-size:13px;overflow-wrap:anywhere}.relation-insight span{font-size:12px;color:var(--rel-muted)}.relation-insight button{color:var(--rel-accent);border-color:#dedafa}
.relation-footer{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;padding:0 20px}.relation-footer:not(:empty){padding-top:10px;padding-bottom:10px;border-top:1px solid #edf0f5}.relation-pagination{display:flex;align-items:center;gap:6px}.relation-pagination>span{font-size:11px;color:#64748b;margin-right:6px}.relation-caption{display:flex;justify-content:space-between;flex-wrap:wrap;gap:7px;padding:12px 22px;color:#64748b;font-size:11px;border-top:1px solid #edf0f5}.relation-person-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;padding:0 20px 14px}.relation-person-list .relation-node{width:100%;min-height:82px}.relation-person-list.secondary .relation-node{background:#f8fafc;box-shadow:none}.relation-section-label{margin:0;padding:16px 22px 12px;color:var(--rel-muted);font-size:12px;font-weight:600}.relation-content>.relation-pagination{padding:0 20px 14px}.relation-inline-empty{padding:0 22px 18px;color:#64748b;font-size:12px;margin:0}.relation-empty{display:flex;align-items:center;flex-direction:column;gap:14px;padding:45px 24px;background:#fafbfe;text-align:center;border-top:1px solid #edf0f5}.relation-empty strong{font-size:15px}.relation-empty p{font-size:12px;color:var(--rel-muted);max-width:340px;line-height:1.8;margin:0}.relation-empty .relation-avatar{flex-basis:42px;height:42px;width:42px}
.relation-explorer button:focus-visible,.relation-explorer input:focus-visible,.relation-explorer select:focus-visible,.relation-canvas:focus-visible{outline:2px solid var(--rel-accent);outline-offset:3px}
@media(max-width:640px){.relation-explorer{border-radius:12px}.relation-heading{padding:18px 15px 14px;align-items:flex-start;flex-direction:column;gap:10px}.relation-heading h3{font-size:16px}.relation-toolbar{padding:0 15px 16px;flex-wrap:wrap;gap:8px}.relation-toolbar input{flex-basis:100%;max-width:none;width:100%;min-height:44px}.relation-toolbar select{flex:1;min-height:44px}.relation-segment button{min-height:36px;padding:6px 15px}.relation-person-list{grid-template-columns:minmax(0,1fr);padding:0 14px 12px}.relation-person-list .relation-node{touch-action:pan-y}.relation-section-label{padding:15px}.relation-insight{padding:15px;align-items:flex-start}.relation-insight>div{flex-direction:column;align-items:flex-start;gap:5px}.relation-control{min-height:44px;min-width:44px}.relation-canvas{height:380px}.relation-canvas-tools{padding:10px}.relation-zoom-controls{gap:3px;flex-wrap:wrap}.relation-zoom-controls .relation-control{padding:5px 8px}.relation-footer{padding-left:14px;padding-right:14px}.relation-caption{padding:12px 15px;font-size:11px}.relation-content>.relation-pagination{padding:0 14px 14px}}
@media(prefers-reduced-motion:reduce){.relation-explorer .relation-node{transition:none}}
