#root{min-height:100vh;max-width:1400px;margin:0 auto;padding:var(--space-6);display:grid;grid-template-columns:350px 1fr 1fr;gap:var(--space-6);animation:slideInUp 1s var(--ease-bounce) forwards;opacity:0}@keyframes slideInUp{0%{opacity:0;transform:translateY(60px)}to{opacity:1;transform:translateY(0)}}.column-1{display:flex;flex-direction:column;gap:var(--space-6)}.column-2,.column-3{display:flex;flex-direction:column}.app{background:white;border-radius:var(--radius-xl);box-shadow:var(--shadow-lg);padding:var(--space-8);text-align:center;border:1px solid var(--gray-200);transition:all .4s var(--ease-adventure);position:relative;overflow:hidden;animation:cardSlideIn .8s var(--ease-bounce) .2s both;height:fit-content}.app:before{content:"";position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:linear-gradient(45deg,transparent,rgba(37,99,235,.1),transparent);transform:rotate(45deg);transition:all .6s ease;opacity:0}.app:hover:before{animation:shimmer 1.5s ease-in-out;opacity:1}.app:hover{transform:translateY(-8px) rotateY(5deg);box-shadow:var(--shadow-adventure);border-color:var(--accent-color)}@keyframes cardSlideIn{0%{opacity:0;transform:translate(-100px) rotateY(-30deg)}to{opacity:1;transform:translate(0) rotateY(0)}}@keyframes shimmer{0%{transform:translate(-100%) rotate(45deg)}to{transform:translate(100%) rotate(45deg)}}.app h1{margin:var(--space-6) 0 var(--space-4) 0}.portfolio{background:white;border-radius:var(--radius-xl);box-shadow:var(--shadow-lg);padding:var(--space-8);border:1px solid var(--gray-200);transition:all .4s var(--ease-adventure);position:relative;overflow:hidden;animation:cardSlideIn .8s var(--ease-bounce) .4s both}.portfolio:hover{transform:translateY(-8px) rotateY(-2deg);box-shadow:var(--shadow-adventure);border-color:var(--success-color)}.portfolio:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,var(--primary-color),var(--accent-color),var(--success-color));background-size:200% 100%;animation:progressBar 3s ease-in-out infinite}@keyframes progressBar{0%,to{background-position:0% 0%}50%{background-position:100% 0%}}.interests{background:white;border-radius:var(--radius-xl);box-shadow:var(--shadow-lg);padding:var(--space-8);text-align:center;border:1px solid var(--gray-200);transition:all .4s var(--ease-adventure);animation:cardSlideIn .8s var(--ease-bounce) .6s both;position:relative}.interests:hover{transform:translateY(-5px) rotate(1deg);box-shadow:var(--shadow-xl)}.interests:after{content:"✨";position:absolute;top:var(--space-4);right:var(--space-4);font-size:1.5rem;opacity:0;transition:all .3s ease}.interests:hover:after{opacity:.6;transform:rotate(20deg)}.experience{background:white;border-radius:var(--radius-xl);box-shadow:var(--shadow-lg);padding:var(--space-8);border:1px solid var(--gray-200);transition:all .4s var(--ease-adventure);position:relative;overflow:hidden;animation:cardSlideIn .8s var(--ease-bounce) .8s both}.experience:hover{transform:translateY(-8px) rotateY(-2deg);box-shadow:var(--shadow-adventure);border-color:var(--success-color)}.experience:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,var(--primary-color),var(--accent-color),var(--success-color));background-size:200% 100%;animation:progressBar 3s ease-in-out infinite}.other-sites{display:flex;justify-content:center;gap:var(--space-6);margin:var(--space-6) 0}.other-sites a{color:var(--gray-600);transition:all .4s var(--ease-bounce);padding:var(--space-3);border-radius:var(--radius-lg);position:relative;transform-style:preserve-3d}.other-sites a:after{display:none}.other-sites a:hover{color:var(--primary-color);background:var(--gray-100);transform:translateY(-8px) rotateX(15deg) scale(1.2);box-shadow:0 10px 20px #2563eb4d;animation:iconBounce .6s var(--ease-bounce)}@keyframes iconBounce{0%,to{transform:translateY(-8px) rotateX(15deg) scale(1.2)}50%{transform:translateY(-12px) rotateX(15deg) scale(1.3)}}nav.mobile{display:none}@media screen and (max-width: 1024px){#root{grid-template-columns:1fr;grid-template-rows:auto auto auto;gap:var(--space-4);padding:var(--space-4)}.column-1{order:1;gap:var(--space-4)}.column-2{order:2}.column-3{order:3}.app,.portfolio,.interests,.experience{padding:var(--space-6)}nav.mobile{display:flex;justify-content:center;gap:var(--space-6);margin-top:var(--space-6);padding-top:var(--space-6);border-top:2px solid var(--gray-200)}nav.mobile a{font-size:var(--font-size-lg);font-weight:600;color:var(--gray-700);padding:var(--space-3) var(--space-6);border-radius:var(--radius-lg);background:var(--gray-100);transition:all .3s ease}nav.mobile a:after{display:none}nav.mobile a:hover{background:var(--primary-color);color:#fff;transform:translateY(-2px)}nav.mobile hr{display:none}}@media screen and (max-width: 768px){#root{padding:var(--space-2);gap:var(--space-3)}.column-1{gap:var(--space-3)}.app,.portfolio,.interests,.experience{padding:var(--space-4)}nav.mobile{flex-direction:column;gap:var(--space-3);margin-top:var(--space-4);padding-top:var(--space-4)}nav.mobile a{font-size:var(--font-size-base);padding:var(--space-2) var(--space-4)}}:root{--primary-color: #2563eb;--primary-light: #3b82f6;--primary-dark: #1d4ed8;--secondary-color: #64748b;--accent-color: #f59e0b;--success-color: #10b981;--gray-50: #f8fafc;--gray-100: #f1f5f9;--gray-200: #e2e8f0;--gray-300: #cbd5e1;--gray-400: #94a3b8;--gray-500: #64748b;--gray-600: #475569;--gray-700: #334155;--gray-800: #1e293b;--gray-900: #0f172a;--font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-size-xs: .75rem;--font-size-sm: .875rem;--font-size-base: 1rem;--font-size-lg: 1.125rem;--font-size-xl: 1.25rem;--font-size-2xl: 1.5rem;--font-size-3xl: 1.875rem;--font-size-4xl: 2.25rem;--space-1: .25rem;--space-2: .5rem;--space-3: .75rem;--space-4: 1rem;--space-6: 1.5rem;--space-8: 2rem;--space-12: 3rem;--space-16: 4rem;--radius-sm: .375rem;--radius-md: .5rem;--radius-lg: .75rem;--radius-xl: 1rem;--shadow-sm: 0 1px 2px 0 rgb(0 0 0 / .05);--shadow-md: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);--shadow-lg: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--shadow-xl: 0 20px 25px -5px rgb(0 0 0 / .1), 0 8px 10px -6px rgb(0 0 0 / .1);--shadow-glow: 0 0 20px rgb(37 99 235 / .3);--shadow-adventure: 0 15px 35px rgb(245 158 11 / .2), 0 5px 15px rgb(245 158 11 / .1);--ease-bounce: cubic-bezier(.68, -.55, .265, 1.55);--ease-adventure: cubic-bezier(.25, .46, .45, .94);--ease-elastic: cubic-bezier(.175, .885, .32, 1.275);font-family:var(--font-family);line-height:1.6;font-weight:400;color:var(--gray-800);background:linear-gradient(135deg,var(--gray-50) 0%,var(--gray-100) 100%);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:linear-gradient(135deg,#dbeafe 0%,#bfdbfe 100%);overflow-x:hidden}body:before{content:"";position:fixed;top:0;left:0;width:100%;height:100%;background-image:radial-gradient(2px 2px at 20px 30px,rgba(37,99,235,.3),transparent),radial-gradient(2px 2px at 40px 70px,rgba(245,158,11,.3),transparent),radial-gradient(1px 1px at 90px 40px,rgba(16,185,129,.3),transparent),radial-gradient(1px 1px at 130px 80px,rgba(139,92,246,.3),transparent);background-repeat:repeat;background-size:200px 200px;animation:particleFloat 25s linear infinite;pointer-events:none;z-index:-1}@keyframes particleFloat{0%{transform:translateY(100vh) rotate(0)}to{transform:translateY(-100vh) rotate(360deg)}}h1,h2,h3,h4,h5,h6{font-weight:700;line-height:1.3;margin:0 0 var(--space-4) 0;color:var(--gray-900)}h1{font-size:var(--font-size-4xl);background:linear-gradient(135deg,var(--primary-color),var(--primary-light),var(--accent-color));background-size:200% 200%;background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;animation:gradientShift 3s ease-in-out infinite;position:relative;z-index:1}@keyframes gradientShift{0%,to{background-position:0% 50%}50%{background-position:100% 50%}}h1:after{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg,var(--primary-color),var(--primary-light),var(--accent-color));background-size:200% 200%;animation:gradientShift 3s ease-in-out infinite;border-radius:var(--radius-lg);filter:blur(20px);opacity:.1;z-index:-1}h2{font-size:var(--font-size-3xl);color:var(--gray-800);position:relative}h2:after{content:"";position:absolute;bottom:-var(--space-2);left:0;width:60px;height:3px;background:linear-gradient(90deg,var(--primary-color),var(--accent-color));border-radius:var(--radius-sm);animation:expandLine .8s var(--ease-bounce) forwards}@keyframes expandLine{0%{width:0;opacity:0}to{width:60px;opacity:1}}h3{font-size:var(--font-size-xl);color:var(--gray-700);font-weight:600}p{font-size:var(--font-size-base);line-height:1.7;color:var(--gray-600);margin:0 0 var(--space-4) 0}a{color:var(--primary-color);text-decoration:none;font-weight:500;transition:all .3s var(--ease-adventure);position:relative;display:inline-block}a:hover{color:var(--primary-dark);transform:translateY(-2px) scale(1.02);filter:drop-shadow(0 4px 8px rgba(37,99,235,.3))}a:after{content:"";position:absolute;bottom:-2px;left:0;width:0;height:2px;background:linear-gradient(90deg,var(--primary-color),var(--accent-color));transition:width .4s var(--ease-elastic);border-radius:1px}a:hover:after{width:100%;animation:linkPulse .6s ease-in-out}@keyframes linkPulse{0%,to{transform:scaleY(1)}50%{transform:scaleY(1.5)}}ul{list-style:none;padding:0;margin:0}li{font-size:var(--font-size-base);color:var(--gray-600);margin:var(--space-2) 0;padding:var(--space-2) 0;position:relative;padding-left:var(--space-6)}li:before{content:"▸";position:absolute;left:0;color:var(--primary-color);font-weight:700;animation:bounce 2s infinite;animation-delay:calc(var(--i, 0) * .1s)}@keyframes bounce{0%,20%,50%,80%,to{transform:translate(0)}40%{transform:translate(3px)}60%{transform:translate(1px)}}img{border-radius:50%;width:180px;height:180px;object-fit:cover;border:4px solid var(--gray-200);box-shadow:var(--shadow-lg);position:relative}@keyframes float{0%,to{transform:translateY(0) rotate(0)}50%{transform:translateY(-10px) rotate(2deg)}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(40px)}to{opacity:1;transform:translateY(0)}}.scroll-reveal{animation:fadeInUp .8s var(--ease-adventure) both}.stagger-1{animation-delay:.1s}.stagger-2{animation-delay:.2s}.stagger-3{animation-delay:.3s}.stagger-4{animation-delay:.4s}.stagger-5{animation-delay:.5s}.stagger-6{animation-delay:.6s}.experience h2{text-align:center;margin-bottom:var(--space-8);color:var(--gray-800)}.experience-item{margin-bottom:var(--space-8);padding:var(--space-6);border-radius:var(--radius-lg);background:var(--gray-50);border-left:4px solid var(--primary-color);transition:all .3s ease;position:relative}.experience-item:hover{background:white;transform:translateY(-2px);box-shadow:var(--shadow-md);border-left-color:var(--accent-color)}.experience-item:last-child{margin-bottom:0}.experience-header{margin-bottom:var(--space-4)}.experience-header h3{margin:0 0 var(--space-2) 0;color:var(--gray-900);font-size:var(--font-size-xl)}.company{display:block;font-weight:600;color:var(--primary-color);font-size:var(--font-size-lg);margin-bottom:var(--space-1)}.duration{display:inline-block;background:var(--primary-color);color:#fff;padding:var(--space-1) var(--space-3);border-radius:var(--radius-sm);font-size:var(--font-size-sm);font-weight:500}.description{color:var(--gray-600);line-height:1.6;margin-bottom:var(--space-4);font-size:var(--font-size-base)}.projects{margin-top:var(--space-4)}.projects h4{margin:0 0 var(--space-3) 0;color:var(--gray-700);font-size:var(--font-size-lg);font-weight:600}.projects ul{margin:0;padding:0;list-style:none}.projects li{background:white;border-radius:var(--radius-md);padding:var(--space-3);margin:var(--space-2) 0;border-left:3px solid var(--success-color);transition:all .3s ease;font-size:var(--font-size-sm);color:var(--gray-600);position:relative;padding-left:var(--space-4)}.projects li:before{content:"▸";position:absolute;left:var(--space-2);color:var(--success-color);font-weight:700}.projects li:hover{background:var(--success-color);color:#fff;transform:translate(5px);box-shadow:var(--shadow-sm)}.projects li:hover:before{color:#fff}.experience-item:nth-child(2){border-left-color:var(--success-color)}.experience-item:nth-child(2):hover{border-left-color:var(--primary-color)}.experience-item:nth-child(2) .duration{background:var(--success-color)}.experience-item:nth-child(3){border-left-color:var(--accent-color)}.experience-item:nth-child(3):hover{border-left-color:var(--success-color)}.experience-item:nth-child(3) .duration{background:var(--accent-color)}@media screen and (max-width: 768px){.experience-item{padding:var(--space-4);margin-bottom:var(--space-6)}.projects li{padding:var(--space-2) var(--space-3)}.company{font-size:var(--font-size-base)}}.portfolio{position:relative}.portfolio h2{margin-bottom:var(--space-6)}.portfolio .project{padding:var(--space-6);margin:var(--space-6) 0;border-radius:var(--radius-lg);background:var(--gray-50);border-left:4px solid var(--primary-color);transition:all .4s var(--ease-adventure);position:relative;overflow:hidden;animation:projectSlideIn .8s var(--ease-bounce) both;animation-delay:calc(var(--i, 0) * .3s)}.portfolio .project:nth-child(2){--i: 0}.portfolio .project:nth-child(3){--i: 1}.portfolio .project:before{content:"";position:absolute;top:0;left:0;width:0;height:100%;background:linear-gradient(45deg,var(--primary-color),var(--accent-color));transition:width .4s ease;z-index:0;opacity:.1}.portfolio .project:hover{background:white;transform:translate(15px) rotateY(3deg);box-shadow:var(--shadow-adventure);border-left-color:var(--accent-color);border-left-width:6px}.portfolio .project:hover:before{width:100%}@keyframes projectSlideIn{0%{opacity:0;transform:translate(-100px) rotateY(-20deg)}to{opacity:1;transform:translate(0) rotateY(0)}}.portfolio a{display:block;font-size:var(--font-size-lg);font-weight:600;margin-bottom:var(--space-3);color:var(--primary-color);text-decoration:none;position:relative;z-index:1;transition:all .3s var(--ease-adventure)}.portfolio a:after{content:" →";transition:all .4s var(--ease-bounce);display:inline-block}.portfolio a:hover{color:var(--accent-color);transform:scale(1.05)}.portfolio a:hover:after{transform:translate(10px) scale(1.2);animation:arrowBounce .6s ease-in-out infinite}@keyframes arrowBounce{0%,to{transform:translate(10px) scale(1.2)}50%{transform:translate(15px) scale(1.3)}}.portfolio p{margin:0;line-height:1.6;color:var(--gray-600)}.portfolio p a{display:inline;font-size:inherit;font-weight:500;margin:0;color:var(--accent-color)}.portfolio p a:after{content:""}@media screen and (max-width: 768px){.portfolio .project{padding:var(--space-4);margin:var(--space-4) 0}}.interest-group{display:flex;flex-direction:column;gap:var(--space-4);align-items:center}.interest{display:flex;flex-direction:column;align-items:center;gap:var(--space-3);padding:var(--space-6);border-radius:var(--radius-lg);background:var(--gray-50);transition:all .3s ease;border:2px solid transparent;width:100%;max-width:200px;text-align:center;position:relative}.interest:hover{background:white;border-color:var(--primary-color);transform:translateY(-5px);box-shadow:var(--shadow-md)}.interest i{transition:all .3s ease;margin-bottom:var(--space-2);position:relative;z-index:1}.interest:hover i{transform:scale(1.1);filter:drop-shadow(0 2px 8px rgba(0,0,0,.2))}.interest p{margin:0;font-weight:600;color:var(--gray-700);font-size:var(--font-size-base)}.interest:nth-child(1) i{color:#61dbfb}.interest:nth-child(2) i{color:#4fc08d}.interest:nth-child(3) i{color:#3178c6}.interest:nth-child(4) i{color:#68a063}.interest:nth-child(5) i{color:#336791}.interest:nth-child(1):hover{border-color:#61dbfb}.interest:nth-child(2):hover{border-color:#4fc08d}.interest:nth-child(3):hover{border-color:#3178c6}.interest:nth-child(4):hover{border-color:#68a063}.interest:nth-child(5):hover{border-color:#336791}@media screen and (min-width: 768px){.interest-group{flex-direction:column;gap:var(--space-4)}.interest{max-width:none}}@media screen and (min-width: 1024px){.interest-group{flex-direction:row;flex-wrap:wrap;justify-content:center;gap:var(--space-4)}.interest{flex:0 1 calc(50% - var(--space-2));max-width:180px}}@media screen and (max-width: 480px){.interest{padding:var(--space-4)}.interest i{font-size:2.5rem!important}}