.pair-flow{background:radial-gradient(ellipse at 18% 45%,#17352e66,transparent 50%),radial-gradient(ellipse at 85% 55%,#27274988,transparent 50%),#111721;border:1px solid #303d51;border-radius:16px;padding:24px;margin:0 0 26px;overflow:hidden}.flow-top{display:flex;justify-content:space-between;align-items:center;gap:12px}.flow-eyebrow{font-size:10px;letter-spacing:2px;color:#87b9ac}.flow-top h2{font-size:20px;font-weight:550;margin:10px 0}.flow-replay{background:#202d3b;border:1px solid #394b60;border-radius:7px;color:#b7c7dd;padding:10px 12px;font-size:12px;cursor:pointer}.flow-canvas{position:relative;height:260px;max-width:800px;margin:14px auto}.flow-wires{position:absolute;inset:0;width:100%;height:100%}.wire{fill:none;stroke:#3a695e;stroke-width:1.5;stroke-dasharray:5 7;opacity:.6}.wire-feedback{stroke:#68618d}.packet{opacity:0}.flow-agent{position:absolute;top:52px;display:flex;flex-direction:column;align-items:center;width:29%;min-height:160px;background:#15241f;border:1px solid #3a6659;border-radius:14px;color:#daf1e7;padding:15px 12px;cursor:pointer;transition:box-shadow .35s,transform .35s}.flow-nav{left:0}.flow-driver{right:0;background:#1d1d32;border-color:#504c78;color:#e0dff9}.flow-avatar{display:grid;place-items:center;width:43px;height:43px;border-radius:12px;background:#274c40;color:#abf1d2;font-size:24px;font-weight:650}.flow-driver .flow-avatar{background:#393353;color:#cbc2ff}.flow-agent strong{font-size:16px;margin:10px 0 5px}.agent-job{font-size:10px;color:#87a899}.flow-driver .agent-job{color:#9992b6}.agent-state{font-size:11px;border:1px solid #476251;border-radius:20px;padding:4px 8px;margin:10px 0}.flow-driver .agent-state{border-color:#565079}.agent-preview{font-size:10px;max-width:170px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#7f8b9f}.handoff{position:absolute;left:31%;width:38%;text-align:center;pointer-events:none}.handoff-plan{top:42px}.handoff-feedback{bottom:26px}.handoff span{display:block;font-size:12px;color:#b6dacb;background:#121d23;max-width:180px;margin:auto;padding:6px 10px;border-radius:6px}.handoff-feedback span{color:#b4ace0}.handoff b{display:block;font-size:9px;font-weight:400;color:#73889a;margin:5px}.flow-bottom{display:flex;justify-content:space-between;gap:12px;border-top:1px solid #2a3547;padding:15px 0 3px;align-items:center}.flow-round{color:#e1e9f5;background:#263546;font-size:11px;padding:5px 10px;border-radius:6px;white-space:nowrap}.flow-phase{font-size:12px;color:#9bd7c3}.flow-mode{color:#738297;font-size:10px}.flow-message{margin-top:16px;background:#0d131d;border:1px solid #243246;border-radius:9px;padding:15px}.flow-message-label{font-size:10px;letter-spacing:1px;color:#627b91}.flow-message p{font-size:12px;color:#a8bace;line-height:1.8;margin:7px 0 0}.flow-steps{display:flex;gap:8px;margin-top:14px}.flow-steps span{flex:1;font-size:10px;color:#6d7c92;padding:8px;text-align:center;border-radius:6px;background:#171e2a}.flow-steps .done{color:#87bda9}.flow-steps .current{background:#263d35;color:#b1e8d5}.pair-flow[data-phase=driver] .wire-plan,.pair-flow[data-phase=review] .wire-feedback{stroke-width:2.5;opacity:1;filter:drop-shadow(0 0 5px #70d7b288)}.pair-flow[data-phase=driver] .packet-plan,.pair-flow[data-phase=review] .packet-feedback{opacity:1}.pair-flow[data-phase=plan] .flow-nav,.pair-flow[data-phase=review] .flow-nav{animation:nav-pulse 1.8s ease-in-out infinite}.pair-flow[data-phase=driver] .flow-driver{animation:driver-pulse 1.8s ease-in-out infinite}.flow-replaying .flow-mode{color:#e0ba7f}.flow-dialog{background:#121d2a;border:1px solid #40546c;border-radius:14px;color:#dbe6f4;max-width:750px;width:90vw;max-height:80vh;padding:25px}.flow-dialog::backdrop{background:#04070cbb}.flow-close{float:right;background:#26374d;color:#cedef1;border:0;border-radius:6px;padding:8px;cursor:pointer}.flow-dialog pre{clear:both;margin-top:20px}.flow-dialog h3{font-size:17px;font-weight:500}@keyframes nav-pulse{50%{box-shadow:0 0 28px #70d7b240;transform:translateY(-2px)}}@keyframes driver-pulse{50%{box-shadow:0 0 28px #a295ec40;transform:translateY(-2px)}}@media(prefers-reduced-motion:reduce){.flow-agent{animation:none!important;transition:none}.packet{display:none}}@media(max-width:680px){.pair-flow{padding:14px}.flow-top{align-items:flex-start}.flow-top h2{font-size:17px}.flow-replay{font-size:10px;padding:8px}.flow-agent{width:30%;padding:13px 5px}.flow-agent strong{font-size:13px}.agent-preview{max-width:90px}.agent-job{font-size:8px}.handoff span{font-size:10px;padding:5px}.flow-bottom{flex-wrap:wrap}.flow-mode{width:100%}.flow-steps span{font-size:9px;padding:7px 2px}}