
.phase3-package3-home{width:min(1180px,calc(100% - 32px));margin:18px auto;padding:25px;border:1px solid #c9dce8;border-radius:24px;background:linear-gradient(135deg,#f6fbff,#fff);box-shadow:var(--shadow)}
.phase3-package3-home h2{margin:0;color:#285b78}.phase3-package3-home>p{margin:5px 0 15px;color:var(--muted);font-size:12px}.package3-links{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.package3-links a{display:block;padding:15px;border:1px solid #d5e3eb;border-radius:15px;background:#fff;text-decoration:none;color:#294e64;font-weight:900}.package3-links small{display:block;margin-top:4px;color:var(--muted);font-size:10px;font-weight:500}
.typed-related{align-items:stretch}.typed-related .related-copy{display:grid;gap:4px;min-width:0}.typed-related strong{font-size:11px;color:#294b44}.typed-related em{font-style:normal;color:var(--muted);font-size:9px;line-height:1.7}.relation-type{width:max-content;max-width:100%;display:inline-flex;align-items:center;padding:2px 7px;border-radius:999px;background:#edf3f1;color:#46675f;font-size:8px;font-weight:950}.relation-type.type-explicit,.relation-badge.explicit{background:#e6effb;color:#315f91}.relation-type.type-incoming,.relation-badge.incoming{background:#f0eafb;color:#664595}.relation-type.type-next,.relation-badge.next{background:#e5f3ed;color:#26705d}.relation-type.type-previous,.relation-badge.previous{background:#fff1d8;color:#825e22}.relation-type.type-anchor,.relation-badge.anchor{background:#fde9df;color:#944d2f}.relation-type.type-topic,.relation-badge.topic{background:#e9f1f5;color:#38657b}.relation-type.type-course,.relation-badge.course{background:#f0f1f5;color:#596177}
.relation-path{display:grid;grid-template-columns:1fr auto 1fr;align-items:stretch;gap:9px;margin-bottom:14px}.relation-path-card{display:block;padding:12px 13px;border:1px solid var(--line);border-radius:14px;background:#fbfdfc;text-decoration:none}.relation-path-card small{display:block;color:var(--muted);font-size:8px}.relation-path-card strong{display:block;margin-top:3px;color:var(--brand);font-size:10px;line-height:1.7}.relation-path-center{display:grid;place-items:center;min-width:72px;border-radius:14px;background:var(--brand);color:#fff;font-weight:950;font-size:10px;text-align:center;padding:7px}.relation-graph-panel{overflow:hidden;background:linear-gradient(135deg,#f8fbfc,#fff);border-right:5px solid #477d99}.relation-graph-head{display:flex;align-items:center;justify-content:space-between;gap:10px}.relation-graph-head a{border:1px solid #c9dce8;border-radius:10px;padding:7px 10px;text-decoration:none;color:#285b78;font-size:9px;font-weight:900}.article-mini-graph{width:100%;height:auto;display:block;margin-top:8px;border:1px solid #e0eaee;border-radius:16px;background:#fff}.article-mini-graph .edge{stroke:#c8d8df;stroke-width:1.5}.article-mini-graph .node{fill:#fff;stroke:#7da3b5;stroke-width:2}.article-mini-graph .node.center{fill:#13594f;stroke:#13594f}.article-mini-graph text{font-family:"Vazirmatn","Segoe UI",Tahoma,Arial,sans-serif;font-size:11px;fill:#294e64;text-anchor:middle;dominant-baseline:middle}.article-mini-graph text.center{fill:#fff;font-weight:900}
.relation-shell{width:min(1220px,calc(100% - 32px));margin:28px auto 50px}.relation-hero{padding:28px;border:1px solid #c9dce8;border-radius:26px;background:linear-gradient(135deg,#f4faff,#fff);box-shadow:var(--shadow)}.relation-hero .eyebrow{color:#477d99;font-size:11px;font-weight:950}.relation-hero h1{margin:5px 0;color:#285b78;font-size:clamp(25px,4vw,40px)}.relation-hero p{max-width:760px;margin:0;color:var(--muted);font-size:12px}.relation-controls{display:grid;grid-template-columns:minmax(220px,1fr) 190px 150px auto;gap:9px;margin-top:18px}.relation-controls input,.relation-controls select,.relation-controls button{min-height:46px;border:1px solid #d5e3eb;border-radius:13px;background:#fff;padding:8px 12px;outline:none}.relation-controls input:focus,.relation-controls select:focus{border-color:#477d99;box-shadow:0 0 0 3px rgba(71,125,153,.12)}.relation-controls button{background:#285b78;color:#fff;border-color:#285b78;font-weight:950;cursor:pointer}.relation-stats{display:flex;flex-wrap:wrap;gap:8px;margin-top:13px}.relation-stats span{padding:5px 9px;border-radius:999px;background:#fff;border:1px solid #d5e3eb;color:#486477;font-size:9px}
.relation-workspace{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:15px;margin-top:16px}.relation-canvas-card,.relation-detail-card,.relation-list-section{border:1px solid var(--line);border-radius:22px;background:#fff;box-shadow:0 10px 30px rgba(22,59,52,.05)}.relation-canvas-card{padding:15px;min-height:610px}.relation-canvas-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:8px}.relation-canvas-toolbar h2{margin:0;color:#285b78;font-size:16px}.relation-canvas-toolbar small{color:var(--muted);font-size:9px}.relation-svg{width:100%;height:540px;display:block;border-radius:17px;background:radial-gradient(circle at center,#f8fbfc 0,#fff 63%,#f5f9fa 100%);border:1px solid #e1ebef}.relation-svg .graph-edge{stroke:#c4d5dc;stroke-width:1.5}.relation-svg .graph-edge.explicit{stroke:#567fa9;stroke-width:2.6}.relation-svg .graph-edge.incoming{stroke:#8c6daf;stroke-dasharray:5 4}.relation-svg .graph-edge.course{stroke:#a6acb9;stroke-dasharray:4 4}.relation-svg .graph-node{cursor:pointer}.relation-svg .graph-node circle{fill:#fff;stroke:#7ea3b5;stroke-width:2;filter:drop-shadow(0 4px 7px rgba(27,72,88,.12))}.relation-svg .graph-node.center circle{fill:#13594f;stroke:#13594f}.relation-svg .graph-node text{font-family:"Vazirmatn","Segoe UI",Tahoma,Arial,sans-serif;fill:#294e64;text-anchor:middle;dominant-baseline:middle;font-size:12px;font-weight:900;pointer-events:none}.relation-svg .graph-node.center text{fill:#fff;font-size:13px}.relation-svg .graph-node:hover circle,.relation-svg .graph-node:focus circle{stroke:#b78335;stroke-width:4}
.relation-detail-card{padding:19px;position:sticky;top:96px;align-self:start}.relation-detail-card .number-bubble{width:60px;height:60px;display:grid;place-items:center;border-radius:18px;background:#285b78;color:#fff;font-size:17px;font-weight:950}.relation-detail-card h2{margin:12px 0 5px;color:#285b78;font-size:17px;line-height:1.7}.relation-detail-card p{margin:0;color:var(--muted);font-size:10px}.relation-detail-card dl{margin:13px 0}.relation-detail-card dl div{padding:8px 0;border-bottom:1px dashed var(--line)}.relation-detail-card dt{font-size:8px;color:var(--muted)}.relation-detail-card dd{margin:2px 0 0;font-size:10px;color:#35514b}.relation-detail-actions{display:grid;gap:7px}.relation-detail-actions a{padding:9px;border-radius:11px;text-align:center;text-decoration:none;background:var(--brand);color:#fff;font-size:10px;font-weight:900}.relation-detail-actions a.secondary{background:#fff;color:#285b78;border:1px solid #d5e3eb}
.relation-list-section{margin-top:16px;padding:22px}.relation-list-section h2{margin:0;color:#285b78;font-size:18px}.relation-list-section>p{margin:3px 0 14px;color:var(--muted);font-size:10px}.relation-list-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:9px}.relation-list-card{display:grid;grid-template-columns:1fr auto;gap:10px;padding:13px;border:1px solid var(--line);border-radius:14px;background:#fbfdfc;text-decoration:none}.relation-list-card:hover{border-color:#9cbcc9;background:#fff}.relation-list-card strong{display:block;margin:4px 0;color:#294e64;font-size:11px}.relation-list-card p{margin:0;color:var(--muted);font-size:9px}.relation-list-card>span:last-child{align-self:center;color:#285b78;font-weight:950}.relation-empty{padding:30px;text-align:center;color:var(--muted)}
@media(max-width:900px){.package3-links{grid-template-columns:1fr}.relation-controls{grid-template-columns:1fr 1fr}.relation-controls input{grid-column:1/-1}.relation-workspace{grid-template-columns:1fr}.relation-detail-card{position:static}.relation-canvas-card{min-height:auto}.relation-svg{height:470px}}
@media(max-width:620px){.phase3-package3-home,.relation-shell{width:min(100% - 20px,1220px)}.relation-hero{padding:19px}.relation-controls{grid-template-columns:1fr}.relation-controls input{grid-column:auto}.relation-path{grid-template-columns:1fr}.relation-path-center{min-height:45px}.relation-list-grid{grid-template-columns:1fr}.relation-canvas-card{padding:8px}.relation-svg{height:400px}.relation-detail-card{padding:15px}}
