.connect-section{--cn-card:#1D2734;--cn-card-line:#364457;--cn-tile:#2A3646;--cn-pink:#EC407A;--cn-wa-green:#25D366;--cn-wa-chat:#EFEAE2;--cn-wa-bubble:#D9FDD3;--cn-wa-tick:#53BDEB;--cn-ok-bg:#DCFCE7;--cn-ok-line:#86EFAC;--cn-ok-text:#15803D;--cn-link:#9FB7B0}.connect-stage{--u:1.25cqw;position:relative;display:grid;grid-template-rows:auto auto;align-content:center;justify-items:center;height:100%;padding-bottom:50px;container-type:inline-size;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',sans-serif;line-height:1.3}.cn-card{display:flex;grid-area:1 / 1;width:72%;flex-direction:column;gap:calc(var(--u) * 2.4);padding:calc(var(--u) * 2.4);border:1px solid var(--cn-card-line);border-radius:calc(var(--u) * 1.4);background:var(--cn-card);opacity:0;visibility:hidden;transform:translateY(calc(var(--u) * 1.5));transition:opacity .45s ease,transform .45s ease,visibility .45s ease}.cn-card.is-active{opacity:1;visibility:visible;transform:none}.cn-card-top{display:flex;align-items:flex-start;gap:calc(var(--u) * 1.6)}.cn-card-icon{display:grid;flex:none;place-items:center;width:calc(var(--u) * 5.4);height:calc(var(--u) * 5.4);border-radius:calc(var(--u) * 1);background:var(--cn-tile);color:var(--cn-pink)}.cn-card-icon svg{width:calc(var(--u) * 2.6);height:calc(var(--u) * 2.6)}.cn-card-whatsapp .cn-card-icon{color:var(--cn-wa-green)}.cn-card-text{display:flex;flex-direction:column;gap:calc(var(--u) * .4);min-width:0}.cn-card-text b{font-size:calc(var(--u) * 1.75);font-weight:600;color:#E5E9F0}.cn-card-text small{font-size:calc(var(--u) * 1.45);color:#8C99AA}.cn-card-help{display:inline-flex;flex:none;align-items:center;gap:calc(var(--u) * .5);margin-left:auto;font-size:calc(var(--u) * 1.4);color:#AEB8C6}.cn-card-help svg{width:calc(var(--u) * 1.8);height:calc(var(--u) * 1.8)}.cn-card-bottom{display:flex;align-items:center;justify-content:space-between;margin-top:auto}.cn-card-status{font-size:calc(var(--u) * 1.45);color:#AEB8C6}.cn-card-pill{display:none;align-items:center;gap:calc(var(--u) * .5);padding:calc(var(--u) * .3) calc(var(--u) * 1);border:1px solid var(--cn-ok-line);border-radius:calc(var(--u) * 2);background:var(--cn-ok-bg);font-size:calc(var(--u) * 1.4);font-weight:600;color:var(--cn-ok-text);animation:cn-pop .35s ease both}.cn-card-pill svg{width:calc(var(--u) * 1.5);height:calc(var(--u) * 1.5)}.cn-card-button{padding:calc(var(--u) * .9) calc(var(--u) * 1.6);border-radius:calc(var(--u) * .6);background:var(--cn-pink);font-size:calc(var(--u) * 1.7);font-weight:500;color:#fff;transition:transform .15s ease}.cn-card-button.is-pressed{transform:scale(.92)}.cn-card-manage{display:none}.cn-card.is-connected .cn-card-status,.cn-card.is-connected .cn-card-connect{display:none}.cn-card.is-connected .cn-card-pill{display:inline-flex}.cn-card.is-connected .cn-card-manage{display:inline}.cn-extra{grid-area:2 / 1;align-self:start;margin-top:calc(var(--u) * 3.5);opacity:0;visibility:hidden;transform:translateY(calc(var(--u) * 1.5));transition:opacity .45s ease,transform .45s ease,visibility .45s ease}.connect-stage[data-scene="whatsapp"] .cn-wa,.connect-stage[data-scene="emr"] .cn-his,.connect-stage[data-scene="lan"] .cn-network{opacity:1;visibility:visible;transform:none}.cn-path{position:relative;height:calc(var(--u) * 9);border-left:2px dashed var(--cn-link)}.cn-wa{display:flex;flex-direction:column;align-items:center;width:48%;margin-top:0}.cn-wa .cn-path{height:calc(var(--u) * 5)}.cn-chat{width:100%;overflow:hidden;border:1px solid #DCE5E2;border-radius:calc(var(--u) * 1.4);background:#fff}.cn-chat-head{display:flex;align-items:center;gap:calc(var(--u) * 1);padding:calc(var(--u) * 1.1) calc(var(--u) * 1.4)}.cn-avatar{display:grid;flex:none;place-items:center;width:calc(var(--u) * 3.6);height:calc(var(--u) * 3.6);border-radius:50%;background:var(--cn-wa-green);font-size:calc(var(--u) * 1.3);font-weight:700;color:#fff}.cn-chat-who{display:flex;flex-direction:column}.cn-chat-who b{font-size:calc(var(--u) * 1.5);color:#111B21}.cn-chat-who small{font-size:calc(var(--u) * 1.2);color:#667781}.cn-chat-body{padding:calc(var(--u) * 1.2) calc(var(--u) * 1.4) calc(var(--u) * 1.6);background:var(--cn-wa-chat)}.cn-bubble{display:flex;flex-direction:column;gap:calc(var(--u) * .7);margin-left:auto;width:88%;padding:calc(var(--u) * .7);border-radius:calc(var(--u) * 1) 0 calc(var(--u) * 1) calc(var(--u) * 1);background:var(--cn-wa-bubble)}.cn-file{display:flex;align-items:center;gap:calc(var(--u) * .8);padding:calc(var(--u) * .8);border-radius:calc(var(--u) * .7);background:#fff}.cn-file-badge{flex:none;padding:calc(var(--u) * .5) calc(var(--u) * .5);border-radius:calc(var(--u) * .4);background:#E53935;font-size:calc(var(--u) * 1);font-weight:700;color:#fff}.cn-file-name{display:flex;flex-direction:column;min-width:0}.cn-file-name b{font-size:calc(var(--u) * 1.25);color:#111B21;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.cn-file-name small{display:inline-flex;align-items:center;gap:calc(var(--u) * .3);font-size:calc(var(--u) * 1.1);color:#667781}.cn-file-name small svg{width:calc(var(--u) * 1.1);height:calc(var(--u) * 1.1)}.cn-bubble-text{padding:0 calc(var(--u) * .3);font-size:calc(var(--u) * 1.35);color:#111B21}.cn-bubble-meta{display:flex;align-items:center;justify-content:flex-end;gap:calc(var(--u) * .4);font-size:calc(var(--u) * 1.1);color:#667781}.cn-ticks{width:calc(var(--u) * 1.9);height:calc(var(--u) * 1.3);color:#8696A0;transition:color .3s ease 1.4s}.connect-stage[data-scene="whatsapp"] .cn-ticks{color:var(--cn-wa-tick)}.cn-his{display:flex;flex-direction:column;align-items:center;width:48%;margin-top:0}.cn-his-tile{display:flex;align-items:center;gap:calc(var(--u) * 1.2);width:100%;padding:calc(var(--u) * 1.4);border:1px solid #DCE5E2;border-radius:calc(var(--u) * 1.4);background:#fff}.cn-his-tile .cn-card-icon{background:#FCE4EC}.cn-his-name{display:flex;flex-direction:column;gap:calc(var(--u) * .3)}.cn-his-name b{font-size:calc(var(--u) * 1.5);color:#111827}.cn-his-state{display:grid}.cn-his-state small{display:inline-flex;grid-area:1 / 1;align-items:center;gap:calc(var(--u) * .4);font-size:calc(var(--u) * 1.25);transition:opacity .3s ease 1.6s}.cn-his-state small svg{width:calc(var(--u) * 1.4);height:calc(var(--u) * 1.4)}.cn-his-wait{color:#6B7280}.cn-his-done{color:var(--cn-ok-text);opacity:0}.connect-stage[data-scene="emr"] .cn-his-wait{opacity:0}.connect-stage[data-scene="emr"] .cn-his-done{opacity:1}.cn-sheet{position:absolute;top:0;left:calc(var(--u) * -1.5 - 1px);display:grid;place-items:center;width:calc(var(--u) * 3);height:calc(var(--u) * 3.6);border:1px solid #DCE5E2;border-radius:calc(var(--u) * .4);background:#fff;color:var(--cn-pink);opacity:0}.cn-sheet svg{width:calc(var(--u) * 1.8);height:calc(var(--u) * 1.8)}.connect-stage[data-scene="emr"] .cn-sheet{animation:cn-travel 1.3s ease-in-out .3s both}.cn-network{width:72%;margin-top:0}.cn-links{display:block;width:100%;height:calc(var(--u) * 8)}.cn-links path{fill:none;stroke-width:2;vector-effect:non-scaling-stroke}.cn-link-base{stroke:var(--cn-link);stroke-dasharray:4 4}.cn-link-flow{stroke:var(--cn-pink);stroke-dasharray:40 260;stroke-dashoffset:300}.connect-stage[data-scene="lan"] .cn-link-flow{animation:cn-flow 1.4s linear infinite}.connect-stage[data-scene="lan"] .cn-link-flow:nth-of-type(5){animation-delay:.2s}.connect-stage[data-scene="lan"] .cn-link-flow:nth-of-type(6){animation-delay:.4s}.cn-nodes{display:flex;justify-content:space-between}.cn-node{position:relative;display:flex;flex-direction:column;align-items:center;gap:calc(var(--u) * .5);width:30%;padding:calc(var(--u) * 1.1) calc(var(--u) * .6);border:1px solid #DCE5E2;border-radius:calc(var(--u) * 1);background:#fff;font-size:calc(var(--u) * 1.25);color:#111827}.cn-node>svg{width:calc(var(--u) * 2.4);height:calc(var(--u) * 2.4);color:var(--cn-pink)}.cn-node-check{position:absolute;top:calc(var(--u) * -1);right:calc(var(--u) * -1);display:grid;place-items:center;width:calc(var(--u) * 2.4);height:calc(var(--u) * 2.4);border-radius:50%;background:var(--cn-ok-text);color:#fff;opacity:0;transform:scale(.5);transition:opacity .3s ease,transform .3s ease}.cn-node-check svg{width:calc(var(--u) * 1.4);height:calc(var(--u) * 1.4)}.connect-stage[data-scene="lan"] .cn-node-check{opacity:1;transform:none}.connect-stage[data-scene="lan"] .cn-node:nth-child(1) .cn-node-check{transition-delay:.9s}.connect-stage[data-scene="lan"] .cn-node:nth-child(2) .cn-node-check{transition-delay:1.2s}.connect-stage[data-scene="lan"] .cn-node:nth-child(3) .cn-node-check{transition-delay:1.5s}@keyframes cn-pop{from{opacity:0;transform:scale(.8)}to{opacity:1;transform:none}}@keyframes cn-travel{0%{top:0;opacity:0}12%{opacity:1}88%{opacity:1}100%{top:calc(100% - var(--u) * 3.6);opacity:0}}@keyframes cn-flow{to{stroke-dashoffset:0}}@media (min-width:992px){.connect-stage{--u:min(1.25cqw,1.95cqh);position:absolute;top:0;right:15px;bottom:0;left:15px;height:auto;padding-bottom:0;container-type:size}}@container (max-width:600px){.connect-stage>*{--u:2.2cqw}.connect-stage .cn-card,.connect-stage .cn-his,.connect-stage .cn-network{width:100%}.connect-stage .cn-wa{width:85%}}