:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:dark;--bg-primary: #050505;--bg-secondary: #0a0a0a;--bg-card: rgba(255, 255, 255, .03);--bg-card-hover: rgba(255, 255, 255, .07);--text-primary: #ffffff;--text-secondary: #a1a1aa;--neon-cyan: #00f3ff;--neon-purple: #bc13fe;--neon-green: #0aff0a;--glass-border: 1px solid rgba(255, 255, 255, .1);--glass-shadow: 0 4px 30px rgba(0, 0, 0, .1);--transition-speed: .3s}[data-theme=light]{--bg-primary: #f0f0f0;--bg-secondary: #ffffff;--bg-card: rgba(0, 0, 0, .03);--bg-card-hover: rgba(0, 0, 0, .05);--text-primary: #1a1a1a;--text-secondary: #52525b;--glass-border: 1px solid rgba(0, 0, 0, .05);--neon-cyan: #00b8c2;--neon-purple: #9d00d6}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0;transition:background-color .3s ease,color .3s ease,border-color .3s ease}html{scroll-behavior:smooth}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh;background-color:var(--bg-primary);color:var(--text-primary);overflow-x:hidden}#root{width:100%}a{color:inherit;text-decoration:none;transition:color var(--transition-speed)}a:hover{color:var(--neon-cyan)}h1,h2,h3,h4,h5,h6{font-weight:700;line-height:1.2}.container{max-width:1200px;margin:0 auto;padding:0 2rem}.section{padding:6rem 0;position:relative}.text-gradient{background:linear-gradient(90deg,var(--neon-cyan),var(--neon-purple));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.btn{display:inline-block;padding:.8rem 2rem;border-radius:4px;font-weight:600;letter-spacing:.5px;cursor:pointer;transition:all var(--transition-speed);border:1px solid transparent}.btn-primary{background:var(--neon-cyan);color:#000;box-shadow:0 0 15px #00f3ff4d}.btn-primary:hover{background:#fff;box-shadow:0 0 25px #00f3ff99;transform:translateY(-2px)}.btn-outline{background:transparent;border:1px solid var(--neon-cyan);color:var(--neon-cyan)}.btn-outline:hover{background:#00f3ff1a;box-shadow:0 0 15px #00f3ff33;transform:translateY(-2px)}@keyframes glow{0%{box-shadow:0 0 5px var(--neon-cyan)}50%{box-shadow:0 0 20px var(--neon-purple)}to{box-shadow:0 0 5px var(--neon-cyan)}}@keyframes gradientShift{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}@keyframes slideUpFade{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@keyframes neonPulse{0%,to{box-shadow:0 0 10px #00f3ff4d,0 0 20px #00f3ff33}50%{box-shadow:0 0 20px #00f3ff80,0 0 40px #00f3ff4d}}.glow-effect{position:absolute;width:300px;height:300px;background:radial-gradient(circle,#bc13fe33,#0000 70%);border-radius:50%;pointer-events:none;z-index:-1;filter:blur(40px)}.animated-gradient-bg{background:linear-gradient(135deg,var(--bg-primary) 0%,var(--bg-secondary) 50%,var(--bg-primary) 100%);background-size:200% 200%;animation:gradientShift 15s ease infinite}.card{background:var(--bg-card);border:var(--glass-border);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);padding:2rem;border-radius:12px;transition:all .4s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}.card:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at var(--mouse-x, 50%) var(--mouse-y, 50%),rgba(0,243,255,.08) 0%,transparent 50%);opacity:0;transition:opacity .4s ease;pointer-events:none}.card:hover:before{opacity:1}.card:hover{background:var(--bg-card-hover);transform:translateY(-8px) scale(1.02);border-color:#00f3ff4d;box-shadow:0 0 30px #00f3ff26,0 20px 40px -15px #0006}.project-card{background:var(--bg-card);border:var(--glass-border);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);padding:2rem;border-radius:12px;transition:all .4s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}.project-card:after{content:"";position:absolute;bottom:0;left:0;right:0;height:2px;background:linear-gradient(90deg,var(--neon-cyan),var(--neon-purple));transform:scaleX(0);transform-origin:left;transition:transform .4s cubic-bezier(.4,0,.2,1)}.project-card:hover:after{transform:scaleX(1)}.project-card:hover{background:var(--bg-card-hover);transform:translateY(-8px);border-color:#00f3ff66;box-shadow:0 0 40px #00f3ff33,0 20px 50px -15px #00000080}.section-divider{height:1px;background:linear-gradient(90deg,transparent 0%,var(--neon-cyan) 50%,transparent 100%);margin:4rem 0;position:relative;overflow:hidden}.section-divider:after{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent 0%,rgba(255,255,255,.8) 50%,transparent 100%);animation:shimmer 3s ease-in-out infinite}@keyframes shimmer{0%{left:-100%}to{left:200%}}.magnetic-hover{transition:transform .2s cubic-bezier(.4,0,.2,1)}.magnetic-hover:hover{transform:scale(1.05)}