:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--header:#008069;--chat:#efeae2;--outgoing:#d9fdd3;--incoming:#fff;--ink:#111b21;--muted:#667781;--composer:#f0f2f5;--send:#00a884}*{box-sizing:border-box}html,body{height:100%;margin:0}body{color:var(--ink);background:#111b21;justify-content:center;font-family:Segoe UI,Helvetica,Arial,sans-serif;display:flex}button,textarea{font:inherit}.phone{background:var(--chat);flex-direction:column;width:100%;max-width:440px;height:100dvh;display:flex;overflow:hidden}.header{background:var(--header);color:#fff;align-items:center;gap:12px;min-height:60px;padding:8px 14px;display:flex}.avatar{object-fit:cover;border-radius:50%;width:40px;height:40px}.name{font-size:16px;font-weight:600;line-height:1.2}.status{opacity:.85;font-size:13px}.thread{background-color:var(--chat);background-image:radial-gradient(circle at 20% 20%,#ffffff47 0 1px,#0000 1.5px),radial-gradient(circle at 70% 60%,#00000008 0 1px,#0000 1.5px);background-size:28px 28px;flex-direction:column;flex:1;gap:6px;padding:12px 10px 8px;display:flex;overflow-y:auto}.bubble{overflow-wrap:anywhere;border-radius:8px;max-width:80%;padding:6px 8px 4px;box-shadow:0 1px .5px #0b141a21}.bubble p{white-space:pre-wrap;margin:0;font-size:14.5px;line-height:1.35}.bubble time{text-align:right;color:var(--muted);margin-top:2px;font-size:11px;display:block}.bubble img{border-radius:6px;width:min(240px,100%);margin-bottom:4px;display:block}.bubble.user{background:var(--outgoing);border-top-right-radius:2px;align-self:flex-end}.bubble.assistant{background:var(--incoming);border-top-left-radius:2px;align-self:flex-start}.typing{gap:4px;width:fit-content;padding:12px 14px;display:flex}.typing span{background:#8696a0;border-radius:50%;width:7px;height:7px;animation:1.2s infinite bounce}.typing span:nth-child(2){animation-delay:.15s}.typing span:nth-child(3){animation-delay:.3s}@keyframes bounce{0%,60%,to{opacity:.4;transform:translateY(0)}30%{opacity:1;transform:translateY(-3px)}}.error{color:#9b1c1c;background:#fff4f4;justify-content:space-between;align-items:center;gap:12px;padding:8px 12px;font-size:13px;display:flex}.error button{color:#9b1c1c;cursor:pointer;background:0 0;border:0;flex:none;font-weight:600}.composer{background:var(--composer);padding:6px 8px calc(8px + env(safe-area-inset-bottom))}.preview{align-items:center;gap:8px;margin:2px 4px 8px;display:flex}.preview img{object-fit:cover;border-radius:8px;width:56px;height:56px}.preview button{color:#54656f;cursor:pointer;background:0 0;border:0}.composer-row{align-items:flex-end;gap:6px;display:flex}.icon-button,.send{cursor:pointer;border:0;border-radius:50%;flex:none;place-items:center;width:42px;height:42px;display:grid}.icon-button{color:#54656f;background:0 0}.icon-button svg,.send svg{width:24px;height:24px}.send{background:var(--send);color:#fff}.send:disabled{opacity:.45;cursor:default}.composer textarea{resize:none;min-height:42px;max-height:120px;color:var(--ink);background:#fff;border:0;border-radius:21px;outline:none;flex:1;padding:11px 14px}@media (min-width:700px){body{align-items:center;padding:24px 0}.phone{border-radius:12px;height:min(880px,100%);box-shadow:0 12px 40px #00000059}}