:root{--bg: #0b141a;--bg-2: #111b21;--bg-3: #202c33;--line: #2a3942;--text: #e9edef;--muted: #8696a0;--accent: #00a884;--accent-2: #005c4b;--bubble-mine: #005c4b;--bubble-theirs: #202c33;--danger: #f15c6d;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}#root{height:100dvh}body{background:var(--bg);color:var(--text);overscroll-behavior:none;padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right)}button{cursor:pointer}input,textarea,button{font:inherit;color:inherit}.boot{display:grid;place-items:center;height:100vh;color:var(--muted)}.login{display:grid;place-items:center;height:100dvh;background:var(--bg);padding-top:env(safe-area-inset-top);padding-bottom:env(safe-area-inset-bottom)}.login form{background:var(--bg-2);padding:32px;border-radius:12px;width:min(92vw,380px);display:flex;flex-direction:column;gap:14px;border:1px solid var(--line)}.login h1{margin:0 0 8px;font-weight:600}.login label{display:flex;flex-direction:column;gap:4px;font-size:13px;color:var(--muted)}.login input{background:var(--bg-3);border:1px solid var(--line);border-radius:8px;padding:10px 12px;outline:none}.login input:focus{border-color:var(--accent)}.login button{background:var(--accent);border:none;border-radius:8px;padding:10px 16px;color:#081c18;font-weight:600}.login button:disabled{opacity:.5}.login .err{color:var(--danger);font-size:13px}.login .hint{color:var(--muted);font-size:12px;margin:0}.chat-root{display:grid;grid-template-columns:320px 1fr;height:100dvh}.chat-root main{background:var(--bg);display:flex;flex-direction:column;min-width:0}.chat-root main>.empty{margin:auto;color:var(--muted)}@media (max-width: 720px){.chat-root{grid-template-columns:1fr}.chat-root main{display:none}.chat-root.has-active .sidebar{display:none}.chat-root.has-active main{display:flex}}.sidebar{background:var(--bg-2);border-right:1px solid var(--line);display:flex;flex-direction:column;min-width:0}.sidebar header{display:flex;justify-content:space-between;align-items:center;padding:14px 16px;border-bottom:1px solid var(--line);padding-top:calc(14px + env(safe-area-inset-top))}.sidebar header .me strong{display:block}.sidebar header .me small{color:var(--muted)}.sidebar header .actions button{background:transparent;border:none;color:var(--muted);font-size:18px;padding:4px 8px}.sidebar header .actions button:hover{color:var(--text)}.sidebar ul.conversations{list-style:none;margin:0;padding:0;overflow-y:auto;flex:1}.sidebar ul.conversations li{padding:12px 16px;border-bottom:1px solid var(--line);cursor:pointer}.sidebar ul.conversations li:hover,.sidebar ul.conversations li.active{background:var(--bg-3)}.sidebar ul.conversations li .row{display:flex;justify-content:space-between;gap:8px}.sidebar ul.conversations li .title{font-weight:600}.sidebar ul.conversations li .preview{color:var(--muted);font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sidebar ul.conversations li .when{color:var(--muted);font-size:12px;white-space:nowrap}.sidebar ul.conversations li .badge{background:var(--accent);color:#081c18;border-radius:999px;padding:1px 8px;font-size:11px;font-weight:600}.sidebar ul.conversations li.empty{color:var(--muted);cursor:default}.sidebar footer{padding:8px 16px;color:var(--muted);font-size:12px;border-top:1px solid var(--line);padding-bottom:calc(8px + env(safe-area-inset-bottom))}.conv{display:flex;flex-direction:column;height:100%;min-width:0}.conv>header{padding:10px 16px;background:var(--bg-2);border-bottom:1px solid var(--line);display:flex;align-items:center;gap:8px;padding-top:calc(10px + env(safe-area-inset-top))}.conv>header .title{flex:1;min-width:0}.conv>header .back{display:none;background:transparent;border:none;color:var(--text);font-size:22px;line-height:1;padding:4px 8px;cursor:pointer}@media (max-width: 720px){.conv>header .back{display:inline-block}}.conv>header strong{display:block}.conv>header small{color:var(--muted)}.conv .typing{padding:2px 16px;color:var(--muted);font-size:12px}.messages{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:2px}.msg{display:flex;flex-direction:column;max-width:75%;margin:2px 0}.msg.mine{align-self:flex-end;align-items:flex-end}.msg.theirs{align-self:flex-start;align-items:flex-start}.msg .author{font-size:12px;color:var(--accent);padding:0 4px 2px}.msg .bubble{background:var(--bubble-theirs);padding:6px 10px;border-radius:8px;position:relative;word-wrap:break-word;white-space:pre-wrap}.msg.mine .bubble{background:var(--bubble-mine)}.msg .bubble .body{font-size:14.5px;line-height:1.35}.msg .bubble .meta{font-size:11px;color:var(--muted);text-align:right;margin-top:2px}.msg .bubble .meta .edited{margin-left:6px;font-style:italic}.msg .bubble .deleted{color:var(--muted);font-style:italic}.msg .bubble .reply-to{border-left:3px solid var(--accent);padding:2px 6px;margin-bottom:4px;background:#00000026;border-radius:4px;font-size:13px}.msg .bubble .reply-to strong{display:block;color:var(--accent)}.msg .bubble .reply-to span{color:var(--muted)}.msg .attachments img{max-width:320px;max-height:320px;border-radius:6px;display:block}.msg .attachments .img-placeholder{color:var(--muted);font-size:12px;padding:8px}.msg .attachments a.file{display:inline-block;color:var(--text);text-decoration:none;padding:4px 0}.msg .reactions{display:flex;gap:4px;margin-top:4px;flex-wrap:wrap}.msg .reactions button{background:var(--bg-3);border:1px solid var(--line);border-radius:999px;padding:0 8px;font-size:12px;color:var(--text)}.msg .reactions button.mine{border-color:var(--accent)}.msg .row-actions{position:relative}.msg .row-actions>button{background:transparent;border:none;color:var(--muted);padding:2px 6px}.msg .menu{position:absolute;top:24px;right:0;z-index:2;background:var(--bg-3);border:1px solid var(--line);border-radius:8px;display:flex;flex-direction:column;min-width:140px}.msg.mine .menu{right:auto;left:0}.msg .menu button{text-align:left;background:transparent;border:none;padding:8px 12px;color:var(--text)}.msg .menu button:hover{background:var(--bg-2)}.msg .menu .quick-emojis{display:flex;justify-content:space-around;padding:4px;border-bottom:1px solid var(--line)}.msg .menu .quick-emojis button{padding:4px;font-size:18px}.msg .edit textarea{width:100%;min-height:60px;background:var(--bg);color:var(--text);border:1px solid var(--line);border-radius:6px;padding:6px;resize:vertical}.msg .edit-actions{display:flex;gap:4px;justify-content:flex-end;margin-top:4px}.composer{border-top:1px solid var(--line);background:var(--bg-2);padding:8px 12px;padding-bottom:calc(8px + env(safe-area-inset-bottom))}.composer .reply-preview,.composer .pending-attachments{display:flex;justify-content:space-between;gap:8px;align-items:center;background:var(--bg-3);padding:6px 10px;border-radius:6px;margin-bottom:6px;font-size:13px}.composer .reply-preview button,.composer .pending-attachments button{background:transparent;border:none;color:var(--muted)}.composer .pending-attachments{flex-wrap:wrap}.composer .pending-attachments span{display:inline-flex;align-items:center;gap:6px}.composer-row{display:flex;align-items:flex-end;gap:8px}.composer-row .attach{background:transparent;border:none;color:var(--muted);font-size:18px;padding:6px 8px}.composer-row textarea{flex:1;resize:none;max-height:160px;background:var(--bg-3);border:1px solid var(--line);border-radius:18px;padding:10px 14px;outline:none}.composer-row textarea:focus{border-color:var(--accent)}.composer-row button:last-child{background:var(--accent);color:#081c18;border:none;padding:8px 16px;border-radius:18px;font-weight:600}.composer-row button:disabled{opacity:.5}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#0009;display:grid;place-items:center;z-index:10}.modal{background:var(--bg-2);border:1px solid var(--line);border-radius:12px;width:min(92vw,420px);max-height:80vh;padding:16px;display:flex;flex-direction:column;gap:10px}.modal h3{margin:0}.modal .tabs{display:flex;gap:6px}.modal .tabs button{flex:1;padding:6px;background:var(--bg-3);border:1px solid var(--line);color:var(--text);border-radius:6px}.modal .tabs button.on{background:var(--accent-2);border-color:var(--accent)}.modal input{background:var(--bg-3);border:1px solid var(--line);border-radius:8px;padding:8px 12px;color:var(--text)}.modal ul.candidates{list-style:none;margin:0;padding:0;overflow-y:auto;flex:1}.modal ul.candidates li{padding:8px 10px;border-radius:6px;cursor:pointer;display:flex;justify-content:space-between;align-items:center}.modal ul.candidates li:hover{background:var(--bg-3)}.modal ul.candidates li.on{background:var(--accent-2)}.modal ul.candidates li small{color:var(--muted)}.modal-actions{display:flex;justify-content:flex-end;gap:8px}.modal-actions button{background:var(--bg-3);border:1px solid var(--line);color:var(--text);padding:8px 14px;border-radius:6px}.modal-actions button:last-child{background:var(--accent);color:#081c18;border-color:var(--accent)}.modal-actions button:disabled{opacity:.5}
