*{box-sizing:border-box} :root{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Arial,sans-serif;color:#182533;background:#fff;font-synthesis:none;--surface:#fff;--muted:#82919e;--line:#e9edf0;--blue:#3390ec;--incoming:#fff;--outgoing:#e3ffc9;--ink:#182533;--wall:#dbe5ce;--hover:#f3f6f8;--shadow:0 1px 2px #314c3026}body{margin:0}button,input{font:inherit}button{cursor:pointer;border:0;background:none;color:inherit}button:focus-visible,input:focus-visible{outline:2px solid var(--blue);outline-offset:3px}button:disabled{opacity:.5;cursor:wait}[hidden]{display:none!important}#app{height:100dvh;display:flex;overflow:hidden}.sidebar{width:350px;flex-shrink:0;background:var(--surface);border-right:1px solid var(--line);display:flex;flex-direction:column;z-index:2}.side-top{height:76px;display:flex;align-items:center;padding:12px 16px;gap:15px}.icon{width:40px;height:40px;border-radius:50%;display:inline-flex;justify-content:center;align-items:center;color:var(--muted);flex-shrink:0}.icon:hover{background:var(--hover)}.icon svg{width:24px;height:24px;stroke:currentColor;stroke-width:1.9;fill:none;stroke-linecap:round;stroke-linejoin:round}.icon.small{width:28px;height:28px}.searchbox{background:var(--hover);border-radius:23px;display:flex;align-items:center;height:44px;padding:0 12px;min-width:0;flex:1;gap:8px}.searchbox svg{width:19px;stroke:var(--muted);fill:none;stroke-width:2}.searchbox input{border:0;outline:0;background:none;color:var(--ink);width:100%;min-width:0;font-size:14px}.searchbox input::placeholder{color:var(--muted)}.tabs{height:49px;padding:0 21px;display:flex;align-items:center;border-bottom:1px solid var(--line);justify-content:space-between}.tabs button{height:100%;font-size:14px;font-weight:600;color:var(--blue);border-bottom:3px solid var(--blue);padding:0 2px}.tabs button span{background:var(--blue);color:white;border-radius:12px;padding:1px 5px;font-size:11px;margin-left:4px}.archive-label{font-size:12px;color:var(--muted)}#chat-list{padding:8px;flex:1}.chat-row{display:flex;gap:12px;width:100%;padding:13px 10px;border-radius:10px;text-align:left;align-items:center}.chat-row.active{background:var(--blue);color:white}.avatar{width:48px;height:48px;display:inline-flex;flex-shrink:0;align-items:center;justify-content:center;border-radius:50%;background:linear-gradient(150deg,#cbb4e9,#8d6db8);color:white;font-size:22px;font-weight:500}.chat-row .avatar{width:54px;height:54px}.chat-summary{flex:1;min-width:0}.chat-summary strong{font-size:15px;font-weight:600}.chat-summary p{margin:6px 0 0;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;opacity:.9}.chat-row time{font-size:11px;align-self:flex-start;margin-top:4px;opacity:.75}.side-bottom{padding:17px 20px;border-top:1px solid var(--line);display:flex;gap:8px;align-items:center;font-size:12px;color:var(--muted)}.side-bottom .icon{margin-left:auto}.status-dot{width:7px;height:7px;border-radius:50%;background:#8ba699}.conversation{flex:1;position:relative;min-width:0;display:flex;flex-direction:column;background-color:var(--wall);background-image:url('/static/wallpaper.svg');background-size:410px}.chat-header{height:72px;min-height:72px;display:flex;align-items:center;justify-content:space-between;background:var(--surface);padding:0 23px;z-index:1;box-shadow:0 1px 0 #00000009}.chat-person{display:flex;align-items:center;gap:13px;text-align:left;padding:0}.chat-person strong{font-weight:600;font-size:16px;display:block}.chat-person small{display:block;color:var(--muted);font-size:13px;margin-top:4px}.chat-person .avatar{width:44px;height:44px;font-size:20px}.header-actions{display:flex;gap:8px}.mobile-back{display:none}#demo-banner{text-align:center;font-size:11px;font-weight:600;background:#f5f9efed;color:#6c7e59;padding:8px 12px;border-bottom:1px solid #5b7a3c16}#demo-banner span{font-weight:400;margin-left:10px}.filterbar{display:flex;align-items:center;justify-content:center;gap:5px;padding:12px 14px;flex-shrink:0;overflow:auto}.filterbar button{white-space:nowrap;padding:7px 11px;color:#597044;border-radius:16px;font-size:12px;background:#ffffff66}.filterbar button.active{background:#fff;color:#496537;box-shadow:var(--shadow)}#messages{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:6px max(30px,calc((100% - 780px)/2)) 25px;scroll-behavior:auto;scrollbar-width:thin;scrollbar-color:#6b795c40 transparent}.day{display:table;margin:17px auto 18px;border-radius:15px;background:#78956899;color:white;font-size:12px;font-weight:500;padding:6px 12px;backdrop-filter:blur(6px)}.message-row{display:flex;margin:5px 0;align-items:flex-end;gap:8px;scroll-margin:50px}.message-row.out{justify-content:flex-end}.bubble{max-width:min(480px,85%);position:relative;padding:8px 11px 6px;background:var(--incoming);border-radius:12px 12px 12px 4px;box-shadow:var(--shadow);min-width:95px}.out .bubble{background:var(--outgoing);border-radius:12px 12px 4px 12px}.bubble p{white-space:pre-wrap;overflow-wrap:anywhere;margin:1px 0 2px;font-size:14px;line-height:1.45}.meta{display:flex;align-items:center;justify-content:flex-end;gap:4px;color:#8c9a88;font-size:10px;min-height:16px;margin-left:24px;float:right}.meta button{padding:0;color:inherit;font-size:10px}.checks{color:#5ba552;font-size:13px;letter-spacing:-4px;margin-right:4px}.bubble:after{content:'';display:block;clear:both}.bubble .media-image{display:block;width:100%;max-height:360px;object-fit:cover;border-radius:8px;cursor:zoom-in}.bubble.has-photo{padding:4px;max-width:365px}.has-photo p,.has-photo .reactions{padding:3px 7px}.has-photo .meta{padding-right:6px}.reply{display:block;border-left:3px solid #78b65a;background:#78b65a16;border-radius:4px;padding:6px 9px;text-align:left;width:100%;margin:2px 0 7px;font-size:12px;max-width:100%;overflow:hidden;color:var(--ink)}.reply strong{display:block;color:#569b39;font-size:12px;margin-bottom:3px}.reply span{display:block;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.reactions{display:flex;gap:5px;flex-wrap:wrap;margin-top:6px}.reaction{display:inline-flex;align-items:center;gap:4px;border-radius:14px;background:#72a96420;padding:3px 8px;color:#53853d;font-size:12px}.reaction.chosen{background:#69a947;color:white}.reaction .custom-emoji{width:18px;height:18px}.service{text-align:center;margin:16px auto;font-size:12px;color:#fff;max-width:500px}.service span{display:inline-block;background:#789568a8;border-radius:15px;padding:6px 13px}.round-bubble{background:none!important;box-shadow:none;padding:0;min-width:0}.round-player{width:225px;height:225px;position:relative}.round-player video{width:100%;height:100%;object-fit:cover;border-radius:50%;box-shadow:0 2px 6px #23372540;background:#92a39a}.round-play{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:white;font-size:28px;text-shadow:0 1px 5px #0009;pointer-events:none}.round-player.playing .round-play{display:none}.round-bubble .meta{background:#5c73588c;color:white;padding:3px 9px;border-radius:15px;margin-top:5px}.voice-player{display:flex;align-items:center;gap:10px;min-width:265px;padding:4px 0}.play-button{width:43px;height:43px;border-radius:50%;background:#78b858;color:white;font-size:18px;flex-shrink:0}.voice-body{flex:1;min-width:0}.waveform{height:27px;display:flex;align-items:center;gap:2px;cursor:pointer}.waveform i{display:block;width:3px;min-width:2px;border-radius:2px;background:#a8cd90}.waveform i.played{background:#649e46}.voice-time{font-size:10px;color:#839477;margin-top:4px}.speed{font-size:11px;color:#628650;border:1px solid #8eb27870;border-radius:10px;padding:2px 5px}.file-card{display:flex;align-items:center;gap:12px;padding:8px 0;min-width:220px;text-decoration:none;color:var(--ink)}.file-icon{width:44px;height:49px;background:#73abdb;border-radius:8px;color:white;display:flex;align-items:center;justify-content:center;font-size:13px}.file-card strong{display:block;font-size:13px;max-width:230px;overflow-wrap:anywhere}.file-card small{display:block;color:var(--muted);margin-top:4px;font-size:11px}.deleted-label{display:block;color:#ab865b;font-size:10px;margin:4px 0}.message-tools{opacity:0}.message-row:hover .message-tools,.message-tools:focus{opacity:1}.message-tools button{color:#688354;font-size:19px}.sticker{width:170px;height:170px;object-fit:contain}.sticker-bubble{background:none!important;box-shadow:none}.inline-video{width:100%;max-height:340px;border-radius:8px}.forward{font-size:12px;color:var(--blue);padding-bottom:5px}.text-link{color:var(--blue);text-decoration:none}.spoiler{filter:blur(5px);cursor:pointer}.spoiler.revealed{filter:none}.poll-option{padding:8px;border-radius:5px;background:#8fb47c20;margin:6px 0;font-size:12px}.archive-footer{margin:0 auto 20px;min-height:58px;width:min(660px,calc(100% - 64px));background:var(--surface);box-shadow:0 2px 6px #43513b16;display:flex;align-items:center;border-radius:12px;padding:12px 17px;gap:13px;font-size:13px;color:#6a7b65}.archive-footer svg{width:21px;height:21px;stroke:#8b9a84;fill:none;stroke-width:1.7}.archive-footer small{display:block;font-size:10px;color:#93a18e;margin-top:3px}.archive-footer button{margin-left:auto;font-size:12px;color:var(--blue);white-space:nowrap}.archive-footer button span{margin-left:8px}.to-bottom{position:absolute;right:25px;bottom:98px;width:40px;height:40px;border-radius:50%;background:var(--surface);box-shadow:0 2px 7px #0002;color:var(--muted);font-size:23px}.loading,.empty{text-align:center;color:#66785a;margin:80px auto;line-height:1.7;font-size:14px;max-width:420px;padding:25px;background:#ffffffc9;border-radius:16px}.empty h2{font-size:20px}.load-more{display:block;margin:10px auto;background:#fff9;border-radius:18px;padding:7px 15px;color:#617653;font-size:12px}.details-panel{width:310px;background:var(--surface);border-left:1px solid var(--line);padding:20px;overflow:auto}.details-panel header{display:flex;align-items:center;justify-content:space-between;margin-bottom:30px;font-weight:600}.profile{text-align:center}.profile .avatar{width:90px;height:90px;font-size:36px;margin:5px auto 12px}.profile h2{font-size:21px;margin:8px}.profile p{font-size:13px;color:var(--muted)}.detail-section{border-top:1px solid var(--line);margin-top:25px;padding-top:20px}.detail-section h3{font-size:13px;color:var(--blue);font-weight:500}.detail-row{display:flex;justify-content:space-between;font-size:13px;margin:18px 0}.detail-row span{color:var(--muted)}.detail-section p{font-size:12px;line-height:1.7;color:var(--muted)}.detail-section button{display:block;color:var(--blue);font-size:13px;margin:15px 0;padding:0}dialog{background:var(--surface);color:var(--ink);border:0;border-radius:16px;max-width:min(650px,92vw);width:600px;max-height:85dvh;box-shadow:0 16px 70px #0004;padding:20px}dialog::backdrop{background:#15212b88;backdrop-filter:blur(4px)}dialog header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}dialog h2{font-size:18px;margin:0}dialog p{font-size:14px;line-height:1.6}dialog pre{white-space:pre-wrap;word-break:break-all;font-size:11px;background:var(--hover);padding:12px;border-radius:8px;max-height:45vh;overflow:auto}dialog img,dialog video{max-width:100%;border-radius:8px}dialog a{color:var(--blue)}.version{padding:12px 0;border-bottom:1px solid var(--line)}.version small{color:var(--muted)}.primary{border-radius:10px;background:var(--blue);color:white;padding:13px 20px;font-weight:500}#login{position:fixed;inset:0;background:var(--surface);z-index:10;display:grid;place-items:center}#login form{width:min(370px,90vw);text-align:center}#login h1{font-size:25px}#login p{font-size:14px;color:var(--muted);line-height:1.6}#login label{display:block;text-align:left;font-size:12px;color:var(--muted);margin:25px 0 16px}#login input{display:block;width:100%;padding:14px;background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:9px;margin-top:7px}#login .primary{width:100%;margin-bottom:15px}#login small{color:var(--muted);font-size:11px;line-height:1.8}.login-logo{width:84px;height:84px;border-radius:50%;background:var(--blue);color:white;margin:auto;display:grid;place-items:center;font-size:45px}#login-error{color:#cc5a4f!important}#toast{position:fixed;bottom:26px;left:50%;transform:translateX(-50%);background:#21313eea;color:#fff;border-radius:10px;padding:12px 18px;z-index:20;opacity:0;pointer-events:none;font-size:13px;transition:opacity .2s}#toast.show{opacity:1}.flash .bubble{outline:3px solid #79b855}.custom-emoji{display:inline-block;width:20px;height:20px;vertical-align:middle}body.dark{--surface:#17212b;--muted:#7e91a4;--line:#253441;--blue:#5288c1;--incoming:#182533;--outgoing:#2b5278;--ink:#e6ecf1;--wall:#0d1821;--hover:#223140;color:var(--ink)}body.dark .conversation{background-blend-mode:soft-light}body.dark .filterbar button{background:#1c2c37;color:#9aafbe}body.dark .filterbar button.active{background:#365473;color:#fff}body.dark #demo-banner{background:#1b2c35;color:#9bafb8}body.dark .meta{color:#90a7b8}body.dark .empty{background:#182533;color:#a5b5be}body.dark .archive-footer{color:#b8c7d4}body.dark .reply{color:var(--ink)}body.dark .reaction{color:#afd3eb}body.dark .waveform i{background:#759abd}body.dark .play-button{background:#5899cf}body.dark .voice-time,body.dark .speed{color:#b4c6d5}@media(min-width:1600px){.sidebar{width:390px}}@media(max-width:1100px){.sidebar{width:290px}.details-panel{position:absolute;right:0;top:0;bottom:0;z-index:4;width:310px;box-shadow:-10px 0 40px #0002}#messages{padding-left:22px;padding-right:22px}.filterbar{justify-content:flex-start}}@media(max-width:700px){.sidebar{display:none;width:100%}body.show-list .sidebar{display:flex}body.show-list .conversation{display:none}.mobile-back{display:inline-flex;font-size:33px;width:27px;margin-right:7px}.chat-header{height:64px;min-height:64px;padding:0 10px}.chat-person{gap:9px;margin-right:auto}.chat-person strong{font-size:15px}.chat-person small{font-size:11px}.chat-person .avatar{width:38px;height:38px}.header-actions{gap:0}.header-actions #info{display:none}#messages{padding:0 10px 20px}.bubble{max-width:88%}.message-tools{display:none}.filterbar{padding:9px 10px}.filterbar button{font-size:11px;padding:6px 10px}.archive-footer{width:calc(100% - 20px);margin-bottom:max(10px,env(safe-area-inset-bottom));padding:11px 13px;min-height:55px}.archive-footer small{font-size:9px}#demo-banner{font-size:10px;padding:6px}#demo-banner span{display:block;margin:2px 0 0;font-size:9px}.round-player{width:205px;height:205px}.voice-player{min-width:230px}.to-bottom{right:14px;bottom:82px}.details-panel{width:100%}.day{margin-top:13px}.bubble p{font-size:14px}.has-photo{max-width:300px!important}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

.avatar img{width:100%;height:100%;object-fit:cover;border-radius:50%}.album-bubble{max-width:420px!important;width:420px}.album-grid{display:grid;grid-template-columns:1fr 1fr;gap:3px;border-radius:8px;overflow:hidden}.album-cell{min-width:0;overflow:hidden}.album-cell .media-image,.album-cell .inline-video{width:100%;height:170px;object-fit:cover;border-radius:0}.album-cell:only-child{grid-column:1/-1}

#login{overflow:auto;padding:24px}#login-form{width:min(420px,100%);padding:30px;border:1px solid var(--line);border-radius:22px;background:var(--surface);box-shadow:0 16px 55px #18253315;text-align:center}#login-form h1{margin:18px 0 8px}#login-form>p{margin:0 0 22px}#login .login-credentials{width:100%;text-align:left}#login .login-credentials label{margin:0 0 12px}#login .login-credentials input{margin-top:7px}#login .login-credentials button{width:100%;min-height:43px;border:1px solid var(--blue);border-radius:10px;color:var(--blue);font-weight:600}#login .login-divider{display:flex;align-items:center;gap:12px;color:var(--muted);font-size:12px;margin:8px 0 18px}#login .login-divider:before,#login .login-divider:after{content:"";height:1px;background:var(--line);flex:1}#login .login-mode{margin:15px 0;color:var(--blue);font-size:12px}#login .login-status{font-size:12px;color:var(--blue)}#login-error{min-height:18px;margin:0 0 10px!important;font-size:12px!important}#login-form small{display:block}#login-form .login-logo{width:64px;height:64px;font-size:33px}@media(max-width:480px){#login{padding:0}#login-form{border:0;box-shadow:none;border-radius:0;padding:28px 22px}}

.filterbar{scrollbar-width:none}.filterbar::-webkit-scrollbar{display:none}.round-bubble{max-width:240px}.round-bubble>p{font-size:12px;margin-top:6px;color:var(--ink)}

.album-cell{position:relative}.album-item-tools{position:absolute;right:4px;bottom:4px;background:#1a2b3690;color:white;border-radius:9px;display:flex;align-items:center;font-size:10px;padding:0 5px}.album-item-tools button{font-size:16px;padding:2px 4px}
.setup-lead{color:var(--muted)}.setup-steps{padding-left:25px}.setup-steps li{padding:8px 0 17px}.setup-steps strong{font-size:15px}.setup-steps p{margin:7px 0;font-size:13px}.setup-state{font-size:12px;color:var(--blue)}.setup-note{font-size:12px!important;color:var(--muted)}.setup-actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px}.setup-actions>button:not(.primary){font-size:12px;color:var(--blue)}.pair-link{display:inline-block;padding:12px 0}.candidate-list{display:flex;flex-direction:column;gap:5px}.candidate{text-align:left;padding:12px;background:var(--hover);border-radius:8px}.candidate span{float:right;color:var(--blue);font-size:12px}.snapshot-label{display:block;font-size:9px;color:var(--muted);margin-top:4px}