:root{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;color:#111b21;background:#f5f1eb;font-synthesis:none;--green:#1daa61;--muted:#667781;--wallpaper:#f5f1eb;--doodle:#eae0d3}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden}button,input{font:inherit}button{border:0;cursor:pointer;-webkit-tap-highlight-color:transparent}button:focus-visible,input:focus-visible,[tabindex]:focus-visible{outline:2px solid #00a884;outline-offset:3px}button:active{opacity:.8}svg{display:block;width:24px;height:24px}[hidden]{display:none!important}.workspace{width:100%;height:100dvh}.chat-panel{height:100%;display:flex;flex-direction:column;position:relative;isolation:isolate;overflow:hidden;background:var(--wallpaper)}.chat-panel:before{content:"";position:absolute;inset:0;z-index:-1;background:var(--doodle);-webkit-mask:url('assets/whatsapp-doodle.webp') repeat 0 0/540px 960px;mask:url('assets/whatsapp-doodle.webp') repeat 0 0/540px 960px;pointer-events:none}
.chat-header{height:66px;padding:10px 24px;display:flex;align-items:center;gap:14px;flex:none;background:#f0f2f5;border-bottom:1px solid #dfe3e5;z-index:2}.chat-identity{display:flex;align-items:center;gap:13px;text-align:left;padding:0;min-width:0;flex:1;background:none;color:inherit}.avatar{width:42px;height:42px;flex:0 0 42px;display:grid;place-items:center;overflow:hidden;border-radius:50%;background:#dae4d3}.avatar svg{width:100%;height:100%}.chat-title{min-width:0;display:flex;flex-direction:column;gap:4px}.chat-title strong{font-size:16px;font-weight:600;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.chat-title>span{font-size:13px;color:#667781;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.3}.chat-actions{display:flex;align-items:center;gap:17px}.icon-button{width:36px;height:36px;display:grid;place-items:center;background:transparent;border-radius:50%;padding:0;color:#54656f;flex-shrink:0}.icon-button:hover{background:#e5e8e9}.icon-button svg{width:23px;height:23px}.mobile-back,.call-button{display:none}.pinned-message{height:45px;padding:0 26px;display:flex;align-items:center;gap:13px;background:#f9fafbd9;border-bottom:1px solid #deded680;flex:none;z-index:1;font-size:13px;line-height:1.4;color:#3b4a54;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}.pinned-message>span:first-child{display:grid;place-items:center;border-radius:5px;background:#e9edef;width:29px;height:29px;flex:none}.pinned-message svg{height:17px;width:17px;transform:rotate(25deg);color:#89969c}.pinned-message>span:last-child{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chat-stage{position:relative;flex:1;min-height:0}.messages{height:100%;overflow-y:auto;overscroll-behavior:contain;padding:24px max(7%,calc((100% - 1040px)/2)) 28px;scrollbar-width:thin;scrollbar-color:#b5b5ad88 transparent;outline:none}.date-label{display:table;margin:0 auto 17px;padding:6px 13px;border-radius:7px;background:#fffef4ed;font-size:12px;color:#54656f;box-shadow:0 1px 1px #0000000a}.message{max-width:78%;display:flex;align-items:flex-end;gap:9px;margin:0 0 10px}.message-avatar{overflow:hidden;height:29px;width:29px;flex:0 0 29px;background:#e9edef;color:#667781;border-radius:50%;display:grid;place-items:center;font-size:11px;font-weight:600;margin-bottom:1px}.bubble{background:#fff;padding:7px 10px 5px;border-radius:8px;position:relative;box-shadow:0 1px 1px #0000001a;font-size:14px;line-height:1.45;min-width:90px;max-width:100%;overflow-wrap:anywhere}.bubble:before{content:"";position:absolute;bottom:0;left:-6px;width:10px;height:10px;background:#fff;clip-path:polygon(100% 0,100% 100%,0 100%)}.sender{color:var(--sender);font-size:12px;line-height:1.4;font-weight:600;display:flex;align-items:center;gap:8px;margin-bottom:3px}.admin-tag{font-size:9px;border:1px solid #d7dce0;border-radius:3px;color:#8b989f;font-weight:400;padding:0 4px}.bubble p{margin:0;white-space:pre-line}.message-time{font-size:10px;line-height:1.4;color:#8696a0;text-align:right;margin:3px 0 0 22px;white-space:nowrap}.read-check{color:#53bdeb;letter-spacing:-4px;margin-left:4px;padding-right:4px}.message.outgoing{margin-left:auto;flex-direction:row-reverse}.outgoing .message-avatar{display:none}.outgoing .bubble{background:#d9fdd3}.outgoing .bubble:before{left:auto;right:-6px;transform:scaleX(-1);background:#d9fdd3}.quote{border-left:4px solid #06cf9c;padding:5px 8px;margin-bottom:6px;background:#dff3dcb8;border-radius:5px;color:#667781;font-size:12px}.quote strong{color:#06a689;display:block;font-size:11px;margin-bottom:2px}.system-message{text-align:center;margin:17px auto 22px;display:table;padding:5px 10px;font-size:11px;background:#fffef4c9;border-radius:7px;color:#667781;line-height:1.6}.reaction{display:table;padding:3px 6px;margin-top:6px;border-radius:20px;background:#f0f2f5;border:1px solid #fff;font-size:11px;line-height:1.2;color:#667781}.shared-card{width:300px;max-width:100%;margin:5px 0;overflow:hidden;border-radius:7px;border:1px solid #e9edef}.shared-art{height:138px;position:relative;overflow:hidden;background:#dce5d0}.shared-art svg{height:100%;width:100%}.art-label{position:absolute;left:15px;top:12px;font-size:9px;letter-spacing:2px;color:#f7f5e7}.art-title{position:absolute;left:15px;bottom:11px;font-size:22px;font-weight:600;color:#fff;letter-spacing:2px}.shared-card-copy{background:#f7f9f5;padding:9px 11px;font-size:12px;color:#3b4a54}.shared-card-copy small{display:block;font-size:10px;color:#8696a0;margin-top:4px}.scroll-bottom{position:absolute;right:24px;bottom:20px;width:40px;height:40px;border-radius:50%;background:#fff;color:#89969c;display:grid;place-items:center;box-shadow:0 1px 4px #0002;padding:0}.scroll-bottom svg{width:23px;height:23px}
.join-area{background:#f0f2f5;padding:10px 24px;flex:none;border-top:1px solid #e5e5df;display:flex;justify-content:center}.join-button{width:100%;height:48px;display:flex;align-items:center;justify-content:center;gap:9px;background:#fff;border:1px solid #d8dedf;border-radius:26px;color:#008f58;font-size:15px;font-weight:600;position:relative;padding:0 50px;transition:background .15s}.join-button:hover{background:#f4fdf7}.join-label{min-width:0;line-height:1.25;text-align:center}.join-button>span:first-child{flex-shrink:0}.join-button>span:first-child svg{width:22px;height:22px}.join-arrow{position:absolute;right:5px;top:5px;width:36px;height:36px;border-radius:50%;background:#1daa61;color:#fff;display:grid;place-items:center}.join-arrow svg{height:21px;width:21px}.message-search{height:56px;display:flex;align-items:center;gap:8px;background:#fff;padding:8px 24px;z-index:2;flex:none}.message-search input{flex:1;min-width:0;background:#f0f2f5;border:0;border-radius:9px;padding:9px 13px;font-size:14px;color:#111b21;outline:none}.message-search input:focus{box-shadow:0 0 0 2px #a5d5b7}.message-search #search-result{white-space:nowrap;font-size:12px;color:#667781}.message.match .bubble{outline:2px solid #ffc93c}.message.current-match .bubble{outline:3px solid #f7b800;background:#fff4c9}
 dialog{max-width:calc(100vw - 36px);width:390px;border:1px solid #e2e7e3;border-radius:16px;padding:35px 27px 25px;box-shadow:0 20px 80px #142b2a26;color:#111b21;background:#fff}dialog::backdrop{background:#111b215c;backdrop-filter:blur(3px)}.dialog-close{position:absolute;right:10px;top:10px;font-size:25px;font-weight:300}.dialog-symbol{width:45px;height:45px;background:#e6f5eb;color:#1daa61;border-radius:14px;display:grid;place-items:center;margin-bottom:22px}dialog h2{font-size:20px;line-height:1.4;font-weight:600;margin:0 0 12px}dialog p{font-size:14px;line-height:1.8;white-space:pre-line;color:#667781;margin:0 0 23px}.dialog-primary{background:#1daa61;border-radius:22px;color:#fff;width:100%;padding:11px;font-size:14px}
@media(min-width:701px){body{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr);place-items:center;background:#e5ebe7}.workspace{min-width:0;min-height:0;width:min(1040px,calc(100% - 64px));height:min(880px,calc(100dvh - 64px))}.chat-panel{border:1px solid #d4ddd6;border-radius:14px;box-shadow:0 16px 48px #20382b16,0 2px 7px #20382b0d}}
@media(max-width:700px){.chat-panel:before{-webkit-mask-size:100% auto;mask-size:100% auto}.chat-header{height:calc(74px + env(safe-area-inset-top));padding:calc(10px + env(safe-area-inset-top)) 16px 10px;gap:9px;background:#f4f1edc9;border-bottom:0;backdrop-filter:blur(26px);-webkit-backdrop-filter:blur(26px)}.mobile-back{display:grid;width:40px;height:40px;color:#111b21}.mobile-back svg{width:25px;height:25px}.glass-button{border:1px solid #fff;border-radius:28px;background:#ffffff6b;box-shadow:0 0 0 .5px #d4d3cf,0 1px 3px #9991;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.chat-identity{gap:9px}.avatar{width:39px;height:39px;flex-basis:39px}.chat-title{gap:3px}.chat-title strong{font-size:15px;font-weight:600;line-height:1.25}.chat-title>span{font-size:11px;color:#8a8a84;line-height:1.3}.chat-actions{gap:0}.desktop-action{display:none}.call-button{display:flex;align-items:center;justify-content:center;gap:2px;width:52px;height:40px;padding:0;color:#111b21;flex-shrink:0}.call-button>svg:first-child{width:22px;height:22px}.call-button>svg:last-child{width:10px;height:10px}.pinned-message{height:42px;padding:0 14px;gap:10px;background:#f4f1edc9;border-bottom:1px solid #dedbd480;font-size:12px;backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px)}.pinned-message>span:first-child{width:25px;height:26px;background:#dededab3}.pinned-message svg{width:15px;height:15px;transform:none}.messages{padding:17px 9px calc(17px + 2px)}.date-label{background:#fffffff0;color:#171717;box-shadow:none;border-radius:18px;font-size:12px;padding:2px 27px;margin-bottom:18px}.message{max-width:95%;gap:8px;margin-bottom:7px}.message-avatar{width:25px;height:25px;flex-basis:25px;font-size:10px;margin-bottom:2px}.bubble{border-radius:17px;padding:7px 10px 5px;font-size:15px;line-height:1.4;min-width:85px;box-shadow:0 .5px 0 #deddd566}.bubble:before{left:-5px;bottom:0;width:13px;height:14px;clip-path:path('M13 0C10 10 6 12 0 14H13Z')}.sender{font-size:11px;line-height:1.35;margin-bottom:2px;color:var(--sender);gap:7px}.admin-tag{font-size:8px;padding:0 3px;border-color:#e4e7e4}.message-time{font-size:10px;margin-top:2px;color:#888c89}.outgoing .bubble{border-radius:17px;background:#d9fdd3}.outgoing .bubble:before{background:#d9fdd3}.system-message{font-size:10px;line-height:1.7;margin:15px auto 18px;max-width:85%;background:#ffffffe6}.quote{font-size:12px}.reaction{font-size:10px;padding:3px 5px}.shared-card{width:242px;border-radius:10px;margin:5px 0 3px}.shared-art{height:145px}.art-title{font-size:24px}.shared-card-copy{font-size:12px;padding:8px 10px}.shared-card-copy small{font-size:9px}.join-area{background:#f4f1edda;backdrop-filter:blur(25px);-webkit-backdrop-filter:blur(25px);border:0;padding:10px 13px calc(14px + env(safe-area-inset-bottom))}.join-button{height:auto;min-height:48px;font-size:14px;border-radius:24px;padding:8px 46px 8px 13px;gap:7px;border-color:#d2d4d1;font-weight:500;box-shadow:inset 0 1px 2px #1111}.join-button>span:first-child svg{width:19px;height:19px}.join-arrow{width:33px;height:33px;top:50%;right:4px;transform:translateY(-50%)}.join-arrow svg{width:19px;height:19px}.scroll-bottom{width:34px;height:34px;right:13px;bottom:13px;box-shadow:0 1px 3px #0001}.scroll-bottom svg{width:21px;height:21px}.message-search{padding:8px 12px;height:54px}.message-search input{font-size:14px}}
@media(max-width:360px){.join-button{font-size:13px}.chat-header{padding-left:11px;padding-right:11px;gap:7px}.chat-identity{gap:7px}.chat-title strong{font-size:14px}.chat-title>span{font-size:10px}.call-button{width:45px}.mobile-back{width:35px;height:35px}.avatar{width:35px;height:35px;flex-basis:35px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

.message-avatar img{display:block;width:100%;height:100%;object-fit:cover;border-radius:50%}
.voice-bubble{width:292px;max-width:100%}.voice-message{display:flex;align-items:center;gap:9px;position:relative;padding:9px 1px 1px;min-width:0}.voice-toggle{flex:0 0 34px;width:34px;height:38px;display:grid;place-items:center;padding:0;background:none;color:#8e999e;border-radius:50%}.voice-toggle svg{height:29px;width:29px}.voice-toggle:hover{background:#f0f2f5}.voice-body{min-width:0;flex:1}.voice-waveform{height:35px;position:relative;display:flex;align-items:center;border-radius:5px}.voice-bars{display:flex;align-items:center;gap:2px;width:100%;height:33px;pointer-events:none}.voice-bars i{display:block;flex:1;min-width:1px;max-width:4px;min-height:4px;background:#c5cbd0;border-radius:3px;transition:background .12s}.voice-bars i.played{background:#46a9d1}.voice-seek{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}.voice-waveform:focus-within{outline:2px solid #86bdb0;outline-offset:3px}.voice-meta{display:flex;justify-content:space-between;align-items:center;font-size:10px;line-height:1.3;color:#8b969c;margin-top:2px;min-height:18px}.voice-time{font-variant-numeric:tabular-nums}.voice-rate{font-size:9px;color:#73828a;background:#eef1f3;min-width:27px;border-radius:9px;padding:2px 4px;line-height:1.2}.voice-mic{height:30px;width:18px;flex:0 0 18px;color:#8f9ba0;align-self:flex-end;margin-bottom:20px}.voice-mic svg{height:20px;width:18px}.is-playing .voice-mic{color:#46a9d1}.voice-error{position:absolute;left:0;right:0;bottom:-8px;background:#fff8ed;color:#b55c2e;font-size:10px;text-align:center;border-radius:4px;padding:2px}.voice-message audio{display:none}.bubble strong{font-weight:650}
@media(max-width:700px){.voice-bubble{width:280px}.voice-message{gap:7px;padding-top:8px}.voice-toggle{flex-basis:31px;width:31px}.voice-bars{gap:2px}.voice-bars i{max-width:3px}.voice-meta{font-size:10px}.voice-rate{font-size:9px}.voice-mic{margin-bottom:19px}.bubble.voice-bubble .message-time{margin-top:0}.message-content{max-width:100%}}

.avatar>img{display:block;width:100%;height:100%;object-fit:cover;border-radius:50%}

.voice-toggle:disabled{opacity:.5;cursor:wait}.voice-seek:disabled{cursor:wait}