@media(max-width:768px){html,body{overscroll-behavior:none;-webkit-overflow-scrolling:touch}.projects-scroll-container,.about-scroll-container{overflow:visible}.projects-track,.about-track{overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scroll-snap-align:none;padding-right:var(--container-padding)}.project-card,.about-card{scroll-snap-align:center}}@property --angle-1{syntax: "<angle>"; inherits: false; initial-value: -75deg;}@property --angle-2{syntax: "<angle>"; inherits: false; initial-value: -45deg;}@property --shimmer-pos{syntax: "<percentage>"; inherits: false; initial-value: 0%;}:root{--bg: #FAFAF8;--bg-subtle: #F5F5F3;--text: #1A1A1A;--text-muted: #666666;--text-subtle: #999999;--accent: #7C3AED;--accent-light: #A78BFA;--accent-dark: #5B21B6;--white: #FFFFFF;--black: #000000;--glass-bg: rgba(255, 255, 255, .35);--glass-bg-hover: rgba(255, 255, 255, .5);--glass-border: rgba(255, 255, 255, .5);--glass-border-shimmer: rgba(255, 255, 255, .8);--glass-shadow: rgba(0, 0, 0, .08);--glass-highlight: rgba(255, 255, 255, .9);--glass-inner-glow: rgba(255, 255, 255, .4);--font-display: "Playfair Display", Georgia, serif;--font-body: "Inter", -apple-system, BlinkMacSystemFont, sans-serif;--font-mono: "JetBrains Mono", "Fira Code", monospace;--text-xs: .75rem;--text-sm: .875rem;--text-base: 1rem;--text-lg: 1.125rem;--text-xl: 1.25rem;--text-2xl: 1.5rem;--text-3xl: 2rem;--text-4xl: 2.5rem;--text-5xl: 3.5rem;--text-6xl: 4.5rem;--text-hero: clamp(3rem, 8vw, 7rem);--space-1: .25rem;--space-2: .5rem;--space-3: .75rem;--space-4: 1rem;--space-5: 1.25rem;--space-6: 1.5rem;--space-8: 2rem;--space-10: 2.5rem;--space-12: 3rem;--space-16: 4rem;--space-20: 5rem;--space-24: 6rem;--space-32: 8rem;--container-max: 1400px;--container-padding: var(--space-6);--blur-sm: 8px;--blur-md: 16px;--blur-lg: 24px;--radius-sm: 6px;--radius-md: 12px;--radius-lg: 20px;--radius-full: 9999px;--ease-out: cubic-bezier(.16, 1, .3, 1);--ease-in-out: cubic-bezier(.65, 0, .35, 1);--ease-bounce: cubic-bezier(.34, 1.56, .64, 1);--ease-glass: cubic-bezier(.25, 1, .5, 1);--duration-fast: .15s;--duration-normal: .3s;--duration-slow: .5s;--duration-glass: .4s}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{font-family:var(--font-body);font-size:var(--text-base);line-height:1.6;color:var(--text);background-color:var(--bg);overflow-x:hidden}body:before{content:"";position:fixed;top:0;left:0;width:100%;height:100%;background-image:radial-gradient(circle,rgba(0,0,0,.03) 1px,transparent 1px);background-size:24px 24px;pointer-events:none;z-index:-1}#three-canvas{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:auto;z-index:0;cursor:grab}#three-canvas:active{cursor:grabbing}#app{position:relative;z-index:1;pointer-events:none}#app a,#app button,#app input,#app textarea,#app select,#app .nav,#app .project-card,#app .about-card,#app .experience-card,#app .btn-primary,#app .btn-secondary,#app .social-link,#app .contact-cta,#app .hero-cta,#app .metric-chip,#app .skill-tag,#app .tag{pointer-events:auto}body.canvas-dragging{user-select:none;-webkit-user-select:none}a{color:inherit;text-decoration:none}ul,ol{list-style:none}img,svg{display:block;max-width:100%}button{font:inherit;cursor:pointer;border:none;background:none}h1,h2,h3,h4,h5,h6{font-family:var(--font-display);font-weight:600;line-height:1.1;letter-spacing:-.02em}.section-label{display:inline-block;font-family:var(--font-mono);font-size:var(--text-xs);font-weight:500;text-transform:uppercase;letter-spacing:.1em;color:var(--accent);margin-bottom:var(--space-4)}.section-title{font-size:clamp(var(--text-4xl),5vw,var(--text-6xl));margin-bottom:var(--space-6)}.section-description{font-size:var(--text-lg);color:var(--text-muted);max-width:600px}.glass{--border-width: 1px;position:relative;background:linear-gradient(var(--angle-2),rgba(255,255,255,.15),rgba(255,255,255,.35),rgba(255,255,255,.15));backdrop-filter:blur(clamp(8px,.75rem,16px)) saturate(180%);-webkit-backdrop-filter:blur(clamp(8px,.75rem,16px)) saturate(180%);box-shadow:inset 0 .125rem .125rem #0000000d,inset 0 -.125rem .125rem #ffffff80,0 .25rem .5rem -.125rem #00000026,0 0 0 .125rem inset #ffffff40;border:none;transition:all var(--duration-glass) var(--ease-glass),--angle-1 .5s ease,--angle-2 .4s var(--ease-glass)}.glass:after{content:"";position:absolute;z-index:1;inset:0;border-radius:inherit;width:calc(100% + var(--border-width) * 2);height:calc(100% + var(--border-width) * 2);top:calc(-1 * var(--border-width));left:calc(-1 * var(--border-width));padding:var(--border-width);box-sizing:border-box;background:conic-gradient(from var(--angle-1) at 50% 50%,rgba(0,0,0,.3),rgba(0,0,0,0) 5% 40%,rgba(0,0,0,.3) 50%,rgba(0,0,0,0) 60% 95%,rgba(0,0,0,.3)),linear-gradient(180deg,#fff9,#ffffff4d);mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;pointer-events:none;transition:all var(--duration-glass) var(--ease-glass),--angle-1 .5s ease}.glass:before{content:"";position:absolute;z-index:2;inset:0;border-radius:inherit;background:linear-gradient(var(--angle-2),rgba(255,255,255,0) 0%,rgba(255,255,255,.4) 45% 55%,rgba(255,255,255,0) 100%);background-size:200% 200%;background-position:var(--shimmer-pos) 50%;mix-blend-mode:overlay;pointer-events:none;opacity:.7;transition:background-position var(--duration-glass) var(--ease-glass),--angle-2 var(--duration-glass) var(--ease-glass),opacity var(--duration-glass) var(--ease-glass)}.glass:hover{--angle-1: -125deg;--shimmer-pos: 30%;transform:scale(.99);box-shadow:inset 0 .125rem .125rem #0000000d,inset 0 -.125rem .125rem #fff9,0 .15rem .25rem -.1rem #0003,0 0 0 .1rem inset #fff6}.glass:hover:before{opacity:1}.glass:active{--angle-1: -75deg;--angle-2: -15deg;--shimmer-pos: 60%;transform:scale(.98)}.glass-shimmer{background:linear-gradient(-75deg,#ffffff1a,#fff6,#ffffff1a);box-shadow:inset 0 .125rem .125rem #0000000d,inset 0 -.125rem .125rem #fff9,0 .3rem .5rem -.125rem #0003,0 0 .1rem .25rem inset #ffffff4d}.glass-shimmer:hover{box-shadow:inset 0 .125rem .125rem #0000000d,inset 0 -.125rem .125rem #ffffffb3,0 .15rem .3rem -.1rem #00000040,0 0 .05rem .15rem inset #ffffff80,0 0 20px #7c3aed26}.nav{position:fixed;top:var(--space-6);left:50%;transform:translate(-50%);display:flex;align-items:center;gap:var(--space-8);padding:var(--space-3) var(--space-6);border-radius:var(--radius-full);z-index:100;transition:all var(--duration-normal) var(--ease-out)}.nav.glass:hover{transform:translate(-50%) scale(.99)}.nav.glass:active{transform:translate(-50%) scale(.98)}.nav-logo{font-family:var(--font-display);font-size:var(--text-lg);font-weight:600}.nav-links{display:flex;align-items:center;gap:var(--space-1);position:relative}.nav-indicator{position:absolute;top:0;left:0;height:100%;background:#7c3aed26;border-radius:var(--radius-full);pointer-events:none;z-index:0;opacity:0}.nav-links a{position:relative;font-size:var(--text-sm);font-weight:500;color:var(--text-muted);padding:var(--space-2) var(--space-4);border-radius:var(--radius-full);transition:all var(--duration-normal) var(--ease-out);z-index:1}.nav-links a:hover{color:var(--text)}.nav-links a.active{color:var(--accent)}.nav-cta{margin-left:var(--space-4);padding:var(--space-2) var(--space-5)!important;border-radius:var(--radius-full)!important;color:var(--accent)!important;font-weight:600!important}.nav-cta:hover{color:var(--accent-dark)!important}.hero{min-height:100vh;display:flex;align-items:center;padding:var(--space-32) var(--container-padding) var(--space-20);max-width:var(--container-max);margin:0 auto}.hero-content{max-width:900px}.hero-title{font-size:var(--text-hero);font-weight:700;margin-bottom:var(--space-8)}.title-line{display:block;overflow:hidden}.title-line.accent{color:var(--accent)}.hero-subtitle{font-size:var(--text-xl);color:var(--text-muted);max-width:600px;margin-bottom:var(--space-10);line-height:1.7}.hero-cta{display:flex;gap:var(--space-4);margin-bottom:var(--space-12)}.btn-primary{display:inline-flex;align-items:center;gap:var(--space-2);padding:var(--space-4) var(--space-8);border-radius:var(--radius-full);font-weight:600;color:var(--accent);position:relative;overflow:hidden;transition:all var(--duration-normal) var(--ease-out)}.btn-primary:hover{transform:translateY(-3px) scale(1.02);box-shadow:0 12px 40px #7c3aed40,0 0 30px #7c3aed26}.btn-secondary{display:inline-flex;align-items:center;gap:var(--space-2);padding:var(--space-4) var(--space-8);font-weight:600;color:var(--text-muted);transition:color var(--duration-fast) var(--ease-out)}.btn-secondary:hover{color:var(--text)}.hero-metrics{display:flex;gap:var(--space-4);flex-wrap:wrap}.metric-chip{display:inline-flex;flex-direction:column;padding:var(--space-3) var(--space-5);border-radius:var(--radius-md);position:relative;overflow:hidden}.metric-chip:after{content:"";position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:radial-gradient(circle at center,rgba(255,255,255,.3) 0%,transparent 60%);opacity:0;transition:opacity .3s ease;pointer-events:none}.metric-chip:hover:after{opacity:1;animation:chipGlow 1s ease-out}@keyframes chipGlow{0%{transform:scale(.5);opacity:.8}to{transform:scale(1);opacity:0}}.metric-value{font-family:var(--font-mono);font-size:var(--text-lg);font-weight:600;color:var(--accent)}.metric-label{font-size:var(--text-xs);color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em}.projects-section{padding:var(--space-24) 0;overflow:hidden}.projects-section .section-header{padding:0 var(--container-padding);max-width:var(--container-max);margin:0 auto var(--space-12)}.projects-scroll-container{position:relative;width:100%;overflow:hidden}.projects-track{display:flex;gap:var(--space-8);padding:var(--space-8) var(--container-padding);will-change:transform}@media(max-width:768px){.projects-scroll-container,.about-scroll-container{overflow:visible}.projects-track,.about-track{overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scroll-behavior:smooth;padding-right:var(--container-padding)}.project-card,.about-card{scroll-snap-align:center;flex-shrink:0}}.project-card{flex:0 0 auto;width:clamp(380px,45vw,550px);background:#ffffffb3;backdrop-filter:blur(var(--blur-sm));border:1px solid rgba(255,255,255,.5);border-radius:var(--radius-lg);overflow:hidden;box-shadow:0 4px 20px #0000000a,inset 0 1px #fffc;transition:all var(--duration-slow) var(--ease-out)}.project-card:hover{transform:translateY(-12px) scale(1.02);box-shadow:0 24px 80px #0000001f,0 0 40px #7c3aed14,inset 0 1px #ffffffe6;border-color:#fffc}.project-artifact{aspect-ratio:4/3;background:linear-gradient(135deg,var(--bg-subtle) 0%,var(--bg) 100%);padding:var(--space-6);display:flex;align-items:center;justify-content:center;overflow:hidden;position:relative}.project-artifact:after{content:"";position:absolute;inset:0;background:linear-gradient(135deg,transparent 40%,rgba(255,255,255,.1) 50%,transparent 60%);background-size:300% 300%;animation:artifactShine 6s ease infinite;pointer-events:none}@keyframes artifactShine{0%,to{background-position:0% 0%}50%{background-position:100% 100%}}.artifact-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center}.artifact-svg{width:100%;height:100%;color:var(--text)}.artifact-image{width:100%;height:100%;object-fit:cover}.artifact-video{width:100%;height:100%;border:none;pointer-events:auto}.project-content{padding:var(--space-6)}.project-tags{display:flex;gap:var(--space-2);margin-bottom:var(--space-4)}.tag{font-size:var(--text-xs);font-weight:500;padding:var(--space-1) var(--space-3);border-radius:var(--radius-full);color:var(--text-muted);transition:all var(--duration-normal) var(--ease-out)}.tag:hover{color:var(--accent);transform:translateY(-1px)}.project-title{font-size:var(--text-xl);margin-bottom:var(--space-3)}.project-summary{font-size:var(--text-sm);color:var(--text-muted);line-height:1.6;margin-bottom:var(--space-4)}.project-metrics{display:flex;gap:var(--space-2);margin-bottom:var(--space-4);flex-wrap:wrap}.project-metrics .metric-chip{padding:var(--space-2) var(--space-3);flex-direction:row;gap:var(--space-2);align-items:center}.project-metrics .metric-value{font-size:var(--text-sm)}.project-metrics .metric-label{font-size:var(--text-xs)}.project-link{font-size:var(--text-sm);font-weight:600;color:var(--accent);transition:all var(--duration-fast) var(--ease-out);display:inline-flex;align-items:center;gap:var(--space-1)}.project-link:hover{color:var(--accent-dark);gap:var(--space-2)}.scroll-progress{width:200px;height:3px;background:#0000000d;margin:var(--space-8) auto 0;border-radius:var(--radius-full);overflow:hidden}.scroll-progress-bar{height:100%;width:20%;background:linear-gradient(90deg,var(--accent-light),var(--accent));border-radius:var(--radius-full);transition:width var(--duration-fast) var(--ease-out);box-shadow:0 0 10px #7c3aed80}.about-section{padding:var(--space-32) 0;overflow:hidden}.about-section .section-header{padding:0 var(--container-padding);max-width:var(--container-max);margin:0 auto var(--space-12)}.about-scroll-container{position:relative;width:100%;overflow:hidden}.about-track{display:flex;gap:var(--space-8);padding:var(--space-4) var(--container-padding);will-change:transform}.about-card{flex:0 0 auto;width:clamp(300px,35vw,450px);padding:var(--space-8);border-radius:var(--radius-lg);transition:all var(--duration-normal) var(--ease-out)}.about-card:hover{transform:translateY(-8px)}.about-card-title{font-size:var(--text-2xl);margin-bottom:var(--space-4)}.about-card-text{font-size:var(--text-base);color:var(--text-muted);line-height:1.8}.about-stats{display:flex;gap:var(--space-4);margin-top:var(--space-6)}.stat-item{display:flex;flex-direction:column;padding:var(--space-4);border-radius:var(--radius-md);min-width:90px;text-align:center;transition:all var(--duration-normal) var(--ease-out)}.stat-item:hover{transform:scale(1.05)}.stat-value{font-family:var(--font-display);font-size:var(--text-2xl);font-weight:700;color:var(--accent)}.stat-label{font-size:var(--text-xs);color:var(--text-muted);margin-top:var(--space-1)}.skills-grid{display:flex;flex-wrap:wrap;gap:var(--space-3);margin-top:var(--space-4)}.skill-tag{font-family:var(--font-mono);font-size:var(--text-xs);padding:var(--space-2) var(--space-3);border-radius:var(--radius-sm);color:var(--text-muted);transition:all var(--duration-fast) var(--ease-out)}.skill-tag:hover{color:var(--accent);transform:translateY(-2px)}.experience-section{padding:var(--space-32) var(--container-padding);background:linear-gradient(180deg,#fafaf8d9,#f5f5f3cc)}.experience-section .section-header{max-width:var(--container-max);margin:0 auto var(--space-12)}.experience-container{max-width:800px;margin:0 auto}.timeline{margin-top:var(--space-8);position:relative}.timeline:before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;background:linear-gradient(180deg,var(--accent) 0%,var(--accent-light) 50%,transparent 100%)}.experience-card{position:relative;padding:var(--space-6);padding-left:var(--space-10);margin-bottom:var(--space-8);border-radius:var(--radius-lg);margin-left:var(--space-6);transition:all var(--duration-normal) var(--ease-out)}.experience-card:last-child{margin-bottom:0}.experience-card:before{content:"";position:absolute;left:calc(-1 * var(--space-6) - 5px);top:var(--space-6);width:12px;height:12px;background:var(--accent);border-radius:50%;box-shadow:0 0 0 4px var(--bg-subtle),0 0 20px #7c3aed4d}.experience-card:hover{transform:translate(8px)}.experience-header{margin-bottom:var(--space-3)}.experience-header h3{font-size:var(--text-lg);margin-bottom:var(--space-1)}.experience-company{font-size:var(--text-sm);color:var(--accent);font-weight:500}.experience-date{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--text-subtle);margin-bottom:var(--space-3);display:inline-block;padding:var(--space-1) var(--space-2);background:#7c3aed1a;border-radius:var(--radius-sm)}.experience-card p{font-size:var(--text-sm);color:var(--text-muted);line-height:1.7}.contact-section{padding:var(--space-32) var(--container-padding);text-align:center}.contact-container{max-width:600px;margin:0 auto}.contact-text{font-size:var(--text-lg);color:var(--text-muted);margin-bottom:var(--space-10);line-height:1.8}.contact-cta{margin-bottom:var(--space-10)}.contact-cta .btn-primary{font-size:var(--text-lg);padding:var(--space-5) var(--space-10)}.contact-links{display:flex;justify-content:center;gap:var(--space-4)}.social-link{display:flex;align-items:center;justify-content:center;width:52px;height:52px;border-radius:var(--radius-full);color:var(--text-muted);transition:all var(--duration-normal) var(--ease-bounce)}.social-link:hover{color:var(--accent);transform:translateY(-4px) rotate(5deg)}.footer{padding:var(--space-8) var(--container-padding);text-align:center;border-top:1px solid rgba(0,0,0,.05)}.footer p{font-size:var(--text-sm);color:var(--text-subtle)}@keyframes fadeInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@keyframes slideInLeft{0%{opacity:0;transform:translate(-50px)}to{opacity:1;transform:translate(0)}}@keyframes slideInRight{0%{opacity:0;transform:translate(50px)}to{opacity:1;transform:translate(0)}}@keyframes jiggle{0%,to{transform:translate(0) rotate(0)}25%{transform:translate(-2px) rotate(-1deg)}75%{transform:translate(2px) rotate(1deg)}}.hero-title .title-line,.hero-subtitle,.hero-cta,.hero-metrics,.section-label,.section-title,.section-description,.project-card,.about-card,.experience-card{opacity:0}body.loaded .hero-title .title-line,body.loaded .hero-subtitle,body.loaded .hero-cta,body.loaded .hero-metrics,body.loaded .section-label,body.loaded .section-title,body.loaded .section-description,body.loaded .project-card,body.loaded .about-card,body.loaded .experience-card{opacity:1}@media(max-width:1024px){.project-card{width:clamp(320px,70vw,450px)}.about-card,.experience-card{width:clamp(280px,60vw,380px)}}@media(max-width:768px){:root{--container-padding: var(--space-4)}.nav{width:calc(100% - var(--space-8));justify-content:space-between}.nav-links a:not(.nav-cta){display:none}.nav-indicator{display:none}.hero{padding-top:var(--space-24)}.hero-metrics{flex-direction:column;gap:var(--space-3)}.metric-chip{flex-direction:row;gap:var(--space-3)}.project-card,.about-card,.experience-card{width:85vw}}@media(max-width:480px){.hero-cta{flex-direction:column}.btn-primary,.btn-secondary{width:100%;justify-content:center}}
