:root{color-scheme:light;--canvas:oklch(97.5% .005 250);--canvas-deep:oklch(94.8% .01 250);--surface:oklch(92.5% .021 250);--surface-strong:oklch(87.5% .034 250);--ink:#172943;--ink-strong:oklch(14.5% .035 255);--ink-soft:oklch(40.5% .033 255);--signal:#a97f1c;--signal-dark:#76580f;--line:oklch(82% .022 250);--line-strong:oklch(66% .035 250);--on-ink:oklch(98.5% .003 250);--radius-sm:8px;--radius-md:12px;--radius-full:999px;--space-2xs:clamp(.4rem, .36rem + .18vw, .54rem);--space-xs:clamp(.68rem, .58rem + .48vw, 1rem);--space-sm:clamp(1rem, .84rem + .78vw, 1.55rem);--space-md:clamp(1.45rem, 1.2rem + 1.25vw, 2.3rem);--space-lg:clamp(2.2rem, 1.76rem + 2.2vw, 3.75rem);--space-xl:clamp(3.4rem, 2.58rem + 4.1vw, 6.25rem);--space-2xl:clamp(5.25rem, 3.9rem + 6.75vw, 10rem);--container:min(1160px, calc(100vw - 40px));--ease-out:cubic-bezier(.23, 1, .32, 1);--font-ui:ui-sans-serif, -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", sans-serif}*{box-sizing:border-box}html{background:var(--canvas);scroll-behavior:smooth;min-width:320px}body{background:var(--canvas);color:var(--ink);font-family:var(--font-ui);font-kerning:normal;text-rendering:optimizelegibility;margin:0;font-size:1rem;line-height:1.65;overflow-x:clip}::selection{background:var(--signal-dark);color:#fff}a{color:inherit;text-decoration:none}a:focus-visible{border-radius:var(--radius-sm);outline:3px solid var(--signal);outline-offset:4px}.page-shell{width:var(--container);margin:0 auto}.site-header{justify-content:space-between;align-items:center;gap:var(--space-md);min-height:96px;padding:max(1rem, env(safe-area-inset-top)) 0 1rem;animation:header-in .42s var(--ease-out) both;display:flex}@keyframes header-in{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}.brand-mark{min-height:44px;color:var(--ink-strong);letter-spacing:-.03em;align-items:center;font-size:.98rem;font-weight:760;display:inline-flex}.brand-tsai{color:var(--signal-dark)}.site-nav{color:var(--ink-soft);align-items:center;gap:clamp(1rem,2.5vw,2.25rem);font-size:.91rem;font-weight:650;display:flex}.site-nav a,.text-link,.experience-detail a,.artifact-row a{transition:color .16s;position:relative}.site-nav a{align-items:center;min-height:44px;display:inline-flex}.site-nav a:after,.text-link:after,.experience-detail a:after,.artifact-row a:after{content:"";transform-origin:100%;height:1.5px;transition:transform .18s var(--ease-out);background:currentColor;position:absolute;bottom:6px;left:0;right:0;transform:scaleX(0)}.text-link:after,.experience-detail a:after,.artifact-row a:after{bottom:-.18em}.hero{min-height:min(780px,100svh - 96px);padding:var(--space-lg) 0 var(--space-xl);grid-template-columns:minmax(0,1.3fr) minmax(300px,.7fr);align-items:center;gap:clamp(3rem,7vw,7.5rem);display:grid}.hero-copy{max-width:760px}.hero-kicker,.experience-company{margin:0;font-weight:720}.hero-kicker{color:var(--ink-soft);letter-spacing:-.01em;align-items:center;gap:.65rem;font-size:clamp(.92rem,.86rem + .25vw,1.04rem);display:flex}.hero-kicker>span{border-radius:var(--radius-full);background:var(--signal);flex:none;width:.62rem;height:.62rem}.hero h1,.section-heading h2,.contact-copy h2{color:var(--ink-strong);letter-spacing:-.04em;text-wrap:balance;margin:0;font-weight:760}.hero h1{max-width:9ch;margin-top:var(--space-xs);font-size:clamp(4rem,8vw,6rem);line-height:.94}.hero-rule{width:min(17rem,48%);height:4px;margin:var(--space-md) 0;background:var(--signal);transform-origin:0;animation:rule-draw .62s var(--ease-out) .36s both}@keyframes rule-draw{0%{transform:scaleX(0)}to{transform:scaleX(1)}}.hero-role{max-width:27ch;color:var(--ink);letter-spacing:-.035em;text-wrap:balance;margin:0;font-size:clamp(1.45rem,2.2vw,2.15rem);font-weight:690;line-height:1.13}.hero-summary{max-width:62ch;margin:var(--space-sm) 0 0;color:var(--ink-soft);text-wrap:pretty;font-size:clamp(1.02rem,.96rem + .25vw,1.14rem);line-height:1.7}.human-note{margin:var(--space-sm) 0 0;color:var(--signal-dark);letter-spacing:-.012em;font-size:.94rem;font-weight:690}.hero-kicker,.hero h1,.hero-role,.hero-summary,.human-note,.hero-actions{animation:settle-in .52s var(--ease-out) both}.hero h1{animation-delay:55ms}.hero-role{animation-delay:.12s}.hero-summary{animation-delay:.175s}.human-note{animation-delay:.225s}.hero-actions{animation-delay:.28s}@keyframes settle-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.hero-actions,.contact-actions{flex-wrap:wrap;align-items:center;gap:1.1rem;display:flex}.hero-actions{margin-top:var(--space-md)}.button{border-radius:var(--radius-sm);letter-spacing:-.012em;min-height:48px;transition:transform .14s var(--ease-out), background-color .16s ease, color .16s ease;justify-content:center;align-items:center;gap:.42rem;padding:.82rem 1.1rem;font-size:.94rem;font-weight:720;display:inline-flex}.button:active{transform:scale(.98)}.button-primary{background:var(--ink);color:var(--on-ink)}.text-link{color:var(--ink);font-size:.94rem;font-weight:700}.profile-picture{aspect-ratio:4/5;border-radius:var(--radius-md);background:var(--surface-strong);object-fit:cover;object-position:50% 48%;width:min(100%,400px);animation:portrait-reveal .68s var(--ease-out) .15s both;justify-self:end;display:block}@keyframes portrait-reveal{0%{opacity:0;clip-path:inset(0 0 18%);transform:translateY(8px)}to{opacity:1;clip-path:inset(0);transform:translateY(0)}}.proof-rail{gap:var(--space-md);border-top:1px solid var(--line-strong);border-bottom:1px solid var(--line-strong);padding:var(--space-md) 0;grid-template-columns:repeat(3,1fr);margin:0;list-style:none;display:grid}.proof-rail>li{min-width:0;color:var(--ink);letter-spacing:-.02em;margin:0;font-size:clamp(.98rem,.91rem + .28vw,1.12rem);font-weight:690;line-height:1.35}.proof-rail>li+li{border-left:1px solid var(--line);padding-left:var(--space-md)}.experience-section{padding:var(--space-xl) 0 0}.projects-section{padding:var(--space-xl) 0}.section-heading{align-items:end;gap:var(--space-xl);margin-bottom:var(--space-lg);grid-template-columns:minmax(0,.9fr) minmax(280px,.55fr);display:grid}.section-heading h2,.contact-copy h2{font-size:clamp(2.4rem,5vw,4.6rem);line-height:.98}.section-heading>p,.contact-copy>p{max-width:48ch;color:var(--ink-soft);text-wrap:pretty;margin:0;font-size:1.02rem;line-height:1.7}.experience-list,.artifact-list{border-bottom:1px solid var(--line-strong)}.experience-row{gap:var(--space-xl);border-top:1px solid var(--line-strong);padding:calc(var(--space-md) + var(--space-2xs)) 0;grid-template-columns:minmax(260px,.72fr) minmax(0,1.28fr);display:grid}.experience-company{color:var(--signal-dark);letter-spacing:.015em;font-size:.84rem}.experience-row h3,.artifact-row h3{color:var(--ink-strong);letter-spacing:-.035em;text-wrap:balance;margin:0;font-size:clamp(1.25rem,1.08rem + .82vw,1.82rem);font-weight:730;line-height:1.13}.experience-row h3{max-width:24ch;margin-top:.6rem}.experience-detail>p{max-width:64ch;color:var(--ink-soft);text-wrap:pretty;margin:0;font-size:1.01rem;line-height:1.72}.experience-detail a,.artifact-row a{color:var(--ink);font-weight:700}.experience-detail ul{margin:var(--space-sm) 0 0;color:var(--ink);letter-spacing:.008em;flex-wrap:wrap;gap:.38rem 0;padding:0;font-size:.79rem;font-weight:690;list-style:none;display:flex}.experience-detail li+li:before{content:"/";color:var(--signal);margin:0 .58rem}.artifact-row{gap:var(--space-xl);border-top:1px solid var(--line-strong);padding:var(--space-md) 0;grid-template-columns:minmax(260px,.72fr) minmax(0,1.28fr);display:grid}.artifact-row>p:last-child{max-width:60ch;color:var(--ink-soft);margin:0}.contact-section{align-items:end;gap:var(--space-xl);margin:0 0 var(--space-xl);border-radius:var(--radius-md);background:var(--surface);grid-template-columns:minmax(0,1.25fr) minmax(280px,.75fr);padding:clamp(2rem,5.5vw,5rem);display:grid}.contact-copy h2{max-width:16ch}.contact-copy>p{margin-top:var(--space-sm)}.contact-actions{justify-content:flex-start;align-items:flex-start}.contact-actions .button{flex-basis:100%;width:max-content}.site-footer{justify-content:space-between;align-items:center;gap:var(--space-md);border-top:1px solid var(--line-strong);padding:var(--space-md) 0 max(var(--space-md), env(safe-area-inset-bottom));display:flex}.site-footer p{color:var(--ink-soft);margin:0;font-size:.84rem}.site-footer p:first-child span{color:var(--signal);margin:0 .42em}@media (hover:hover) and (pointer:fine){.site-nav a:hover,.text-link:hover,.experience-detail a:hover,.artifact-row a:hover{color:var(--signal-dark)}.site-nav a:hover:after,.site-nav a:focus-visible:after,.text-link:hover:after,.text-link:focus-visible:after,.experience-detail a:hover:after,.experience-detail a:focus-visible:after,.artifact-row a:hover:after,.artifact-row a:focus-visible:after{transform-origin:0;transform:scaleX(1)}.site-nav a:focus-visible:after,.text-link:focus-visible:after,.experience-detail a:focus-visible:after,.artifact-row a:focus-visible:after{transition-duration:0s}.button-primary:hover{background:var(--signal-dark)}}@media (width<=900px){.hero{gap:var(--space-lg);min-height:auto;padding-top:var(--space-xl);grid-template-columns:minmax(0,1fr) minmax(240px,.55fr)}.hero h1{font-size:clamp(3.4rem,8.8vw,5.4rem)}.profile-picture{width:min(100%,320px)}.section-heading,.contact-section{grid-template-columns:1fr}.section-heading{gap:var(--space-md)}.experience-row,.artifact-row{gap:var(--space-lg)}}@media (width<=700px){:root{--container:min(100% - 28px, 1160px)}.site-header{min-height:80px}.site-nav{gap:clamp(.72rem,3.2vw,1.1rem);font-size:.84rem}.hero{padding-top:var(--space-lg);grid-template-columns:1fr}.hero-copy{max-width:none}.hero h1{max-width:8ch;font-size:clamp(3.35rem,16vw,5rem)}.profile-picture{width:min(82vw,340px);margin-top:var(--space-md);justify-self:start}.proof-rail{grid-template-columns:1fr;gap:0}.proof-rail>li{padding:var(--space-sm) 0}.proof-rail>li+li{border-top:1px solid var(--line);border-left:0;padding-left:0}.experience-row,.artifact-row{gap:var(--space-sm);grid-template-columns:1fr}.artifact-row{padding:var(--space-md) 0}.contact-section{align-items:start;gap:var(--space-lg);padding:var(--space-lg)}.contact-actions .button{width:100%}.site-footer{flex-direction:column;align-items:flex-start;gap:.35rem}}@media (width<=440px){.site-header{flex-wrap:wrap;gap:0;padding-bottom:.75rem}.site-nav{flex-basis:100%;justify-content:space-between}.hero h1{font-size:clamp(3.15rem,17vw,4.25rem)}.hero-role{font-size:1.42rem}.hero-actions{flex-direction:column;align-items:stretch}.hero-actions .button{width:100%}.hero-actions .text-link{align-self:flex-start}}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,:before,:after{transition-duration:.01ms!important;animation:none!important}}
