:root{color:#1a1a1a;background:#f5f6f8;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif}*{box-sizing:border-box}body{margin:0}.page-status{text-align:center;color:#6b7280;padding:2rem}.login-form{background:#fff;border-radius:.75rem;flex-direction:column;gap:.75rem;max-width:22rem;margin:4rem auto;padding:1.5rem;display:flex;box-shadow:0 1px 4px #00000014}.login-form input{border:1px solid #d1d5db;border-radius:.5rem;padding:.6rem .75rem;font-size:1rem}.login-form button{color:#fff;cursor:pointer;background:#2563eb;border:0;border-radius:.5rem;padding:.6rem;font-size:1rem}.login-form button:disabled{opacity:.6;cursor:default}.login-error{color:#b91c1c;font-size:.9rem}.app-header{background:#fff;border-bottom:1px solid #e5e7eb;justify-content:space-between;align-items:center;gap:.5rem;padding:.75rem 1rem;display:flex}.app-header-title{align-items:center;gap:.5rem;display:flex}.link-btn{color:#2563eb;cursor:pointer;background:0 0;border:0;padding:.25rem;font-size:.95rem}.ws-badge{color:#fff;white-space:nowrap;border-radius:999px;padding:.1rem .45rem;font-size:.72rem}.ws-connected{background:#16a34a}.ws-connecting{background:#d97706}.ws-disconnected{background:#9ca3af}.chats-screen{background:#fff;max-width:48rem;min-height:100vh;margin:0 auto}.chats-search,.conv-search{border:1px solid #d1d5db;border-radius:.5rem;width:100%;padding:.55rem .75rem;font-size:.95rem}.chats-search{width:calc(100% - 2rem);margin:.75rem 1rem}.chat-list{margin:0;padding:0;list-style:none}.chat-list-item{border-bottom:1px solid #f0f1f3;align-items:center;gap:.5rem;padding:.6rem 1rem;display:flex}.chat-list-link{color:inherit;flex-direction:column;flex:1;min-width:0;text-decoration:none;display:flex}.chat-list-name{font-weight:600}.chat-list-preview{color:#6b7280;white-space:nowrap;text-overflow:ellipsis;font-size:.88rem;overflow:hidden}.unread-badge{color:#fff;text-align:center;background:#2563eb;border-radius:999px;min-width:1.25rem;padding:.05rem .45rem;font-size:.75rem}.mute-toggle{cursor:pointer;background:0 0;border:0;font-size:1rem}.conversation{background:#fff;flex-direction:column;max-width:48rem;height:100vh;margin:0 auto;display:flex}.conv-peer{text-align:center;flex-direction:column;display:flex}.conv-presence{color:#6b7280;font-size:.75rem}.conv-toolbar{border-bottom:1px solid #f0f1f3;align-items:center;gap:.5rem;padding:.5rem 1rem;display:flex}.pinned-banner{background:#fef9c3;justify-content:space-between;align-items:center;gap:.5rem;padding:.4rem 1rem;font-size:.85rem;display:flex}.pinned-label{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.conv-messages{background:#f5f6f8;flex-direction:column;flex:1;gap:.35rem;padding:.75rem 1rem;display:flex;overflow-y:auto}.load-more{cursor:pointer;background:#e5e7eb;border:0;border-radius:.5rem;align-self:center;padding:.35rem .75rem;font-size:.85rem}.msg{flex-direction:column;max-width:80%;display:flex;position:relative}.msg-own{align-self:flex-end;align-items:flex-end}.msg-peer{align-self:flex-start;align-items:flex-start}.msg-bubble{word-break:break-word;white-space:pre-wrap;background:#fff;border-radius:.75rem;padding:.4rem .6rem;box-shadow:0 1px 1px #0000000f}.msg-own .msg-bubble{background:#dbeafe}.msg-deleted .msg-tombstone{color:#6b7280;padding:.25rem .5rem;font-size:.88rem;font-style:italic}.msg-quote{color:#4b5563;white-space:pre-wrap;background:#00000008;border-left:3px solid #93c5fd;margin-bottom:.2rem;padding:.1rem .4rem;font-size:.82rem}.msg-attachment{color:#374151;margin-top:.2rem;font-size:.85rem;display:block}.att-file{color:#2563eb;text-decoration:none}.att-error{color:#b91c1c}.att-loading{color:#9ca3af;font-style:italic}.att-image-link{margin-top:.25rem;display:block}.att-image{object-fit:cover;border-radius:.5rem;max-width:14rem;max-height:14rem;display:block}.msg-meta{color:#6b7280;justify-content:flex-end;align-items:center;gap:.3rem;margin-top:.15rem;font-size:.68rem;display:flex}.msg-edited{font-style:italic}.tick-read{color:#2563eb}.tick-failed{color:#b91c1c}.msg-reactions{flex-wrap:wrap;gap:.25rem;margin-top:.25rem;display:flex}.reaction-chip{cursor:pointer;background:#fff;border:1px solid #e5e7eb;border-radius:999px;padding:.02rem .4rem;font-size:.78rem}.reaction-mine{background:#bfdbfe;border-color:#93c5fd}.msg-actions{opacity:0;gap:.1rem;margin-top:.15rem;transition:opacity .1s;display:flex}.msg:hover .msg-actions{opacity:1}.msg-actions button{cursor:pointer;background:0 0;border:0;padding:.1rem .2rem;font-size:.85rem}.reaction-picker{background:#fff;border:1px solid #e5e7eb;border-radius:999px;gap:.2rem;margin-top:.2rem;padding:.1rem .3rem;display:flex}.reaction-picker button{cursor:pointer;background:0 0;border:0;font-size:1.1rem}.composer{background:#fff;border-top:1px solid #e5e7eb;padding:.5rem 1rem}.composer-banner{color:#4b5563;justify-content:space-between;align-items:center;gap:.5rem;padding:.25rem 0;font-size:.82rem;display:flex}.composer-quote{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.composer-banner button{cursor:pointer;background:0 0;border:0}.composer-attachments{flex-wrap:wrap;gap:.35rem;padding:.25rem 0;display:flex}.attach-chip{background:#eef2ff;border:1px solid #c7d2fe;border-radius:999px;align-items:center;gap:.25rem;padding:.1rem .5rem;font-size:.8rem;display:inline-flex}.attach-chip button{cursor:pointer;background:0 0;border:0}.composer-hint{color:#6b7280;margin:.2rem 0;font-size:.8rem}.composer-attach{cursor:pointer;background:0 0;border:0;padding:.4rem .3rem;font-size:1.2rem}.composer-attach:disabled{opacity:.5;cursor:default}.composer-row{align-items:flex-end;gap:.5rem;display:flex}.composer-input{resize:vertical;min-height:2.2rem;max-height:8rem;font:inherit;border:1px solid #d1d5db;border-radius:.5rem;flex:1;padding:.5rem .6rem}.composer-send{color:#fff;cursor:pointer;background:#2563eb;border:0;border-radius:.5rem;padding:.5rem .9rem}.composer-send:disabled{opacity:.5;cursor:default}.composer-error{color:#b91c1c;margin:.25rem 0 0;font-size:.8rem}.app-nav{align-items:center;gap:.5rem;display:flex}.card{flex-direction:column;gap:.75rem;padding:1rem;display:flex}.card-name{margin:0}.card-fields{flex-direction:column;gap:.4rem;margin:0;display:flex}.card-row{gap:.5rem;display:flex}.card-row dt{color:#6b7280;min-width:9rem;margin:0}.card-row dd{margin:0}.notif-unread{background:#eff6ff}.unread-dot{background:#2563eb;border-radius:999px;flex:none;width:.6rem;height:.6rem}