:root, [data-theme="dark"] {
  --bg:      #05060f;
  --bg2:     #0d0e1a;
  --bg3:     #12142b;
  --bg4:     #181b38;
  --border:  rgba(45, 50, 112, 0.35);
  --border2: #2d3270;
  --violet:  #7c6dfa;
  --violet-l:#9b8dff;
  --cyan:    #22d4fd;
  --pink:    #f959a4;
  --green:   #06f7a1;
  --red:     #ff4e6a;
  --amber:   #ffd166;
  --text1:   #f0f2ff;
  --text2:   #9ba3d4;
  --text3:   #5c669e;
  --text4:   #373d72;
  --card:    rgba(18, 20, 43, 0.72);
  --sidebar: rgba(5, 6, 15, 0.5);
}

[data-theme="light"] {
  --bg:      #f0f2ff;
  --bg2:     #ffffff;
  --bg3:     #e8eaf6;
  --bg4:     #dde0f5;
  --border:  rgba(124, 109, 250, 0.15);
  --border2: rgba(124, 109, 250, 0.30);
  --violet:  #7c6dfa;
  --violet-l:#6558e8;
  --cyan:    #0bb8e0;
  --pink:    #e0347a;
  --green:   #00a870;
  --red:     #d4002a;
  --amber:   #b87600;
  --text1:   #1a1a2e;
  --text2:   #3d3d6b;
  --text3:   #6b6b9e;
  --text4:   #9b9bc8;
  --card:    rgba(255, 255, 255, 0.9);
  --sidebar: rgba(240, 242, 255, 0.8);
}

* {
  transition: background-color 0.25s ease,
              color 0.25s ease,
              border-color 0.25s ease,
              box-shadow 0.25s ease;
}