:root{font-family:Arial,Helvetica,sans-serif;color:#172b32;background:#e9edef;font-size:16px;--green:#008069;--line:#edf0f2;--muted:#78878e;--panel:#fff;--header:#f0f2f5;--bubble:#d9fdd3}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button{cursor:pointer;border:0;background:none;color:inherit}button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid #00a884;outline-offset:3px}input,select{border:1px solid #dce3e5;border-radius:8px;padding:13px;background:var(--panel);color:inherit;min-width:0}button.primary{background:var(--green);color:white;padding:14px 22px;border-radius:8px;font-weight:600}button.secondary{padding:12px;background:var(--header);border-radius:8px}.muted{color:var(--muted);font-size:14px;line-height:1.6}.icon{width:40px;height:40px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}.icon:hover{background:#00000009}svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.avatar{width:46px;height:46px;border-radius:50%;object-fit:cover;flex-shrink:0;background:#d8eee5}.brand{font-weight:700;letter-spacing:-1px;font-size:28px;display:flex;gap:10px;align-items:center;color:var(--green)}.brand svg{width:30px;height:30px}.auth{min-height:100dvh;background:linear-gradient(#008069 0 210px,#eef2f1 210px);padding:50px 24px}.auth>.brand{max-width:980px;margin:auto;color:white}.authcard{max-width:980px;margin:38px auto 20px;background:white;border-radius:14px;display:grid;grid-template-columns:1fr 1fr;min-height:570px;box-shadow:0 14px 55px #123b3020;overflow:hidden}.authintro{padding:65px 48px;background:#f6faf8;display:flex;flex-direction:column;justify-content:center}.authintro h1{font-size:39px;line-height:1.15;font-weight:500;letter-spacing:-1.5px;margin:25px 0 18px}.authintro p{color:#64766e;line-height:1.7}.badge{font-size:12px;text-transform:uppercase;letter-spacing:2px;color:var(--green);font-weight:700}.mini-bubble{background:#d9fdd3;border-radius:15px 15px 0 15px;padding:16px;align-self:flex-end;margin-top:20px;font-size:15px;box-shadow:0 2px 1px #0001}.authform{padding:58px 44px;display:flex;flex-direction:column;justify-content:center;gap:16px}.authform h2{font-size:25px;font-weight:500;margin:0}.authform label{font-size:14px;display:grid;gap:8px}.row{display:flex;gap:12px;align-items:center}.row>*{min-width:0}.grow{flex:1}.demo-note{background:#eff8f4;padding:12px;border-radius:8px;font-size:13px;line-height:1.7;color:#397262}.error{color:#ba3636;font-size:14px;min-height:16px}.workspace{height:calc(100dvh - 44px);max-width:1580px;margin:22px auto;display:grid;grid-template-columns:66px 365px 1fr;background:var(--panel);box-shadow:0 8px 40px #263b3320;overflow:hidden}.rail{background:var(--header);border-right:1px solid #dde3e5;display:flex;flex-direction:column;align-items:center;padding:18px 8px;gap:16px}.rail .active{background:#d9e0e3}.rail .spacer{flex:1}.rail .avatar{width:34px;height:34px}.sidebar{border-right:1px solid #dde3e5;display:flex;flex-direction:column;min-height:0}.listhead{padding:24px 22px 13px;display:flex;align-items:center;justify-content:space-between}.listhead h1{font-size:25px;margin:0;letter-spacing:-.6px}.search{margin:0 16px 14px;background:var(--header);border-radius:8px;display:flex;align-items:center;padding:0 12px;color:var(--muted)}.search input{width:100%;padding:11px;border:0;background:none;font-size:14px}.filters{display:flex;gap:8px;padding:0 18px 17px}.chip{font-size:14px;border-radius:20px;padding:8px 13px;background:var(--header);color:#64757e}.chip.active{background:#e3f4eb;color:#008069}.chatlist{overflow:auto;flex:1}.chatrow{display:flex;width:100%;gap:13px;text-align:left;padding:15px 18px;align-items:center}.chatrow:hover,.chatrow.selected{background:var(--header)}.chatrow .info{flex:1;border-bottom:1px solid var(--line);padding-bottom:14px;margin-bottom:-14px;min-width:0}.name{font-size:16px;font-weight:500}.preview{font-size:14px;color:#77878e;margin-top:7px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.time{font-size:12px;color:#8b969c}.unread{background:#25d366;color:white;border-radius:20px;min-width:20px;height:20px;padding:3px 6px;font-size:12px;float:right;margin-top:8px}.listfooter{font-size:12px;text-align:center;color:#85928f;padding:18px;border-top:1px solid var(--line)}.conversation{display:flex;flex-direction:column;min-width:0;min-height:0;background:#efeae2}.chatheader{display:flex;align-items:center;padding:12px 24px;background:var(--header);gap:13px;min-height:73px}.chatheader .subtitle{font-size:13px;color:var(--muted);margin-top:4px}.chatheader .back{display:none}.messages{flex:1;overflow:auto;padding:22px max(5%,25px);background-image:radial-gradient(#afaaa426 .9px,transparent .9px);background-size:18px 18px;display:flex;flex-direction:column;gap:9px}.day{align-self:center;background:#ffffffd9;box-shadow:0 1px 2px #0001;border-radius:7px;padding:7px 12px;font-size:12px;color:#66747b;margin:0 0 15px}.notice{background:#fff2c9;align-self:center;font-size:12px;padding:10px 15px;border-radius:8px;color:#7a745b;max-width:90%;text-align:center;margin-bottom:15px;line-height:1.5}.bubble{max-width:76%;align-self:flex-start;background:var(--panel);padding:10px 12px 7px;border-radius:0 9px 9px 9px;box-shadow:0 1px 1px #0002;font-size:15px;line-height:1.5;overflow-wrap:anywhere}.bubble.mine{background:var(--bubble);align-self:flex-end;border-radius:9px 0 9px 9px}.bubble .meta{font-size:11px;color:#83928c;text-align:right;margin-top:3px;margin-left:30px}.ticks{color:#53bdeb;margin-left:4px}.bubble img{max-width:100%;max-height:260px;border-radius:6px}.bubble audio{max-width:240px}.bubble .msg-action{float:right;font-size:13px;opacity:.4;margin-left:12px}.composer{padding:14px 19px;display:flex;gap:8px;align-items:center;background:var(--header)}.composer input{flex:1;border:0;background:var(--panel);padding:15px;border-radius:8px}.send{background:var(--green);color:white}.empty{margin:auto;text-align:center;color:#78878e;padding:30px}.empty h2{font-size:30px;font-weight:400;color:#41565d}.empty .brand{justify-content:center;font-size:48px;margin-bottom:25px}.empty .brand svg{width:65px;height:65px}.statusring{padding:3px;border:2px solid #00a884}.overlay{position:fixed;inset:0;background:#0b241d75;z-index:20;display:flex;align-items:center;justify-content:center;padding:22px;backdrop-filter:blur(3px)}.dialog{background:var(--panel);padding:28px;border-radius:16px;max-width:440px;width:100%;box-shadow:0 20px 70px #0003;max-height:90dvh;overflow:auto}.dialog h2{font-size:23px;margin:0 0 12px}.dialog label{display:grid;gap:8px;margin:15px 0;font-size:14px}.dialog .close{float:right}.dialog .primary{width:100%;margin-top:16px}.menuitem{display:block;padding:15px 8px;border-bottom:1px solid var(--line);width:100%;text-align:left}.call{background:#0c4236;color:white;text-align:center;padding:45px 30px}.call .avatar{width:100px;height:100px;margin:20px auto}.call .muted{color:#b7d9d0}.hangup{background:#e24b55;color:white;width:60px;height:60px;margin:35px 10px 0}.settingspanel{padding:15px 23px}.settingspanel .avatar{width:80px;height:80px}#toast{position:fixed;bottom:35px;left:50%;transform:translateX(-50%);background:#243c35;color:white;padding:12px 22px;border-radius:9px;z-index:30;display:none;font-size:14px;max-width:90%}.mobile-tabs{display:none}.dark{--panel:#111b21;--header:#202c33;--line:#25343d;--muted:#91a1aa;--bubble:#005c4b;color:#e9edef;background:#0b141a}.dark .conversation{background:#0b141a}.dark .day{background:#202c33}.dark .notice{background:#3c3828}.dark .chip.active{background:#005c4b;color:#d9fdd3}@media(max-width:1050px){.workspace{margin:0;height:100dvh;grid-template-columns:60px 315px 1fr}.bubble{max-width:88%}}@media(max-width:720px){.workspace{display:block;height:100dvh}.rail{display:none}.sidebar{height:100%;border:0}.listhead{padding-top:max(23px,env(safe-area-inset-top))}.listhead h1{color:var(--green)}.conversation{display:none;height:100dvh}.workspace.chat-open .sidebar{display:none}.workspace.chat-open .conversation{display:flex}.chatheader{padding:10px 12px;gap:8px}.chatheader .back{display:flex}.chatheader .avatar{width:39px;height:39px}.chatheader .name{font-size:15px}.messages{padding:20px 14px}.composer{padding:9px 8px max(9px,env(safe-area-inset-bottom));gap:1px}.composer input{padding:14px 10px}.mobile-tabs{display:flex;justify-content:space-around;padding:10px 0 max(10px,env(safe-area-inset-bottom));background:var(--header)}.mobile-tabs button{font-size:12px;display:grid;justify-items:center;gap:4px}.mobile-tabs .active{color:var(--green)}.listfooter{padding:12px}.auth{padding:25px 16px}.authcard{display:block;max-width:450px;margin-top:25px;min-height:0}.authintro{display:none}.authform{padding:35px 26px}.dialog{padding:24px}}