.network-topology{display:grid;grid-template-columns:minmax(0,1fr) 210px minmax(0,1fr);grid-template-rows:1fr 1fr;gap:50px 24px;min-height:670px;padding:65px 30px 110px;background:radial-gradient(ellipse at center,#ff5a3626,transparent 65%),var(--ink);box-shadow:0 30px 65px #0d19302b;overflow:hidden}
.network-topology:before{opacity:.3;background-size:35px 35px}.network-topology:after{content:"";position:absolute;width:440px;height:440px;left:50%;top:46%;margin:-220px;border-radius:50%;background:conic-gradient(transparent 65%,#ff5a3608 80%,#ff5a3660 99%,transparent);mask:radial-gradient(transparent 62%,#000 63%);animation:network-sweep 18s linear infinite;pointer-events:none}
.network-topology .publication-node{position:relative;inset:auto;width:auto;min-width:0;margin:0;transform:none;background:linear-gradient(135deg,#fbfaf6,#eae7df);color:var(--ink);border:1px solid #ffffffbd;box-shadow:0 18px 30px #0003;padding:22px;animation:network-light 16s ease-in-out infinite;display:flex;flex-direction:column}
.network-topology .node-byd{grid-area:1/1;animation-delay:0s}.network-topology .node-xpeng{grid-area:1/3;animation-delay:-12s}.network-topology .node-mg{grid-area:2/1;animation-delay:-8s}.network-topology .node-deal{grid-area:2/3;animation-delay:-4s}
.network-topology .publication-node b{font-size:clamp(1.4rem,2.4vw,2rem);letter-spacing:-.055em;margin:10px 0}.network-topology .publication-node p{color:#59657a;min-height:0;margin-bottom:20px;line-height:1.5}.network-topology .publication-node a{margin-top:auto;color:#a42d16;min-height:30px;display:flex;align-items:center;gap:7px}.network-topology .node-status{color:#59657a;font:700 9px 'DM Sans',sans-serif;letter-spacing:.1em}.network-topology .node-status:before{background:var(--cyan);box-shadow:0 0 10px #ff5a3645}
.network-topology .publication-node:hover,.network-topology .publication-node:focus-within{transform:translateY(-5px);outline:2px solid var(--cyan);outline-offset:3px}.network-topology a:focus-visible,.network-motion:focus-visible{outline:3px solid var(--cyan);outline-offset:4px}
.network-topology .control-node{position:relative;inset:auto;grid-area:1/2/3/3;align-self:center;justify-self:center;transform:none;width:190px;height:190px;background:radial-gradient(circle at 30% 20%,#fff,#f3f0e8 50%,#b6b0a4);color:var(--ink);border:1px solid #fff9;box-shadow:inset -8px -10px 20px #0d193020,0 25px 40px #0005,0 0 0 12px #ffffff06,0 0 70px #ff5a3640;animation:network-core 6s ease-in-out infinite}
.network-topology .control-node strong{font-size:1.3rem;max-width:150px;letter-spacing:-.04em}.network-topology .control-kicker{color:#a42d16;font-size:8px;max-width:130px;line-height:1.5}.network-topology .control-node small{color:#59657a;font-size:10px}.network-topology .control-orbit{inset:-26px;border-color:#ff5a3680;animation:network-sweep 30s linear infinite}.network-topology .control-orbit:after{background:var(--cyan);box-shadow:0 0 20px var(--cyan);width:7px;height:7px}
.network-topology .topology-lines{inset:0;width:100%;height:100%;z-index:0;pointer-events:none}.network-topology .topology-track{stroke:#ff5a3660;stroke-width:1.3;stroke-dasharray:5 8}.network-topology .topology-pulse{stroke:#fff2df;stroke-width:2.5;stroke-dasharray:3 180;filter:drop-shadow(0 0 6px #ff5a36);animation:topology-flow 7s linear infinite}.network-topology .topology-pulse:nth-of-type(2n){animation-delay:-3s}
.network-topology .topology-legend{left:30px;right:30px;bottom:24px;gap:10px}.network-topology .topology-legend span{background:#ffffff07;border-color:#ffffff20;padding:12px;color:#e8e5db;animation:network-step 16s ease-in-out infinite}.network-topology .topology-legend span:nth-child(2){animation-delay:-12s}.network-topology .topology-legend span:nth-child(3){animation-delay:-8s}.network-topology .topology-legend span:nth-child(4){animation-delay:-4s}.network-topology .topology-legend i{background:#ff5a3625;color:#ff9277}
.network-motion{position:absolute;top:16px;right:26px;z-index:5;background:transparent;border:1px solid #ffffff50;color:#f3f0e8;border-radius:30px;padding:7px 12px;font:600 11px 'DM Sans',sans-serif;cursor:pointer;min-height:32px}
@keyframes network-sweep{to{transform:rotate(360deg)}}@keyframes network-core{50%{translate:0 -5px}}@keyframes network-light{0%,17%,100%{border-color:var(--cyan);box-shadow:0 0 0 2px #ff5a3625,0 18px 30px #0003}30%,85%{border-color:#ffffffbd;box-shadow:0 18px 30px #0003}}@keyframes network-step{0%,17%,100%{border-color:#ff5a3680}30%,85%{border-color:#ffffff20}}
.network-topology.motion-paused *,.network-topology.motion-paused:after{animation-play-state:paused!important}
@media(max-width:1000px) and (min-width:801px){.network-topology{grid-template-columns:minmax(0,1fr) 160px minmax(0,1fr);gap:35px 16px;padding-inline:20px}.network-topology .control-node{width:150px;height:150px}.network-topology .control-node strong{font-size:1.05rem;max-width:125px}.network-topology .publication-node{padding:18px}.network-topology .topology-legend{left:20px;right:20px}}
@media(max-width:800px){.network-topology{grid-template-columns:minmax(0,1fr);grid-template-rows:auto;gap:16px;padding:65px 20px 22px;min-height:0}.network-topology:after{display:none}.network-topology .publication-node,.network-topology .control-node{grid-area:auto}.network-topology .control-node{display:flex;order:-1;width:175px;height:175px;margin:20px 0 35px}.network-topology .publication-node{padding:22px}.network-topology .topology-legend{position:relative;inset:auto;grid-column:1;grid-template-columns:1fr 1fr;gap:9px;margin-top:6px}.network-topology .topology-legend span{padding:10px;font-size:10px}.network-topology .topology-lines{display:none}}
@media(max-width:360px){.network-topology .topology-legend{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.network-topology *,.network-topology:after{animation:none!important;transition:none!important;translate:none}.network-topology:after{display:none}.network-topology .topology-pulse{display:none}.network-motion{display:none}}
