.connection{margin-top:28px;grid-template-columns:minmax(0,1fr) 64px minmax(0,1fr) 64px minmax(0,1fr) 64px minmax(0,1fr);align-items:stretch}
.connection-node{min-height:0;padding:24px 14px;border-radius:8px;border:1px solid #d6e1ee;text-align:center;background:#fff}
.flow-symbol{width:64px;height:64px;margin:0 auto 18px;display:flex;align-items:center;justify-content:center;background:transparent;color:#365cf5}
.flow-symbol svg{width:60px;height:60px}
.flow-app{background:#fff;border:1px solid #d6e1ee;padding:5px}
.flow-app img{display:block;object-fit:contain;width:52px;height:52px}
.connection .node-index{font-size:10px;letter-spacing:1px;color:#657a94}
.connection-node h3{margin:8px 0 10px;font-size:20px}
.connection-node p{font-size:14px;line-height:1.8;color:#657487}
.connection .server-node{background:#fff;border-color:#d6e1ee}
.server-node .flow-symbol{background:transparent;color:#365cf5}
.connection .server-node .node-index{color:#657a94}
.connection .server-node p{color:#657487}
.connection .server-node h3{color:#14263e}
.connection .app-node{background:#fff;border-color:#d6e1ee}
.connection .connector{display:flex;flex-direction:column;align-items:center;justify-content:center;color:#67809b;gap:5px}
.connection .connector b{font-size:25px;line-height:1.2}
.connection .connector.carrier{color:#315d91}
.structure-note{margin-top:24px;border-left-color:#6b8caf;background:#f5f8fc;padding:18px 22px}
@media(max-width:1000px){.connection{grid-template-columns:minmax(0,1fr) 45px minmax(0,1fr) 45px minmax(0,1fr) 45px minmax(0,1fr)}.connection-node{padding:20px 10px}.connection-node h3{font-size:17px}.connection-node p{font-size:13px}}
@media(max-width:800px){.connection{grid-template-columns:1fr;gap:0;max-width:520px;margin:26px auto 0}.connection-node{display:grid;grid-template-columns:64px 1fr;column-gap:18px;text-align:left;padding:20px}.flow-symbol{grid-row:1/4;margin:0;align-self:center}.connection-node h3{font-size:19px;margin:4px 0 6px}.connection-node p{font-size:14px}.connection .connector,.connection .connector:nth-child(4){display:flex;flex-direction:row;gap:12px;min-height:42px}.connection .connector b{transform:rotate(90deg)}.structure-note{padding:16px 18px}}