.reference-chat{height:100dvh;min-height:420px;display:flex;flex-direction:column;background:#f4f3f5;position:relative;color:#444}.chat-heading{padding:calc(12px + env(safe-area-inset-top)) 16px 12px;display:flex;align-items:center;justify-content:space-between;background:#fff;gap:10px}.chat-heading button{color:#666;font-size:18px;min-width:65px;text-align:left}.chat-heading button:last-child{text-align:right;font-size:30px;color:#c5bfc8}.chat-heading strong{font-size:18px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.chat-contacts{display:flex;background:#fff;padding:15px 4px;border-bottom:1px solid #eee}.chat-contacts button{flex:1;font-size:13px;color:#666;white-space:nowrap}.chat-thread{flex:1;min-height:0;overflow-y:auto;padding:0 15px 140px;overscroll-behavior:contain}.chat-day{text-align:center;color:#aaa;font-size:12px;margin:18px 0 22px}.reference-chat .message{display:flex;gap:9px;margin:18px 0;align-items:flex-start}.reference-chat .message.mine{flex-direction:row-reverse}.reference-chat .message>.avatar{width:38px;height:38px;flex-shrink:0;border-radius:50%;object-fit:cover}.reference-chat .message>div{max-width:76%;min-width:0}.reference-chat .bubble{position:relative;background:#fff;border-radius:12px;padding:12px 14px;color:#444;white-space:pre-wrap;overflow-wrap:anywhere;font-size:16px;line-height:1.5;box-shadow:none}.reference-chat .mine .bubble{background:#4465e8;color:#fff;border-radius:12px}.reference-chat .bubble:after{content:'';position:absolute;top:14px;left:-6px;border-top:6px solid transparent;border-bottom:6px solid transparent;border-right:7px solid #fff}.reference-chat .mine .bubble:after{left:auto;right:-6px;border-right:0;border-left:7px solid #4465e8}.reference-chat .bubble button{color:inherit;text-decoration:underline}.reference-chat .message small{display:block;font-size:10px;color:#aaa;margin:5px 2px}.reference-chat .mine small{text-align:right}.chat-floating{position:absolute;right:17px;bottom:calc(160px + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:18px}.chat-floating button{width:49px;height:49px;border-radius:50%;background:#f4ab26;color:#fff;font-size:26px;box-shadow:0 2px 7px #dca54d35}.chat-floating button:first-child{border-radius:12px;font-family:serif;font-size:22px;background:#efbd48;color:#aa6126}.chat-floating small{display:block;font-size:8px;color:#965526}.chat-dock{flex-shrink:0;background:#fcfbfc;padding-bottom:env(safe-area-inset-bottom);border-top:1px solid #eeeaef;z-index:1}.chat-tools{display:grid;grid-template-columns:repeat(6,1fr);padding:14px 7px 12px}.chat-tools button{display:flex;flex-direction:column;align-items:center;gap:7px;color:#777;font-size:12px}.chat-tools span{color:#dc88aa;font-size:25px;line-height:1}.chat-compose{display:flex;align-items:center;gap:8px;border-top:1px solid #eee;padding:10px 12px;margin:0;position:static;background:#fff}.chat-compose input{min-width:0;flex:1;border:0;border-radius:18px;background:#f5f3f6;padding:10px;font-size:16px;outline-offset:2px}.chat-compose button{color:#777;font-size:25px;flex-shrink:0}.chat-compose .chat-send{font-size:13px;color:#fff;background:#4465e8;border-radius:16px;padding:8px 12px}.chat-emoji{padding:8px 15px}.chat-emoji button{font-size:25px;margin:4px}.chat-emoji[hidden]{display:none}body:has(.reference-chat){overflow:hidden}body:has(.reference-chat):before,body:has(.reference-chat):after{display:none}@media(max-width:360px){.chat-contacts button{font-size:11px}.chat-compose{gap:5px;padding:9px 7px}.chat-compose .chat-send{padding:8px}.chat-tools button{font-size:11px}}

.reference-chat .message{width:100%;max-width:100%}.chat-tools svg{display:block;width:24px;height:24px}

.chat-receipt{color:#a69bad}.chat-receipt.is-read{color:#6a86c8}
