/* LeadSift — Design Tokens */

:root {
  /* Backgrounds */
  --bg:         #0f1117;
  --surface:    #1a1d27;
  --surface-2:  #232633;
  --surface-3:  #2a2e3d;
  --border:     #363b52;

  /* Text */
  --text:       #e4e6ef;
  --text-muted: #8b8fa3;
  --text-dim:   #7a7e94;

  /* Accent */
  --accent:     #6c5ce7;
  --accent-soft: rgba(108, 92, 231, 0.12);

  /* Semantic */
  --green:      #00c48c;
  --green-soft: rgba(0, 196, 140, 0.12);
  --yellow:     #f5a623;
  --yellow-soft: rgba(245, 166, 35, 0.12);
  --red:        #ff6b6b;
  --red-soft:   rgba(255, 107, 107, 0.12);
  --blue:       #4da6ff;
  --blue-soft:  rgba(77, 166, 255, 0.12);
  --orange:     #ff9f43;
  --orange-soft: rgba(255, 159, 67, 0.12);

  /* Bubbles */
  --bubble-inbound:  #2a2f42;
  --bubble-outbound: #252047;

  /* Radius */
  --radius-sm:   6px;
  --radius-md:   8px;
  --radius-lg:   10px;
  --radius-full: 50%;
}

* { margin: 0; padding: 0; box-sizing: border-box; }

body {
  font-family: 'DM Sans', -apple-system, BlinkMacSystemFont, sans-serif;
  background: var(--bg);
  color: var(--text);
  height: 100vh;
  overflow: hidden;
  margin: 0;
}

#app {
  display: flex;
  height: 100vh;
  width: 100%;
}

::selection {
  background: var(--accent);
  color: #fff;
}

::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #3d4255; border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: var(--text-dim); }