:root{--accent: #3390ec;--accent-2: #2b7fd4;--bg: #0e1621;--bg-2: #17212b;--bg-3: #1c2733;--panel: #202b36;--hover: #202b36;--active: #2b5278;--text: #eef2f6;--text-dim: #8794a1;--border: #101820;--bubble-in: #182533;--bubble-out: #2b5278;--danger: #e15b64;--ok: #61c877;--warn: #e0a94a;--radius: 12px;--shadow: 0 6px 24px rgba(0, 0, 0, .35)}@media(prefers-color-scheme:light){:root{--bg: #ffffff;--bg-2: #ffffff;--bg-3: #f1f3f5;--panel: #ffffff;--hover: #f1f3f5;--active: #e7f1fb;--text: #1a1a1a;--text-dim: #7d8894;--border: #e6e9ec;--bubble-in: #f1f3f5;--bubble-out: #cfe9ff;--shadow: 0 6px 24px rgba(0,0,0,.12)}}*{box-sizing:border-box;margin:0;padding:0}body{font-family:-apple-system,Segoe UI,system-ui,sans-serif;background:var(--bg);color:var(--text);height:100vh;overflow:hidden}.hidden{display:none!important}.view{height:100vh}.hint{color:var(--text-dim);font-size:.82rem}.error{color:var(--danger);min-height:1.1em;font-size:.85rem;margin:.3rem 0}button{cursor:pointer;border:none;border-radius:8px;padding:.5rem .9rem;background:var(--accent);color:#fff;font-size:.9rem;transition:background .15s,opacity .15s}button:hover{background:var(--accent-2)}button:disabled{opacity:.5;cursor:default}button.small{padding:.28rem .6rem;font-size:.78rem;background:var(--bg-3);color:var(--text)}button.small:hover{background:var(--hover)}button.danger,.danger-btn{background:var(--danger)}.danger-btn{width:100%;padding:.7rem}input,textarea{border:1px solid var(--border);border-radius:8px;padding:.6rem .8rem;background:var(--bg-3);color:var(--text);font-size:.92rem;font-family:inherit;outline:none}input:focus,textarea:focus{border-color:var(--accent)}.icon-btn{background:transparent;color:var(--text-dim);font-size:1.1rem;padding:.3rem .45rem;border-radius:50%}.icon-btn:hover{background:var(--hover);color:var(--text)}.avatar{display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;border-radius:50%;color:#fff;font-weight:600;font-size:.95rem;flex:none}.avatar.big{width:72px;height:72px;font-size:1.5rem}.badge{font-size:.7rem;padding:.05rem .4rem;border-radius:6px;background:var(--bg-3);color:var(--text-dim)}.badge.ok{background:#61c87726;color:var(--ok)}.badge.warn{background:#e0a94a26;color:var(--warn)}#auth-view{display:flex;align-items:center;justify-content:center;background:linear-gradient(160deg,var(--bg),var(--bg-2))}.auth-card{background:var(--bg-2);padding:2.5rem;border-radius:16px;width:23rem;box-shadow:var(--shadow);text-align:center}.auth-logo{font-size:3rem}.auth-card h1{font-size:1.35rem;margin:.3rem 0}.auth-card form{display:flex;flex-direction:column;gap:.7rem;margin-top:1.2rem}.auth-card button[type=submit]{padding:.65rem;font-weight:600}.switch-auth{margin-top:1rem;font-size:.85rem;color:var(--text-dim)}.switch-auth a{color:var(--accent);text-decoration:none}#app-view{display:flex}#sidebar{width:22rem;background:var(--bg-2);border-right:1px solid var(--border);display:flex;flex-direction:column}.side-head{display:flex;align-items:center;justify-content:space-between;padding:.7rem .9rem;border-bottom:1px solid var(--border)}.side-me{display:flex;align-items:center;gap:.6rem;min-width:0}.side-me .avatar{width:38px;height:38px;font-size:.85rem}.side-me-txt{min-width:0}.side-name{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.side-actions{display:flex;gap:.1rem}.vpn-bar{display:flex;align-items:center;justify-content:space-between;padding:.5rem .9rem;background:var(--bg-3);font-size:.8rem;color:var(--text-dim)}.switch{width:40px;height:22px;border-radius:999px;background:#46525e;position:relative;padding:0}.switch .knob{position:absolute;top:2px;left:2px;width:18px;height:18px;border-radius:50%;background:#fff;transition:left .18s}.switch.on{background:var(--ok)}.switch.on .knob{left:20px}.side-search{display:flex;gap:.4rem;padding:.6rem .9rem}.side-search input{flex:1}.newchat-btn{background:var(--accent);width:38px;font-size:1.2rem;padding:0}.chat-list{flex:1;overflow-y:auto}.chat-item{display:flex;gap:.7rem;padding:.6rem .9rem;cursor:pointer;align-items:center}.chat-item:hover{background:var(--hover)}.chat-item.active{background:var(--active)}.chat-avatar{position:relative}.online-dot{position:absolute;right:0;bottom:0;width:12px;height:12px;border-radius:50%;background:var(--ok);border:2px solid var(--bg-2)}.chat-main{flex:1;min-width:0}.chat-row1,.chat-row2{display:flex;justify-content:space-between;align-items:center;gap:.5rem}.chat-title{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.group-tag{font-size:.65rem;color:var(--text-dim);font-weight:400}.chat-time{font-size:.7rem;color:var(--text-dim);flex:none}.chat-preview{color:var(--text-dim);font-size:.83rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.unread{background:var(--accent);color:#fff;font-size:.7rem;border-radius:999px;padding:.05rem .4rem;min-width:18px;text-align:center;flex:none}.empty-hint{padding:2rem 1rem;text-align:center;color:var(--text-dim);font-size:.85rem}#chat-main{flex:1;display:flex;flex-direction:column;background:var(--bg);background-image:radial-gradient(circle at 50% 0,rgba(43,82,120,.12),transparent 60%)}.no-chat{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--text-dim);gap:.5rem;font-size:2.5rem}.no-chat p{font-size:.95rem}#conversation{flex:1;display:flex;flex-direction:column;height:100vh}#conv-header{display:flex;align-items:center;gap:.7rem;padding:.6rem 1rem;background:var(--bg-2);border-bottom:1px solid var(--border)}#conv-header .avatar{width:40px;height:40px;font-size:.85rem}.conv-headtxt{flex:1;min-width:0}.conv-title{font-weight:600}.conv-subtitle{font-size:.78rem;color:var(--text-dim)}.conv-subtitle .online,.conv-subtitle.typing{color:var(--accent)}#timeline{flex:1;overflow-y:auto;padding:1rem 1.2rem;display:flex;flex-direction:column;gap:.15rem}.day-sep{text-align:center;margin:.8rem 0}.day-sep span{background:#00000040;color:var(--text-dim);font-size:.72rem;padding:.15rem .7rem;border-radius:999px}.msg-row{display:flex;align-items:flex-end;gap:.4rem;max-width:72%}.msg-row.mine{align-self:flex-end;flex-direction:row-reverse}.bubble{background:var(--bubble-in);padding:.4rem .65rem;border-radius:14px 14px 14px 4px;position:relative;min-width:3rem}.msg-row.mine .bubble{background:var(--bubble-out);border-radius:14px 14px 4px}.msg-row.undecryptable .bubble{font-style:italic;color:var(--warn)}.bubble-sender{font-size:.78rem;font-weight:600;color:var(--accent);margin-bottom:.1rem}.bubble-text{white-space:pre-wrap;word-break:break-word;line-height:1.35}.fwd-note{font-size:.72rem;color:var(--text-dim);border-left:2px solid var(--accent);padding-left:.4rem;margin-bottom:.2rem}.bubble-meta{display:flex;align-items:center;gap:.25rem;justify-content:flex-end;margin-top:.1rem}.bubble-time{font-size:.66rem;color:var(--text-dim)}.msg-row.mine .bubble-time{color:#fff9}.ticks{font-size:.7rem;color:#ffffff8c}.ticks.read{color:#7fd0ff}.sd-clock,.nf-lock{font-size:.7rem;opacity:.8}.reacts{display:flex;flex-wrap:wrap;gap:.25rem;margin-top:.3rem}.react-chip{background:#0003;color:var(--text);font-size:.78rem;padding:.1rem .4rem;border-radius:999px;display:flex;gap:.2rem;align-items:center}.react-chip.mine{background:var(--accent);color:#fff}.react-chip span{font-size:.72rem;opacity:.9}.msg-actions{display:flex;gap:.1rem;opacity:0;transition:opacity .12s}.msg-row:hover .msg-actions{opacity:1}.msg-act{background:var(--bg-3);color:var(--text-dim);font-size:.85rem;padding:.2rem .35rem;border-radius:6px}.msg-act:hover{background:var(--hover);color:var(--text)}#composer{display:flex;align-items:flex-end;gap:.5rem;padding:.6rem 1rem;background:var(--bg-2);border-top:1px solid var(--border)}#composer textarea{flex:1;resize:none;max-height:140px;border-radius:18px}.send-btn{width:42px;height:42px;border-radius:50%;font-size:1.1rem;padding:0;flex:none}.sd-pill{background:var(--bg-3);color:var(--text-dim);width:42px;height:42px;border-radius:50%;padding:0;flex:none;font-size:1rem}.sd-pill.on{background:var(--warn);color:#fff}.popover{position:fixed;z-index:50;background:var(--panel);border:1px solid var(--border);border-radius:10px;box-shadow:var(--shadow);padding:.3rem}.reaction-picker{display:flex;gap:.15rem}.reaction-picker button{background:transparent;font-size:1.2rem;padding:.25rem;border-radius:8px}.reaction-picker button:hover{background:var(--hover)}.popover.menu{display:flex;flex-direction:column;min-width:12rem}.popover.menu button{background:transparent;color:var(--text);text-align:left;padding:.5rem .7rem;border-radius:6px}.popover.menu button:hover{background:var(--hover)}.popover.menu button.active{color:var(--accent)}#settings-view{overflow-y:auto;background:var(--bg)}.settings-page{max-width:42rem;margin:0 auto;padding:1rem 1.2rem 3rem}.settings-head{display:flex;align-items:center;gap:.6rem;padding:.5rem 0 1rem}.set-section{background:var(--bg-2);border-radius:var(--radius);padding:1rem 1.1rem;margin-bottom:.9rem}.set-section h3{font-size:.8rem;text-transform:uppercase;color:var(--text-dim);margin-bottom:.6rem;display:flex;gap:.6rem;align-items:center}.set-section.profile{display:flex;gap:1rem;align-items:center}.set-profile-fields{flex:1}.set-profile-fields label{font-size:.75rem;color:var(--text-dim)}.set-profile-fields .row{display:flex;gap:.5rem;margin:.3rem 0}.set-profile-fields .row input{flex:1}.set-line{padding:.2rem 0;font-size:.9rem}.set-vpn{display:flex;align-items:center;justify-content:space-between;gap:1rem}.device-card{border:1px solid var(--border);border-radius:10px;padding:.7rem .85rem;margin-bottom:.5rem;background:var(--bg-3)}.device-card.current{border-color:var(--accent)}.device-head{display:flex;justify-content:space-between;align-items:center;gap:.5rem}.device-meta{font-size:.76rem;color:var(--text-dim);margin-top:.35rem;line-height:1.5}.device-meta code,.member-main code{background:var(--bg-2);padding:.05rem .3rem;border-radius:4px}.device-actions{display:flex;gap:.4rem;margin-top:.5rem}.tag{font-size:.68rem;padding:.08rem .45rem;border-radius:999px}.tag.this{background:#3390ec26;color:var(--accent)}.tag.ok{background:#61c87726;color:var(--ok)}.tag.warn{background:#e0a94a26;color:var(--warn)}.modal{position:fixed;inset:0;background:#0000008c;display:flex;align-items:center;justify-content:center;z-index:30;padding:1rem}.modal-card{background:var(--bg-2);border-radius:14px;padding:1.4rem;width:26rem;max-width:94vw;max-height:88vh;overflow-y:auto;box-shadow:var(--shadow)}.modal-card.wide{width:40rem}.modal-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:.8rem}.modal-head h2{font-size:1.1rem}.modal-card h2{font-size:1.1rem;margin-bottom:.5rem}.modal-buttons{display:flex;gap:.6rem;justify-content:flex-end;margin-top:1rem}.modal-card input{width:100%}.pick-list{display:flex;flex-direction:column;gap:.25rem;margin-top:.8rem;max-height:60vh;overflow-y:auto}.forward-item,.member-row{display:flex;align-items:center;gap:.6rem;padding:.5rem;border-radius:10px;cursor:pointer}.forward-item:hover{background:var(--hover)}.member-row{cursor:default}.member-main{flex:1;min-width:0}.member-row .avatar,.forward-item .avatar{width:36px;height:36px;font-size:.8rem}.emoji-row{display:flex;flex-wrap:wrap;gap:.8rem;margin:1rem 0;justify-content:center}.emoji-item{text-align:center;width:4.2rem}.emoji-item .glyph{font-size:2rem}.emoji-item .name{font-size:.7rem;color:var(--text-dim)}.recovery-key{background:var(--bg-3);border:1px solid var(--border);border-radius:8px;padding:.8rem;margin:.8rem 0;font-family:ui-monospace,monospace;font-size:1rem;letter-spacing:.05em;white-space:pre-wrap;word-break:break-all;user-select:all}.admin-inline-form{display:flex;gap:.5rem;align-items:center;flex-wrap:wrap;margin-bottom:.5rem}.admin-inline-form input{flex:1;min-width:8rem;width:auto}.admin-list{display:flex;flex-direction:column;gap:.4rem;max-height:26vh;overflow-y:auto;margin-bottom:.4rem}.admin-row{border:1px solid var(--border);border-radius:8px;padding:.5rem .7rem;background:var(--bg-3);font-size:.85rem}.admin-row-head{display:flex;justify-content:space-between;align-items:center;gap:.5rem}.admin-devices{margin-top:.5rem;border-top:1px solid var(--border);padding-top:.5rem}.admin-device{padding:.15rem 0;color:var(--text-dim);font-size:.8rem}.device-actions .small{white-space:nowrap}h3 .small{margin-left:auto}