:root {
  --bg:           #0a0a0a;
  --bg-elev:      #121212;
  --bg-elev-2:    #1a1a1a;
  --bg-hover:     #1f1f1f;
  --bg-active:    #262626;
  --border:       #1f1f1f;
  --border-strong:#2a2a2a;
  --text:         #f5f5f5;
  --text-2:       #a3a3a3;
  --text-3:       #6b6b6b;
  --danger:       #ef4444;
  --online:       #22c55e;
  --warn:         #eab308;
  --font:         'Geist', ui-sans-serif, system-ui, -apple-system, sans-serif;
  --font-mono:    'Geist Mono', ui-monospace, monospace;
  --font-serif:   'Instrument Serif', ui-serif, Georgia, serif;
}
[data-theme="light"] {
  --bg:           #fafafa;
  --bg-elev:      #ffffff;
  --bg-elev-2:    #f5f5f5;
  --bg-hover:     #f0f0f0;
  --bg-active:    #e5e5e5;
  --border:       #e5e5e5;
  --border-strong:#d4d4d4;
  --text:         #0a0a0a;
  --text-2:       #525252;
  --text-3:       #a3a3a3;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html, body { height: 100%; overflow: hidden; }
body {
  font-family: var(--font);
  background: var(--bg);
  color: var(--text);
  font-size: 14px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}
button { background: none; border: none; cursor: pointer; padding: 0; font-family: inherit; color: inherit; }
input, textarea { font-family: inherit; color: inherit; }
::selection { background: var(--text); color: var(--bg); }
#root { height: 100vh; }

/* Scrollbar */
*::-webkit-scrollbar { width: 6px; height: 6px; }
*::-webkit-scrollbar-track { background: transparent; }
*::-webkit-scrollbar-thumb { background: var(--border-strong); border-radius: 3px; }
*::-webkit-scrollbar-thumb:hover { background: var(--text-3); }

/* Hover states */
.nav-row:hover { background: var(--bg-hover) !important; color: var(--text) !important; }
.mob-row:active { background: var(--bg-hover); }
.composer-wrap:focus-within { border-color: var(--text-3) !important; }

/* Message row hover */
.msg-row:hover .msg-actions { display: flex !important; }
.msg-row:hover .msg-ts { opacity: 1 !important; }
.msg-ts { opacity: 0; transition: opacity .15s; }
.msg-act-btn:hover { background: var(--bg-hover) !important; }

/* Room delete button */
.room-del-btn { transition: opacity .15s; }
button:hover .room-del-btn,
.nav-row:hover .room-del-btn { opacity: 1 !important; }

/* Header edit button */
.header-edit-btn { opacity: 0; transition: opacity .15s; }
header:hover .header-edit-btn { opacity: 1 !important; }

/* Animations */
@keyframes typingDot {
  0%, 60%, 100% { opacity: 0.3; transform: translateY(0); }
  30% { opacity: 1; transform: translateY(-2px); }
}
@keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: .4; } }