:root{--bg: #0b1020;--panel: #0f152a;--border: #1e2438;--text: #e6e8ef;--muted: #9aa4bf;--brand: #5561ff;--accent: #00c389}*{box-sizing:border-box}body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;background:var(--bg);color:var(--text)}.app{display:flex;height:100vh}.sidebar{width:320px;border-right:1px solid var(--border);background:var(--panel);padding:20px}.sidebar h1{margin:0 0 16px;font-size:18px}.group{margin-bottom:12px}.group label{display:block;font-size:12px;color:var(--muted);margin-bottom:6px}.group input{width:100%;padding:10px 12px;background:var(--bg);border:1px solid var(--border);border-radius:8px;color:var(--text)}.sidebar button{width:100%;padding:10px 12px;margin-top:6px;border:none;border-radius:8px;background:var(--brand);color:#fff;cursor:pointer}.sidebar button:disabled{opacity:.6;cursor:not-allowed}.presence{list-style:none;padding:0;margin:10px 0 0}.presence-item{display:flex;align-items:center;gap:8px;padding:6px 0;color:#c9d1e5}.presence-item .dot{width:8px;height:8px;border-radius:50%;background:#7a839c}.presence-item.online .dot{background:#3fb950}.badge{margin-left:auto;font-size:12px;color:var(--accent)}.chat{flex:1;display:flex;flex-direction:column}.messages{flex:1;padding:16px;overflow:auto;background:linear-gradient(180deg,var(--bg) 0%,var(--panel) 100%)}.message{margin:10px 0;padding:10px 12px;background:var(--bg);border:1px solid var(--border);border-radius:10px}.meta{color:var(--muted);font-size:12px;margin-bottom:4px}.composer{display:flex;gap:8px;padding:12px;background:var(--panel);border-top:1px solid var(--border)}.composer input{flex:1;padding:12px 14px;background:var(--bg);border:1px solid var(--border);border-radius:10px;color:var(--text)}.composer button{padding:12px 16px;border:none;border-radius:10px;background:var(--accent);color:#06101a;font-weight:600;cursor:pointer}