@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@400;500;600;700&display=swap');
:root{font-family:'Noto Sans SC','Microsoft YaHei',sans-serif;color:#202332;background:#f5f6fa;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,a,input{font:inherit}button,a{touch-action:manipulation}button{cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid #ff9bb2;outline-offset:3px}a{color:inherit;text-decoration:none}[hidden]{display:none!important}.rail{position:fixed;inset:0 auto 0 0;width:224px;background:#20222d;color:#a6a8b5;padding:36px 20px;display:flex;flex-direction:column;z-index:5}.brand{display:flex;gap:12px;align-items:center;color:white;margin:0 8px 58px}.brand>b{width:42px;height:42px;display:grid;place-items:center;background:#ff3f70;border-radius:14px;font-size:24px}.brand>span{font-size:16px;font-weight:600}.brand small{display:block;font-size:10px;color:#9397a7;letter-spacing:2px;margin-top:6px}.rail-label{font-size:10px;letter-spacing:2px;padding:0 16px 16px;color:#727687}.rail nav{display:grid;gap:10px}.rail nav button{background:none;border:0;color:#aeb1c0;padding:17px 15px;border-radius:12px;display:flex;align-items:center;gap:12px;text-align:left}.rail nav button>span{font-size:23px;width:24px}.rail nav label{cursor:pointer;font-size:14px}.rail nav i{font-style:normal;font-size:10px;margin-left:auto;opacity:.5}.rail nav button:hover{background:#2c2e3a}.rail nav button[aria-current=page]{background:#ff3f70;color:#fff;box-shadow:0 8px 20px #ff3f7020}.rail-bottom{margin-top:auto;font-size:11px;padding:24px 12px 0;border-top:1px solid #ffffff0d}.rail-bottom small{display:block;margin-top:14px;font-size:9px;letter-spacing:1.5px;color:#626879}.connection-dot{display:inline-block;width:6px;height:6px;background:#c89c4f;border-radius:50%;margin-right:6px}.connected .connection-dot{background:#3dd9a0}.workspace{margin-left:224px}.topbar{height:112px;padding:24px 44px;display:flex;align-items:center;justify-content:space-between;background:#fff;border-bottom:1px solid #eaecf2}.breadcrumb{font-size:11px;color:#969aa9}.topbar h1{font-size:20px;margin:6px 0 0;font-weight:600}.topbar-right{display:flex;align-items:center;gap:20px}.public-badge,.read-only{font-size:11px;border:1px solid #e5e7ee;padding:6px 12px;border-radius:20px;color:#828797}.avatar{width:36px;height:36px;background:#fff0f4;color:#ff3f70;display:grid;place-items:center;border-radius:50%;font-weight:600}.page{padding:38px 44px;max-width:1800px;margin:auto}.customer-page{display:grid;grid-template-columns:minmax(230px,.8fr) minmax(400px,1.2fr);min-height:calc(100dvh - 112px);align-items:center;gap:40px;background:radial-gradient(ellipse at 58% 40%,#ffeef3,transparent 60%)}.customer-intro{padding:10px 0 10px 8px;max-width:430px}.eyebrow{font-size:9px;letter-spacing:2px;color:#9b6478;font-weight:600}.customer-intro h2{font-size:clamp(36px,3.8vw,60px);line-height:1.4;letter-spacing:-2px;margin:25px 0}.customer-intro>p{font-size:14px;line-height:2;color:#8c8e9e}.service-tags{display:flex;gap:8px;flex-wrap:wrap;margin-top:30px}.service-tags span{font-size:10px;border:1px solid #e2e3ec;border-radius:6px;padding:6px 10px;color:#828596}.intro-bottom{font-size:11px;color:#9698a7;margin-top:65px}.intro-bottom span{color:#ff3f70;font-size:20px;margin-right:8px}.phone-stage{display:flex;justify-content:center;min-width:0}.phone-stage iframe{border:1px solid #fff;border-radius:28px;background:#fff;box-shadow:0 22px 70px #33334a12;width:460px;height:calc(100dvh - 165px);min-height:550px;max-height:1000px}.section-heading{display:flex;justify-content:space-between;align-items:center;gap:18px;margin:4px 0 28px}.section-heading h2{font-size:26px;margin:10px 0}.section-heading p{font-size:12px;color:#9699a7;margin:0}.button{border:1px solid #e4e6ee;background:#fff;color:#5c6174;border-radius:9px;padding:10px 15px;font-size:12px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;white-space:nowrap}.button:hover{background:#f7f7fb}.button.primary{background:#ff3f70;color:white;border-color:#ff3f70}.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-bottom:24px}.metric{padding:24px;background:#fff;border:1px solid #e9ebf1;border-radius:14px}.metric>span{font-size:11px;color:#8d92a4}.metric strong{display:block;font-size:29px;margin:13px 0 8px;letter-spacing:-1px}.metric small{font-size:10px;color:#a6a9b6}.dashboard-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}.panel{background:#fff;border:1px solid #e9ebf1;border-radius:14px;padding:25px}.panel.full{grid-column:1/-1}.panel-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:20px}.panel h3{font-size:14px;margin:0}.panel-heading span,.panel time{font-size:10px;color:#a0a5b3}.health-row{display:flex;align-items:center;gap:12px;padding:18px 0;border-bottom:1px solid #f0f1f5}.health-row:last-child{border:0}.health-icon{width:32px;height:32px;border-radius:9px;background:#fff0f4;color:#ff3f70;display:grid;place-items:center;font-size:11px}.health-row strong{font-size:12px;display:block}.health-row small{font-size:10px;color:#9a9fac}.health-state{margin-left:auto;font-size:10px;color:#828899}.capability{display:flex;gap:16px;padding:17px 0}.capability>b{font-size:12px;color:#d8bcc6}.capability strong{font-size:12px}.capability p,.panel.full p{font-size:11px;color:#9398a8;line-height:1.9;margin:7px 0 0}.muted{color:#979cab}.workflow-tabs{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:23px}.workflow-tab{border:1px solid #e4e6ef;border-radius:12px;background:#fff;text-align:left;padding:20px;color:#545b70}.workflow-tab[aria-selected=true]{border-color:#ff779b;box-shadow:0 0 0 1px #ff779b;background:#fff8fa}.workflow-tab b{display:block;font-size:14px;margin-bottom:8px}.workflow-tab span{font-size:10px;color:#999eaf}.flow-panel{border:1px solid #e4e6ef;background:white;border-radius:16px;overflow:hidden}.flow-toolbar{padding:24px;display:flex;align-items:center;justify-content:space-between;gap:16px}.flow-toolbar h3{margin:0;font-size:17px}.flow-toolbar p{font-size:11px;color:#9298a9;margin:8px 0 0}.flow-actions{display:flex;gap:8px}.flow-info{padding:12px 24px;background:#fafbfe;border-top:1px solid #eef0f5;border-bottom:1px solid #eef0f5;display:flex;justify-content:space-between;gap:10px;font-size:10px;color:#9aa0b0}.graph-layout{display:grid;grid-template-columns:minmax(0,1fr) 260px}.graph-stage{height:530px;background-color:#f8f9fc;background-image:radial-gradient(#cdd1de 1px,transparent 1px);background-size:18px 18px;position:relative;overflow:hidden;touch-action:none;cursor:grab}.graph-stage:active{cursor:grabbing}#graph{width:100%;height:100%;user-select:none}.flow-node{cursor:pointer}.flow-node rect{fill:white;stroke:#dde1ec;stroke-width:1.4}.flow-node:hover rect,.flow-node.selected rect{stroke:#ff5b87;stroke-width:2.2}.flow-node text{font-size:12px;fill:#30384d}.flow-node .node-type{font-size:9px;fill:#969dad}.flow-edge{fill:none;stroke:#aeb6c9;stroke-width:1.3;marker-end:url(#arrow)}.zoom-tools{position:absolute;left:18px;bottom:18px;display:flex;box-shadow:0 3px 15px #30305010}.zoom-tools button{border:1px solid #e5e7ee;background:#fff;padding:8px 11px;color:#697086;font-size:11px}.zoom-tools button:first-child{border-radius:7px 0 0 7px}.zoom-tools button:last-child{border-radius:0 7px 7px 0}.node-detail{padding:24px;border-left:1px solid #e9ecf2;overflow:auto;max-height:530px}.node-detail h3{font-size:16px;line-height:1.7;margin:14px 0}.node-detail p{font-size:11px;color:#8991a5;line-height:1.9;white-space:pre-wrap;overflow-wrap:anywhere}.node-detail dt{font-size:10px;color:#a4a9b9;margin:20px 0 5px}.node-detail dd{margin:0;font-size:11px;color:#666e83;overflow-wrap:anywhere}.flow-footnote{padding:17px 24px;border-top:1px solid #edf0f6;color:#9a9fae;font-size:10px;line-height:1.8}dialog{width:min(1000px,92vw);max-height:90dvh;border:1px solid #e4e7f0;border-radius:16px;padding:26px;color:#30364c;box-shadow:0 30px 100px #11132b30}dialog::backdrop{background:#1e233b80;backdrop-filter:blur(4px)}.dialog-heading{display:flex;align-items:center;justify-content:space-between}.dialog-heading h2{font-size:20px;margin:8px 0}dialog>p{font-size:12px;color:#989eaf}dialog pre{background:#212533;color:#e0e4f0;border-radius:10px;padding:22px;font:12px/1.8 Consolas,monospace;white-space:pre;overflow:auto;height:56dvh}.dialog-footer{display:flex;justify-content:flex-end;align-items:center;gap:10px}.dialog-footer span{font-size:11px;margin-right:auto;color:#9098aa}
@media(min-width:1600px){.customer-page{padding-left:10%;padding-right:10%}}@media(max-width:1150px){.rail{width:188px;padding:30px 12px}.brand{margin-bottom:42px}.workspace{margin-left:188px}.page{padding:28px}.topbar{padding:24px 28px}.customer-page{gap:20px;grid-template-columns:.7fr 1.3fr}.customer-intro h2{font-size:37px}.graph-layout{grid-template-columns:1fr 220px}.metrics{gap:10px}.metric{padding:18px}}@media(max-width:900px){.rail{width:76px;padding:25px 10px}.brand{margin:0 auto 50px}.brand>span,.rail-label,.rail nav label,.rail nav i,.rail-bottom{display:none}.rail nav button{justify-content:center;padding:14px 8px}.workspace{margin-left:76px}.topbar{height:90px}.customer-page{grid-template-columns:1fr;min-height:calc(100dvh - 90px)}.customer-intro{display:none}.phone-stage iframe{height:calc(100dvh - 145px);min-height:480px}.workflow-tabs{grid-template-columns:repeat(2,1fr)}.graph-layout{grid-template-columns:1fr}.node-detail{border-top:1px solid #e9ecf2;border-left:0;max-height:230px}.graph-stage{height:450px}.metrics{grid-template-columns:repeat(2,1fr)}.dashboard-grid{grid-template-columns:1fr}.flow-toolbar{align-items:flex-start;flex-direction:column}.flow-info{flex-direction:column}}@media(max-width:520px){.rail{width:57px;padding:22px 7px}.brand>b{width:34px;height:34px;border-radius:11px;font-size:20px}.rail nav button>span{font-size:21px}.workspace{margin-left:57px}.topbar{padding:16px;height:78px}.topbar h1{font-size:17px}.breadcrumb{font-size:9px}.public-badge{font-size:9px;padding:5px 7px}.avatar{display:none}.page{padding:18px 12px}.customer-page{padding:10px 7px}.phone-stage iframe{width:100%;height:calc(100dvh - 100px);border-radius:18px;min-height:400px}.section-heading h2{font-size:21px}.section-heading p{font-size:10px}.workflow-tab{padding:14px 10px}.workflow-tab b{font-size:12px}.workflow-tab span{font-size:9px}.flow-toolbar{padding:18px}.flow-actions .button{padding:9px 11px;font-size:10px}.graph-stage{height:370px}.metric{padding:16px 12px}.metric strong{font-size:23px}.panel{padding:20px}.panel-heading{align-items:flex-start;flex-direction:column}.flow-info{padding:12px 18px}}

.node-picker-label{display:flex;align-items:center;gap:7px;min-width:0;color:#9197a9}.node-picker-label select{font:inherit;max-width:240px;width:100%;border:1px solid #e1e5f0;background:white;border-radius:6px;padding:5px;color:#636c82}.flow-info{align-items:center;flex-wrap:wrap}.graph-stage{min-width:0}.node-picker-label select:focus-visible{outline:2px solid #ff97b5}@media(max-width:900px){.flow-info{align-items:flex-start}.node-picker-label{width:100%}}
.node-picker-label{flex-shrink:0;white-space:nowrap}.node-picker-label select{min-width:0}.flow-info>span:last-child{line-height:1.7}
