@keyframes fadeInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.fade-in-element{opacity:0;transform:translateY(30px);transition:opacity .8s ease,transform .8s ease}.fade-in-element.visible{opacity:1;transform:translateY(0)}@font-face{font-display:swap;font-family:XuandongKaishu;font-style:normal;font-weight:400;src:url(/static/media/myfont.4afc816c4f7871983e57.ttf) format("truetype")}:root{--page-max-width:1200px;--page-gutter:clamp(1rem,3vw,2rem);--header-safe-offset:7.5rem}@media (min-width:768px){html{font-size:90%}:root{--page-max-width:1080px}}*{box-sizing:border-box;margin:0;padding:0;-webkit-user-select:none;user-select:none}body{background:linear-gradient(10deg,#eeeee5,#f5f7f8 70%);color:#333;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif}.app,body{height:100vh;height:100dvh;overflow:hidden}.app{position:relative}.header{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);left:0;padding-block:clamp(1rem,3vw,2rem);padding-inline:clamp(1rem,3vw,2rem);padding-inline:var(--page-gutter);position:fixed;right:0;top:0;z-index:100}.header-content{grid-gap:clamp(1rem,3vw,2rem);align-items:center;display:grid;gap:clamp(1rem,3vw,2rem);grid-template-columns:1fr 1fr;margin:0 auto;max-width:1200px;max-width:var(--page-max-width)}.header-left,.header-right{align-items:center;display:flex}.header-right{justify-content:flex-end}.welcome-text{color:#333;font-size:clamp(1.2rem,3vw,1.5rem);font-weight:400}.nav-links{display:flex;gap:clamp(1rem,3vw,2rem)}.nav-links a{align-items:center;color:#333;display:flex;font-size:clamp(.875rem,2vw,1rem);font-weight:400;min-height:44px;padding:clamp(.25rem,1vw,.5rem);text-decoration:none;transition:color .3s ease}.nav-links a:hover{color:#666}.nav-links>:last-child{padding-right:0}.nav-button{align-items:center;background:none;border:none;color:#333;cursor:pointer;display:flex;font-family:inherit;font-size:clamp(.875rem,2vw,1rem);font-weight:400;min-height:44px;padding:clamp(.25rem,1vw,.5rem);text-decoration:none;transition:color .3s ease}.nav-button:hover{color:#666}a:focus-visible,button:focus-visible{outline:2px solid #464040;outline-offset:4px}.nav-links .active{color:#666;font-weight:500}@media (max-width:767px){body{overflow:auto}.app,body{height:auto}.app{overflow:visible}.header-content{gap:clamp(.75rem,2vw,1rem);grid-template-columns:1fr;grid-template-rows:auto auto;text-align:center}.header-left,.header-right{justify-content:center}}@media (max-width:480px){:root{--page-gutter:clamp(0.75rem,3vw,1rem)}.nav-links{gap:clamp(.5rem,1.5vw,.75rem)}.nav-links a{font-size:clamp(.8rem,2.5vw,.875rem)}.header{padding-block:clamp(.75rem,2vw,1rem)}}.about-page .main-content{padding-bottom:clamp(.75rem,2vh,2rem);padding-top:clamp(5.5rem,13vh,8rem)}.about-wrapper{grid-gap:clamp(1rem,3vw,1.5rem);display:grid;gap:clamp(1rem,3vw,1.5rem);margin:0 auto;max-width:var(--page-max-width);padding-top:clamp(20px,calc(30px + 1vw),50px);width:100%}.about-title h1{color:#333;font-family:DM Sans,sans-serif;font-size:clamp(2rem,5vw,2.5rem);font-weight:400;line-height:1.24;margin-bottom:0;text-align:left}.about-section{margin-bottom:0}.about-section h2{color:#999;font-size:clamp(.75rem,2vw,.9rem);font-weight:400;letter-spacing:.5px;margin-bottom:clamp(.25rem,1vw,.5rem);text-transform:uppercase}.about-section p{color:#606060;font-family:DM Sans,sans-serif;font-size:clamp(1rem,4vw,1.5rem);font-weight:400;line-height:1.17;margin-bottom:clamp(.5rem,2vw,1rem)}.skills-content{display:flex;flex-direction:column;gap:clamp(.25rem,1vw,.5rem)}.skill-category{margin-bottom:clamp(.5rem,2vw,1rem)}.skill-category h3{color:#464040;font-family:DM Sans,sans-serif;font-size:clamp(1rem,2.5vw,1.2rem);font-weight:600;margin-bottom:clamp(.25rem,1vw,.5rem)}.skill-category p{color:#333;font-family:inter,sans-serif;font-size:clamp(.8rem,2vw,.9rem);line-height:1.4;margin-bottom:0}.experience-testimonial-grid{grid-gap:clamp(1.5rem,4vw,3rem);align-items:start;display:grid;gap:clamp(1.5rem,4vw,3rem);grid-template-columns:1fr 1fr}.experience-timeline{display:flex;flex-direction:column;gap:0}.experience-item{grid-gap:clamp(1rem,3vw,1.5rem);align-items:center;display:grid;gap:clamp(1rem,3vw,1.5rem);grid-template-columns:1fr auto;padding:clamp(.5rem,2vw,.75rem) 0}.experience-content h3{color:#333;font-family:inter,sans-serif;font-size:clamp(.8rem,2vw,.9rem);font-weight:400;margin-bottom:clamp(.125rem,.5vw,.25rem)}.experience-content p{color:#999;font-family:inherit;font-size:clamp(.7rem,1.5vw,.8rem);margin-bottom:0}.experience-date{text-align:right}.experience-date span{color:#999;font-family:inherit;font-size:clamp(.7rem,1.5vw,.8rem);font-weight:500}.timeline-line{background-color:#e0e0e0;height:1px;margin:clamp(.25rem,1vw,.5rem) 0}.testimonial-right{align-self:start;text-align:right}.testimonial-right blockquote{background:#f1f1f133;border-right:2px solid #5a5858;color:#606060;font-family:DM Sans,sans-serif;font-size:clamp(1rem,4vw,1.5rem);font-style:italic;font-weight:400;line-height:1.17;margin:0 0 clamp(.5rem,2vw,1rem);padding:clamp(.5rem,2vw,1rem);text-align:right}.testimonial-right cite{color:#999;display:block;font-family:inherit;font-size:clamp(.7rem,1.5vw,.8rem);font-style:normal;font-weight:400;text-align:right}@container (max-width: 600px){.about-title h1{text-align:center}.experience-testimonial-grid{gap:clamp(1rem,3vw,1.5rem);grid-template-columns:1fr}.testimonial-right{text-align:left}.testimonial-right blockquote{border-left:2px solid #5a5858;border-right:none;text-align:left}.testimonial-right cite{text-align:left}}@media (min-width:1200px){.about-wrapper{gap:1.5rem;padding-top:0}.skills-content{grid-gap:clamp(1rem,3vw,1.5rem);display:grid;gap:clamp(1rem,3vw,1.5rem);grid-template-columns:1fr 1fr}}@media (min-width:768px) and (max-width:1199px){.about-wrapper{gap:clamp(1rem,3vw,1.5rem);padding-top:clamp(80px,calc(70px + 2vw),100px)}}@media (max-width:767px){.about-wrapper{gap:clamp(.75rem,2vw,1rem);padding-top:clamp(70px,calc(60px + 2vw),90px)}.skills-content{display:flex;flex-direction:column}.experience-testimonial-grid{gap:clamp(1rem,3vw,1.5rem);grid-template-columns:1fr}.testimonial-right{text-align:left}.testimonial-right blockquote{border-left:2px solid #5a5858;border-right:none;text-align:left}.testimonial-right cite{text-align:left}}@media (max-width:480px){.about-wrapper{gap:clamp(.5rem,1.5vw,.75rem);padding-top:clamp(60px,calc(50px + 2vw),80px)}}.experience-item.clickable{background:none;border:0;border-radius:8px;color:inherit;cursor:pointer;font:inherit;overflow:hidden;padding:clamp(.5rem,2vw,.75rem);position:relative;text-align:left;transition:all .3s ease;width:100%}.experience-item.clickable:before{background:#ffffff26;border-radius:8px;bottom:0;content:"";left:0;opacity:0;pointer-events:none;position:absolute;right:0;top:0;transition:opacity .3s ease}.experience-item.clickable:hover:before{opacity:1}.experience-item.clickable:hover{box-shadow:0 4px 12px #0000001a;transform:translateY(-2px)}.modal-overlay{align-items:center;animation:modalFadeIn .25s ease-out forwards;-webkit-backdrop-filter:blur(0);backdrop-filter:blur(0);background:#0000;bottom:0;display:flex;justify-content:center;left:0;padding:clamp(1rem,5vw,2rem);position:fixed;right:0;top:0;z-index:1000}@keyframes modalFadeIn{0%{-webkit-backdrop-filter:blur(0);backdrop-filter:blur(0);background:#0000}to{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#0003}}.modal-content{animation:modalContentSlideIn .3s ease-out forwards;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#fffffff2;border:1px solid #e0e0e04d;border-radius:12px;box-shadow:0 8px 32px #0000001f;max-height:90vh;max-width:900px;opacity:0;overflow:hidden;position:relative;transform:scale(.8) translateY(20px);width:100%}@keyframes modalContentSlideIn{0%{opacity:0;transform:scale(.8) translateY(20px)}to{opacity:1;transform:scale(1) translateY(0)}}@keyframes modalContentSlideOut{0%{opacity:1;transform:scale(1) translateY(0)}to{opacity:0;transform:scale(.8) translateY(20px)}}@keyframes modalFadeOut{0%{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#0003}to{-webkit-backdrop-filter:blur(0);backdrop-filter:blur(0);background:#0000}}.modal-close{align-items:center;background:none;border:none;border-radius:50%;color:#999;cursor:pointer;display:flex;font-family:inherit;font-size:1.5rem;height:32px;justify-content:center;position:absolute;right:1rem;top:1rem;transition:all .3s ease;width:32px;z-index:10}.modal-close:hover{background:#00000014;color:#666}.modal-body{grid-gap:clamp(1.5rem,4vw,2rem);align-items:center;display:grid;gap:clamp(1.5rem,4vw,2rem);grid-template-columns:1fr 1fr;padding:clamp(2rem,5vw,3rem)}.modal-text h2{color:#464040;font-size:clamp(1.5rem,4vw,2rem);font-weight:400;line-height:1.24;margin-bottom:clamp(.5rem,1vw,1rem)}.modal-text h2,.modal-text h3{font-family:DM Sans,sans-serif}.modal-text h3{color:#333;font-size:clamp(1rem,2.5vw,1.2rem);font-weight:600;margin-bottom:clamp(.25rem,.5vw,.5rem)}.modal-year{background:#f1f1f180;border-radius:20px;color:#999;display:inline-block;font-family:inter,sans-serif;font-size:clamp(.7rem,1.5vw,.8rem);font-weight:400;letter-spacing:.5px;margin-bottom:clamp(1rem,2vw,1.5rem);padding:clamp(.25rem,.5vw,.5rem) clamp(.75rem,1.5vw,1rem);text-transform:uppercase}.modal-text p{color:#606060;font-family:DM Sans,sans-serif;font-size:clamp(1rem,4vw,1.5rem);font-weight:400;line-height:1.17;margin:0}.modal-image{align-items:center;display:flex;flex-direction:column;gap:clamp(.5rem,1vw,.75rem);justify-content:center;padding:clamp(1rem,2vw,1.5rem)}.modal-image img{border-radius:8px;height:auto;object-fit:contain;width:125%}.modal-image-caption{color:#999;font-family:inherit;font-size:clamp(.7rem,1.5vw,.8rem);line-height:1.4;margin:0;text-align:right}@media (max-width:768px){.modal-body{gap:clamp(1.5rem,3vw,2rem);grid-template-columns:1fr;padding:clamp(1.5rem,4vw,2rem)}.modal-image img{max-height:200px}.modal-content{max-height:95vh}}.modal-overlay.closing{animation:modalFadeOut .3s ease-in forwards}.modal-content.closing{animation:modalContentSlideOut .3s ease-in forwards}@media (min-width:768px) and (max-height:760px){.about-wrapper{gap:clamp(.5rem,1.5vh,.875rem);padding-bottom:0;padding-top:0}.about-section p,.testimonial-right blockquote{font-size:clamp(.9rem,2.8vh,1.15rem);line-height:1.2}.skill-category{margin-bottom:.25rem}.experience-item{padding-bottom:.35rem;padding-top:.35rem}}.main-content{align-items:center;display:flex;height:100vh;height:100dvh;justify-content:center;overflow:hidden;padding-inline:var(--page-gutter);padding-bottom:var(--page-gutter);padding-top:clamp(250px,calc(230px + 5vw),280px)}.content-wrapper{grid-gap:clamp(1.5rem,4vw,3rem);container-type:inline-size;display:grid;gap:clamp(1.5rem,4vw,3rem);grid-template-columns:1fr 1fr;grid-template-rows:auto auto auto;margin:0 auto;max-width:var(--page-max-width);position:relative;width:100%}.name-section-container{align-items:flex-start;display:flex;flex-direction:column;grid-column:1;grid-row:1}.name-section{align-items:center;display:flex;gap:clamp(.5rem,2vw,1rem)}.chinese-name{word-wrap:break-word;color:#6b6363;font-family:XuandongKaishu,GenRyuMin JP Regular,"Noto Serif JP",serif;font-size:clamp(2rem,5vw,2.5rem);font-weight:400;line-height:1.17;text-orientation:mixed;writing-mode:vertical-rl}.name-divider{background-color:#5a5858;height:clamp(50px,8vw,100px);width:2px}.english-name{color:#464040;font-family:DM Sans,sans-serif;font-size:clamp(2rem,5vw,2.5rem);font-weight:400;line-height:1.24}.summary-section{align-self:start;display:flex;flex-direction:column;gap:clamp(.5rem,2vw,1rem);grid-column:2;grid-row:1;text-align:right}.summary-label{color:#999;font-size:clamp(.75rem,2vw,.9rem);letter-spacing:.5px;margin-bottom:clamp(.25rem,1vw,.5rem);text-transform:uppercase}.summary-text{font-size:clamp(1rem,4vw,1.5rem);margin-bottom:clamp(.5rem,2vw,1rem)}.current-status,.summary-text{word-wrap:break-word;color:#606060;font-family:DM Sans,sans-serif;font-weight:400;line-height:1.17}.current-status{font-size:clamp(1.5rem,4vw,2rem)}.links-section{align-self:end;display:flex;flex-direction:column;gap:clamp(.5rem,2vw,1rem);grid-column:1;grid-row:2}.links-heading{color:#333;font-size:clamp(1rem,2.5vw,1.2rem);font-weight:600;margin-bottom:clamp(.25rem,1vw,.5rem)}.links-list{display:flex;flex-direction:column;gap:clamp(.25rem,1vw,.5rem)}.links-list a{align-items:center;color:#333;display:flex;font-family:inter\ ,sans-serif;font-size:clamp(.8rem,2vw,.9rem);min-height:16px;padding:clamp(.125rem,.5vw,.25rem) 0;text-decoration:none;transition:color .3s ease}.links-list a:hover{color:#666}.footer-credit{align-self:end;color:#999;font-size:clamp(.7rem,1.5vw,.8rem);grid-column:2;grid-row:2;text-align:right}@container (max-width: 600px){.footer-credit,.summary-section{text-align:left}.name-section{justify-content:center}}@media (min-width:1200px){.content-wrapper{gap:3rem}.main-content{padding-top:250px}}@media (min-width:768px) and (max-width:1199px){.content-wrapper{gap:clamp(2rem,4vw,3rem)}.main-content{padding-top:clamp(240px,calc(230px + 4vw),260px)}}@media (max-width:767px){.main-content{height:auto;min-height:100vh;overflow:visible}.content-wrapper{gap:clamp(1.5rem,4vw,2rem);grid-template-columns:1fr;grid-template-rows:auto auto auto auto}.name-section-container{align-items:center;grid-column:1;grid-row:1}.summary-section{grid-column:1;grid-row:2;text-align:left}.links-section{grid-column:1;grid-row:3}.footer-credit{grid-column:1;grid-row:4;text-align:left}.main-content{padding-top:clamp(200px,calc(180px + 5vw),220px)}.english-name{font-size:clamp(1.75rem,4vw,2rem)}.name-section{justify-content:center}}@media (max-width:480px){.main-content{padding-top:clamp(180px,calc(160px + 5vw),200px)}.content-wrapper{gap:clamp(1rem,3vw,1.5rem)}}.projects-page .main-content{align-items:flex-start;padding-bottom:clamp(.75rem,2vh,2rem);padding-top:calc(clamp(5.5rem, 13vh, 8rem) + clamp(1rem, 3vw, 1.5rem) + 1rem)}.projects-wrapper{grid-gap:clamp(.75rem,2vh,1.25rem);display:grid;gap:clamp(.75rem,2vh,1.25rem);margin:0 auto;max-width:var(--page-max-width);width:100%}.projects-selector>h2,.projects-title h1{color:#999;font-family:DM Sans,sans-serif;font-size:clamp(.75rem,2vw,.9rem);font-weight:400;letter-spacing:.5px;text-transform:uppercase}.projects-layout{grid-column-gap:clamp(2rem,5vw,5rem);grid-row-gap:clamp(.75rem,2vh,1.25rem);align-items:start;column-gap:clamp(2rem,5vw,5rem);display:grid;grid-template-areas:"title selector" "detail selector";grid-template-columns:minmax(0,1.65fr) minmax(240px,.65fr);row-gap:clamp(.75rem,2vh,1.25rem)}.projects-title{grid-area:title}.project-detail{grid-gap:clamp(.75rem,2vh,1.25rem);display:grid;gap:clamp(.75rem,2vh,1.25rem);grid-area:detail;min-width:0}.project-detail.portrait-project{align-items:center;column-gap:clamp(1.5rem,4vw,3rem);grid-template-columns:minmax(0,3fr) minmax(0,3fr)}.portrait-project .project-image{aspect-ratio:auto;justify-self:stretch;max-height:none;max-width:none;overflow:visible;width:100%}.portrait-project .project-image img{height:auto}.project-image{align-items:center;animation:projectSwap .35s ease-out;aspect-ratio:16/9;background:#0000;border:0;color:#999;display:flex;font-family:DM Sans,sans-serif;justify-content:center;max-height:45vh;overflow:hidden;width:100%}.project-image img{height:100%;object-fit:contain;width:100%}.project-content{grid-gap:clamp(.5rem,1.4vh,.875rem);animation:projectSwap .35s ease-out;display:grid;gap:clamp(.5rem,1.4vh,.875rem)}@keyframes projectSwap{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.project-heading{align-items:flex-end;display:flex;gap:1.5rem;justify-content:space-between}.project-heading h2{color:#464040;font-family:DM Sans,sans-serif;font-size:clamp(1.5rem,4vw,2.25rem);font-weight:400;line-height:1.1;margin:.125rem 0 0}.project-year{color:#999;font-family:DM Sans,sans-serif;font-size:clamp(.7rem,1.5vw,.8rem)}.project-links{display:flex;flex-shrink:0;gap:1rem;justify-content:flex-end}.project-link{align-items:center;border-bottom:1px solid #0000;color:#333;display:inline-flex;font-family:DM Sans,sans-serif;font-size:clamp(.75rem,1.5vw,.875rem);min-height:44px;text-decoration:none;transition:color .2s ease,border-color .2s ease}.project-link:hover{border-bottom-color:initial;color:#666}.project-description{color:#606060;font-family:DM Sans,sans-serif;font-size:clamp(.875rem,1.8vw,1rem);line-height:1.45;margin:0;max-width:720px}.project-technologies{display:flex;flex-wrap:wrap;gap:.375rem}.tech-tag{background:#f1f1f18c;border:1px solid #e0e0e099;border-radius:4px;color:#555;font-family:DM Sans,sans-serif;font-size:clamp(.65rem,1.2vw,.75rem);padding:.25rem .625rem}.projects-selector{align-self:start;grid-area:selector;justify-self:end;max-width:340px;text-align:right;width:100%}.projects-selector>h2{margin-bottom:clamp(.5rem,1.5vh,.875rem)}.projects-list{display:flex;flex-direction:column}.project-selector-item{grid-gap:clamp(1rem,3vw,1.5rem);align-items:center;background:#0000;border:0;border-radius:8px;color:inherit;cursor:pointer;display:grid;font:inherit;gap:clamp(1rem,3vw,1.5rem);grid-template-columns:1fr auto;overflow:hidden;padding:clamp(.5rem,2vw,.75rem);position:relative;text-align:left;transition:all .3s ease;width:100%}.project-selector-item:before{background:#ffffff26;border-radius:8px;content:"";inset:0;opacity:0;pointer-events:none;position:absolute;transition:opacity .3s ease}.project-selector-item:hover:before{opacity:1}.project-selector-item:hover{box-shadow:0 4px 12px #0000001a;transform:translateY(-2px)}.project-selector-content{display:flex;flex-direction:column;min-width:0}.project-selector-title{color:#333;font-family:inter,sans-serif;font-size:clamp(.8rem,2vw,.9rem);font-weight:400;margin-bottom:clamp(.125rem,.5vw,.25rem)}.project-selector-item.active .project-selector-title{font-weight:500}.project-selector-summary{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.project-selector-date,.project-selector-summary{color:#999;font-family:inherit;font-size:clamp(.7rem,1.5vw,.8rem)}.project-selector-date{font-weight:500;text-align:right}.project-divider{background:#e0e0e0;height:1px;margin:clamp(.25rem,1vw,.5rem) 0}@media (min-width:768px) and (max-height:760px){.projects-page .main-content{padding-bottom:.75rem;padding-top:calc(clamp(5.5rem, 13vh, 8rem) + clamp(1rem, 3vw, 1.5rem) + 1rem)}.project-detail,.projects-wrapper{gap:.5rem}.project-image{max-height:37vh}.project-heading h2{font-size:clamp(1.25rem,3.5vh,1.75rem)}.project-description{font-size:.8rem;line-height:1.35}.project-selector-item{padding-bottom:.375rem;padding-top:.375rem}}@media (max-width:767px){.projects-page .main-content{padding-bottom:2rem;padding-top:clamp(9rem,30vw,11rem)}.projects-wrapper{padding:0}.projects-layout{gap:2rem;grid-template-areas:"title" "detail" "selector";grid-template-columns:1fr}.project-image{max-height:none}.project-detail.portrait-project{grid-template-columns:1fr}.portrait-project .project-image{width:min(70vw,280px)}.projects-selector{justify-self:stretch;max-width:none}}@media (max-width:480px){.project-heading{align-items:flex-start;flex-direction:column;gap:.25rem}.project-links{justify-content:flex-start}}
/*# sourceMappingURL=main.ccaf4294.css.map*/