.spd-section{background:var(--surface,#f8fbfd);padding:80px 0;position:relative;overflow:hidden}.spd-copy{opacity:0;transition:opacity .7s cubic-bezier(.16,1,.3,1),transform .7s cubic-bezier(.16,1,.3,1);transform:translate(-36px)}.spd-vis .spd-copy{opacity:1;transform:none}.spd-badge{letter-spacing:.06em;text-transform:uppercase;color:var(--primary,#2aa3ce);background:rgba(var(--primary-rgb), .1);border:1px solid rgba(var(--primary-rgb), .2);border-radius:100px;align-items:center;padding:7px 16px;font-size:.76rem;font-weight:700;display:inline-flex}.spd-text{color:var(--text-secondary,#4a5568);margin:20px 0 0;font-size:1.12rem;line-height:1.75}.spd-chips{flex-wrap:wrap;gap:10px;margin-top:22px;display:flex}.spd-chip{color:var(--text-primary,#0a1929);border:1px solid var(--border-light,#0a19291a);box-shadow:var(--shadow-sm,0 2px 8px #0a19290f);background:#fff;border-radius:100px;align-items:center;gap:7px;padding:7px 14px;font-size:.8rem;font-weight:600;display:inline-flex}.spd-chip i{color:var(--primary,#2aa3ce)}.spd-panel-col{opacity:0;transition:opacity .8s cubic-bezier(.16,1,.3,1),transform .8s cubic-bezier(.16,1,.3,1);transform:translateY(34px)scale(.97)}.spd-vis .spd-panel-col{opacity:1;transform:none}.spd-panel{background:linear-gradient(160deg,#0d1e32 0%,#091423 100%);border:1px solid #ffffff1a;border-radius:16px;font-family:IBM Plex Mono,ui-monospace,SFMono-Regular,Menlo,monospace;overflow:hidden;box-shadow:0 30px 80px #0a192959}.spd-bar-top{background:#00000038;border-bottom:1px solid #ffffff12;align-items:center;gap:8px;padding:13px 18px;display:flex}.spd-dot{border-radius:50%;flex-shrink:0;width:11px;height:11px}.spd-dot-r{background:#ff5f57}.spd-dot-y{background:#febc2e}.spd-dot-g{background:#28c840}.spd-title{color:#ffffffd1;white-space:nowrap;text-overflow:ellipsis;margin-left:10px;font-size:.84rem;font-weight:600;overflow:hidden}.spd-live{letter-spacing:.08em;color:#22c55e;align-items:center;gap:6px;margin-left:auto;font-size:.72rem;font-weight:700;display:inline-flex}.spd-live-dot{background:#22c55e;border-radius:50%;width:8px;height:8px;animation:1.3s ease-in-out infinite spdBlink;box-shadow:0 0 8px #22c55e}@keyframes spdBlink{0%,to{opacity:1;transform:scale(1)}50%{opacity:.25;transform:scale(.7)}}.spd-body{padding:30px 18px 22px}.spd-flow{justify-content:space-between;align-items:flex-start;margin-bottom:28px;display:flex}.spd-stage-wrap{flex:1;align-items:center;min-width:0;display:flex}.spd-stage-wrap:first-child{flex:none}.spd-conn{transform-origin:0;background:#ffffff1f;border-radius:2px;flex:1;height:2px;margin:0 4px 44px;transition:transform .6s cubic-bezier(.16,1,.3,1);position:relative;overflow:hidden;transform:scaleX(0)}.spd-vis .spd-conn{transform:scaleX(1)}.spd-conn:after{content:"";background:linear-gradient(90deg, transparent, var(--primary-light,#5bcfef), transparent);animation:2.2s linear infinite spdFlow;position:absolute;inset:0;transform:translate(-100%)}@keyframes spdFlow{to{transform:translate(200%)}}.spd-stage{text-align:center;opacity:0;flex-direction:column;flex-shrink:0;align-items:center;width:78px;transition:opacity .5s,transform .5s cubic-bezier(.34,1.56,.64,1);display:flex;transform:translateY(16px)scale(.8)}.spd-vis .spd-stage{opacity:1;transform:none}.spd-node{border:1.5px solid;border-radius:50%;justify-content:center;align-items:center;width:50px;height:50px;margin-bottom:12px;font-size:1.15rem;display:inline-flex;position:relative}.spd-node-pulse{opacity:0;border:1.5px solid;border-radius:50%;animation:2.4s ease-out infinite spdPulse;position:absolute;inset:-4px}@keyframes spdPulse{0%{opacity:.6;transform:scale(.85)}70%{opacity:0;transform:scale(1.35)}to{opacity:0}}.spd-stage-label{color:#ffffffe6;font-size:.74rem;font-weight:700;line-height:1.2}.spd-stage-sub{color:#ffffff73;margin-top:3px;font-size:.64rem}.spd-metrics{border-top:1px solid #ffffff12;grid-template-columns:repeat(4,1fr);gap:8px;padding-top:18px;display:grid}.spd-metric{opacity:0;flex-direction:column;gap:4px;padding:4px 8px;transition:opacity .5s,transform .5s;display:flex;transform:translateY(12px)}.spd-vis .spd-metric{opacity:1;transform:none}.spd-metric-label{letter-spacing:.04em;text-transform:uppercase;color:#ffffff6b;font-size:.6rem;font-weight:600}.spd-metric-val{font-size:1.15rem;font-weight:800}@media (max-width:575px){.spd-title{font-size:.7rem}.spd-stage{width:56px}.spd-node{width:40px;height:40px;font-size:.95rem}.spd-metrics{grid-template-columns:repeat(2,1fr);gap:14px 8px}}@media (prefers-reduced-motion:reduce){.spd-copy,.spd-panel-col,.spd-stage,.spd-conn,.spd-metric{transition:none}.spd-live-dot,.spd-conn:after,.spd-node-pulse{animation:none}}
