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

:root {
  --bg-primary:   #0a0e17;
  --bg-secondary: #111827;
  --bg-tertiary:  #1a2333;
  --bg-elevated:  #1e293b;
  --border:       #1e3a5f;
  --border-hover: #2d5a8e;
  --text-primary:   #f1f5f9;
  --text-secondary: #94a3b8;
  --text-muted:     #64748b;
  --accent:        #0ea5e9;
  --accent-hover:  #38bdf8;
  --accent-dim:    #0c4a6e;
  --green:  #22c55e;
  --red:    #ef4444;
  --yellow: #eab308;
  --font-ui:   'IBM Plex Sans', sans-serif;
  --font-mono: 'IBM Plex Mono', monospace;
  --font-display: 'Space Grotesk', system-ui, sans-serif;
  --space-xs: 4px;  --space-sm: 8px;
  --space-md: 16px; --space-lg: 24px;
  --space-xl: 32px; --space-2xl: 48px;
  --radius-sm: 4px; --radius-md: 8px; --radius-lg: 12px;
  --touch-min: 44px;
  --nav-h: 56px;
  --font-xs: 0.65rem;
  --font-sm: 0.75rem;
  --font-base: 0.85rem;
  --font-lg: 1rem;
  --font-xl: 1.15rem;
  --sidebar-w: 300px;
}

html {
  font-size: 14px;
  scroll-behavior: smooth;
}

body {
  font-family: var(--font-ui);
  background: var(--bg-primary);
  color: var(--text-primary);
  line-height: 1.5;
  min-height: 100vh;
  -webkit-font-smoothing: antialiased;
}

a { color: var(--accent); text-decoration: none; }
a:hover { color: var(--accent-hover); }

::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: var(--bg-tertiary); }
::-webkit-scrollbar-thumb { background: var(--accent-dim); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: var(--accent); }

::selection { background: var(--accent-dim); color: var(--text-primary); }