:root {
  /* Backgrounds */
  --bg-base:        #000000;
  --bg-surface:     #0a0f18;
  --bg-elevated:    #111827;
  --bg-overlay:     rgba(0,0,0,0.7);
  --bg-hover:       #1a2236;

  /* Borders */
  --border-default: #2f3f57;
  --border-subtle:  #1a2536;
  --border-focus:   #a78bfa;

  /* Text */
  --text-primary:   #e2e8f0;
  --text-secondary: #94a3b8;
  --text-tertiary:  #64748b;
  --text-inverse:   #000000;

  /* Accent — purple for Messingy */
  --accent:         #a78bfa;
  --accent-hover:   #c4b5fd;
  --accent-subtle:  rgba(167,139,250,0.12);

  /* Semantic */
  --success:        #34d399;
  --success-subtle: rgba(52,211,153,0.12);
  --warning:        #fbbf24;
  --warning-subtle: rgba(251,191,36,0.12);
  --error:          #f87171;
  --error-subtle:   rgba(248,113,113,0.12);

  /* Messaging */
  --msg-sent:       rgba(167,139,250,0.15);
  --msg-received:   #111827;

  /* Web3 badges */
  --badge-blockinity: #8b5cf6;
  --badge-provifier:  #10b981;
  --badge-verified:   #34d399;

  /* Typography */
  --font-sans:      'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-mono:      'JetBrains Mono', 'Fira Code', monospace;
  --text-xs:        0.75rem;
  --text-sm:        0.875rem;
  --text-base:      1rem;
  --text-lg:        1.125rem;
  --text-xl:        1.25rem;
  --text-2xl:       1.5rem;
  --text-3xl:       1.875rem;

  /* Spacing */
  --space-1:  0.25rem;
  --space-2:  0.5rem;
  --space-3:  0.75rem;
  --space-4:  1rem;
  --space-5:  1.25rem;
  --space-6:  1.5rem;
  --space-8:  2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;

  /* Radius */
  --radius-sm:   4px;
  --radius-md:   8px;
  --radius-lg:   12px;
  --radius-full: 9999px;

  /* Shadows */
  --shadow-sm:  0 1px 2px rgba(0,0,0,0.5);
  --shadow-md:  0 4px 6px rgba(0,0,0,0.5);
  --shadow-lg:  0 10px 15px rgba(0,0,0,0.5);

  /* Layout */
  --sidebar-width: 320px;
  --content-max:   800px;
  --header-height: 56px;

  /* Transitions */
  --transition-fast: 150ms ease;
  --transition-base: 250ms ease;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { font-size: 16px; -webkit-text-size-adjust: 100%; }
body {
  font-family: var(--font-sans);
  font-size: var(--text-base);
  line-height: 1.5;
  color: var(--text-primary);
  background-color: var(--bg-base);
  -webkit-font-smoothing: antialiased;
}
a { color: var(--accent); text-decoration: none; }
a:hover { color: var(--accent-hover); }
img { max-width: 100%; display: block; }
button, input, textarea, select { font: inherit; color: inherit; }
button { cursor: pointer; }
ul, ol { list-style: none; }
h1, h2, h3, h4 { line-height: 1.25; }
code { font-family: var(--font-mono); font-size: 0.9em; }

::selection { color: var(--accent); background-color: var(--accent-subtle); }

::-webkit-scrollbar { height: 10px; width: 10px; }
::-webkit-scrollbar-track { background-color: var(--bg-base); }
::-webkit-scrollbar-thumb { background-color: var(--bg-elevated); border-radius: 5px; border: 1px solid var(--border-default); }
::-webkit-scrollbar-corner { background: transparent; }
