.demo-chat{background:0 0;border:0;width:100vw;max-width:none;height:100dvh;max-height:none;margin:0;padding:0;position:fixed;inset:0;overflow:hidden}.demo-chat::backdrop{background:0 0}.demo-chat__portal{background:radial-gradient(circle at var(--demo-x,50%) var(--demo-y,50%), #7c3aed61, #2f6fed2e 28%, #110c288c 62%), #110c2833;-webkit-backdrop-filter:blur(8px)saturate(1.15);backdrop-filter:blur(8px)saturate(1.15);will-change:opacity;position:absolute;inset:0}@media (pointer:coarse),(max-width:48rem){.demo-chat__portal{-webkit-backdrop-filter:none;backdrop-filter:none;background:radial-gradient(circle at var(--demo-x,50%) var(--demo-y,50%), #7c3aed73, #2f6fed40 28%, #110c28b8 62%), #110c2859}}.demo-chat__stage{pointer-events:none;place-items:center;padding:1rem;display:grid;position:absolute;inset:0}.demo-chat__card{pointer-events:auto;will-change:transform, opacity;transform-origin:50%;background:#7c3aed;border-radius:1.75rem;width:min(27.5rem,100%);height:min(45rem,100%);padding:3px;position:relative;box-shadow:0 0 0 1px #ffffff40,0 30px 90px -20px #7c3aeda6,0 0 60px -10px #25d36640}.demo-chat__ring{border-radius:inherit;pointer-events:none;position:absolute;inset:0;overflow:hidden}.demo-chat__ring:before{content:"";aspect-ratio:1;will-change:transform;background:conic-gradient(#7c3aed,#2f6fed,#25d366,#a78bfa,#7c3aed);width:300%;animation:2.4s linear infinite demo-chat-ring;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.demo-chat[data-ready] .demo-chat__ring:before{animation-duration:9s}@keyframes demo-chat-ring{to{transform:translate(-50%,-50%)rotate(360deg)}}.demo-chat__inner{background:#fff;border-radius:calc(1.75rem - 3px);width:100%;height:100%;position:relative;overflow:hidden}.demo-chat__frame,.demo-chat__frame iframe{border:0;width:100%;height:100%;position:absolute;inset:0}.demo-chat__frame{opacity:0;transition:opacity .45s}.demo-chat[data-ready] .demo-chat__frame{opacity:1}.demo-chat__waiting{text-align:center;color:#3b3355;background:radial-gradient(circle at 50% 40%,#f5f3ff,#fff 70%);flex-direction:column;justify-content:center;align-items:center;gap:1rem;padding:2rem;font-weight:600;transition:opacity .35s;display:flex;position:absolute;inset:0}.demo-chat[data-ready] .demo-chat__waiting{opacity:0;pointer-events:none}.demo-chat__unavailable{text-align:center;color:#3b3355;background:#fff;margin:0;padding:1.25rem 2rem 2.5rem;display:none;position:absolute;inset:auto 0 0}.demo-chat[data-failed] .demo-chat__unavailable{display:block}.demo-chat[data-failed] .demo-chat__dots,.demo-chat[data-failed] [data-demo-chat-connecting]{display:none}.demo-chat[data-failed] .demo-chat__ring:before,.demo-chat[data-failed] .demo-chat__face{animation:none}.demo-chat__face{border-radius:9999px;width:4.5rem;height:4.5rem;animation:1.6s ease-in-out infinite demo-chat-pulse;display:block;position:relative}.demo-chat__face:after{content:"";border-radius:inherit;border:2px solid #7c3aed73;animation:1.6s ease-out infinite demo-chat-halo;position:absolute;inset:-6px}.demo-chat__face img{border-radius:inherit;object-fit:cover;background:#f5f3ff;width:100%;height:100%}@keyframes demo-chat-pulse{50%{transform:scale(1.06)}}@keyframes demo-chat-halo{0%{opacity:1;transform:scale(.9)}to{opacity:0;transform:scale(1.45)}}.demo-chat__dots{gap:.35rem;display:inline-flex}.demo-chat__dots i{background:#7c3aed;border-radius:9999px;width:.45rem;height:.45rem;animation:1.2s ease-in-out infinite demo-chat-dot}.demo-chat__dots i:nth-child(2){background:#2f6fed;animation-delay:.15s}.demo-chat__dots i:nth-child(3){background:#25d366;animation-delay:.3s}@keyframes demo-chat-dot{0%,80%,to{opacity:.4;transform:translateY(0)}40%{opacity:1;transform:translateY(-.4rem)}}.demo-chat__close{z-index:1;color:#3b3355;background:#fff;border-radius:9999px;place-items:center;width:2.5rem;height:2.5rem;transition:transform .15s,color .15s;display:grid;position:absolute;top:-.75rem;right:-.75rem;box-shadow:0 6px 20px -6px #110c2880}.demo-chat__close:hover{color:#7c3aed;transform:rotate(90deg)}.demo-chat__close:focus-visible{outline-offset:2px;outline:3px solid #7c3aed}@media (max-width:30rem){.demo-chat__stage{padding:2.75rem .5rem .5rem}.demo-chat__close{top:-2.5rem;right:.25rem}}@media (prefers-reduced-motion:reduce){.demo-chat__ring:before,.demo-chat__face,.demo-chat__face:after,.demo-chat__dots i{animation:none}}