@font-face{font-family:PersonalDisplay;src:url('/assets/display.ttf') format('truetype');font-display:swap;font-weight:400}:root{--ground:#dbe8e3;--paper:#f6f8f5;--ink:#213a35;--muted:#526e63;--line:#b9cdc2;--accent:#386b5a;--accent-ink:#fff;color-scheme:light}[data-theme=dark]{--ground:#182b25;--paper:#223931;--ink:#edf5ef;--muted:#bbd0c3;--line:#496457;color-scheme:dark}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:45px;scrollbar-color:var(--accent) var(--ground)}body{margin:0;color:var(--ink);background:var(--ground);font:17px/1.85 -apple-system,BlinkMacSystemFont,"Segoe UI","Microsoft YaHei",sans-serif}a{color:inherit;text-underline-offset:6px}::selection{background:var(--accent);color:var(--accent-ink)}:focus-visible{outline:3px solid var(--ink);outline-offset:6px}h1,h2,h3,p{margin-top:0}h1,h2{font-family:PersonalDisplay,"Noto Serif CJK SC",serif;font-weight:400;text-wrap:balance}h1{font-size:clamp(42px,5.5vw,80px);letter-spacing:-.025em;line-height:1.25;margin-bottom:0;max-width:10em}h2{font-size:clamp(30px,3.5vw,46px);line-height:1.35;margin-bottom:35px}h3{font-size:23px;line-height:1.45;font-weight:600;margin-bottom:12px}button,a{-webkit-tap-highlight-color:transparent}.site-shell{max-width:1540px;margin:auto;padding:88px 5vw 55px;display:grid;grid-template-columns:235px minmax(0,1fr);gap:50px}.index-spine{align-self:start;position:sticky;top:65px;display:flex;flex-direction:column;min-height:calc(100vh - 150px)}.identity{font-size:24px;font-weight:600;line-height:1.4;text-decoration:none;overflow-wrap:anywhere;padding-right:15px}.index-spine nav{margin-top:62px;display:grid;gap:4px;padding-right:25px}.index-spine nav a{text-decoration:none;display:flex;align-items:center;min-height:49px;padding:10px 15px;font-size:16px;border-radius:7px}.index-spine nav a:hover{background:color-mix(in srgb,var(--accent) 10%,transparent)}.index-spine nav a[aria-current]{background:var(--accent);color:var(--accent-ink)}.spine-bottom{margin-top:auto;padding:45px 15px 0 0;color:var(--muted);font-size:13px;line-height:1.85}.edit-link{font-size:12px;display:inline-block;padding:8px 0}.folio{position:relative;background:var(--paper);padding:0 7%;border-radius:0 14px 14px 14px;min-height:calc(100vh - 143px);animation:open-page .65s cubic-bezier(.16,1,.3,1) both}.folio-tab{position:absolute;top:-37px;left:0;height:38px;padding:8px 28px 0;background:var(--paper);border-radius:12px 12px 0 0;font-size:13px;line-height:30px;color:var(--muted)}.welcome{min-height:640px;padding:85px 0 70px;display:flex;flex-direction:column;justify-content:center}.welcome-heading{display:flex;align-items:flex-start;gap:30px}.welcome-heading:has(.portrait) h1{font-size:clamp(36px,4.5vw,65px)}.portrait{width:145px;height:180px;object-fit:cover;border-radius:10px;flex-shrink:0}.introduction{margin:42px 0 0;max-width:60ch;font-size:19px;line-height:1.9}.personal-status{color:var(--muted);margin:18px 0 0;max-width:65ch}.begin-link{display:flex;width:max-content;align-items:center;gap:25px;margin-top:55px;padding:10px 0;text-decoration:none;border-bottom:1px solid var(--ink);font-size:16px}.begin-link svg{transition:transform .2s ease}.begin-link:hover svg{transform:translateX(5px)}.empty-note{font-size:14px;color:var(--muted);margin:65px 0 0;line-height:1.85}.content-section{padding:76px 0;border-top:1px solid var(--line);overflow-wrap:anywhere}.biography{max-width:70ch;line-height:2.05}.skills-list{margin:0}.skills-list>div{display:grid;grid-template-columns:1fr 1.5fr;gap:30px;padding:22px 0;border-bottom:1px solid var(--line)}.skills-list>div:last-child{border:0}dt{font-size:20px;font-weight:600}dd{margin:0;color:var(--muted);font-size:16px;white-space:pre-line}.projects-list{display:grid;grid-template-columns:1fr 1fr;gap:45px}.projects-list article{padding:5px 0 20px}.projects-list p{font-size:16px;line-height:1.9;color:var(--muted)}.text-link{display:inline-flex;align-items:center;gap:12px;font-size:15px;padding:8px 0}.experience-list article{display:grid;grid-template-columns:130px 1fr;gap:25px;padding:30px 0;border-bottom:1px solid var(--line)}.experience-list article:first-child{padding-top:0}.experience-list article:last-child{border:0}.period{font-size:14px;color:var(--muted);font-variant-numeric:tabular-nums}.organization{color:var(--muted);font-size:15px;margin-bottom:20px}.experience-list article>div>p:last-child{font-size:16px;margin-bottom:0}.contact-links{display:grid;gap:0}.contact-links>a{display:flex;align-items:center;justify-content:space-between;gap:20px;text-decoration:none;padding:22px 0;font-size:24px;border-bottom:1px solid var(--line)}.contact-links>a:hover{color:var(--muted)}.folio-footer{padding:32px 0;display:flex;justify-content:space-between;gap:20px;border-top:1px solid var(--line);font-size:13px;color:var(--muted)}.folio-footer p{margin:0}.folio-footer a{display:flex;gap:10px;align-items:center;text-decoration:none}.preview-bar{padding:12px 25px;background:#213a35;color:#fff;font-size:14px;display:flex;justify-content:center;gap:30px}.skip{position:fixed;top:-80px;left:15px;background:var(--paper);padding:12px;z-index:30}.skip:focus{top:10px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@keyframes open-page{from{transform:translateY(12px);clip-path:inset(0 0 1% 0 round 0 14px 14px 14px)}to{transform:translateY(0);clip-path:inset(0 0 0 0 round 0 14px 14px 14px)}}@media(min-width:1500px){.site-shell{padding-left:70px;padding-right:70px;grid-template-columns:270px minmax(0,1fr);gap:60px}}@media(max-width:1100px){.site-shell{grid-template-columns:180px minmax(0,1fr);gap:30px;padding-left:4vw;padding-right:4vw}.welcome{min-height:610px}.portrait{width:100px;height:130px}.index-spine nav{padding-right:5px}.identity{font-size:21px}}@media(max-width:760px){html{scroll-padding-top:25px}.site-shell{display:block;padding:30px 20px}.index-spine{position:static;min-height:0}.identity{font-size:21px}.index-spine nav{display:flex;gap:4px;overflow-x:auto;margin:22px 0 58px;padding:0 0 8px}.index-spine nav a{flex-shrink:0;min-height:44px;font-size:14px;padding:8px 14px}.spine-bottom{display:none}.folio{padding:0 8%;min-height:660px}.folio-tab{font-size:12px;padding-left:22px;padding-right:22px}.welcome{padding:65px 0;min-height:560px}.welcome-heading{flex-direction:column-reverse;gap:25px}h1,.welcome-heading:has(.portrait) h1{font-size:clamp(38px,8.8vw,58px);max-width:10em}.portrait{width:90px;height:100px}.introduction{font-size:17px;margin-top:30px}.begin-link{margin-top:40px}.empty-note{margin-top:50px}.content-section{padding:50px 0}h2{font-size:34px;margin-bottom:27px}.biography{font-size:16px}.projects-list{grid-template-columns:1fr;gap:25px}.skills-list>div{grid-template-columns:1fr;gap:7px;padding:18px 0}.experience-list article{grid-template-columns:1fr;gap:7px}.period{margin-bottom:3px}.contact-links>a{font-size:21px}.folio-footer{font-size:12px;gap:15px;flex-wrap:wrap}.preview-bar{font-size:12px;flex-wrap:wrap;gap:6px 20px}.content-section h3{font-size:21px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.folio{animation:none}.begin-link svg{transition:none}}
/* Keep the folio's external tab visible after the opening motion. */
.folio{animation-fill-mode:backwards}
.welcome-heading,.welcome-heading h1{min-width:0;overflow-wrap:anywhere}
@media(max-width:760px){.index-spine{position:relative;top:auto}.spine-bottom{display:block;position:absolute;top:0;right:0;padding:0;margin:0}.spine-bottom p{display:none}.spine-bottom .edit-link{display:block;min-height:44px;padding:5px 0 5px 12px}.identity{max-width:calc(100% - 90px)} }
