/* Settings → Tools and connections, and Connect agents (connections.js). Flat cards, quiet lines, accent for emphasis. */
#s-tools,#s-connect{max-width:1080px}
.cx-top{display:flex;align-items:center;gap:var(--sp-3);margin-bottom:var(--sp-4);flex-wrap:wrap}
.cx-top h2{margin:0;font-size:var(--fs-6);font-weight:600}
.cx-top .btn.ghost{color:var(--fg-2);padding-left:var(--sp-2)}
.cx-top .btn.ghost::before{content:"";width:6px;height:6px;border-left:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg);margin-right:2px}
.btn.cx-danger{color:var(--err)}.btn.cx-danger:hover{background:var(--err-soft)}
.cx-wait{display:flex;align-items:center;gap:var(--sp-2);color:var(--fg-2);padding:var(--sp-5) 0}
#s-tools .note,#s-connect .note{margin-bottom:var(--sp-3)}
#s-tools .ag-in,#s-connect .ag-in{color:var(--fg)}
#s-tools .ag-field>.dd,#s-connect .ag-field>.dd{width:100%;min-height:30px}
/* list */
.cx-list{padding:var(--sp-1) 0}
.cx-tab{width:100%;border-collapse:collapse;font-size:var(--fs-3)}
.cx-tab th{text-align:left;font-weight:500;font-size:var(--fs-2);color:var(--fg-3);padding:var(--sp-2) var(--sp-4);border-bottom:1px solid var(--line)}
.cx-tab td{padding:var(--sp-3) var(--sp-4);border-bottom:1px solid var(--line-soft);vertical-align:top}
.cx-tab tr:last-child td{border-bottom:0}
.cx-tab tbody tr{cursor:pointer}.cx-tab tbody tr:hover{background:var(--bg-2)}
.cx-tab tr.off td:first-child b{color:var(--fg-2)}
.cx-tab td:last-child{text-align:right;vertical-align:middle}
.cx-clip{max-width:300px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cx-empty{padding:var(--sp-6);display:flex;flex-direction:column;gap:var(--sp-2);align-items:flex-start}
.cx-empty b{font-size:var(--fs-4);font-weight:600}.cx-empty p{margin:0 0 var(--sp-2);max-width:640px}
.cx-rules .hint{margin:var(--sp-2) 0 0}
.cx-rules .kv b,.cx-over .kv b{max-width:70%}
/* wizard */
.cx-steps{list-style:none;display:flex;gap:var(--sp-1);margin:0 0 var(--sp-4);padding:0;flex-wrap:wrap}
.cx-steps li{display:flex;align-items:center;gap:var(--sp-2);padding:var(--sp-1) var(--sp-3) var(--sp-1) var(--sp-1);border-radius:var(--r-full);font-size:var(--fs-2);color:var(--fg-3);background:var(--bg-2)}
.cx-steps li i{font-style:normal;width:20px;height:20px;border-radius:var(--r-full);display:grid;place-items:center;background:var(--bg-4);color:var(--fg-2);font:500 var(--fs-1) var(--mono)}
.cx-steps li.on{background:var(--accent-soft);color:var(--accent-deep);font-weight:500}.cx-steps li.on i{background:var(--accent);color:var(--accent-fg)}
.cx-steps li.done{color:var(--fg-2)}.cx-steps li.done i{background:var(--ok-soft);color:var(--ok)}
.cx-wiz{padding:var(--sp-5);max-width:760px}
.cx-foot{display:flex;align-items:center;gap:var(--sp-2);margin-top:var(--sp-4);padding-top:var(--sp-4);border-top:1px solid var(--line-soft)}
.cx-2{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-3)}
.cx-ta{height:64px;padding:var(--sp-2);resize:vertical;line-height:18px}.cx-ta.tall{height:180px}
.cx-seg{display:inline-flex;gap:2px;padding:2px;border-radius:var(--r8);background:var(--bg-3);align-self:flex-start;margin-bottom:var(--sp-1)}
.cx-seg button{height:24px;padding:0 var(--sp-3);border-radius:5px;font-size:var(--fs-2);font-weight:500;color:var(--fg-2)}
.cx-seg button.on{background:var(--bg);color:var(--fg);box-shadow:var(--sh-1)}
.cx-file{display:flex;align-items:center;gap:var(--sp-3);cursor:pointer}.cx-file input{position:absolute;opacity:0;width:1px;height:1px}
.cx-file:focus-within .btn{outline:2px solid var(--accent);outline-offset:1px}
.cx-rows{display:flex;flex-direction:column;gap:var(--sp-2);align-items:flex-start;margin-bottom:var(--sp-3)}
.cx-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr) auto;gap:var(--sp-2);width:100%;align-items:center}
.cx-found{display:flex;flex-direction:column;gap:2px;margin-bottom:var(--sp-3)}.cx-found b{font-size:var(--fs-5);font-weight:600}
.cx-kv{display:flex;gap:var(--sp-6);flex-wrap:wrap;margin:var(--sp-2) 0}
.cx-kv>div{display:flex;flex-direction:column}.cx-kv span{font-size:var(--fs-2);color:var(--fg-3)}.cx-kv b{font-weight:600}
.cx-probe{flex-direction:column;gap:var(--sp-1);color:var(--fg)}.cx-probe.err{color:var(--err)}.cx-probe.err .cx-kv span{color:inherit;opacity:.8}
.cx-picks{max-height:420px;overflow:auto;border-radius:var(--r12);box-shadow:0 0 0 1px var(--line);padding:0 var(--sp-3)}
.cx-pick{display:grid;grid-template-columns:minmax(0,1fr) 110px;gap:var(--sp-3);align-items:center;border-bottom:1px solid var(--line-soft)}
.cx-pick:last-child{border-bottom:0}.cx-pick .dd{width:100%}
/* detail */
.cx-over{margin-bottom:0}
.cx-tools{padding:0 var(--sp-4)}
.cx-tool{border-bottom:1px solid var(--line-soft)}.cx-tool:last-child{border-bottom:0}
.cx-thead{display:grid;grid-template-columns:auto minmax(0,1fr) 96px auto;gap:var(--sp-3);align-items:center;padding:var(--sp-3) 0}
.cx-thead .ag-switch{padding:0}.cx-thead .ag-switch i{margin-top:0}
.cx-thead .dd{width:100%}
.cx-tname{display:flex;align-items:center;gap:var(--sp-2);flex-wrap:wrap;font-weight:600}.cx-tname .mono{font-size:var(--fs-3)}
.cx-tdesc{color:var(--fg-2);font-size:var(--fs-2);line-height:17px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.cx-tool.off .cx-tname .mono,.cx-tool.off .cx-tdesc{color:var(--fg-3)}
.cx-tbtns{display:flex;gap:2px}.cx-tbtns .btn.on{background:var(--accent-soft);color:var(--accent-deep)}
.cx-tbody{padding:0 0 var(--sp-4) 40px}
.cx-try{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:var(--sp-5)}
.cx-pre{background:var(--bg-2);border-radius:var(--r12);padding:var(--sp-3);max-height:340px;overflow:auto;white-space:pre-wrap;word-break:break-word;margin-top:var(--sp-1)}
.cx-pre.bad{background:var(--err-soft);color:var(--err)}
.cx-req{font-size:var(--fs-1);color:var(--accent-deep)}
.cx-cols{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-6)}
.cx-sub{font-family:var(--mono);font-size:var(--fs-1);letter-spacing:.08em;text-transform:uppercase;color:var(--fg-3);margin-bottom:var(--sp-3);display:block}
/* connect agents */
.cx-url{display:flex;flex-direction:column;gap:var(--sp-1);margin-bottom:var(--sp-3)}
.cx-urlbox{display:flex;align-items:center;gap:var(--sp-2);background:var(--bg-2);border-radius:var(--r8);padding:var(--sp-1) var(--sp-1) var(--sp-1) var(--sp-3)}
.cx-urlbox code{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cx-snip{margin-top:var(--sp-3)}.cx-snip .ag-row{margin:0}
@media (max-width:900px){.cx-cols,.cx-try,.cx-2{grid-template-columns:1fr}.cx-thead{grid-template-columns:auto minmax(0,1fr)}.cx-tbody{padding-left:0}}