.node-link { box-sizing:border-box; margin:18px 0; padding:clamp(16px,3vw,26px); border:1px solid #644e83; border-radius:18px; background:radial-gradient(ellipse at top right,#bc39812b,transparent 65%),linear-gradient(130deg,#142334,#171326); color:#e9e5f6; }
.node-link *, .node-link *::before, .node-link *::after { box-sizing:border-box; }
.node-link-heading { display:flex; justify-content:space-between; align-items:flex-start; flex-wrap:wrap; gap:16px; }
.node-link h2 { margin:5px 0; font-size:clamp(21px,3vw,28px); } .node-link h3 { font-size:17px; margin:12px 0; }
.node-link p { color:#c6c4d7; line-height:1.65; max-width:80ch; }
.node-link .node-link-kicker { font:700 11px/1.5 Consolas,monospace; letter-spacing:.14em; color:#91e8d1; margin:0; }
.node-link-steps { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,250px),1fr)); gap:14px; margin-top:20px; }
.node-link-steps > section { min-width:0; padding:18px; border:1px solid #79658866; border-radius:12px; background:#080d1a88; }
.node-link-step { display:block; color:#bc97ed; font:700 11px/1.5 Consolas,monospace; letter-spacing:.12em; margin-bottom:16px; }
.node-link label { display:block; margin-bottom:9px; font-weight:600; }
.node-link input { display:block; width:100%; min-width:0; padding:12px; color:#f8f3ff; background:#080e20; border:1px solid #667387; border-radius:8px; font:inherit; }
.node-link button, .node-link-shortcut { max-width:100%; min-height:42px; padding:10px 14px; margin-top:12px; border:1px solid #aa71d9; border-radius:9px; background:linear-gradient(120deg,#643582,#863766); color:#fff; font:600 13px/1.4 inherit; cursor:pointer; white-space:normal; }
.node-link button:disabled { opacity:.5; cursor:default; }
.node-link button:focus-visible,.node-link input:focus-visible { outline:2px solid #75ead3; outline-offset:3px; }
.node-link small { display:block; margin-top:10px; color:#b8b5cb; line-height:1.6; }
.node-link-state { border:1px solid #997aaf; padding:7px 12px; border-radius:20px; font-size:12px; background:#23192c; }
.node-link-state[data-connected=true] { border-color:#6ce8c7; color:#81f2d3; background:#12372f; }
.node-link-actions { display:flex; flex-wrap:wrap; gap:10px; align-items:center; }
.node-link-actions input { flex:1 1 150px; } .node-link-actions button { margin:0; }
#node-link-code { display:block; font:700 clamp(28px,5vw,42px)/1.5 Consolas,monospace; letter-spacing:.12em; color:#8defd4; margin:12px 0 0; }
.node-link-first { margin-top:16px; padding:16px; border-left:3px solid #dfa2d9; background:#301f3d77; }
.node-link-fingerprint,#node-link-identity,#node-link-binding { overflow-wrap:anywhere; font:13px/1.7 Consolas,monospace; }
.node-link details { border-top:1px solid #80718b55; margin-top:16px; padding-top:14px; }
.node-link [hidden] { display:none!important; }
@media(max-width:560px) { .node-link-actions { align-items:stretch; flex-direction:column; } .node-link-actions input { flex-basis:auto; } .node-link button { width:100%; } }