.control-demo{padding:18px;overflow:hidden;min-height:0}.control-stage{position:relative;width:100%;height:100%;min-height:320px;border:1px solid rgba(15,107,104,.32);border-radius:var(--radius);background:#f9fbf9;overflow:hidden}.control-network{position:absolute;inset:0;z-index:1;opacity:.58;transition:opacity .35s ease,filter .35s ease}.control-network-links{position:absolute;inset:0;width:100%;height:100%;z-index:1;pointer-events:none}.control-network-link{fill:none;stroke:rgba(15,107,104,.26);stroke-width:1.6;vector-effect:non-scaling-stroke;transition:stroke .25s ease,stroke-width .25s ease,opacity .25s ease}.control-network-pulse{fill:var(--accent);opacity:.28}.control-network .control-system{opacity:.68;pointer-events:none;transition:opacity .25s ease,transform .25s ease,background .25s ease,border-color .25s ease,color .25s ease,box-shadow .25s ease}.control-network .control-system.is-trace-active{opacity:1;transform:scale(1.08);background:#fff;color:var(--accentDark);border-color:var(--accent);box-shadow:0 0 0 8px rgba(15,107,104,.08),0 10px 28px rgba(15,107,104,.11)}.control-network .control-system.is-trace-complete{opacity:.84;color:var(--accentDark);border-color:rgba(15,107,104,.38);background:#f6fbf9}.control-network .control-system.is-approval{opacity:1;transform:scale(1.1);border-color:#b48a19;background:#fffaf0;color:#7b6116;box-shadow:0 0 0 9px rgba(180,138,25,.09)}.control-network .slot-1{left:6%;top:26%}.control-network .slot-2{left:28%;top:19%}.control-network .slot-3{right:28%;top:19%}.control-network .slot-4{right:6%;top:26%}.control-network .slot-5{left:5%;top:53%}.control-network .slot-6{right:5%;top:53%}.control-network .slot-7{left:6%;bottom:7%}.control-network .slot-8{left:28%;bottom:7%}.control-network .slot-9{right:28%;bottom:7%}.control-network .slot-10{right:6%;bottom:7%}.control-you-node{opacity:.48;transform:translate(-50%,-50%) scale(.9);box-shadow:none}.control-work-item{fill:var(--accentDark);opacity:.52}.control-work-item.is-selected{fill:#fff;stroke:var(--accentDark);stroke-width:2.2;opacity:1;filter:drop-shadow(0 0 5px rgba(15,107,104,.5))}.control-load{position:absolute;z-index:5;left:15px;top:14px;display:flex;align-items:baseline;gap:7px;padding:7px 10px;border:1px solid rgba(15,107,104,.28);border-radius:8px;background:rgba(255,255,255,.92);color:var(--accentDark)}.control-load strong{font-size:20px;line-height:1}.control-load span{font-size:9px;font-weight:850;text-transform:uppercase;letter-spacing:.06em}.control-cybtronix-label{position:absolute;z-index:5;left:14px;bottom:11px;display:flex;align-items:baseline;gap:8px;padding:5px 8px;border-radius:6px;background:rgba(250,249,245,.92);color:var(--accentDark)}.control-cybtronix-label strong{font-size:10px;font-weight:950;letter-spacing:.05em}.control-cybtronix-label span{font-size:9px;font-weight:750;color:var(--muted)}
.control-foreground{position:absolute;z-index:7;left:220px;right:16px;top:18px;bottom:18px;display:grid;grid-template-columns:minmax(0,1fr) minmax(230px,270px);gap:16px;min-width:0;min-height:0;align-items:stretch}.control-trace{position:relative;min-width:0;min-height:0;height:100%;padding:13px 15px;border:1px solid var(--ink);border-radius:10px;background:rgba(255,255,255,.975);box-shadow:0 20px 54px rgba(21,26,30,.14);overflow:hidden}.control-trace-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px}.control-trace h3{margin:0;font-size:21px;line-height:1.05}.control-trace-status{flex:0 0 auto;padding:4px 7px;border:1px solid rgba(15,107,104,.3);border-radius:999px;background:#f6fbf9;color:var(--accentDark);font-size:8px;font-weight:850;text-transform:uppercase;transition:color .25s ease,border-color .25s ease,background .25s ease}.control-trace-status.is-approval{border-color:rgba(180,138,25,.45);background:#fffaf0;color:#7b6116}.control-trace-status.is-complete{background:var(--accentDark);border-color:var(--accentDark);color:#fff}.control-trace-list{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:2px}.control-trace-list li{display:grid;grid-template-columns:42px 78px minmax(0,1fr);gap:7px;align-items:center;min-height:22px;padding:3px 6px;border-radius:5px;color:var(--muted);font-size:9px;line-height:1.15;opacity:0;transform:translateY(3px);transition:opacity .25s ease,transform .25s ease,background .25s ease,color .25s ease}.control-trace-list li.is-visible{opacity:1;transform:translateY(0)}.control-trace-list li.is-current{background:#f5faf8;color:var(--ink)}.control-trace-list li.is-approval{background:#fff9ec;color:#6f5919}.control-trace-list li.is-human{background:#f3f0ff;color:#4d456c}.control-trace-list time{font-variant-numeric:tabular-nums;font-weight:750}.control-trace-list b{font-size:8px;text-transform:uppercase;letter-spacing:.04em}.control-trace-list span{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.control-side{min-width:0;min-height:0;display:grid;grid-template-rows:minmax(0,1fr) auto;gap:10px}.control-policy{position:relative;min-width:0;min-height:0;padding:12px 13px;border:1px solid rgba(15,107,104,.3);border-radius:9px;background:rgba(255,255,255,.97);box-shadow:0 16px 42px rgba(21,26,30,.1);opacity:0;transform:translateY(-6px);pointer-events:none;transition:opacity .35s ease,transform .35s ease;overflow:hidden}.control-policy.is-visible{opacity:1;transform:translateY(0)}.control-policy h3{margin:1px 0 6px;font-size:15px;line-height:1.15}.control-policy dl{margin:0;display:grid;gap:1px}.control-policy dl div{display:flex;justify-content:space-between;gap:8px;padding:4px 0;border-bottom:1px solid #ebe6dc;font-size:9px}.control-policy dl div:last-child{border-bottom:0}.control-policy dt{color:var(--muted)}.control-policy dd{margin:0;font-weight:800;text-align:right}.control-policy .limit dd{color:#7b6116}.control-policy .restricted dd{color:#8d3b30}.control-policy-note{margin:5px 0 0;padding-top:5px;border-top:1px solid #ebe6dc;color:var(--muted);font-size:8px;line-height:1.3}.control-approval{min-height:105px;padding:10px 11px;border:1px solid rgba(180,138,25,.32);border-radius:8px;background:#fffbf2;opacity:0;visibility:hidden;transform:translateY(5px);pointer-events:none;transition:opacity .3s ease,transform .3s ease,visibility 0s linear .3s}.control-approval.is-visible{opacity:1;visibility:visible;transform:translateY(0);pointer-events:auto;transition-delay:0s}.control-approval small{display:block;color:#7b6116;font-size:8px;font-weight:850;text-transform:uppercase}.control-approval strong{display:block;margin-top:1px;font-size:16px;line-height:1.1}.control-approval p{margin:3px 0 7px;color:var(--muted);font-size:9px;line-height:1.25}.control-approve{width:100%;min-height:34px;padding:7px 9px;font-size:11px}.control-approve.is-attention{animation:workflowAttention 1.45s ease-in-out infinite}.control-note{margin:10px 0 0;color:var(--muted);font-size:12px;text-align:center}.control-next:disabled{opacity:.22;cursor:default;filter:saturate(.4);box-shadow:none}.control-next.is-ready{opacity:1;filter:none;animation:workflowNext 1.45s ease-in-out infinite}
@media(prefers-reduced-motion:reduce){.control-network-pulse,.control-work-item{display:none}.control-approve.is-attention,.control-next.is-ready{animation:none}.control-trace-list li,.control-policy,.control-approval{transition:none}}
@media(max-width:1199px){.control-foreground{left:150px;grid-template-columns:minmax(0,1fr) 240px;gap:12px}.control-trace{padding:12px}.control-trace-list li{grid-template-columns:38px 70px minmax(0,1fr);gap:5px}.control-policy{padding:10px}.control-approval{min-height:102px;padding:9px}}
@media(max-width:900px){.control-foreground{left:76px;right:10px;grid-template-columns:minmax(0,1fr) 220px;gap:9px}.control-trace-status{max-width:112px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.control-policy-note{display:none}}
@media(max-width:767px){.control-demo{padding:10px}.control-stage{min-height:650px}.control-network .complexity-node{width:86px;font-size:10px}.control-network .slot-1{left:2%;top:18%}.control-network .slot-2{left:35%;top:15%}.control-network .slot-3{right:2%;top:18%}.control-network .slot-4{right:2%;top:34%}.control-network .slot-5{left:2%;top:34%}.control-network .slot-6{right:2%;top:49%}.control-network .slot-7{left:2%;bottom:4%}.control-network .slot-8{left:35%;bottom:4%}.control-network .slot-9{right:2%;bottom:4%}.control-network .slot-10{right:2%;bottom:18%}.control-load{left:8px;top:8px}.control-cybtronix-label{left:8px;bottom:8px}.control-foreground{left:8px;right:8px;top:58px;bottom:42px;grid-template-columns:1fr;grid-template-rows:minmax(270px,1fr) auto;gap:8px}.control-side{grid-template-columns:1fr 1fr;grid-template-rows:auto;gap:8px}.control-trace{height:auto}.control-trace-list li{grid-template-columns:36px 64px minmax(0,1fr);gap:4px;font-size:8px}.control-policy,.control-approval{min-height:0}.control-policy-note{display:none}.control-approve{font-size:10px}}