.rn-chat-demo{display:flex;flex-direction:column;align-items:center;min-width:0;width:100%;font-family:-apple-system,BlinkMacSystemFont,Helvetica Neue,sans-serif}.rn-chat-device{box-sizing:border-box;width:min(100%,340px);aspect-ratio:1350/2760;position:relative;filter:drop-shadow(0 10px 12px rgba(0,0,0,.12))}.rn-chat-hardware{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;z-index:5;pointer-events:none}.rn-chat-screen{position:absolute;left:5.333333%;top:2.5%;width:89.333333%;height:95%;overflow:hidden;border-radius:14.5%/6.67%;background:#fff;box-sizing:border-box;color:#111;container-type:inline-size}.rn-chat-island{position:absolute;z-index:2;left:50%;transform:translate(-50%);background:#000}.rn-chat-messages{display:flex;flex-direction:column}.rn-chat-row{display:flex;align-items:flex-end;min-width:0;transition:opacity .2s,transform .2s}.rn-chat-avatar{flex:none;display:grid;place-items:center;border-radius:50%;color:#fff}.rn-chat-body{min-width:0}.rn-chat-sender{display:block;color:#6e6e73}.rn-chat-bubble{position:relative;isolation:isolate;width:fit-content;max-width:100%;background:#e9e9eb;overflow-wrap:anywhere}.rn-chat-email{text-decoration:underline}.rn-chat-row.outgoing{justify-content:flex-end}.outgoing .rn-chat-body{max-width:90%}.outgoing .rn-chat-bubble{color:#fff;margin-left:auto}.outgoing .rn-chat-email{color:#fff}.rn-chat-composer{position:absolute;display:flex;align-items:center;color:#aaaab0}.rn-chat-composer div{flex:1}.rn-chat-mic svg{display:block}.rn-chat-home{position:absolute;left:50%;transform:translate(-50%);background:#171717}.rn-chat-controls{display:flex;gap:20px;margin-top:5px}.rn-chat-controls button{border:0;background:transparent;min-height:44px;padding:8px 4px;color:#174c3c;font:600 13px -apple-system,BlinkMacSystemFont,Helvetica Neue,sans-serif;cursor:pointer}@media (prefers-reduced-motion:reduce){.rn-chat-row{transition:none}}.rn-chat-screen{--u:calc(100cqw / 402)}.rn-chat-island{top:calc(14 * var(--u));height:calc(36 * var(--u));width:calc(124 * var(--u));border-radius:calc(20 * var(--u))}.rn-chat-messages{gap:calc(8 * var(--u));padding:calc(10 * var(--u)) calc(12 * var(--u)) calc(76 * var(--u))}.rn-chat-row{gap:calc(7 * var(--u))}.rn-chat-avatar{width:calc(28 * var(--u));height:calc(28 * var(--u));margin-bottom:calc(1 * var(--u));font-size:calc(12 * var(--u));background:#aeb0b5}.rn-chat-avatar.anna,.rn-chat-avatar.jules{background:#aeb0b5}.rn-chat-body{max-width:calc(100% - 35 * var(--u))}.rn-chat-sender{font-size:calc(12 * var(--u));line-height:calc(14 * var(--u));margin:0 0 calc(2 * var(--u)) calc(12 * var(--u))}.rn-chat-email{color:#007aff;text-underline-offset:calc(2 * var(--u))}.outgoing .rn-chat-bubble{background:#0078ff}.rn-chat-composer{bottom:calc(24 * var(--u));left:calc(14 * var(--u));right:calc(14 * var(--u));gap:calc(8 * var(--u));font-size:calc(20 * var(--u))}.rn-chat-composer div{border:calc(1 * var(--u)) solid #d6d6db;border-radius:calc(20 * var(--u));padding:calc(7 * var(--u)) calc(10 * var(--u));font-size:calc(12 * var(--u))}.rn-chat-mic svg{width:calc(17 * var(--u));height:calc(20 * var(--u))}.rn-chat-home{bottom:calc(8 * var(--u));width:calc(90 * var(--u));height:calc(4 * var(--u));border-radius:calc(4 * var(--u))}.rn-chat-native-header{position:relative;height:calc(139 * var(--u))}.rn-chat-native-header>img{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:auto}.rn-chat-native-header .rn-chat-native-status{height:calc(54 * var(--u))}.rn-chat-native-label{position:absolute;top:calc(117 * var(--u));left:50%;transform:translate(-50%);font-size:calc(12 * var(--u));background:#fff;white-space:nowrap}.rn-chat-row.waiting{display:none}.rn-chat-row:not(.waiting) .rn-chat-bubble{animation:rn-arrive .28s ease-out both;transform-origin:left bottom}.rn-chat-row.outgoing .rn-chat-bubble{transform-origin:right bottom}.rn-chat-bubble{padding:calc(7 * var(--u)) calc(12 * var(--u));border-radius:calc(16 * var(--u));font-size:calc(16 * var(--u));line-height:calc(20 * var(--u));letter-spacing:calc(-.15 * var(--u))}.rn-chat-bubble:before{content:"";position:absolute;z-index:-1;bottom:0;left:calc(-5.5 * var(--u));width:calc(16.5 * var(--u));height:calc(17 * var(--u));background:#e9e9eb;mask:url(/imessage-tail.svg) center/contain no-repeat}.outgoing .rn-chat-bubble:before{left:auto;right:calc(-5.5 * var(--u));background:#0078ff;transform:scaleX(-1)}@keyframes rn-arrive{0%{opacity:0;transform:translateY(calc(6 * var(--u))) scale(.92)}to{opacity:1;transform:none}}@media (prefers-reduced-motion:reduce){.rn-chat-row:not(.waiting) .rn-chat-bubble{animation:none}}.rn-chat-native-avatar{position:absolute;top:calc(63 * var(--u));left:calc(176 * var(--u));width:calc(50 * var(--u));height:calc(50 * var(--u));border-radius:50%;display:grid;place-items:center;background:#aeb0b5;color:#fff;font-size:calc(22 * var(--u))}.rn-chat-native-avatar{background:#fff;display:block}.rn-chat-native-avatar span{position:absolute;display:grid;place-items:center;border-radius:50%;width:calc(27 * var(--u));height:calc(27 * var(--u));border:calc(1.5 * var(--u)) solid white;background:#a4b0b9;font-size:calc(11 * var(--u))}.rn-chat-native-avatar span:nth-child(1){left:0;top:calc(15 * var(--u))}.rn-chat-native-avatar span:nth-child(2){left:calc(12 * var(--u));top:0;background:#b8a99f}.rn-chat-native-avatar span:nth-child(3){left:calc(24 * var(--u));top:calc(15 * var(--u));background:#a4b4a9}.rn-chat-native-label{top:calc(115 * var(--u));width:calc(100 * var(--u));height:calc(20 * var(--u));text-align:center}.rn-chat-row.outgoing .rn-chat-body{padding-top:calc(27 * var(--u))}.rn-chat-tapbacks{position:absolute;left:calc(-22 * var(--u));top:calc(-27 * var(--u));display:flex;align-items:flex-start;gap:0;z-index:2;pointer-events:none}.rn-chat-tapback{display:block;width:calc(35.7198143 * var(--u));height:auto;aspect-ratio:35.7198143/42.8683815;object-fit:contain;flex:none;transform-origin:50% 90%;animation:rn-tapback-pop .26s cubic-bezier(.2,.85,.3,1.18) both}.rn-chat-tapback:first-child{position:relative;z-index:1}.rn-chat-tapback+.rn-chat-tapback{margin-left:calc(-8 * var(--u))}@keyframes rn-tapback-pop{0%{opacity:0;transform:translateY(calc(4 * var(--u))) scale(.5)}to{opacity:1;transform:translateY(0) scale(1)}}@media (prefers-reduced-motion:reduce){.rn-chat-tapback{animation:none}}