@import "tailwindcss"; :root { --background: #0a0a0a; --foreground: #e0e0e0; --surface: #111111; --surface-elevated: #1a1a1a; --border: #333333; --accent: #3b82f6; --accent-hover: #2563eb; } @theme inline { --color-background: var(--background); --color-foreground: var(--foreground); --font-sans: var(--font-geist-sans); --font-mono: var(--font-geist-mono); } * { box-sizing: border-box; } html { scroll-behavior: smooth; } body { background: linear-gradient(135deg, #0a0a0a 0%, #111111 50%, #0a0a0a 100%); color: var(--foreground); font-family: var(--font-geist-sans), system-ui, -apple-system, sans-serif; line-height: 1.6; min-height: 100vh; position: relative; } body::before { content: ''; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: radial-gradient(circle at 20% 80%, rgba(59, 130, 246, 0.1) 0%, transparent 50%), radial-gradient(circle at 80% 20%, rgba(147, 51, 234, 0.1) 0%, transparent 50%), radial-gradient(circle at 40% 40%, rgba(236, 72, 153, 0.05) 0%, transparent 50%); pointer-events: none; z-index: -1; } /* Enhanced scrollbar */ ::-webkit-scrollbar { width: 8px; } ::-webkit-scrollbar-track { background: #111111; } ::-webkit-scrollbar-thumb { background: #333333; border-radius: 4px; } ::-webkit-scrollbar-thumb:hover { background: #555555; } /* 3D Effects */ .glass-effect { backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); } .neon-glow { box-shadow: 0 0 20px rgba(59, 130, 246, 0.3), 0 0 40px rgba(59, 130, 246, 0.1); } .text-glow { text-shadow: 0 0 10px rgba(59, 130, 246, 0.5); } /* Animation utilities */ @keyframes float { 0%, 100% { transform: translateY(0px); } 50% { transform: translateY(-10px); } } @keyframes pulse-glow { 0%, 100% { box-shadow: 0 0 20px rgba(59, 130, 246, 0.3); } 50% { box-shadow: 0 0 30px rgba(59, 130, 246, 0.6); } } .float { animation: float 6s ease-in-out infinite; } .pulse-glow { animation: pulse-glow 2s ease-in-out infinite; }