body {
  margin: 0;
  line-height: normal;
  background-color: #030014;
  color: var(--text-primary-light);
  font-family: 'Inter Tight', -apple-system, BlinkMacSystemFont, sans-serif;
}

:root {
  /* FIGMA ORIGINAL COLORS - RESTORED */
  --accent: #7d00e0;
  --color-gray: #030014;
  --color-indianred: #f16472;
  --color-khaki: #f1ce64;
  --color-mediumseagreen: #5cc681;
  --lavander: #b364f1;
  --light: #f6f3ff;
  --secondary: #413c65;

  /* GRADIENTS */
  --gradient-1: linear-gradient(180deg, rgba(78, 31, 136, 0.5), rgba(3, 0, 20, 0.5));
  --grad-button: linear-gradient(135deg, #7d00e0 0%, #9b1aff 100%);
  --grad-button-hover: linear-gradient(135deg, #9b1aff 0%, #7d00e0 100%);
  --grad-card: linear-gradient(180deg, rgba(78, 31, 136, 0.5), rgba(3, 0, 20, 0.5));
  --grad-multiplier: linear-gradient(135deg, #7d00e0 0%, #e7ab3b 100%);
  --grad-deep-night: linear-gradient(180deg, #4e1e87 0%, #030013 100%);
  --grad-glass-card: linear-gradient(180deg, rgba(78, 30, 135, 0.85) 0%, rgba(3, 0, 19, 0.92) 100%);
  --grad-glass-alt: linear-gradient(200deg, rgba(50, 16, 116, 0.86) 0%, rgba(13, 6, 52, 0.94) 52%, rgba(3, 1, 23, 0.98) 100%);

  /* Gap */
  --gap-0: 0px;
  --gap-4: 4px;
  --gap-10: 10px;
  --gap-12: 12px;
  --gap-20: 20px;
  --gap-24: 24px;
  --gap-30: 30px;
  --gap-40: 40px;
  --gap-60: 60px;

  /* Padding */
  --padding-0: 0px;
  --padding-10: 10px;
  --padding-19: 19px;
  --padding-20: 20px;
  --padding-22: 22px;
  --padding-26: 26px;
  --padding-32: 32px;
  --padding-40: 40px;
  --padding-60: 60px;
  --padding-80: 80px;

  /* BorderRadius */
  --br-5: 5px;
  --br-20: 20px;
  --br-40: 40px;

  /* Font */
  --font-inter-tight: Inter Tight;

  /* FontSize */
  --fs-16: 16px;
  --fs-18: 18px;
  --fs-19: 19px;
  --fs-20: 20px;
  --fs-24: 24px;
  --fs-30: 30px;
  --fs-40: 40px;

  /* Legacy gradient variable */
  --gradient-1-legacy: linear-gradient(180deg, rgba(78, 31, 136, 0.5), rgba(3, 0, 20, 0.5));
  --mobile-surface: #ffffff;
  --mobile-surface-alt: #ffffff;
  --chart-column-gradient: linear-gradient(180deg, #7d00e0 0%, #e7ab3b 100%);
  --chart-column-glow: 0 12px 28px rgba(125, 0, 224, 0.18);
  --chart-column-gradient-alt: linear-gradient(180deg, #76b900 0%, #c2e534 100%);
  --chart-column-glow-alt: 0 12px 28px rgba(118, 185, 0, 0.18);
  --mobile-card-surface: linear-gradient(175deg, rgba(94, 64, 210, 0.94) 0%, rgba(42, 24, 128, 0.95) 52%, rgba(14, 9, 68, 0.98) 100%), radial-gradient(140% 120% at 15% 12%, rgba(215, 168, 255, 0.38) 0%, rgba(215, 168, 255, 0) 60%);
  --mobile-section-border: rgba(255, 255, 255, 0.16);
  --figma-surface-border: rgba(206, 192, 255, 0.28);
  --figma-surface-highlight: rgba(255, 255, 255, 0.16);
  --figma-surface-shadow: rgba(8, 3, 37, 0.45);

  /* Shadows */
  --shadow-button: 0 16px 34px rgba(116, 32, 168, 0.28);
  --shadow-button-hover: 0 22px 48px rgba(116, 32, 168, 0.38);
  --shadow-card: 0 24px 40px rgba(23, 15, 73, 0.3);
  --shadow-glass: 0 32px 90px rgba(8, 3, 37, 0.48);

  /* Surface + borders */
  --card-border: rgba(255, 255, 255, 0.08);
  --card-highlight: rgba(237, 221, 255, 0.35);
  --text-secondary: rgba(246, 243, 255, 0.86);
  --text-primary-light: rgba(246, 243, 255, 0.98);
  --text-muted-light: rgba(215, 210, 244, 0.82);
  --text-caption: rgba(194, 188, 232, 0.72);
  --accent-soft: #b364f1;

  /* Other */
  --height-1: 1px;
  --lh-18: 18px;
  --ls-1: 1px;
  --max-w-53: 53px;
  --width-603: 603px;
  --width-43_1: 43.1px;

  /* Figma Variables */
  --White: #fff;
}