/* ============================================================
   Design Tokens — colors, gradients, radii, spacing
   ============================================================ */
:root {
  /* Backgrounds */
  --bg:       #0A0A0F;
  --bg-s:     #111118;
  --bg-e:     #18182A;
  --bg-o:     #20203A;

  /* Accents */
  --purple:   #6C63FF;
  --cyan:     #3ECFCF;
  --green:    #00FFA3;
  --orange:   #F7931A;
  --pink:     #DC1FFF;
  --yellow:   #FBCA0A;
  --red:      #FF5C5C;

  /* Text */
  --t1: #FFFFFF;
  --t2: #9898B8;
  --t3: #55557A;

  /* Borders */
  --b1: rgba(255,255,255,0.07);
  --b2: rgba(255,255,255,0.13);
  --ba: rgba(108,99,255,0.45);

  /* Gradients */
  --g1: linear-gradient(135deg,#6C63FF,#3ECFCF);
  --g2: linear-gradient(135deg,#00FFA3,#03E1FF,#DC1FFF);
  --g3: linear-gradient(135deg,#F7931A,#FBCA0A);
  --g4: linear-gradient(135deg,#00C97F,#00FFA3);
  --g5: linear-gradient(135deg,#6C63FF 0%,#3ECFCF 60%,#00FFA3 100%);

  /* Layout */
  --nav: 64px;
  --r1: 8px;
  --r2: 14px;
  --r3: 20px;
  --r4: 28px;
}