:root {



  /* ==========================================================

     COLORS

  ========================================================== */



  --bg: #030305;



  --panel: #08080d;

  --panel2: #111119;



  --text: #f7f7fb;



  --muted: #a8a8b6;

  --muted2: #747482;



  --purple: #8b2cff;

  --purple2: #bd74ff;

  --purple3: #4c1496;



  --line: rgba(255,255,255,.11);

  --line2: rgba(255,255,255,.20);



  --glass: rgba(255,255,255,.055);



  /* ==========================================================

     LAYOUT

  ========================================================== */



  --max: 1240px;



  --radius: 22px;



  --ticker: 42px;



  --rail: 0px;



  --header-height: 82px;



  --container-padding: 16px;



  /* ==========================================================

     TRANSITIONS

  ========================================================== */



  --transition-fast: .20s ease;

  --transition-normal: .30s ease;

  --transition-slow: .45s ease;



  /* ==========================================================

     SHADOWS

  ========================================================== */



  --shadow-soft:

    0 10px 40px rgba(0,0,0,.25);



  --shadow-medium:

    0 20px 80px rgba(0,0,0,.35);



  --shadow-large:

    0 35px 120px rgba(0,0,0,.55);



  /* ==========================================================

     GRADIENTS

  ========================================================== */



  --gradient-primary:

    linear-gradient(

      135deg,

      var(--purple),

      var(--purple2)

    );



  --gradient-dark:

    linear-gradient(

      180deg,

      rgba(255,255,255,.06),

      rgba(255,255,255,.015)

    );



  /* ==========================================================

     BORDERS

  ========================================================== */



  --border:

    1px solid var(--line);



  --border-strong:

    1px solid var(--line2);



}