:root{--bg: #ffffff;--bg-soft: #f6f6f9;--bg-hover: #efeff4;--side: #2c2550;--side-text: #d9d5f0;--side-dim: #a49fc4;--side-hover: #3a3266;--side-active: #5b4bdb;--text: #1d1c24;--dim: #6b6a78;--line: #e3e2ea;--accent: #5b4bdb;--accent-text: #ffffff;--mention-bg: #fdf1c7;--mention-text: #7a5a00;--me-bg: #ffe08a;--danger: #c0392b;--ok: #1e8e5a;--warn-bg: #fff4e5;--warn-text: #8a4b00;--shadow: 0 8px 28px rgba(20, 16, 50, .18);--radius: 8px;color-scheme:light}@media(prefers-color-scheme:dark){:root:not([data-theme=light]){--bg: #1b1a21;--bg-soft: #23222b;--bg-hover: #2b2a35;--side: #15131f;--side-text: #d9d5f0;--side-dim: #8f8aae;--side-hover: #24203a;--side-active: #5b4bdb;--text: #e8e7ef;--dim: #9e9cab;--line: #34333f;--mention-bg: #4a3d12;--mention-text: #ffd977;--me-bg: #6a5310;--warn-bg: #3d2c12;--warn-text: #ffcf8a;--shadow: 0 8px 28px rgba(0, 0, 0, .5);color-scheme:dark}}*{box-sizing:border-box}html,body{margin:0;height:100%;background:var(--bg);color:var(--text);font:15px/1.45 -apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;-webkit-text-size-adjust:100%}#app{height:100%}button,input,textarea,select{font:inherit;color:inherit}button{cursor:pointer;border:1px solid var(--line);background:var(--bg);border-radius:6px;padding:6px 12px}button:hover:not(:disabled){background:var(--bg-hover)}button:disabled{opacity:.55;cursor:default}button.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-text)}button.primary:hover:not(:disabled){filter:brightness(1.08);background:var(--accent)}button.danger{color:var(--danger)}button.icon{border:0;background:transparent;padding:4px 6px;line-height:1}button.link{border:0;background:none;padding:0;color:var(--accent);text-decoration:underline}button.on{background:var(--accent);color:var(--accent-text);border-color:var(--accent)}input,textarea,select{border:1px solid var(--line);border-radius:6px;padding:8px 10px;background:var(--bg);width:100%}input:focus,textarea:focus,button:focus-visible{outline:2px solid var(--accent);outline-offset:1px}a{color:var(--accent)}.muted{color:var(--dim)}.small{font-size:12.5px}.pad{padding:12px 16px}.center{text-align:center}.error{color:var(--danger)}.boot{display:grid;place-items:center;height:100%;color:var(--dim)}.signin{display:grid;place-items:center;min-height:100%;padding:24px 16px;background:var(--bg-soft)}.signin-card{width:100%;max-width:380px;background:var(--bg);border:1px solid var(--line);border-radius:14px;padding:32px 24px;text-align:center;box-shadow:var(--shadow)}.signin-card h1{margin:12px 0 4px;font-size:24px}.signin-card .big{width:100%;padding:12px;font-size:16px;margin-top:12px}.dev-signin{display:grid;gap:8px;margin-top:20px;padding-top:16px;border-top:1px solid var(--line)}.shell{display:grid;grid-template-columns:260px minmax(0,1fr);height:100%}.shell.with-thread{grid-template-columns:260px minmax(0,1fr) minmax(300px,380px)}.narrow-only{display:none}@media(max-width:760px){.shell,.shell.with-thread{grid-template-columns:minmax(0,1fr)}.shell.narrow-list .main,.shell.narrow-list .thread,.shell.narrow-main .sidebar,.shell.with-thread.narrow-main .main{display:none}.narrow-only{display:inline-block}}.sidebar{background:var(--side);color:var(--side-text);display:flex;flex-direction:column;min-height:0}.side-head{position:relative;padding:10px 10px 6px}.me-button{display:flex;align-items:center;gap:8px;width:100%;background:transparent;border:0;color:var(--side-text);text-align:left}.me-button:hover:not(:disabled){background:var(--side-hover)}.me-name{flex:1;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.menu{position:absolute;z-index:20;left:10px;right:10px;top:52px;background:var(--bg);color:var(--text);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);display:grid;padding:4px}.menu button{border:0;text-align:left}.status,.side-warning{margin:0 10px 6px;padding:6px 8px;border-radius:6px;font-size:13px;background:var(--warn-bg);color:var(--warn-text)}.side-search{padding:0 10px 8px}.side-search input{background:var(--side-hover);border-color:transparent;color:var(--side-text)}.side-search input::placeholder{color:var(--side-dim)}.side-scroll{overflow-y:auto;flex:1;padding-bottom:16px}.side-section{display:flex;align-items:center;justify-content:space-between;padding:12px 14px 4px;color:var(--side-dim);font-size:13px;font-weight:600}.side-actions button.icon{color:var(--side-dim);font-size:16px}.side-actions button.icon:hover{color:#fff;background:var(--side-hover)}.conv-list{list-style:none;margin:0;padding:0 6px}.conv-row{display:flex;align-items:center;gap:8px;width:100%;border:0;background:transparent;color:var(--side-dim);padding:5px 8px;text-align:left}.conv-row:hover:not(:disabled){background:var(--side-hover)}.conv-row.unread{color:#fff;font-weight:700}.conv-row.muted{opacity:.65}.conv-row.active,.conv-row.active:hover:not(:disabled){background:var(--side-active);color:#fff}.conv-icon{width:20px;text-align:center;flex:none}.conv-icon.group{font-size:11px;border:1px solid currentColor;border-radius:4px;line-height:18px}.conv-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.badge{background:#e0245e;color:#fff;border-radius:10px;font-size:11.5px;font-weight:700;padding:1px 7px}.avatar{display:inline-grid;place-items:center;flex:none;border-radius:6px;width:36px;height:36px;font-size:13px;font-weight:700;color:#fff;object-fit:cover}.avatar.sm{width:26px;height:26px;font-size:11px}.avatar.xs{width:20px;height:20px;font-size:9px;border-radius:4px}.av0{background:#5b4bdb}.av1{background:#d9534f}.av2{background:#1e8e5a}.av3{background:#e08e0b}.av4{background:#2a7ab0}.av5{background:#a0448c}.av6{background:#4f6d7a}.av7{background:#8a6d3b}.main{min-width:0;min-height:0;display:flex;flex-direction:column}.conversation,.search-pane{display:flex;flex-direction:column;height:100%;min-height:0}.empty-main{display:grid;place-items:center;height:100%}.conv-head{display:flex;align-items:center;gap:8px;padding:8px 12px;border-bottom:1px solid var(--line);min-height:52px}.conv-title{flex:1;min-width:0;border:0;background:transparent;text-align:left;padding:4px 6px;display:flex;flex-direction:column}.conv-title-name{font-weight:700;font-size:16px;margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.conv-topic{font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.members-button{flex:none}.timeline{flex:1;overflow-y:auto;padding:8px 0 12px;position:relative}.conv-start{padding:24px 20px 8px}.day-line,.new-line{display:flex;align-items:center;margin:12px 16px 4px;font-size:12.5px;font-weight:600;color:var(--dim)}.day-line:before,.day-line:after,.new-line:before,.new-line:after{content:"";flex:1;border-top:1px solid var(--line)}.day-line span,.new-line span{padding:0 10px}.new-line{color:#e0245e}.new-line:before,.new-line:after{border-color:#e0245e}.jump-latest{position:sticky;bottom:8px;display:block;margin:8px auto 0;border-radius:20px;box-shadow:var(--shadow)}.archived-note{margin:0;padding:14px 16px;border-top:1px solid var(--line);color:var(--dim);text-align:center}.msg{display:flex;gap:10px;padding:6px 16px 4px;position:relative}.msg.compact{padding-top:1px}.msg:hover{background:var(--bg-soft)}.msg.highlight{background:var(--mention-bg)}.msg-gutter{width:36px;flex:none}.msg-time-hover{visibility:hidden;font-size:11px;color:var(--dim);line-height:22px}.msg:hover .msg-time-hover{visibility:visible}.msg-body{min-width:0;flex:1}.msg-head{display:flex;align-items:baseline;gap:8px}.msg-author{font-weight:700}.msg-time{font-size:12px;color:var(--dim)}.tag{font-size:10px;font-weight:700;background:var(--bg-hover);color:var(--dim);padding:0 4px;border-radius:3px}.text{overflow-wrap:anywhere}.text p,.text blockquote,.text pre{margin:0}.text p+p{margin-top:4px}.text blockquote{border-left:3px solid var(--line);padding-left:10px;color:var(--dim)}.text pre{background:var(--bg-soft);border:1px solid var(--line);border-radius:6px;padding:8px 10px;white-space:pre-wrap;font:13px/1.4 ui-monospace,SFMono-Regular,Menlo,monospace;margin:4px 0}.text code{background:var(--bg-soft);border:1px solid var(--line);border-radius:4px;padding:0 4px;font:13px ui-monospace,SFMono-Regular,Menlo,monospace;color:#c0392b}.text.big-emoji{font-size:34px;line-height:1.2}.mention{background:var(--mention-bg);color:var(--mention-text);border-radius:4px;padding:0 2px;font-weight:600}.mention.me{background:var(--me-bg)}.edited{margin-left:4px}.deleted{font-style:italic;margin:0}.msg.system .text{color:var(--dim);font-style:italic}.msg.pending{opacity:.6}.msg.pending.failed{opacity:1}.sending,.send-failed{margin:2px 0 0}.send-failed{color:var(--danger);font-size:13px}.confirm-delete{margin:2px 0 0;font-size:13px}button.link.danger{color:var(--danger)}.msg-actions{position:absolute;top:-14px;right:16px;display:none;background:var(--bg);border:1px solid var(--line);border-radius:8px;box-shadow:var(--shadow);padding:2px}.msg:hover .msg-actions,.msg:has(:focus-visible) .msg-actions{display:flex}.msg-actions button.icon{font-size:16px;padding:4px 6px}@media(hover:none){.msg{flex-wrap:wrap}.msg:hover{background:transparent}.msg:focus-within{background:var(--bg-soft);outline:none}.msg:hover .msg-actions{display:none}.msg-actions,.msg:focus-within .msg-actions{position:static;flex-basis:100%;flex-wrap:wrap;margin:4px 0 0 46px;box-shadow:none}.msg:focus-within .msg-actions{display:flex}.msg-actions button.icon{font-size:20px;padding:8px 10px}}.msg:focus{outline:none}.reactions{display:flex;flex-wrap:wrap;gap:4px;margin-top:4px}.reaction{padding:1px 8px;border-radius:12px;font-size:13px;background:var(--bg-soft)}.reaction.mine{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 14%,var(--bg))}.reaction.add{color:var(--dim)}.thread-summary{border:0;background:transparent;color:var(--accent);font-weight:600;font-size:13px;padding:2px 0}.attachments{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}.attachment{padding:0;overflow:hidden}.attachment.image img{display:block;max-width:min(360px,100%);max-height:280px;width:auto;height:auto;object-fit:contain}.attachment.file{display:flex;align-items:center;gap:8px;padding:8px 12px;max-width:320px}.file-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.emoji-picker{position:absolute;z-index:30;right:16px;margin-top:4px;width:300px;background:var(--bg);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:8px}.emoji-grid{display:grid;grid-template-columns:repeat(8,1fr);max-height:220px;overflow-y:auto;margin-top:6px}.emoji-grid button.icon{font-size:20px;padding:4px}.composer{position:relative;padding:8px 16px 14px}.composer.edit{padding:4px 0}.composer-row{display:flex;align-items:flex-end;gap:6px;border:1px solid var(--line);border-radius:10px;padding:6px;background:var(--bg)}.composer-row:focus-within{border-color:var(--accent)}.composer textarea{border:0;resize:none;padding:6px 4px;max-height:240px;outline:none;background:transparent}.composer textarea:focus{outline:none}.composer .send{padding:6px 12px}.edit-buttons{display:flex;gap:6px}.suggest{position:absolute;bottom:100%;left:16px;right:16px;margin:0 0 4px;padding:4px;list-style:none;background:var(--bg);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);z-index:25}.suggest button{display:flex;align-items:center;gap:8px;width:100%;border:0;text-align:left}.uploads{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:6px}.chip{display:inline-flex;align-items:center;gap:4px;background:var(--bg-soft);border:1px solid var(--line);border-radius:14px;padding:2px 4px 2px 10px;font-size:13px}.chip.failed{color:var(--danger)}.thread{border-left:1px solid var(--line);display:flex;flex-direction:column;min-height:0;min-width:0}.thread-head{display:flex;align-items:center;justify-content:space-between;padding:8px 12px;border-bottom:1px solid var(--line);min-height:52px}.thread-head h2{margin:0;font-size:16px}.thread-scroll{flex:1;overflow-y:auto;padding:8px 0}.thread-count{margin:4px 16px;border-top:1px solid var(--line);padding-top:6px}.search-results{overflow-y:auto;flex:1}.result{display:flex;gap:10px;width:100%;border:0;border-bottom:1px solid var(--line);border-radius:0;text-align:left;padding:10px 16px}.result-body{display:flex;flex-direction:column;min-width:0}.result-head{display:flex;gap:8px;align-items:baseline}.result-text{overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical}.modal-back{position:fixed;inset:0;background:#0a081e73;display:grid;place-items:center;z-index:50;padding:16px}.modal{background:var(--bg);border-radius:12px;box-shadow:var(--shadow);width:100%;max-width:460px;max-height:calc(100vh - 32px);display:flex;flex-direction:column}.modal.wide{max-width:600px}.modal-head{display:flex;justify-content:space-between;align-items:center;padding:14px 16px 6px}.modal-head h2{margin:0;font-size:18px}.modal-body{padding:6px 16px 16px;overflow-y:auto}.modal-body h3{font-size:14px;margin:18px 0 6px}.modal-foot{display:flex;justify-content:flex-end;gap:8px;margin-top:12px}.form{display:grid;gap:10px}.form label{display:grid;gap:4px;font-weight:600;font-size:14px}.form.inline{grid-template-columns:1fr 1fr auto;align-items:end}@media(max-width:520px){.form.inline{grid-template-columns:1fr}}.form label.check{display:flex;align-items:center;gap:8px;font-weight:400}.form label.check input{width:auto}.label{font-weight:600;font-size:14px;margin:8px 0 4px}.row-buttons{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0}.picker .chips{display:flex;flex-wrap:wrap;gap:6px;border:1px solid var(--line);border-radius:6px;padding:6px}.picker .chips input{border:0;flex:1;min-width:120px;padding:4px}.picker-list,.member-list,.channel-list{list-style:none;margin:6px 0 0;padding:0;max-height:260px;overflow-y:auto}.picker-list button{display:flex;align-items:center;gap:8px;width:100%;border:0;text-align:left}.member-list li,.channel-list li{display:flex;align-items:center;gap:8px;padding:6px 2px;border-bottom:1px solid var(--line)}.member-list li>span{flex:1}.channel-info{display:flex;flex-direction:column;flex:1;min-width:0}.typing{margin:0;padding:0 16px;height:18px;font-size:12px;color:var(--dim);font-style:italic;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
