:root {
  --bg:            #0D0F12;
  --bg-1:          #141720;
  --bg-2:          rgba(255,255,255,0.04);
  --bg-3:          rgba(255,255,255,0.07);
  --glass:         rgba(14,16,22,0.82);
  --border:        rgba(255,255,255,0.07);
  --border-strong: rgba(255,255,255,0.13);
  --text:          #EEF1F6;
  --text-2:        rgba(238,241,246,0.65);
  --text-3:        rgba(238,241,246,0.38);
  --accent:        #5B8FFF;
  --accent-dim:    rgba(91,143,255,0.14);
  --accent-border: rgba(91,143,255,0.28);
  --green:         #4CAF82;
  --green-dim:     rgba(76,175,130,0.13);
  --amber:         #D4A843;
  --amber-dim:     rgba(212,168,67,0.13);
  --red:           #D46060;
  --red-dim:       rgba(212,96,96,0.13);
  --nav-w:         224px;
  --right-w:       272px;
  --gap:           14px;
  --r-xl:          20px;
  --r-lg:          14px;
  --r-md:          10px;
  --r-sm:          7px;
  --shadow:        0 8px 32px rgba(0,0,0,0.35);
}

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

html, body {
  height: 100%;
  background: var(--bg);
  color: var(--text);
  font-family: 'DM Sans', -apple-system, sans-serif;
  font-size: 14px;
  -webkit-font-smoothing: antialiased;
  overflow: hidden;
}

button, input, select, textarea { font: inherit; color: inherit; }
button { border: 0; cursor: pointer; background: none; }

::-webkit-scrollbar { width: 4px; height: 4px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.12); border-radius: 4px; }