:root{--origin:#0aa64b;--tier:#00a0ef;--middle:#cbd2db;--edge:#87929e;--ink:#17212b;--muted:#687586}*{box-sizing:border-box}html,body{height:100%;margin:0}body{background:#f6f8fb;color:var(--ink);font-family:Inter,"PingFang SC","Microsoft YaHei",system-ui,sans-serif}.app{min-height:100%;display:grid;grid-template-rows:auto auto auto;gap:12px;padding:15px}.topbar{display:flex;align-items:center;gap:14px;padding:13px 17px;background:#fff;border:1px solid #e1e6ed;border-radius:15px;box-shadow:0 9px 30px #182b4912}.brand{font-size:18px;font-weight:800;white-space:nowrap}.meta{flex:1;color:var(--muted);font-size:13px}.pill{display:inline-flex;padding:4px 9px;margin:2px 5px 2px 0;border-radius:999px;background:#edf8ff;color:#067ba9}.btn{border:0;border-radius:9px;padding:9px 13px;background:#172033;color:#fff;cursor:pointer}.stage{position:relative;width:100%;aspect-ratio:16/9;min-height:0;max-height:calc(100vh - 145px);margin:auto;overflow:hidden;background:#fff;border:1px solid #dce2e9;border-radius:15px;box-shadow:0 12px 38px #20385814;cursor:grab}.stage.dragging{cursor:grabbing}svg{display:block;width:100%;height:100%;user-select:none}.edge-halo{fill:none;stroke:#fff;stroke-width:4.5;vector-effect:non-scaling-stroke;stroke-linejoin:round}.edge{fill:none;stroke:var(--edge);stroke-width:1.3;opacity:.7;vector-effect:non-scaling-stroke;stroke-linejoin:round}.edge.peering{stroke-dasharray:4 4;stroke-width:1.45;opacity:.9}.edge.active{opacity:1;stroke-width:2.6}.edge.dim,.edge-halo.dim,.node.dim{opacity:.045}.node{cursor:pointer}.node rect{fill:#fff;stroke:var(--middle);stroke-width:1.8;vector-effect:non-scaling-stroke}.node.origin rect{fill:#effaf2;stroke:var(--origin);stroke-width:2.2}.node.tier1 rect{fill:#eaf7ff;stroke:var(--tier);stroke-width:2.2}.node.active rect{stroke-width:3;filter:drop-shadow(0 4px 8px #0002)}.asn{font-size:12px;font-weight:800;text-anchor:middle}.org{font-size:11px;text-anchor:middle;fill:#5e6b79}.column-title{font-size:12px;font-weight:700;text-anchor:middle;fill:#8d98a7}.empty{position:absolute;inset:0;display:grid;place-items:center;text-align:center;color:#788292;pointer-events:none}.empty strong{display:block;color:#344054;font-size:17px;margin-bottom:6px}.tools{position:absolute;right:13px;top:13px;display:flex;gap:6px}.tool{width:36px;height:36px;border:1px solid #dce2e9;border-radius:9px;background:#fff;box-shadow:0 4px 14px #1d29391a;font-size:17px;cursor:pointer}.tip{display:none;position:absolute;z-index:5;max-width:370px;padding:10px 12px;border-radius:8px;background:#101828;color:#fff;font-size:12px;line-height:1.55;pointer-events:none}.legend{min-height:44px;display:flex;align-items:center;justify-content:center;gap:24px;flex-wrap:wrap;padding:9px 16px;background:#fff;border:1px solid #e2e7ed;border-radius:12px;color:#596273;font-size:13px}.legend-item{height:24px;display:inline-flex;align-items:center;gap:7px}.swatch{width:14px;height:14px;border:2px solid;border-radius:5px}.origin-key{border-color:var(--origin);background:#effaf2}.middle-key{border-color:var(--middle);background:#fff}.tier-key{border-color:var(--tier);background:#eaf7ff}.line-key{width:32px;height:2px;background:var(--edge)}.line-key.peer{height:0;background:none;border-top:2px dashed var(--edge)}@media(max-width:720px){.app{padding:7px}.stage{max-height:none;min-height:430px;aspect-ratio:auto}.topbar{flex-wrap:wrap}.meta{order:3;flex-basis:100%}.legend{gap:8px 14px}}