
          :root {
            --background: 0 0% 0%;
            --foreground: 0 0% 100%;
            --card: 0 0% 7%;
            --card-foreground: 0 0% 100%;
            --popover: 0 0% 7%;
            --popover-foreground: 0 0% 100%;
            --primary: 189 94% 43%;
            --primary-foreground: 0 0% 0%;
            --secondary: 0 0% 11%;
            --secondary-foreground: 0 0% 100%;
            --muted: 0 0% 11%;
            --muted-foreground: 0 0% 56%;
            --accent: 0 0% 17%;
            --accent-foreground: 0 0% 100%;
            --destructive: 0 85% 60%;
            --destructive-foreground: 0 0% 100%;
            --border: 0 0% 17%;
            --input: 0 0% 17%;
            --ring: 189 94% 43%;
          }
          
          * {
            border-color: hsl(var(--border));
          }
          
          body {
            background-color: hsl(var(--background));
            color: hsl(var(--foreground));
            font-feature-settings: "rlig" 1, "calt" 1;
          }
          
          .bg-gradient-primary {
            background: linear-gradient(135deg, #22d3ee 0%, #06b6d4 100%);
          }
          
          .text-gradient {
            background: linear-gradient(135deg, #22d3ee 0%, #67e8f9 100%);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            background-clip: text;
          }
          
          .glass-effect {
            background: rgba(28, 28, 30, 0.8);
            backdrop-filter: blur(20px);
            border: 1px solid rgba(255, 255, 255, 0.1);
          }
          
          .hero-gradient {
            background: linear-gradient(180deg, rgba(0, 0, 0, 0.3) 0%, rgba(0, 0, 0, 0.8) 100%);
          }
        