/* ── OpenSable Dashboard,  Global Styles ─────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  --bg-primary:   #0a0b0f;
  --bg-secondary: #12141a;
  --bg-tertiary:  #1a1d26;
  --bg-hover:     #22252f;
  --border:       #2a2d38;
  --border-light: #363a47;
  --accent:       #7c3aed;
  --accent-light: #a78bfa;
  --accent-dim:   rgba(124,58,237,0.15);
  --teal:         #00cec9;
  --teal-dim:     rgba(0,206,201,0.12);
  --green:        #22c55e;
  --green-dim:    rgba(34,197,94,0.12);
  --red:          #ef4444;
  --red-dim:      rgba(239,68,68,0.12);
  --yellow:       #eab308;
  --yellow-dim:   rgba(234,179,8,0.12);
  --blue:         #3b82f6;
  --blue-dim:     rgba(59,130,246,0.12);
  --text:         #e6edf3;
  --text-secondary: #9ca3af;
  --text-muted:   #6b7280;
  --mono:         'JetBrains Mono', monospace;
  --sans:         'Inter', system-ui, -apple-system, sans-serif;
  --radius:       10px;
  --radius-sm:    6px;
  --radius-lg:    14px;
}

html, body, #root { height: 100%; overflow: hidden; }
body {
  font-family: var(--sans);
  background: var(--bg-primary);
  color: var(--text);
  -webkit-font-smoothing: antialiased;
}

/* ── Scrollbar ────────────────────────────────────────────────────── */
::-webkit-scrollbar { width: 5px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--border); border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: var(--border-light); }
* { scrollbar-width: thin; scrollbar-color: var(--border) transparent; }

/* ── Animations ───────────────────────────────────────────────────── */
@keyframes pulse { 0%,100% { opacity: .3; } 50% { opacity: 1; } }
@keyframes progress-slide {
  0% { width: 0; margin-left: 0; }
  50% { width: 60%; margin-left: 20%; }
  100% { width: 0; margin-left: 100%; }
}
@keyframes spin { to { transform: rotate(360deg); } }
@keyframes glow-pulse {
  0%, 100% { box-shadow: 0 0 8px rgba(124,58,237,0.15); }
  50% { box-shadow: 0 0 20px rgba(124,58,237,0.35); }
}

.typing-dots span {
  display: inline-block; width: 5px; height: 5px; border-radius: 50%;
  background: var(--accent-light); animation: pulse 1.2s infinite;
}
.typing-dots span:nth-child(2) { animation-delay: .2s; }
.typing-dots span:nth-child(3) { animation-delay: .4s; }
