
    :root {
      --background: 0 0% 100%;
      --foreground: 222 47% 11%;
      --card: 0 0% 100%;
      --card-foreground: 222 47% 11%;
      --popover: 0 0% 100%;
      --popover-foreground: 222 47% 11%;

      /* Premium Gaming Theme - Indigo & Cyan */
      --primary: 262 83% 58%;
      /* Vibrant Violet */
      --primary-foreground: 210 40% 98%;
      --primary-light: 262 83% 95%;
      --primary-glow: 262 83% 65%;

      --secondary: 191 91% 50%;
      /* Neon Cyan */
      --secondary-foreground: 222 47% 11%;
      --secondary-light: 191 91% 96%;

      --muted: 210 40% 96%;
      --muted-foreground: 215 16% 47%;

      --accent: 262 83% 58%;
      --accent-foreground: 210 40% 98%;
      --accent-light: 262 83% 95%;

      --destructive: 0 84% 60%;
      --destructive-foreground: 210 40% 98%;

      --border: 214 32% 91%;
      --input: 214 32% 91%;
      --ring: 262 83% 58%;

      /* High-Tech Gradients */
      --gradient-hero: linear-gradient(135deg, hsl(262 83% 58%) 0%, hsl(191 91% 50%) 100%);
      --gradient-soft: linear-gradient(180deg, hsl(0 0% 100%) 0%, hsl(262 83% 98%) 100%);
      --gradient-card: linear-gradient(135deg, hsl(0 0% 100%) 0%, hsl(262 83% 99%) 100%);

      /* Premium Glows */
      --shadow-sm: 0 2px 8px -2px hsla(262, 83%, 58%, 0.1);
      --shadow-md: 0 4px 16px -4px hsla(262, 83%, 58%, 0.15);
      --shadow-lg: 0 8px 32px -8px hsla(262, 83%, 58%, 0.2);
      --shadow-glow: 0 0 24px hsla(262, 83%, 58%, 0.4);
      --shadow-cyan: 0 0 24px hsla(191, 91%, 50%, 0.4);

      --transition-smooth: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
      --transition-bounce: all 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55);
      --radius: 0.75rem;
    }

    body {
      font-family: "Plus Jakarta Sans", sans-serif;
    }

    * {
      border-color: hsl(var(--border));
    }

    .bg-primary {
      background-color: hsl(var(--primary)) !important;
    }

    .bg-primary-light {
      background-color: hsl(var(--primary-light)) !important;
    }

    .bg-secondary {
      background-color: hsl(var(--secondary)) !important;
    }

    .text-gradient {
      background-image: var(--gradient-hero);
      -webkit-background-clip: text;
      background-clip: text;
      -webkit-text-fill-color: transparent;
      color: transparent;
      display: inline-block;
    }

    .bg-gradient-hero {
      background-image: var(--gradient-hero) !important;
    }

    .glow-violet {
      box-shadow: var(--shadow-glow);
    }

    .glow-cyan {
      box-shadow: var(--shadow-cyan);
    }
  