.spx-diagram-switch{display:flex;align-items:center;gap:6px;width:min(1440px,calc(100% - 28px));margin:16px auto 0;padding:6px;border:1px solid #cbd8df;border-radius:10px;background:#fff}.spx-diagram-switch button{min-height:42px;padding:8px 20px;border:1px solid transparent;border-radius:7px;background:transparent;color:#52616b;font-weight:800;cursor:pointer}.spx-diagram-switch button.is-active{border-color:#0878c9;background:#0878c9;color:#fff}.spx-diagram-switch span{margin-left:8px;color:#667782;font-size:12px}.spx-diagram-test{width:min(1440px,calc(100% - 28px));margin:18px auto 56px;overflow:hidden;border:1px solid #263746;border-radius:10px;background:#111820;box-shadow:0 12px 36px #12202b2b}.spx-diagram-test[hidden],[data-test-panel][hidden]{display:none!important}.spx-diagram-test-toolbar{display:flex;min-height:56px;align-items:center;justify-content:space-between;gap:14px;padding:9px 15px;border-bottom:1px solid #334252;background:#17212a;color:#fff}.spx-diagram-test-toolbar>div{display:flex;align-items:center;gap:12px}.spx-diagram-test-toolbar span{color:#a8bac5;font-size:11px}.spx-diagram-test-toolbar button{padding:9px 14px;border:1px solid #4b6070;border-radius:6px;background:#0878c9;color:#fff;font-weight:800;cursor:pointer}.spx-diagram-test-scroll{overflow:auto;background-color:#111820;background-image:radial-gradient(#31404d 1px,transparent 1px);background-size:20px 20px}.spx-diagram-test-scroll svg{display:block;width:1600px;height:900px}.spx-diagram-bg{fill:#111820}.spx-diagram-area-title{fill:#8297a4;font-size:13px;font-weight:800;letter-spacing:.14em}.spx-test-node-box{fill:#263540;stroke:#607584;stroke-width:2;filter:url(#test-shadow)}.spx-test-node-title{fill:#fff;font-size:14px;font-weight:800;text-anchor:middle}.spx-test-node-type{fill:#9fb1bc;font-size:10px;font-weight:700;text-anchor:middle;letter-spacing:.08em}.spx-test-port-in{fill:#4da6ff;stroke:#0e171d;stroke-width:2}.spx-test-port-out{fill:#ffb547;stroke:#0e171d;stroke-width:2}.spx-test-wire{fill:none;stroke:#34c7e8;stroke-width:2.5;marker-end:url(#test-arrow)}.spx-test-empty{fill:#b8c8d1;font-size:18px;text-anchor:middle}.spx-diagram-test-help{margin:0;padding:11px 15px;background:#17212a;color:#a8bac5;font-size:11px;line-height:1.7}@media(max-width:820px){.spx-diagram-switch{align-items:stretch;flex-wrap:wrap}.spx-diagram-switch button{flex:1}.spx-diagram-switch span{flex-basis:100%;margin:4px}.spx-diagram-test-toolbar{align-items:flex-start;flex-direction:column}.spx-diagram-test-toolbar>div{align-items:flex-start;flex-direction:column;gap:3px}}