@import "https://fonts.googleapis.com/css2?family=Inter:opsz,wght@14..32,100..900&family=JetBrains+Mono:wght@400;500&display=swap";:root{--canvas:#09090b;--surface-1:#111113;--surface-2:#18181b;--surface-3:#1f1f23;--surface-4:#27272a;--hairline:#ffffff0f;--hairline-strong:#ffffff1a;--hairline-hover:#ffffff29;--ink-1:#fafafa;--ink-2:#a1a1aa;--ink-3:#71717a;--ink-4:#52525b;--accent:#a78bfa;--accent-dim:#a78bfa1f;--green:#4ade80;--green-dim:#4ade801a;--red:#f87171;--red-dim:#f871711a;--sp-1:4px;--sp-2:8px;--sp-3:12px;--sp-4:16px;--sp-5:20px;--sp-6:24px;--sp-8:32px;--sp-10:40px;--sp-12:48px;--sp-16:64px;--sp-20:80px;--sp-24:96px;--sp-32:128px;--sp-40:160px;--text-caption:.75rem;--text-footnote:.8125rem;--text-body-sm:.875rem;--text-body:1.0625rem;--text-callout:1.1875rem;--text-title-sm:1.3125rem;--text-title:1.75rem;--text-headline:2.5rem;--text-display:3.5rem;--max-w:960px;--max-w-narrow:640px;--ease:cubic-bezier(.25, .1, .25, 1);--ease-out:cubic-bezier(.16, 1, .3, 1);--duration:.15s;--duration-md:.2s;--duration-slow:.3s;--radius-sm:6px;--radius-md:8px;--radius-lg:12px}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;scroll-padding-top:var(--sp-16);--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}body{font-family:Inter,-apple-system,BlinkMacSystemFont,system-ui,sans-serif;font-size:var(--text-body-sm);font-feature-settings:"ss01", "cv01";font-optical-sizing:auto;color:var(--ink-2);background:var(--canvas);letter-spacing:-.006em;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizelegibility;min-height:100vh;line-height:1.47;overflow-x:hidden}h1{color:var(--ink-1);letter-spacing:-.03em;font-weight:600;line-height:1.07}h2{color:var(--ink-1);letter-spacing:-.022em;font-weight:600;line-height:1.12}h3{color:var(--ink-1);letter-spacing:-.017em;font-weight:600;line-height:1.19}h4,h5,h6{color:var(--ink-1);letter-spacing:-.012em;font-weight:600;line-height:1.25}.section-label{font-size:var(--text-caption);color:var(--ink-4);text-transform:uppercase;letter-spacing:.08em;margin-bottom:var(--sp-6);font-weight:600;line-height:1.33;display:block}p{letter-spacing:-.01em;line-height:1.53}.App{min-height:100vh;position:relative}.container{max-width:var(--max-w);padding:0 var(--sp-6);margin:0 auto}section{position:relative}a{color:inherit;transition:color var(--duration) var(--ease);text-decoration:none}:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:2px}.section-subtitle{color:var(--ink-2);font-size:var(--text-callout);letter-spacing:-.012em;max-width:var(--max-w-narrow);margin-bottom:var(--sp-10);font-weight:400;line-height:1.42}@media (width<=768px){:root{--text-display:2.5rem;--text-headline:2rem;--text-title:1.5rem}}@media (width<=480px){:root{--text-display:2rem;--text-headline:1.75rem;--text-title:1.375rem;--text-body:1rem;--text-callout:1.0625rem}.container{padding:0 var(--sp-4)}}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--surface-3);border:2px solid var(--canvas);border-radius:4px}::selection{background:var(--accent-dim);color:var(--ink-1)}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}html{scroll-behavior:auto}}.header{z-index:100;width:100%;transition:background var(--duration-slow) var(--ease), border-color var(--duration-slow) var(--ease);border-bottom:1px solid #0000;position:fixed;top:0}.header.scrolled{-webkit-backdrop-filter:blur(16px)saturate(1.2);border-color:var(--hairline);background:#09090bd9}.header-inner{justify-content:space-between;align-items:center;height:56px;display:flex}.logo{font-size:var(--text-body-sm);color:var(--ink-1);letter-spacing:-.01em;font-weight:500}nav{gap:var(--sp-1);align-items:center;display:flex}nav a{font-size:var(--text-footnote);color:var(--ink-3);padding:var(--sp-2) var(--sp-3);border-radius:var(--radius-sm);letter-spacing:-.003em;transition:color var(--duration-md) var(--ease);position:relative}nav a:after{content:"";bottom:2px;left:var(--sp-3);right:var(--sp-3);background:var(--ink-1);transform-origin:0;height:1px;transition:transform var(--duration-md) var(--ease-out);position:absolute;transform:scaleX(0)}nav a:hover{color:var(--ink-2)}nav a:hover:after{transform:scaleX(1)}nav a.active{color:var(--ink-1)}nav a.active:after{transform:scaleX(1)}.menu-toggle{padding:var(--sp-2);cursor:pointer;background:0 0;border:none;flex-direction:column;gap:5px;display:none}.menu-toggle span{background:var(--ink-2);width:18px;height:1.5px;transition:transform var(--duration-md) var(--ease);border-radius:1px;display:block}.menu-toggle.active span:first-child{transform:rotate(45deg)translate(2px,2px)}.menu-toggle.active span:last-child{transform:rotate(-45deg)translate(2px,-2px)}.backdrop{z-index:99;background:#0009;position:fixed;inset:0}@media (width<=640px){nav{background:var(--surface-1);border-left:1px solid var(--hairline);width:240px;height:100dvh;padding:var(--sp-20) var(--sp-6) var(--sp-6);transition:right .25s var(--ease-out);z-index:100;flex-direction:column;align-items:stretch;gap:0;position:fixed;top:0;right:-100%}nav.active{right:0}nav a{padding:var(--sp-4) 0;border-bottom:1px solid var(--hairline);font-size:var(--text-body-sm);border-radius:0}nav a:after{display:none}.menu-toggle{z-index:101;display:flex}}.hero{padding:var(--sp-32) 0 var(--sp-12)}.hero-inner{max-width:var(--max-w)}.hero-headline{animation:heroFade .5s var(--ease-out) both}.hero-lede{animation:heroFade .5s var(--ease-out) 80ms both}.hero-actions{animation:heroFade .5s var(--ease-out) .16s both}@keyframes heroFade{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.hero-headline{font-size:clamp(2.5rem, 5vw, var(--text-display));letter-spacing:-.035em;margin-bottom:var(--sp-5);color:var(--ink-1);font-weight:600;line-height:1.05}.hero-lede{font-size:var(--text-callout);color:var(--ink-2);letter-spacing:-.012em;max-width:480px;margin-bottom:var(--sp-8);padding-left:var(--sp-1);font-weight:400;line-height:1.47}.hero-actions{gap:var(--sp-3);padding-left:var(--sp-1);align-items:center;display:flex}.btn-primary{padding:var(--sp-2) var(--sp-5);background:var(--ink-1);height:36px;color:var(--canvas);border-radius:var(--radius-md);font-size:var(--text-footnote);letter-spacing:-.006em;transition:background var(--duration-md) var(--ease), gap var(--duration-md) var(--ease);align-items:center;gap:0;font-weight:500;display:inline-flex;overflow:hidden}.btn-arrow{opacity:0;width:14px;height:14px;transition:opacity var(--duration-md) var(--ease), transform var(--duration-md) var(--ease);flex-shrink:0;transform:translate(-6px)}.btn-primary:hover{gap:var(--sp-1);background:#d4d4d8}.btn-primary:hover .btn-arrow{opacity:1;transform:translate(0)}.btn-primary:active{background:#c4c4c8}.btn-ghost{height:36px;padding:var(--sp-2) var(--sp-4);color:var(--ink-3);border:1px solid var(--hairline-strong);border-radius:var(--radius-md);font-size:var(--text-footnote);letter-spacing:-.006em;transition:color var(--duration-md) var(--ease), border-color var(--duration-md) var(--ease);align-items:center;font-weight:500;display:inline-flex}.btn-ghost:hover{color:var(--ink-1);border-color:var(--hairline-hover)}@media (width<=768px){.hero{padding:var(--sp-24) 0 var(--sp-10)}.hero-headline{font-size:var(--text-headline)}.hero-lede,.hero-actions{padding-left:0}}@media (width<=480px){.hero{padding:var(--sp-20) 0 var(--sp-8)}.hero-headline{font-size:var(--text-headline)}.hero-lede{font-size:var(--text-body)}}.projects{padding:var(--sp-12) 0 var(--sp-16)}.featured{border:1px solid var(--hairline);border-radius:var(--radius-lg);margin-bottom:var(--sp-10);background:var(--surface-1);position:relative;overflow:hidden}.featured:before{content:"";top:0;left:var(--sp-8);background:linear-gradient(90deg, var(--accent), transparent);border-radius:0 0 2px 2px;width:60px;height:2px;position:absolute}.featured-top{padding:var(--sp-8) var(--sp-8) var(--sp-5)}.featured-title-row{align-items:center;gap:var(--sp-3);margin-bottom:var(--sp-2);display:flex}.featured-title-row h3{font-size:var(--text-title-sm);letter-spacing:-.017em;font-weight:600;line-height:1.19}.status{font-size:var(--text-caption);color:var(--ink-3);background:var(--surface-3);letter-spacing:.01em;border-radius:100px;padding:2px 8px;font-weight:500;line-height:1.33}.featured-desc{color:var(--ink-2);font-size:var(--text-body-sm);letter-spacing:-.006em;max-width:600px;line-height:1.53}.tabs{border-top:1px solid var(--hairline);border-bottom:1px solid var(--hairline);padding:0 var(--sp-8);display:flex}.tab{padding:var(--sp-3) var(--sp-4);color:var(--ink-3);font-size:var(--text-footnote);letter-spacing:-.003em;cursor:pointer;transition:color var(--duration) var(--ease);background:0 0;border:none;font-family:inherit;font-weight:500;position:relative}.tab:after{content:"";bottom:-1px;left:var(--sp-4);right:var(--sp-4);background:var(--ink-1);transform-origin:0;height:1.5px;transition:transform var(--duration-md) var(--ease-out);position:absolute;transform:scaleX(0)}.tab:hover{color:var(--ink-2)}.tab.active{color:var(--ink-1)}.tab.active:after{transform:scaleX(1)}.tab-panel{padding:var(--sp-6) var(--sp-8)}.feature-list{columns:2;column-gap:var(--sp-8);padding:0;list-style:none}.feature-list li{padding:var(--sp-2) 0;padding-left:var(--sp-5);font-size:var(--text-body-sm);color:var(--ink-2);letter-spacing:-.006em;break-inside:avoid;line-height:1.47;position:relative}.feature-list li:before{content:"–";padding-top:var(--sp-2);color:var(--ink-4);font-size:var(--text-body-sm);line-height:1.47;position:absolute;top:0;left:0}.arch{color:var(--ink-3);padding:var(--sp-4);background:var(--surface-2);border-radius:var(--radius-md);border:1px solid var(--hairline);white-space:pre;font-family:JetBrains Mono,monospace;font-size:11px;line-height:1.5;overflow-x:auto}.stack-list{gap:var(--sp-2);flex-wrap:wrap;display:flex}.chip{font-size:var(--text-caption);color:var(--ink-2);background:var(--surface-2);border:1px solid var(--hairline);padding:var(--sp-1) var(--sp-3);letter-spacing:.005em;border-radius:100px;font-weight:500}.featured-footer{padding:var(--sp-5) var(--sp-8) var(--sp-6);border-top:1px solid var(--hairline)}.featured-links{gap:var(--sp-2);margin-bottom:var(--sp-3);display:flex}.link-btn{align-items:center;gap:var(--sp-2);font-size:var(--text-footnote);letter-spacing:-.003em;color:var(--ink-2);padding:var(--sp-2) var(--sp-3);border:1px solid var(--hairline-strong);border-radius:var(--radius-sm);transition:color var(--duration-md) var(--ease), border-color var(--duration-md) var(--ease), background var(--duration-md) var(--ease);font-weight:500;display:inline-flex}.link-btn:hover{color:var(--ink-1);border-color:var(--hairline-hover);background:var(--surface-2)}.note{font-size:var(--text-caption);color:var(--ink-4);letter-spacing:0;line-height:1.33}.project-grid{gap:var(--sp-4);margin-bottom:var(--sp-5);grid-template-columns:3fr 2fr;display:grid}.project-card{border:1px solid var(--hairline);border-radius:var(--radius-lg);background:var(--surface-1);transition:border-color var(--duration-md) var(--ease), transform var(--duration-md) var(--ease), box-shadow var(--duration-md) var(--ease);flex-direction:column;display:flex}.project-card:hover{border-color:var(--hairline-hover);transform:translateY(-2px);box-shadow:0 4px 12px #00000026}.card-body{padding:var(--sp-6);flex:1}.card-body h3{font-size:var(--text-body);margin-bottom:var(--sp-2);letter-spacing:-.012em;font-weight:600;line-height:1.25}.card-body p{font-size:var(--text-body-sm);color:var(--ink-2);letter-spacing:-.006em;margin-bottom:var(--sp-4);line-height:1.47}.card-tech{gap:var(--sp-1);flex-wrap:wrap;display:flex}.card-tech span{font-size:var(--text-caption);color:var(--ink-3);background:var(--surface-2);letter-spacing:.005em;border-radius:4px;padding:2px 8px}.card-link{align-items:center;gap:var(--sp-2);padding:var(--sp-4) var(--sp-6);border-top:1px solid var(--hairline);font-size:var(--text-footnote);color:var(--ink-3);letter-spacing:-.003em;transition:color var(--duration-md) var(--ease);font-weight:500;display:flex}.card-link:hover{color:var(--ink-1)}.more-link{text-align:right}.more-link a{font-size:var(--text-footnote);color:var(--ink-3);letter-spacing:-.003em;transition:color var(--duration-md) var(--ease);align-items:center;gap:var(--sp-1);font-weight:500;display:inline-flex}.more-link a:after{content:"→";transition:transform var(--duration-md) var(--ease-out);display:inline-block}.more-link a:hover{color:var(--ink-1)}.more-link a:hover:after{transform:translate(3px)}@media (width<=768px){.featured:before{left:var(--sp-6)}.featured-top{padding:var(--sp-6)}.tabs{padding:0 var(--sp-6)}.tab-panel,.featured-footer{padding:var(--sp-5) var(--sp-6)}.feature-list{columns:1}.project-grid{grid-template-columns:1fr}.arch{font-size:10px}}@media (width<=480px){.featured-title-row{align-items:flex-start;gap:var(--sp-2);flex-direction:column}}.about{padding:var(--sp-20) 0 var(--sp-16)}.about-grid{gap:var(--sp-16);margin-bottom:var(--sp-10);grid-template-columns:1fr 200px;align-items:start;display:grid}.about-prose p{font-size:var(--text-body);color:var(--ink-2);letter-spacing:-.01em;margin-bottom:var(--sp-5);max-width:620px;font-weight:400;line-height:1.53}.about-prose p:last-child{margin-bottom:0}.about-numbers{gap:var(--sp-8);padding-top:var(--sp-1);padding-left:var(--sp-5);border-left:2px solid var(--surface-4);flex-direction:column;display:flex}.number-item{flex-direction:column;gap:2px;display:flex}.number{font-size:var(--text-title);color:var(--ink-1);letter-spacing:-.025em;font-variant-numeric:tabular-nums;font-weight:600;line-height:1}.number-label{font-size:var(--text-caption);color:var(--ink-3);letter-spacing:.005em;font-weight:500;line-height:1.33}.education-section{padding-top:var(--sp-6)}.edu-list{flex-direction:column;display:flex}.edu-item{gap:var(--sp-6);padding:var(--sp-4) 0;border-bottom:1px solid var(--hairline);grid-template-columns:140px 1fr;display:grid}.edu-item:last-child{border-bottom:none}.edu-period{font-size:var(--text-footnote);color:var(--ink-3);font-variant-numeric:tabular-nums;letter-spacing:0;padding-top:2px;padding-left:var(--sp-4);position:relative}.edu-period:before{content:"";background:repeating-linear-gradient(to bottom, var(--ink-4) 0, var(--ink-4) 3px, transparent 3px, transparent 7px);width:1px;position:absolute;top:0;bottom:0;left:0}.edu-degree{font-size:var(--text-body-sm);color:var(--ink-1);align-items:center;gap:var(--sp-2);letter-spacing:-.006em;margin-bottom:2px;font-weight:600;line-height:1.43;display:flex}.current-badge{color:var(--ink-3);background:var(--surface-3);letter-spacing:.02em;border-radius:100px;padding:1px 6px;font-size:10px;font-weight:500}.edu-school{font-size:var(--text-footnote);color:var(--ink-2);letter-spacing:-.003em;margin-bottom:2px;line-height:1.38}.edu-detail{font-size:var(--text-footnote);color:var(--ink-3);font-variant-numeric:tabular-nums;letter-spacing:0;line-height:1.38}@media (width<=768px){.about{padding:var(--sp-20) 0 var(--sp-16)}.about-grid{gap:var(--sp-10);grid-template-columns:1fr}.about-numbers{gap:var(--sp-10);border-left:none;border-top:1px solid var(--hairline);padding-left:0;padding-top:var(--sp-6);flex-direction:row}.edu-item{gap:var(--sp-1);grid-template-columns:1fr}.edu-period{padding-left:0}.edu-period:before{display:none}}@media (width<=480px){.about-numbers{gap:var(--sp-6)}.number{font-size:var(--text-title-sm)}}.skills{padding:var(--sp-16) 0;border-top:1px solid var(--hairline)}.skill-table{gap:var(--sp-10) var(--sp-12);grid-template-columns:1fr 1fr;display:grid}.skill-row{gap:var(--sp-3);flex-direction:column;display:flex}.skill-label{font-size:var(--text-caption);color:var(--ink-4);text-transform:uppercase;letter-spacing:.06em;font-weight:600;line-height:1.33}.skill-items{gap:var(--sp-2);flex-wrap:wrap;display:flex}.skill-name{font-size:var(--text-footnote);color:var(--ink-2);padding:var(--sp-1) var(--sp-3);border-radius:var(--radius-sm);border:1px solid var(--hairline-strong);letter-spacing:-.003em;transition:border-color var(--duration-md) var(--ease), background var(--duration-md) var(--ease), color var(--duration-md) var(--ease);background:0 0;font-weight:500;line-height:1.38}.skill-name:hover{border-color:var(--hairline-hover);background:var(--surface-2);color:var(--ink-1)}@media (width<=640px){.skill-table{gap:var(--sp-6);grid-template-columns:1fr}}.contact{padding:var(--sp-20) 0 var(--sp-16);border-top:1px solid var(--hairline)}.contact .section-subtitle{padding-left:var(--sp-1)}.contact-grid{gap:var(--sp-16);grid-template-columns:280px 1fr;align-items:start;display:grid}.contact-info{flex-direction:column;display:flex}.info-row{padding:var(--sp-3) 0;border-bottom:1px solid var(--hairline);flex-direction:column;gap:2px;display:flex}.info-row:last-child{border-bottom:none}.info-label{font-size:var(--text-caption);color:var(--ink-4);text-transform:uppercase;letter-spacing:.06em;font-weight:500;line-height:1.33}.info-row a,.info-row dd{font-size:var(--text-footnote);color:var(--ink-2);letter-spacing:-.003em;line-height:1.38}.info-row a{width:fit-content;display:inline-block;position:relative}.info-row a:after{content:"";background:var(--ink-3);transform-origin:0;width:100%;height:1px;transition:transform var(--duration-md) var(--ease-out);position:absolute;bottom:-1px;left:0;transform:scaleX(0)}.info-row a:hover{color:var(--ink-1)}.info-row a:hover:after{transform:scaleX(1)}.contact-form-wrap{background:var(--surface-1);border:1px solid var(--hairline);border-radius:var(--radius-lg);padding:var(--sp-8)}.form-message{font-size:var(--text-footnote);padding:var(--sp-3) var(--sp-4);border-radius:var(--radius-sm);margin-bottom:var(--sp-4);letter-spacing:-.003em;line-height:1.38}.form-message.success{background:var(--green-dim);color:var(--green)}.form-message.error{background:var(--red-dim);color:var(--red)}form{gap:var(--sp-4);flex-direction:column;display:flex}.form-row{gap:var(--sp-4);grid-template-columns:1fr 1fr;display:grid}.field{gap:var(--sp-2);flex-direction:column;display:flex}.field label{font-size:var(--text-caption);color:var(--ink-3);letter-spacing:.01em;font-weight:500;line-height:1.33}.field input,.field textarea{background:var(--surface-2);border:1px solid var(--hairline-strong);border-radius:var(--radius-sm);padding:var(--sp-2) var(--sp-3);font-size:var(--text-body-sm);color:var(--ink-1);letter-spacing:-.006em;transition:border-color var(--duration-md) var(--ease), box-shadow var(--duration-md) var(--ease);outline:none;font-family:inherit;line-height:1.47}.field input:focus,.field textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-dim)}.field input::placeholder,.field textarea::placeholder{color:var(--ink-4)}.field textarea{resize:vertical;min-height:96px}.submit-btn{height:36px;padding:0 var(--sp-5);color:var(--ink-2);border:1px solid var(--hairline-strong);border-radius:var(--radius-md);font-size:var(--text-footnote);letter-spacing:-.003em;cursor:pointer;transition:color var(--duration-md) var(--ease), border-color var(--duration-md) var(--ease), background var(--duration-md) var(--ease);background:0 0;align-self:flex-start;font-family:inherit;font-weight:500}.submit-btn:hover:not(:disabled){color:var(--ink-1);border-color:var(--hairline-hover);background:var(--surface-2)}.submit-btn:active:not(:disabled){background:var(--surface-3)}.submit-btn:disabled{opacity:.4;cursor:not-allowed}@media (width<=768px){.contact{padding:var(--sp-20) 0 var(--sp-12)}.contact .section-subtitle{padding-left:0}.contact-grid{gap:var(--sp-10);grid-template-columns:1fr}.form-row{grid-template-columns:1fr}}@media (width<=480px){.contact-form-wrap{padding:var(--sp-5)}}.footer{padding:var(--sp-8) 0 var(--sp-6);position:relative}.footer:before{content:"";background:var(--hairline-strong);width:60px;height:1px;margin:0 auto var(--sp-8);display:block}.footer-inner{justify-content:space-between;align-items:center;display:flex}.footer-copy{font-size:var(--text-caption);color:var(--ink-4);letter-spacing:0;line-height:1.33}.footer-nav{gap:var(--sp-5);display:flex}.footer-nav a{font-size:var(--text-caption);color:var(--ink-3);letter-spacing:0;transition:color var(--duration-md) var(--ease);line-height:1.33;position:relative}.footer-nav a:after{content:"";background:var(--ink-3);transform-origin:0;width:100%;height:1px;transition:transform var(--duration-md) var(--ease-out);position:absolute;bottom:-2px;left:0;transform:scaleX(0)}.footer-nav a:hover{color:var(--ink-1)}.footer-nav a:hover:after{transform:scaleX(1)}@media (width<=480px){.footer-inner{gap:var(--sp-3);text-align:center;flex-direction:column}}