:root{--bg:#1a1d21;--bg-elevated:#222529;--bg-sidebar:#15171a;--border:#2c2f33;--text:#e8e8e8;--text-muted:#9aa0a6;--accent:#5865f2;--accent-hover:#4752c4;--danger:#f04747;--chip:#2c2f33;--chip-mine:#3b3f8a;color:var(--text);background:var(--bg);font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;line-height:1.5}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--text)}button{cursor:pointer;font-family:inherit}a{color:var(--accent)}input,textarea{font-family:inherit;font-size:1rem}code{background:var(--bg-sidebar);border-radius:4px;padding:1px 5px;font-family:ui-monospace,Consolas,monospace;font-size:.9em}.auth-screen{place-items:center;height:100%;padding:24px;display:grid}.auth-card{background:var(--bg-elevated);border:1px solid var(--border);text-align:center;border-radius:12px;width:100%;max-width:380px;padding:32px}.auth-card h1{margin:0 0 8px;font-size:1.6rem}.auth-card p{color:var(--text-muted);margin:0 0 20px}.auth-card form{flex-direction:column;gap:12px;display:flex}.auth-card input{border:1px solid var(--border);background:var(--bg);color:var(--text);border-radius:8px;padding:12px 14px}.auth-card button[type=submit],.auth-card button:not(.link-button){background:var(--accent);color:#fff;border:none;border-radius:8px;padding:12px 14px;font-weight:600}.auth-card button:hover:not(:disabled){background:var(--accent-hover)}.auth-card button:disabled{opacity:.6;cursor:default}.auth-error{color:var(--danger);margin-top:12px!important}.link-button{color:var(--accent);background:0 0;border:none;padding:0;font-size:.95rem}.app{flex-direction:column;height:100%;display:flex}.app-header{border-bottom:1px solid var(--border);background:var(--bg-sidebar);flex-shrink:0;justify-content:space-between;align-items:center;height:52px;padding:0 16px;display:flex}.app-title{font-weight:700}.app-user{color:var(--text-muted);align-items:center;gap:12px;font-size:.85rem;display:flex}.app-body{flex:1;min-height:0;display:flex}.sidebar{background:var(--bg-sidebar);border-right:1px solid var(--border);flex-shrink:0;width:220px;padding:12px 8px;overflow-y:auto}.sidebar-heading{text-transform:uppercase;letter-spacing:.05em;color:var(--text-muted);margin-bottom:4px;padding:4px 8px;font-size:.7rem}.sidebar ul{margin:0;padding:0;list-style:none}.channel-item{text-align:left;width:100%;color:var(--text-muted);background:0 0;border:none;border-radius:6px;align-items:center;gap:4px;padding:6px 8px;font-size:.95rem;display:flex}.channel-item:hover{background:var(--bg-elevated);color:var(--text)}.channel-item.active{background:var(--accent);color:#fff}.channel-hash{opacity:.6}.app-content{flex:1;min-width:0;display:flex}.channel-view{flex-direction:column;flex:1;min-width:0;display:flex}.channel-header{border-bottom:1px solid var(--border);flex-shrink:0;align-items:center;gap:4px;height:48px;padding:0 16px;font-weight:600;display:flex}.channel-main{flex:1;min-height:0;display:flex}.channel-stream{flex-direction:column;flex:1;min-width:0;display:flex}.message-list{flex-direction:column;flex:1;gap:4px;padding:16px;display:flex;overflow-y:auto}.message-list.empty{color:var(--text-muted);text-align:center;justify-content:center;align-items:center}.message{border-radius:6px;padding:6px 8px}.message:hover{background:var(--bg-elevated)}.message-head{align-items:baseline;gap:8px;display:flex}.message-author{font-weight:600}.message-time{color:var(--text-muted);font-size:.72rem}.message-body{white-space:pre-wrap;word-break:break-word}.thread-link{color:var(--accent);background:0 0;border:none;margin-top:2px;padding:2px 0;font-size:.8rem}.composer{border-top:1px solid var(--border);flex-wrap:wrap;align-items:flex-end;gap:8px;padding:12px 16px;display:flex}.composer textarea{resize:none;border:1px solid var(--border);background:var(--bg-elevated);min-height:40px;max-height:160px;color:var(--text);border-radius:8px;flex:1;padding:10px 12px}.composer button{background:var(--accent);color:#fff;border:none;border-radius:8px;padding:10px 16px;font-weight:600}.composer button:disabled{opacity:.5;cursor:default}.composer-error{color:var(--danger);width:100%;margin:0;font-size:.82rem}.thread-panel{border-left:1px solid var(--border);background:var(--bg);flex-direction:column;flex-shrink:0;width:360px;min-height:0;display:flex}.thread-head{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;height:48px;padding:0 16px;font-weight:600;display:flex}.thread-parent{border-bottom:1px solid var(--border);padding:8px}.thread-replies{flex:1;padding:8px;overflow-y:auto}.reaction-bar{flex-wrap:wrap;align-items:center;gap:4px;margin-top:4px;display:flex}.reaction-chip{background:var(--chip);border:1px solid var(--border);color:var(--text);border-radius:12px;align-items:center;gap:4px;padding:1px 8px;font-size:.85rem;line-height:1.6;display:inline-flex}.reaction-chip.mine{background:var(--chip-mine);border-color:var(--accent)}.reaction-chip.add{color:var(--text-muted);padding:1px 8px}.reaction-count{color:var(--text-muted);font-size:.75rem}.reaction-chip.mine .reaction-count{color:#cdd2ff}.reaction-add{display:inline-flex;position:relative}.reaction-picker{background:var(--bg-elevated);border:1px solid var(--border);z-index:10;border-radius:8px;gap:2px;padding:4px;display:flex;position:absolute;bottom:28px;left:0}.reaction-picker button{background:0 0;border:none;border-radius:4px;padding:2px 4px;font-size:1.1rem}.reaction-picker button:hover{background:var(--chip)}.welcome-banner{background:var(--bg-elevated);border:1px solid var(--border);border-radius:12px;margin-bottom:8px;padding:20px 24px}.welcome-banner h2{margin:0 0 8px}.welcome-banner ul{margin:8px 0;padding-left:20px}.welcome-banner li{margin:4px 0}.welcome-source{color:var(--text-muted);margin-top:12px;font-size:.9rem}.app-footer{text-align:center;border-top:1px solid var(--border);color:var(--text-muted);background:var(--bg-sidebar);flex-shrink:0;padding:8px;font-size:.8rem}.app-footer a{text-decoration:none}.app-footer a:hover{text-decoration:underline}