/* ──────────────────────────────
   DESIGN TOKENS + GLOBAL RESET
────────────────────────────── */

:root {
  --font: 'Inter', system-ui, -apple-system, sans-serif;

  /* Brand */
  --brand:       #534AB7;
  --brand-light: #6c63d1;
  --brand-dim:   rgba(83, 74, 183, 0.15);

  /* Surfaces */
  --bg:          #0d0d0f;
  --surface:     #18181b;
  --surface-2:   #232329;
  --surface-3:   #2e2e38;

  /* Borders */
  --border:      rgba(255,255,255,0.08);
  --border-2:    rgba(255,255,255,0.12);

  /* Text */
  --text:        #f4f4f5;
  --text-2:      #a1a1aa;
  --muted:       #71717a;

  /* Status */
  --success:  #00C896;
  --warning:  #f59e0b;
  --danger:   #ef4444;
  --info:     #3b82f6;

  /* Brand colours */
  --hub-primary:    #00C896;
  --hub-secondary:  #0A2647;
  --vectro-primary: #18181b;
  --vectro-accent:  #7c3aed;
  --wonda-primary:  #00C896;
}

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

html {
  font-size: 16px;
  -webkit-text-size-adjust: 100%;
}

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

button {
  font-family: inherit;
}

.hidden {
  display: none !important;
}