*,:before,:after{box-sizing:border-box;margin:0;padding:0}::selection{color:#1a1a1a;background-color:#f2ab8c}:root{--bg:#fcfcfc;--text-dark:#1a1a1a;--text-mid:#4a4a4a;--text-light:#7a7a7a;--card-bg:#fff;--card-border:#e8e4e0;--nav-text:#1a1a1a;--border-color:#d4cfc9;--accent:#ff6b35;--accent-hover:#e55a24;--accent-army:#69773c;--accent-army-hover:#c0cc99;--accent-teal:#3c7772;--accent-teal-hover:#99ccc7;--accent-lavender:#543c77;--accent-lavender-hover:#ae99cc;--font-serif:"Parastoo", Georgia, serif;--font-mono:"IBM Plex Mono", "Courier New", monospace;--font-sans:"IBM Plex Sans", system-ui, sans-serif;--page-padding:72px;--section-gap:80px}html{scroll-behavior:smooth;font-size:16px}body{font-family:var(--font-sans);background-color:var(--bg);color:var(--text-dark);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;min-height:100vh}#root{flex-direction:column;min-height:100vh;display:flex}a{color:inherit;text-decoration:none}img{max-width:100%;height:auto;display:block}button{cursor:pointer;background:0 0;border:none;font-family:inherit}.page-shell{background-color:var(--bg);flex-direction:column;width:100%;min-height:100vh;display:flex;position:relative;overflow:hidden}.top-nav{width:100%;padding:40px var(--page-padding);z-index:10;justify-content:space-between;align-items:center;display:flex;position:relative}.nav-logo{font-family:var(--font-mono);letter-spacing:.04em;text-transform:uppercase;color:var(--text-dark);font-size:16px;font-weight:400;text-decoration:none;transition:opacity .2s}.nav-logo:hover{opacity:.7}.nav-resume{font-family:var(--font-mono);letter-spacing:.04em;text-transform:uppercase;color:var(--text-dark);text-underline-offset:3px;font-size:14px;font-weight:400;text-decoration:underline;transition:opacity .2s}.nav-resume:hover{color:var(--accent-hover)}.hero-section{padding:0 var(--page-padding);text-align:center;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:12px;display:flex;position:relative}.heading-row{justify-content:center;align-items:center;gap:16px;display:flex;position:relative}.hero-heading{font-family:var(--font-serif);color:var(--text-dark);letter-spacing:-.02em;font-size:clamp(128px,7vw,88px);font-weight:400;line-height:1}.hero-heading em{font-style:italic}.sticker-wrap{flex-shrink:0;justify-content:center;align-items:center;display:flex;position:relative}.sticker-note{text-align:center;color:var(--text-mid);opacity:0;pointer-events:none;z-index:10;width:140px;font-family:Shadows Into Light,cursive;font-size:13px;transition:opacity .25s,transform .25s;position:absolute;bottom:calc(100% + 6px);left:50%;transform:translate(-50%)translateY(4px)}.sticker-wrap:hover .sticker-note{opacity:1;transform:translate(-50%)translateY(0)}.sticker-note--peng{bottom:calc(100% - 18px);transform:translate(-50%)translateY(4px)rotate(5deg)}.sticker-wrap:hover .sticker-note--peng{opacity:1;transform:translate(-50%)translateY(0)rotate(5deg)}.sticker{pointer-events:auto;-webkit-user-select:none;user-select:none;cursor:default;flex-shrink:0}.sticker-flower{object-fit:contain;width:52px;height:52px;transition:transform .2s;transform:rotate(-15deg)}.sticker-peng{object-fit:contain;width:72px;height:45px;transition:transform .2s;position:relative;top:24px;right:20px;transform:rotate(11.4deg)}.sticker-flower:hover,.sticker-peng:hover{animation:.5s ease-in-out wobble}@keyframes wobble{0%{transform:rotate(var(--rot,0deg))}20%{transform:rotate(calc(var(--rot,0deg) - 8deg))}50%{transform:rotate(calc(var(--rot,0deg) + 8deg))}75%{transform:rotate(calc(var(--rot,0deg) - 4deg))}to{transform:rotate(var(--rot,0deg))}}.hero-subtitle{font-family:var(--font-mono);color:var(--text-mid);letter-spacing:.02em;font-size:clamp(11px,1.1vw,14px);font-weight:400;line-height:1.5}.hero-tagline{font-family:var(--font-sans);color:var(--text-dark);max-width:720px;font-size:clamp(20px,1.4vw,22px);font-weight:400;line-height:1.5}.hero-tagline em{font-style:italic;font-weight:300}.hero-tagline .accent-link{color:var(--accent);font-style:normal;text-decoration:none;transition:transform .25s cubic-bezier(.34,1.56,.64,1);display:inline-block}.hero-tagline .accent-link:hover{transform:scale(1.15)rotate(-6deg)}.sections-row{padding:40px var(--page-padding) 0;justify-content:center;align-items:flex-start;gap:20px;width:100%;display:flex}.section-card{border-radius:16px;flex-shrink:0;width:320px;transition:transform .3s,box-shadow .3s;overflow:hidden}.section-card img{border-radius:16px;width:100%;height:auto;transition:transform .4s;display:block}.section-card:hover{transform:translateY(-4px);box-shadow:0 20px 60px #0000001a}.footer-section{padding:32px var(--page-padding) 40px;flex-direction:column;justify-content:flex-end;align-items:center;gap:20px;width:100%;display:flex}.social-icons{align-items:center;gap:28px;display:flex}.social-icon-link{width:36px;height:36px;color:var(--text-mid);justify-content:center;align-items:center;transition:color .2s,transform .2s;display:flex;position:relative}.social-icon-link:after{content:attr(data-tooltip);background:var(--text-mid);color:#fff;font-family:var(--font-mono);letter-spacing:.03em;white-space:nowrap;opacity:0;pointer-events:none;border-radius:999px;padding:4px 12px;font-size:11px;transition:opacity .2s,transform .2s;position:absolute;bottom:calc(100% + 8px);left:50%;transform:translate(-50%)translateY(4px)}.social-icon-link:hover:after{opacity:1;transform:translate(-50%)translateY(0)}.social-icon-link:hover{color:var(--accent-hover);transform:translateY(-2px)}.social-icon-link svg{stroke:currentColor;fill:none;stroke-width:1.5px;stroke-linecap:round;stroke-linejoin:round;width:20px;height:20px}@keyframes fade-up{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.animate-in{animation:.7s forwards fade-up}.animate-in-delay-1{opacity:0;animation-delay:.1s}.animate-in-delay-2{opacity:0;animation-delay:.2s}.animate-in-delay-3{opacity:0;animation-delay:.35s}.animate-in-delay-4{opacity:0;animation-delay:.5s}.animate-in-delay-5{opacity:0;animation-delay:.65s}.animate-in-delay-6{opacity:0;animation-delay:.8s}@media (width<=768px){:root{--page-padding:24px}.top-nav{padding:24px var(--page-padding)}.hero-heading{font-size:40px}.sticker-flower{width:36px;height:36px}.sticker-peng{width:52px;height:32px}.sections-row{padding:28px var(--page-padding) 0;flex-direction:column;align-items:center;gap:14px}.section-card{width:100%;max-width:340px}}.projects-page{padding:40px var(--page-padding) 80px;flex-direction:column;flex:1;align-items:center;width:100%;max-width:1280px;margin:0 auto;display:flex}.projects-header{text-align:center;margin-bottom:88px}.projects-title{font-family:var(--font-serif);color:var(--text-dark);letter-spacing:-.02em;margin-bottom:12px;font-size:clamp(48px,5vw,72px);font-weight:400;line-height:1.1}.projects-subtitle{font-family:var(--font-mono);color:var(--text-mid);letter-spacing:.02em;font-size:clamp(11px,1.1vw,14px);font-weight:400;line-height:1.5}.projects-list{flex-direction:column;align-items:stretch;gap:88px;width:100%;display:flex}.proj-card{cursor:default;align-items:center;gap:64px;transition:transform .35s cubic-bezier(.22,1,.36,1);display:flex;position:relative}.proj-card:hover{transform:rotate(-.8deg)scale(1.008)}.proj-card:after{content:attr(data-tooltip);background:var(--text-dark);color:#fff;font-family:var(--font-mono);letter-spacing:.04em;white-space:nowrap;opacity:0;pointer-events:none;z-index:5;border-radius:999px;padding:6px 16px;font-size:11px;font-weight:500;transition:opacity .25s,transform .3s cubic-bezier(.22,1,.36,1);position:absolute;top:-12px;right:24px;transform:translateY(6px)rotate(2deg)}.proj-card:hover:after{opacity:1;transform:translateY(0)rotate(2deg)}.proj-card-image{border-radius:16px;flex-shrink:0;width:460px;overflow:hidden}.proj-card-image img{border-radius:16px;width:100%;height:auto;transition:transform .4s;display:block}.proj-card:hover .proj-card-image img{transform:scale(1.02)}.proj-card:nth-child(2n){flex-direction:row-reverse}.proj-card:nth-child(2n):after{left:24px;right:auto;transform:translateY(6px)rotate(-2deg)}.proj-card:nth-child(2n):hover:after{transform:translateY(0)rotate(-2deg)}.proj-card-text{flex-direction:column;flex:1;gap:8px;display:flex}.proj-year-badge{font-family:var(--font-mono);letter-spacing:.06em;text-transform:uppercase;color:#fff;background:var(--text-dark);border-radius:999px;justify-content:center;align-items:center;width:fit-content;padding:4px 12px;font-size:13px;font-weight:300;display:inline-flex}.proj-year-badge--ongoing{background:var(--accent-army)}.proj-card-title{font-family:var(--font-serif);color:var(--text-dark);letter-spacing:-.01em;font-size:clamp(26px,2.8vw,38px);font-weight:500;line-height:1.2}.proj-card-desc{font-family:var(--font-sans);color:var(--text-mid);max-width:440px;font-size:clamp(14px,1.4vw,16px);font-weight:400;line-height:1.5}.proj-tags{flex-wrap:wrap;gap:16px;margin-top:4px;display:flex}.proj-tag{font-family:var(--font-mono);letter-spacing:.04em;text-transform:uppercase;color:var(--text-light);padding:6px 0;font-size:12px;font-weight:400}.proj-card:hover .proj-tag{color:var(--text-mid)}@media (width<=900px){.proj-card{gap:24px;flex-direction:column!important}.proj-card-image{width:100%;max-width:500px}.proj-card-text{align-items:flex-start}.projects-page{padding:24px var(--page-padding) 48px}.projects-header{margin-bottom:48px}.projects-list{gap:56px}.proj-card:after{display:none}}