.cp-wrap{position:relative;display:flex;flex-direction:column;align-items:center;gap:.9rem;isolation:isolate}.cp-wrap:before{content:"";position:absolute;left:50%;top:46%;width:150%;aspect-ratio:1;transform:translate(-50%,-50%);background:radial-gradient(closest-side,rgb(16 185 129 / .16),transparent 72%);pointer-events:none;z-index:-1}.cp{--pw: min(300px, 76vw);position:relative;width:var(--pw);height:calc(var(--pw) * 2.04);font-family:var(--font-sans);font-size:calc(var(--pw) * .045);line-height:1.35;-webkit-font-smoothing:antialiased}@media(min-width:1024px){.cp{--pw: clamp(250px, calc((100svh - 13rem) / 2.04), 330px)}}.cp[data-skin=whatsapp]{--head-bg: #008069;--head-fg: #fff;--head-line: transparent;--badge-bg: rgb(255 255 255 / .18);--badge-fg: #fff;--badge-ic: #fff;--avatar-bg: #dff3ec;--avatar-fg: #008069;--feed-bg: #efeae2;--in-bg: #fff;--in-fg: #111b21;--out-bg: #d9fdd3;--out-fg: #111b21;--meta: #667781;--bar-bg: #f0f2f5;--field-bg: #fff;--field-line: transparent;--field-fg: #111b21;--tool-fg: #54656f;--send-bg: #00a884;--send-fg: #fff;--r-in: .15em .55em .55em .55em;--r-out: .55em .15em .55em .55em}.cp[data-skin=instagram]{--head-bg: #fff;--head-fg: #000;--head-line: #dbdbdb;--badge-bg: #f2f2f2;--badge-fg: #262626;--badge-ic: #e1306c;--avatar-bg: linear-gradient(45deg, #feda75, #fa7e1e 30%, #d62976 60%, #962fbf 85%);--avatar-fg: #fff;--feed-bg: #fff;--in-bg: #efefef;--in-fg: #000;--out-bg: linear-gradient(160deg, #a033ff, #3797f0);--out-fg: #fff;--meta: rgb(255 255 255 / .75);--bar-bg: #fff;--field-bg: #fff;--field-line: #dbdbdb;--field-fg: #000;--tool-fg: #fff;--tool-bg: #3797f0;--send-bg: transparent;--send-fg: #0095f6;--r-in: 1.3em;--r-out: 1.3em}.cp[data-skin=telegram]{--head-bg: #517da2;--head-fg: #fff;--head-line: transparent;--badge-bg: rgb(255 255 255 / .18);--badge-fg: #fff;--badge-ic: #fff;--avatar-bg: #e8f1fa;--avatar-fg: #3390ec;--feed-bg: linear-gradient(160deg, #d9e6bb, #a9c99c);--in-bg: #fff;--in-fg: #000;--out-bg: #effdde;--out-fg: #000;--meta: #5fa75b;--bar-bg: #fff;--field-bg: #fff;--field-line: transparent;--field-fg: #000;--tool-fg: #8d9aa5;--send-bg: transparent;--send-fg: #3390ec;--r-in: .9em .9em .9em .2em;--r-out: .9em .9em .2em .9em}.dark .cp[data-skin=whatsapp]{--head-bg: #202c33;--head-fg: #e9edef;--badge-bg: rgb(255 255 255 / .1);--badge-fg: #e9edef;--badge-ic: #25d366;--avatar-bg: #2a3942;--avatar-fg: #25d366;--feed-bg: #0b141a;--in-bg: #202c33;--in-fg: #e9edef;--out-bg: #005c4b;--out-fg: #e9edef;--meta: #8696a0;--bar-bg: #202c33;--field-bg: #2a3942;--field-fg: #e9edef;--tool-fg: #8696a0}.dark .cp[data-skin=instagram]{--head-bg: #000;--head-fg: #f5f5f5;--head-line: #262626;--badge-bg: #262626;--badge-fg: #f5f5f5;--feed-bg: #000;--in-bg: #262626;--in-fg: #f5f5f5;--bar-bg: #000;--field-bg: #000;--field-line: #363636;--field-fg: #f5f5f5}.dark .cp[data-skin=telegram]{--head-bg: #17212b;--head-fg: #f5f5f5;--badge-bg: rgb(255 255 255 / .1);--badge-fg: #f5f5f5;--badge-ic: #5ea9e9;--avatar-bg: #2b5278;--avatar-fg: #fff;--feed-bg: #0e1621;--in-bg: #182533;--in-fg: #f5f5f5;--out-bg: #2b5278;--out-fg: #fff;--meta: #7da8d3;--bar-bg: #17212b;--field-bg: #17212b;--field-fg: #f5f5f5;--tool-fg: #6d7f8f;--send-fg: #5ea9e9}.cp .cp-frame{--glow-bg: #0c0f0e;--glow-bg-hover: #0c0f0e;width:100%;height:100%;padding:.55em;border-radius:3.1em;border-width:1.5px}.cp-screen{position:relative;display:flex;flex-direction:column;height:100%;overflow:hidden;border-radius:2.6em;background:var(--feed-bg)}.cp-status{position:relative;flex:none;display:flex;align-items:center;justify-content:flex-end;gap:.4em;height:2.3em;padding:0 1.6em;background:var(--head-bg);color:var(--head-fg)}.cp-island{position:absolute;left:50%;top:.55em;width:5.6em;height:1.45em;transform:translate(-50%);border-radius:1em;background:#000}.cp-bars{display:flex;align-items:flex-end;gap:.12em;height:.75em}.cp-bars i{display:block;width:.2em;background:currentColor;border-radius:.05em}.cp-bars i:nth-child(1){height:35%}.cp-bars i:nth-child(2){height:55%}.cp-bars i:nth-child(3){height:78%}.cp-bars i:nth-child(4){height:100%}.cp-battery{position:relative;width:1.5em;height:.72em;border:.09em solid currentColor;border-radius:.22em;opacity:.9}.cp-battery:after{content:"";position:absolute;inset:.1em .35em .1em .1em;border-radius:.08em;background:currentColor}.cp-head{flex:none;display:flex;align-items:center;gap:.5em;height:3.6em;padding:0 .85em 0 .4em;background:var(--head-bg);color:var(--head-fg);border-bottom:1px solid var(--head-line)}.cp-back{width:1.5em;height:1.5em;flex:none}.cp-avatar{display:grid;place-items:center;flex:none;width:2.4em;height:2.4em;border-radius:9999px;background:var(--avatar-bg);color:var(--avatar-fg)}.cp-avatar svg{width:58%;height:58%}.cp-who{display:flex;flex-direction:column;align-items:flex-start;gap:.18em;min-width:0;flex:1}.cp-name{font-weight:600;font-size:1.04em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.cp-badge{display:inline-flex;align-items:center;gap:.35em;padding:.1em .5em .1em .4em;border-radius:9999px;background:var(--badge-bg);color:var(--badge-fg);font-size:.72em;font-weight:600;letter-spacing:.01em}.cp-badge svg{width:1.1em;height:1.1em;color:var(--badge-ic)}.cp-actions{display:flex;gap:.95em;flex:none}.cp-actions svg{width:1.3em;height:1.3em}.cp-feed{flex:1;display:flex;flex-direction:column;gap:.42em;min-height:0;overflow:hidden;padding:.85em .75em;transition:opacity .35s ease}.cp[data-clearing] .cp-feed{opacity:0}.cp-msg{position:relative;align-self:flex-start;max-width:80%;padding:.42em .68em;border-radius:var(--r-in);background:var(--in-bg);color:var(--in-fg);box-shadow:0 1px .5px #00000021;overflow-wrap:anywhere}.cp-msg--customer{align-self:flex-end;border-radius:var(--r-out);background:var(--out-bg);color:var(--out-fg)}.cp[data-skin=instagram] .cp-msg{box-shadow:none}.cp-time{float:right;margin:.45em -.15em -.2em .6em;font-size:.7em;line-height:1;color:var(--meta)}.cp-msg--agent .cp-time{color:var(--meta)}.cp-typing{display:flex;gap:.25em;padding:.7em .8em}.cp-typing i{display:block;width:.42em;height:.42em;border-radius:9999px;background:currentColor;opacity:.4;animation:cp-dot 1.1s ease-in-out infinite}.cp-typing i:nth-child(2){animation-delay:.15s}.cp-typing i:nth-child(3){animation-delay:.3s}@keyframes cp-dot{0%,60%,to{transform:translateY(0);opacity:.35}30%{transform:translateY(-.28em);opacity:.85}}.cp-system{align-self:center;display:flex;align-items:flex-start;gap:.4em;max-width:90%;margin-top:.3em;padding:.4em .75em;border-radius:.8em;background:#dcfaecf5;border:1px solid rgb(16 185 129 / .45);color:#047857;font-size:.8em;font-weight:600;text-align:center}.dark .cp-system{background:#06281eeb;color:#6ee7b7}.cp-system svg{flex:none;width:1.2em;height:1.2em;margin-top:.05em}.cp-input{flex:none;display:flex;align-items:center;gap:.5em;height:3.5em;padding:0 .7em .5em;background:var(--bar-bg)}.cp-tool{display:grid;place-items:center;flex:none;width:2em;height:2em;border-radius:9999px;background:var(--tool-bg, transparent);color:var(--tool-fg)}.cp-tool svg{width:1.25em;height:1.25em}.cp-field{flex:1;min-width:0;height:2.3em;display:flex;align-items:center;padding:0 .85em;border-radius:9999px;background:var(--field-bg);border:1px solid var(--field-line);color:var(--field-fg);overflow:hidden;white-space:nowrap}.cp-draft{flex:none}.cp-draft:after{content:"";display:inline-block;width:1px;height:1.1em;margin-left:1px;vertical-align:-.2em;background:currentColor;animation:cp-caret 1s steps(1) infinite}@keyframes cp-caret{50%{opacity:0}}.cp-send{display:grid;place-items:center;flex:none;width:2.3em;height:2.3em;border-radius:9999px;background:var(--send-bg);color:var(--send-fg);transition:transform .2s ease}.cp-send svg{width:1.15em;height:1.15em}.cp-send[data-ready]{transform:scale(1.08)}.cp-label{display:flex;align-items:center;gap:.5rem;margin:0;font-family:var(--font-mono);font-size:.75rem;letter-spacing:.04em;color:hsl(var(--muted-foreground))}.cp-label:before{content:"";width:6px;height:6px;border-radius:9999px;background:#10b981}.cp[data-live] .cp-head,.cp[data-live] .cp-status,.cp[data-live] .cp-screen,.cp[data-live] .cp-input,.cp[data-live] .cp-badge{transition:background-color .4s ease,color .4s ease,border-color .4s ease}.cp[data-live] .cp-msg,.cp[data-live] .cp-system{animation:cp-pop .32s cubic-bezier(.22,1,.36,1) both}.cp[data-live] .cp-msg--customer{transform-origin:100% 100%}.cp[data-live] .cp-msg--agent{transform-origin:0 100%}@keyframes cp-pop{0%{opacity:0;transform:translateY(.5em) scale(.96)}}.cp[data-paused] *,.cp[data-paused] *:after{animation-play-state:paused!important}@media(prefers-reduced-motion:no-preference){html.js .cp:not([data-live]) .cp-feed{opacity:0;animation:cp-fallback .4s ease 4s forwards}}@keyframes cp-fallback{to{opacity:1}}@media(prefers-reduced-motion:reduce){.cp *,.cp *:after{animation:none!important;transition:none!important}}