body.dx-open{overflow:hidden}
#cpp-demo{--dx-blue:#456af3;--dx-text:#242933;--dx-sub:#7d8694;box-sizing:border-box;width:min(1400px,calc(100vw - 40px));max-width:none;height:min(900px,calc(100dvh - 40px));max-height:none;margin:auto;padding:0;border:1px solid #e0e5ef;border-radius:16px;background:#e4e9f1;color:var(--dx-text);font:14px/1.6 "PingFang SC",-apple-system,BlinkMacSystemFont,"Microsoft YaHei",sans-serif;box-shadow:0 24px 100px #1e315340;overflow:hidden}
#cpp-demo::backdrop{background:#17243c75;backdrop-filter:blur(5px)}
#cpp-demo[open]{display:flex;flex-direction:column}
#cpp-demo *{box-sizing:border-box}#cpp-demo h2,#cpp-demo h3,#cpp-demo p{margin:0;letter-spacing:normal}#cpp-demo h2{font-size:24px;line-height:1.4}#cpp-demo h3{font-size:16px;line-height:1.5}#cpp-demo button,#cpp-demo input,#cpp-demo select{font:inherit}#cpp-demo button{cursor:pointer}#cpp-demo button:disabled{cursor:default;opacity:.6}#cpp-demo button:focus-visible,#cpp-demo a:focus-visible,#cpp-demo input:focus-visible,#cpp-demo select:focus-visible,#cpp-demo summary:focus-visible{outline:3px solid #84a5ff;outline-offset:3px}#cpp-demo .dx-focus:focus{outline:none}#cpp-demo small{font-size:12px}#cpp-demo .dx-muted{color:var(--dx-sub);font-size:12px;margin-top:15px}
.dx-header{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:14px 22px;background:#f8faff;flex-shrink:0}.dx-brand,.dx-header-actions{display:flex;align-items:center;gap:12px}.dx-brand strong{font-size:17px}.dx-logo{display:grid;place-items:center;width:32px;height:32px;background:#4372ff;color:white;border-radius:50%;font-size:18px}.dx-badge{font-size:12px;color:#456af3;background:#edf2ff;border-radius:4px;padding:2px 8px}.dx-notice{padding:7px 22px;color:#68758a;background:#eef2f9;font-size:12px;flex-shrink:0}
#cpp-demo .dx-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:6px 14px;min-height:34px;border:1px solid #dde2ec;background:white;border-radius:6px;color:#414956;white-space:nowrap;text-decoration:none;font-size:13px;font-weight:500}#cpp-demo .dx-btn:hover{background:#f0f4ff;border-color:#a9baff}#cpp-demo .dx-btn.dx-primary{background:var(--dx-blue);border-color:var(--dx-blue);color:white}#cpp-demo .dx-btn.dx-primary:hover{background:#365de7}.dx-picker{padding:50px 42px;overflow:auto;background:#f8faff;flex:1}.dx-eyebrow{color:#456af3;display:block;margin-bottom:14px;font-size:13px}.dx-picker>p{color:#7d8694;margin-top:15px!important}.dx-scene-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin:32px 0}.dx-scene{text-align:left;padding:28px;border:1px solid #dde4f1;border-radius:12px;background:white;color:#242933}.dx-scene:hover{border-color:#819eff;box-shadow:0 8px 25px #5878c512;transform:translateY(-2px)}.dx-scene img{width:46px;height:46px;display:block;margin-bottom:25px}.dx-scene small{color:#8190a5;display:block;margin-bottom:8px}.dx-scene h3{font-size:22px!important}.dx-scene p{color:#7d8694;margin:12px 0 24px!important}.dx-scene span{display:block;color:#7d8694;font-size:12px}.dx-scene b{display:block;color:#456af3;margin-top:28px}
.dx-workspace{display:grid;grid-template-columns:180px minmax(0,1fr);gap:6px;padding:6px;min-height:0;flex:1}.dx-sidebar{padding:24px 10px;position:relative}.dx-side-title{font-weight:600;padding:0 10px 20px}.dx-nav{display:flex;align-items:center;gap:12px;border:0;background:transparent;border-radius:9px;padding:12px;width:100%;color:#626d80;margin:4px 0;text-align:left}.dx-nav img{width:24px;height:24px}.dx-nav.active{background:white;color:#2c3546;font-weight:600}.dx-side-foot{font-size:12px;color:#8590a0;position:absolute;bottom:22px;left:20px;right:20px}.dx-main{background:#f8f9fc;border-radius:9px;overflow:auto;min-width:0;scrollbar-gutter:stable;display:flex;flex-direction:column}.dx-context{padding:18px 24px;display:flex;align-items:center;gap:12px;background:white;border-bottom:1px solid #edf0f5}.dx-avatar{flex-shrink:0;display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:#4775ef;color:white;font-size:13px}.dx-context b{font-size:16px}.dx-context small{display:block;color:#8a93a1}.dx-context>.dx-tag{margin-left:auto}.dx-tag{display:inline-block;padding:2px 8px;border-radius:4px;color:#647baf;background:#eef3fd;font-size:12px;font-weight:400;margin-left:8px;white-space:nowrap}.dx-body{padding:24px;flex:1;min-width:0}.dx-section-head{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:24px}.dx-section-head p{color:#7d8694;margin-top:8px!important;font-size:13px}.dx-steps{display:flex;list-style:none;gap:0;padding:0;margin:0 0 26px;border-bottom:1px solid #e2e7f1}.dx-steps li{padding:10px 14px 15px;color:#8993a3;flex:1;display:flex;align-items:center;gap:10px;font-size:13px;border-bottom:2px solid transparent}.dx-steps span{display:inline-grid;place-items:center;width:24px;height:24px;border-radius:50%;background:#eef0f5;font-size:12px}.dx-steps li.active{color:#456af3;border-color:#456af3;font-weight:600}.dx-steps li.active span{background:#e9efff}.dx-steps li.done{color:#399573}.dx-table-wrap{overflow-x:auto;border:1px solid #e1e6ef;border-radius:9px;background:#fff}#cpp-demo table{width:100%;border-collapse:collapse;white-space:nowrap;font-size:13px}#cpp-demo th,#cpp-demo td{padding:15px 17px;border-bottom:1px solid #edf0f5;text-align:left}#cpp-demo th{background:#f3f5f9;color:#737e8f;font-size:12px;font-weight:500}#cpp-demo td b{font-weight:500}#cpp-demo td small{display:block;color:#939cac;margin-top:4px}#cpp-demo tbody tr:last-child td{border-bottom:0}#cpp-demo .dx-num{text-align:right;font-variant-numeric:tabular-nums}#cpp-demo tfoot th{background:#f0f5ff;color:#4c618d}#cpp-demo input[type=checkbox]{accent-color:#456af3;width:16px;height:16px;vertical-align:middle}.dx-action-bar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:24px;font-size:13px;color:#758198}.dx-field{display:flex;flex-direction:column;gap:7px;margin:0 0 17px;font-size:13px;color:#5e6878}#cpp-demo .dx-field input,#cpp-demo .dx-field select{width:100%;min-height:36px;background:white;border:1px solid #dce2eb;border-radius:6px;padding:7px 10px;color:#2c3442;font-size:14px}.dx-field input::placeholder{color:#a2a9b6}.dx-success{display:flex;align-items:center;gap:14px;background:#edf8f3;border:1px solid #d4ebdf;border-radius:9px;padding:18px;margin-bottom:22px}.dx-success>span{background:#42a87e;color:white;border-radius:50%;width:28px;height:28px;display:grid;place-items:center}.dx-success p{font-size:12px;color:#6d8a7b;margin-top:4px!important}.dx-ledger{margin-top:24px}.dx-ledger h3{margin-bottom:15px!important}.dx-source{padding:15px 18px;background:white;border:1px solid #e2e7ef;border-radius:9px;margin-top:15px}.dx-source summary{color:#456af3;cursor:pointer;font-size:13px}.dx-source p{padding-top:12px;font-size:12px;display:flex;justify-content:space-between;gap:16px}.dx-finish{display:flex;align-items:center;justify-content:space-between;gap:20px;border-top:1px solid #e2e7f0;margin-top:26px;padding-top:22px}.dx-finish p{color:#7c889b;font-size:12px;margin-top:5px!important}.dx-footer{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 24px;background:#fff;border-top:1px solid #e6eaf2;font-size:12px;color:#8994a4}.dx-reset-confirm{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.dx-error{background:#fff1f0;border:1px solid #ffd3ce;border-radius:6px;padding:10px 14px;color:#b74637;margin-top:18px!important}#dx-feedback:empty{display:none}.dx-metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:#e4e9f2;border:1px solid #e4e9f2;border-radius:9px;overflow:hidden;margin:20px 0}.dx-metrics>div{background:#fff;padding:20px 15px}.dx-metrics small{color:#8892a2;display:block}.dx-metrics b{font-size:21px;display:block;margin-top:8px;font-variant-numeric:tabular-nums;font-weight:600}.dx-metrics .highlight{background:#eef5ff}.dx-metrics .highlight b{color:#456af3}.dx-project-grid{display:grid;grid-template-columns:minmax(240px,1fr) 1.1fr;gap:20px}.dx-panel{padding:22px;background:#fff;border:1px solid #e0e5ee;border-radius:12px}.dx-panel h3{margin-bottom:20px!important}.dx-panel .dx-btn[type=submit]{width:100%}.dx-chart-key{display:flex;align-items:baseline;gap:10px;margin:18px 0}.dx-chart-key b{font-size:34px;letter-spacing:-1px;color:#456af3}.dx-chart-key span,.dx-chart p,.dx-chart small{color:#8a94a4;font-size:12px}.dx-bar-row{display:grid;grid-template-columns:1fr auto;font-size:12px;margin:15px 0;color:#768297;gap:8px}.dx-bar-row strong{font-weight:500;color:#434f60}.dx-bar-row>div{grid-column:1/-1;background:#f0f3f9;border-radius:5px;height:12px;overflow:hidden}.dx-bar-row i{display:block;height:100%;background:#597cf4;border-radius:5px}.dx-bar-row i.cost{background:#50bca0}.dx-chart p{margin:20px 0 10px!important}.dx-companies{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:25px}.dx-companies button{display:flex;align-items:center;gap:10px;text-align:left;background:white;border:1px solid #e0e6ef;padding:14px;border-radius:9px;color:#454e5e}.dx-companies button.active{border-color:#6388ff;background:#f0f4ff}.dx-companies b{font-size:13px}.dx-companies small{color:#8a95a8;display:block;margin-top:3px}.dx-task-head{display:flex;justify-content:space-between;align-items:center}.dx-task-head small{color:#909aab}.dx-task-head h3{margin-top:4px!important}.dx-status{background:#fff5dc;color:#af8427;border-radius:4px;padding:3px 9px;font-size:12px}.dx-status.review{background:#edf2ff;color:#5075d6}.dx-status.done{background:#eaf7f0;color:#3a9872}.dx-material{padding:16px 18px;border-radius:8px;background:#f6f8fc;margin-bottom:18px}.dx-material>div{display:flex;gap:12px;align-items:center}.dx-material img{width:28px;height:28px}.dx-material p{font-size:12px;color:#8490a2;margin-top:5px!important}.dx-material summary{cursor:pointer;color:#456af3;font-size:12px;margin-top:15px}.dx-check{display:flex;gap:10px;align-items:center;font-size:13px;margin:20px 0}.dx-assignee{max-width:300px}.dx-done{color:#399573}
@media(max-width:1100px){.dx-workspace{grid-template-columns:150px minmax(0,1fr)}.dx-body{padding:20px}.dx-metrics b{font-size:18px}.dx-companies{grid-template-columns:1fr}.dx-companies button{padding:10px}.dx-companies button>div{display:flex;justify-content:space-between;gap:10px;align-items:center;flex:1}.dx-scene-grid{gap:12px}.dx-scene{padding:20px}}
@media(max-width:680px){#cpp-demo{width:100vw;height:100dvh;border:0;border-radius:0}.dx-header{padding:12px;gap:8px}.dx-brand{gap:6px}.dx-brand strong{font-size:14px}.dx-logo{width:28px;height:28px;font-size:16px}.dx-badge{display:none}.dx-header-actions{gap:6px}#cpp-demo .dx-btn{min-height:44px;padding:7px 12px}.dx-header .dx-btn{font-size:12px!important;padding:6px 9px!important}.dx-notice{padding:8px 12px;font-size:11px}.dx-picker{padding:28px 20px}.dx-scene-grid{grid-template-columns:1fr;margin-top:24px}.dx-scene{padding:22px}.dx-scene img{width:36px;height:36px;margin-bottom:16px}.dx-scene b{margin-top:16px}.dx-workspace{display:flex;flex-direction:column;padding:4px;gap:4px}.dx-sidebar{padding:4px;display:flex;gap:4px}.dx-side-title,.dx-side-foot{display:none}.dx-nav{padding:10px 6px;font-size:12px;gap:6px;justify-content:center;margin:0}.dx-nav img{width:19px;height:19px}.dx-main{flex:1;border-radius:9px}.dx-context{padding:15px 14px}.dx-context b{font-size:14px}.dx-context .dx-tag{display:none}.dx-body{padding:20px 14px}#cpp-demo h2{font-size:21px}.dx-steps li{padding:8px 2px 12px;gap:5px;font-size:11px}.dx-steps span{width:20px;height:20px;flex-shrink:0}.dx-section-head{gap:10px;align-items:flex-start}.dx-section-head>.dx-tag{display:none}.dx-action-bar,.dx-finish{align-items:stretch;flex-direction:column}.dx-action-bar .dx-btn{width:100%}.dx-metrics{grid-template-columns:1fr 1fr}.dx-metrics b{font-size:20px}.dx-metrics>div{padding:14px 10px}.dx-project-grid{grid-template-columns:1fr;gap:14px}.dx-panel{padding:18px 14px}#cpp-demo .dx-field input,#cpp-demo .dx-field select{min-height:44px;font-size:16px}.dx-companies button>div{display:block}.dx-footer{flex-wrap:wrap;padding:14px}.dx-footer>span:first-child{font-size:11px}.dx-reset-confirm{width:100%}.dx-source p{flex-direction:column;gap:3px}.dx-success{padding:15px;align-items:flex-start}.dx-success>span{flex-shrink:0}.dx-success b{font-size:13px}.dx-finish .dx-btn{white-space:normal}.dx-table-wrap{max-width:100%}}
/* Separate the experience title bar from the working surface. */
#cpp-demo .dx-header{background:#eaf0fc;padding-top:18px;padding-bottom:12px}
#cpp-demo .dx-notice{background:#eaf0fc;border-bottom:1px solid #cbd8ec;padding-bottom:12px;color:#63748f}
#cpp-demo .dx-badge{background:#fff;color:#4265cb;border:1px solid #d6e0f5}
#cpp-demo .dx-picker{background:#f7f9fc}
#cpp-demo .dx-context{border-bottom:1px solid #dae2ef}
@media(max-width:680px){#cpp-demo .dx-header{padding-top:12px;padding-bottom:10px}#cpp-demo .dx-notice{padding-bottom:10px}}