:root { --bg:#1a1a2e; --fg:#e6e6f0; --accent:#7c5cff; --muted:#9aa; --card:#23233b; }
* { box-sizing: border-box; }
body {
  margin:0; font-family:-apple-system,system-ui,Segoe UI,Roboto,sans-serif;
  background:var(--bg); color:var(--fg); padding:env(safe-area-inset-top) 0 0 0;
}
header {
  display:flex; align-items:center; justify-content:space-between;
  padding:12px 16px; background:#15152a; position:sticky; top:0; z-index:10;
}
.brand { font-weight:700; color:var(--accent); letter-spacing:.5px; }
.who { font-size:12px; color:var(--muted); }
.view { padding:12px 16px; }
.card { background:var(--card); border-radius:12px; padding:14px; margin:12px 16px; }
h2 { margin:8px 0; } h3 { margin:10px 0 6px; font-size:14px; color:var(--muted); }
input {
  width:100%; padding:12px; margin:6px 0; border-radius:10px; border:1px solid #3a3a5a;
  background:#1c1c30; color:var(--fg); font-size:16px;
}
.row { display:flex; gap:8px; align-items:center; }
.row input { flex:1; }
button {
  padding:12px 14px; border-radius:10px; border:1px solid #3a3a5a; background:#2c2c48;
  color:var(--fg); font-size:15px; cursor:pointer;
}
button.primary { background:var(--accent); border-color:var(--accent); color:#fff; }
.label { font-size:12px; color:var(--muted); margin:6px 0; }
.chips { display:flex; flex-wrap:wrap; gap:8px; }
.chips button { font-size:13px; padding:8px 10px; }
.messages {
  min-height:140px; max-height:38vh; overflow-y:auto; background:#1c1c30;
  border-radius:10px; padding:10px; margin:8px 0; font-size:15px;
}
.msg { padding:6px 8px; margin:4px 0; border-radius:8px; background:#2a2a44; }
.msg.mine { background:#33336a; }
.queue { color:#f5a; font-size:12px; }
.logwrap { margin-top:16px; }
.log { font-family:ui-monospace,Menlo,monospace; font-size:11px; color:var(--muted);
  max-height:22vh; overflow-y:auto; white-space:pre-wrap; }
.chan-header { margin-bottom:4px; }