:root{--green:#00a884;--green-dark:#008069;--bg:#f0f2f5;--panel:#fff;--head:#f0f2f5;--line:#e9edef;--text:#111b21;--muted:#667781;--out:#d9fdd3;--in:#fff;--wallpaper:#efeae2;--danger:#d93025;--blue:#53bdeb;color:var(--text);font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg)}button,input,textarea{font:inherit;color:inherit}button{cursor:pointer}.btn{border:0;border-radius:8px;padding:10px 18px;font-weight:600}.btn--primary{background:var(--green);color:#fff}.btn--primary:hover:not(:disabled){background:var(--green-dark)}.btn:disabled{opacity:.6;cursor:default}.icon-btn{width:40px;height:40px;color:var(--muted);background:0 0;border:0;border-radius:50%;place-items:center;display:grid}.icon-btn:hover{background:#0000000f}.login{background:linear-gradient(var(--green) 0 220px, var(--bg) 220px);place-items:center;min-height:100%;padding:16px;display:grid}.login__card{background:var(--panel);border-radius:12px;flex-direction:column;gap:14px;width:min(420px,100%);padding:28px;display:flex;box-shadow:0 6px 24px #0000001f}.login__logo{color:var(--green)}.login h1{margin:0;font-size:26px}.login__hint,.login__note{color:var(--muted);margin:0;font-size:14px}.login__note{font-size:12px}.login a{color:var(--green-dark)}.login label{color:var(--muted);flex-direction:column;gap:6px;font-size:13px;display:flex}.login input,.newchat input{border:1px solid var(--line);background:#fff;border-radius:8px;outline:none;padding:10px 12px}.login input:focus,.newchat input:focus{border-color:var(--green)}.login__adv summary{cursor:pointer;color:var(--muted);margin-bottom:8px;font-size:13px}.login__error,.newchat__error{color:var(--danger);background:#fdecea;border-radius:8px;padding:10px 12px;font-size:13px}.app{background:var(--panel);max-width:1500px;height:100%;box-shadow:0 0 0 1px var(--line);grid-template-columns:380px 1fr;margin:0 auto;display:grid}.sidebar{border-right:1px solid var(--line);flex-direction:column;min-height:0;display:flex}.sidebar__head{background:var(--head);justify-content:space-between;align-items:center;min-height:60px;padding:10px 12px;display:flex}.sidebar__me{align-items:center;gap:12px;min-width:0;display:flex}.sidebar__title{font-size:17px;font-weight:700}.sidebar__status{color:var(--muted);font-size:12px}.sidebar__status--off{color:var(--danger)}.sidebar__actions{display:flex}.newchat{border-bottom:1px solid var(--line);flex-direction:column;gap:8px;padding:12px;display:flex}.chatlist{flex:1;margin:0;padding:0;list-style:none;overflow-y:auto}.chatlist__empty{color:var(--muted);text-align:center;padding:24px 20px;font-size:14px}.chatitem{text-align:left;border:0;border-bottom:1px solid var(--line);background:0 0;align-items:center;gap:12px;width:100%;padding:10px 14px;display:flex}.chatitem:hover{background:var(--head)}.chatitem--active{background:#e7ebee}.chatitem__body{flex-direction:column;flex:1;gap:3px;min-width:0;display:flex}.chatitem__row{justify-content:space-between;align-items:center;gap:8px;display:flex}.chatitem__name{text-overflow:ellipsis;white-space:nowrap;font-weight:600;overflow:hidden}.chatitem__time{color:var(--muted);flex:none;font-size:12px}.chatitem__preview{color:var(--muted);text-overflow:ellipsis;white-space:nowrap;font-size:14px;overflow:hidden}.badge{background:var(--green);color:#fff;border-radius:999px;flex:none;place-items:center;min-width:20px;height:20px;padding:0 6px;font-size:12px;font-weight:700;display:grid}.avatar{color:#fff;border-radius:50%;flex:none;place-items:center;width:40px;height:40px;font-weight:700;display:grid}.chat{background:var(--wallpaper);flex-direction:column;min-height:0;display:flex}.chat--empty{text-align:center;color:var(--muted);justify-content:center;align-items:center}.chat--empty h2{color:var(--text);font-weight:500}.chat__head{background:var(--head);border-bottom:1px solid var(--line);align-items:center;gap:12px;min-height:60px;padding:10px 16px;display:flex}.chat__back{display:none}.chat__name{font-weight:600}.chat__messages{flex-direction:column;flex:1;gap:3px;padding:16px min(8%,64px);display:flex;overflow-y:auto}.chat__row{flex-direction:column;display:flex}.chat__hint{color:var(--muted);background:#ffffffd9;border-radius:8px;align-self:center;padding:6px 12px;font-size:13px}.day{color:var(--muted);background:#ffffffe6;border-radius:8px;align-self:center;margin:10px 0;padding:4px 10px;font-size:12px}.bubble{overflow-wrap:anywhere;border-radius:8px;max-width:min(75%,560px);padding:6px 8px 5px 10px;display:flow-root;box-shadow:0 1px .5px #0b141a21}.bubble--in{background:var(--in);border-top-left-radius:0;align-self:flex-start}.bubble--out{background:var(--out);border-top-right-radius:0;align-self:flex-end}.bubble--muted .bubble__text{color:var(--muted);font-style:italic}.bubble--failed{background:#fdecea}.bubble__text{white-space:pre-wrap;font-size:14.5px;line-height:1.35}.bubble__meta{float:right;color:var(--muted);align-items:center;gap:3px;margin:6px 0 0 10px;font-size:11px;display:inline-flex}.bubble__retry{clear:both;color:var(--danger);background:0 0;border:0;margin-top:4px;padding:0;font-size:12px;text-decoration:underline;display:block}.tick{color:var(--muted)}.tick--read{color:var(--blue)}.tick--pending{font-size:10px}.composer{background:var(--head);align-items:flex-end;gap:8px;padding:10px 14px;display:flex}.composer textarea{resize:none;background:#fff;border:0;border-radius:10px;outline:none;flex:1;max-height:140px;padding:10px 14px;line-height:1.35}.send{background:var(--green);color:#fff;border:0;border-radius:50%;flex:none;place-items:center;width:44px;height:44px;display:grid}.send:disabled{cursor:default;background:#b7c4cc}@media (width<=760px){.app{grid-template-columns:1fr}.app .chat,.app--chat-open .sidebar{display:none}.app--chat-open .chat{display:flex}.chat__back{display:grid}.chat__messages{padding:12px}}