/* Homepage platform capability network. Scenario studio and architecture explorer have separate stylesheets. */
.network-section { background: linear-gradient(180deg,#f8fbff,#fff); padding-top: 76px; padding-bottom: 76px; }
.platform-network { display: grid; grid-template-columns: minmax(0,1fr) 310px; border: 1px solid #dae8f6; border-radius: 18px; overflow: hidden; background: #f9fcff; box-shadow: 0 16px 45px #35669408; }
.network-map { position: relative; min-height: 520px; isolation: isolate; background: radial-gradient(ellipse at 50% 45%,#d4efffa3,transparent 55%),linear-gradient(150deg,#fbfdff,#eef6ff); }
.network-map::before { content: ''; position: absolute; z-index: -1; inset: 0; background-image: radial-gradient(#8eb5d644 .8px,transparent .8px); background-size: 22px 22px; mask-image: radial-gradient(ellipse,#000,transparent 82%); }
.network-map-label { position: absolute; top: 23px; left: 25px; display: flex; gap: 15px; color: #91abc8; font: 12px/1.5 ui-monospace,monospace; letter-spacing: 1.1px; }
.network-map-label span { font: 12px/1.5 sans-serif; letter-spacing: 0; color: #9eb0c5; }
.network-map-footer { position: absolute; bottom: 19px; left: 25px; font-size: 12px; color: #92a9c1; display: flex; align-items: center; gap: 7px; }
.network-map-footer i { width: 5px; height: 5px; border-radius: 50%; background: #72aaff; }
.network-wires { position: absolute; width: 100%; height: 100%; inset: 0; overflow: visible; }
.network-wires path { fill: none; stroke: #bad5ee; stroke-width: 1.1px; vector-effect: non-scaling-stroke; stroke-dasharray: 3 5; }
.network-wires path.is-selected { stroke: #3b94f7; stroke-width: 1.8px; stroke-dasharray: 4 7; animation: network-flow 4s linear infinite; }
.platform-network:not([data-visible="true"]) .network-wires path { animation-play-state: paused; }
.network-halo { position: absolute; left: 50%; top: 46%; width: 240px; height: 240px; transform: translate(-50%,-50%); border: 1px solid #a5c9eb40; border-radius: 50%; box-shadow: 0 0 0 32px #ffffff30,0 0 0 33px #a5c9eb22; pointer-events: none; }
.network-core { position: absolute; left: 50%; top: 45%; transform: translate(-50%,-50%); width: 190px; text-align: center; pointer-events: none; }
.network-core-glass { position: relative; height: 92px; width: 116px; margin: 0 auto 12px; }
.network-core-glass i { position: absolute; width: 84px; height: 84px; border-radius: 18px; left: 16px; top: -11px; transform: rotateX(53deg) rotateZ(-45deg); background: linear-gradient(140deg,#ffffffd9,#b3deffb3); border: 1px solid #fff; box-shadow: 4px 7px 0 #71b5e923,10px 18px 26px #5da5de16,inset 0 0 18px #fff; }
.network-core-glass i:nth-child(2) { top: 12px; opacity: .75; }.network-core-glass i:nth-child(3) { top: 34px; opacity: .5; }
.network-core strong { display: block; color: #23476e; font-size: 17px; font-weight: 500; }.network-core > span { display: block; color: #809dbd; font-size: 12px; margin-top: 6px; letter-spacing: 2px; }
.network-node { position: absolute; left: var(--x); top: var(--y); transform: translate(-50%,-50%); width: 182px; min-height: 66px; display: flex; align-items: center; gap: 9px; text-align: left; padding: 13px 12px; color: #557491; border-radius: 11px; border: 1px solid #d4e4f4; background: #ffffffd9; box-shadow: 0 5px 15px #4874a109,inset 0 1px 0 #fff; transition: border-color .3s,background .3s,box-shadow .3s; }
.network-node > span:nth-child(2) { font-size: 12px; font-weight: 500; line-height: 1.6; flex: 1; }.network-node small { align-self: flex-start; font: 12px/1.5 ui-monospace,monospace; color: #9ab0c7; }
.network-node-icon { display: grid; place-items: center; width: 29px; height: 29px; color: #5b8ac4; flex-shrink: 0; }.network-node-icon svg { width: 19px; height: 19px; }
.network-node[aria-pressed="true"],.network-node:hover { border-color: #6da8f5; background: #fff; color: #1169d6; box-shadow: 0 7px 22px #3880d71b,0 0 0 3px #b9d9ff22; }
.network-node[aria-pressed="true"] .network-node-icon { color: #0066ff; }
.network-inspector { padding: 30px 27px 26px; background: linear-gradient(150deg,#fff,#f8fbff); border-left: 1px solid #dce8f5; display: flex; flex-direction: column; }
.network-panel-eyebrow { color: #8ea4bd; font: 12px/1.5 ui-monospace,monospace; letter-spacing: 1.5px; }.network-panel-eyebrow b { color: #3684e5; font-weight: 400; }
.network-panel-icon { position: relative; width: 44px; height: 44px; display: grid; place-items: center; margin-top: 25px; }.network-panel-icon::before { content: ''; position: absolute; inset: 0; border-radius: 11px; background: linear-gradient(145deg,#fff 6%,#e6f1ff 50%,#cfe3fb 100%); border: 1px solid #ffffffb8; box-shadow: inset 0 1px 0 #fff, inset 0 -9px 15px #bcd8f64d, 0 7px 17px #2f6ebe2e, 0 0 0 1px #a8c8ec59; }.network-panel-icon svg { position: relative; z-index: 1; width: 22px; height: 22px; color: #1c5fb0; }
.network-inspector h3 { color: #203c5c; font-size: 23px; line-height: 1.4; font-weight: 600; margin: 17px 0 12px; }.network-description { color: #74879c; font-size: 12px; line-height: 1.95; min-height: 70px; }
.network-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 17px; }.network-tags span { font-size: 12px; color: #6281a5; background: #f0f6fd; padding: 4px 7px; border-radius: 4px; }
.network-route { margin-top: 24px; }.network-route > span { font-size: 12px; color: #9bacc0; }.network-route ol { margin-top: 10px; display: flex; flex-wrap: wrap; gap: 7px; list-style: none; padding: 0; }.network-route li { font-size: 12px; color: #547394; }.network-route li + li::before { content: '→'; color: #90b8e5; margin-right: 7px; }
.network-panel-actions { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: auto; padding-top: 26px; }.network-panel-actions a { font-size: 12px; color: #5d84b0; }.network-panel-actions .network-detail { color: #0969df; }.network-detail span { margin-left: 9px; }
@keyframes network-flow { to { stroke-dashoffset: -44; } }
@media (max-width: 1100px) and (min-width: 768px) {
 .platform-network { grid-template-columns: minmax(0,1fr) 270px; }.network-node { width: 150px; padding: 10px; gap: 6px; }.network-node-icon { width: 23px; height: 23px; }.network-node > span:nth-child(2) { font-size: 12px; }.network-node small { display: none; }.network-node:nth-last-child(3) { left: 20%; }.network-node:nth-last-child(2) { left: 80%; }.network-halo { width: 160px; height: 160px; }.network-core { width: 150px; }.network-core strong { font-size: 15px; }
}
@media (max-width: 767px) {
 .network-section { padding: 60px 0; }
 .platform-network { grid-template-columns: 1fr; }.network-map { min-height: 430px; }.network-map-label { left: 16px; top: 18px; font-size: 12px; gap: 9px; }.network-map-label span { font-size: 12px; }.network-map-footer { font-size: 12px; bottom: 14px; left: 16px; }
 .network-node { width: 126px; min-height: 54px; padding: 9px; gap: 6px; border-radius: 9px; }.network-node > span:nth-child(2) { font-size: 12px; }.network-node-icon { width: 20px; height: 20px; border-radius: 5px; }.network-node-icon svg { width: 13px; height: 13px; }.network-node small { display: none; }
 .network-node { left: clamp(68px,var(--x),calc(100% - 68px)); }.network-node:last-child { top: 83%; }.network-core { width: 150px; top: 44%; }.network-core-glass { transform: scale(.78); margin-bottom: -5px; }.network-core strong { font-size: 14px; }.network-core > span { font-size: 12px; letter-spacing: 1px; }.network-halo { width: 120px; height: 120px; box-shadow: 0 0 0 22px #ffffff30,0 0 0 23px #a5c9eb22; }
 .network-inspector { padding: 22px; border-left: 0; border-top: 1px solid #dce8f5; }.network-panel-icon { display: none; }.network-inspector h3 { font-size: 22px; margin-top: 12px; }.network-description { min-height: 0; }.network-tags { margin-top: 12px; }.network-route { margin-top: 17px; }.network-panel-actions { padding-top: 21px; }
}
@media (prefers-reduced-motion: reduce) { .network-wires path.is-selected { animation: none; }.network-node { transition: none; } }