@font-face{font-family:Inter;src:url('assets/inter.ttf') format('truetype');font-weight:100 900;font-display:swap}
:root{--paper:#fff0f5;--ink:#111;--muted:#4b5563;--accent:#ffb6c1;--blue:#263dff;--line:#fbcfe8;--shadow:0 10px 15px -3px rgb(0 0 0 / 10%),0 4px 6px -4px rgb(0 0 0 / 10%);--ease:cubic-bezier(.34,1.56,.64,1)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:80px;color-scheme:light;scrollbar-color:#ffb6c1 #fff0f5}body{margin:0;background:#fff;color:var(--ink);font-family:Inter,"Microsoft YaHei",sans-serif;line-height:1.5;-webkit-tap-highlight-color:rgb(255 182 193 / 25%)}::selection{background:#ffc7dc;color:#111}button,a,summary{touch-action:manipulation;outline-offset:4px}button{font:inherit;color:inherit;cursor:pointer;border:0}a{color:inherit;text-underline-offset:4px}:focus-visible{outline:3px solid var(--blue)}img{display:block;max-width:100%}svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}h1,h2,h3,p{margin-top:0}section{scroll-margin-top:80px}.skip-link{position:fixed;top:-70px;left:20px;z-index:100;padding:10px 18px;background:white}.skip-link:focus{top:10px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.site-header{height:69px;position:fixed;inset:0 0 auto;z-index:50;display:flex;align-items:center;justify-content:space-between;padding:0 max(40.8px,env(safe-area-inset-right)) 0 max(40.8px,env(safe-area-inset-left));background:rgb(255 240 245 / 90%);border-bottom:1px solid var(--line)}.brand{width:40.8px;height:40.8px;display:block}.brand img{width:100%;height:100%;object-fit:contain;transition:transform .3s}.brand:hover img{transform:scale(1.1)}.site-header nav{display:flex;align-items:center;gap:27.2px}.site-header nav a{font-size:15.3px;line-height:23px;text-decoration:none;font-weight:700;position:relative}.site-header nav a::after{content:"";height:1px;position:absolute;left:0;bottom:-4px;width:0;background:var(--accent);transition:width .3s}.site-header nav a:hover::after{width:100%}.language{background:white;color:#d56e86;border:1.7px solid var(--accent);font-size:11.9px;font-weight:700;min-width:42px;min-height:29px;padding:3px 10px;border-radius:24px}.language:hover{background:var(--accent);color:white}.menu-toggle{display:none;background:none;width:40px;height:40px}
.hero{position:relative;overflow:hidden;height:102svh;min-height:750px;background:var(--paper);text-align:center}.hero-copy{position:absolute;z-index:3;left:50%;transform:translateX(-50%);top:16.1152%;width:min(1060.8px,calc(76.5vw - 40.8px));perspective:1000px}.hero h1{font-size:81.6px;font-weight:800;line-height:1.5;letter-spacing:-1.7px;white-space:nowrap;margin:0;transition:transform .1s ease-out;transform-style:preserve-3d;background:linear-gradient(90deg,#ffb6c1,#ff99cc,#e6e6fa,#ffb6c1);background-size:200% auto;background-clip:text;-webkit-background-clip:text;color:transparent;animation:gradient-flow 3s linear infinite}.hero h1 span,.section-title,.site-header nav a,.about-resource{background:linear-gradient(90deg,#ff99cc,#99ccff,#ffff99,#cc99ff,#ff99cc);background-size:200% auto;background-clip:text;-webkit-background-clip:text;color:transparent;animation:gradient-flow 3s linear infinite}.hero h1 span{font-weight:950}.hero-name{font-size:25.5px;line-height:30.6px;color:#9ca3af;font-weight:400;margin:6.8px 0 53.54px}.hero-role,.hero-school{font-size:19.125px;line-height:22.95px;font-weight:400;margin:0 auto 15.3px}.hero-school{margin-bottom:0}.ghost{position:absolute;top:50%;width:42.5vw;height:42.5vw;opacity:.3;pointer-events:none;z-index:0;will-change:transform}.ghost img{width:100%;height:100%;object-fit:contain}.ghost-left{left:0;transform:translate(-20%,-50%) rotate(12deg)}.ghost-right{right:0;transform:translate(20%,-50%) rotate(-12deg)}.characters{position:absolute;top:56.1084%;left:50%;transform:translateX(-50%);width:852px;max-width:76.5vw;display:grid;grid-template-columns:repeat(3,1fr);align-items:center;z-index:5}.character{position:relative;background:none;padding:0;isolation:isolate;display:block}.characters>.character{width:100%;height:306px}.character img{object-fit:contain;transition:transform .5s var(--ease),opacity .3s}.characters>.character>img{width:306px;height:306px;max-width:none;margin-left:calc(50% - 153px)}.characters>.character:nth-child(2)>img{width:267.75px;height:267.75px;margin-left:calc(50% - 133.875px)}.characters>.character:nth-child(2){height:267.75px;z-index:2}.characters>.character:hover>img,.characters>.character:focus-visible>img,.characters>.character[aria-expanded="true"]>img{transform:rotate(15deg) scale(1.5)}.characters>.character:nth-child(2):is(:hover,:focus-visible,[aria-expanded="true"])>img{transform:scale(1.5)}.characters>.character:nth-child(3):is(:hover,:focus-visible,[aria-expanded="true"])>img{transform:rotate(-15deg) scale(1.5)}.speech{position:absolute;bottom:calc(100% + 10px);left:50%;transform:translate(-50%,14px);padding:9px 13px;background:white;color:#111;border:1px solid #fce7f3;border-radius:10.2px;box-shadow:var(--shadow);width:165px;max-width:80vw;font-size:13.6px;line-height:1.5;text-align:left;font-weight:500;opacity:0;visibility:hidden;transition:opacity .3s,transform .3s,visibility .3s;pointer-events:none;z-index:9}.speech::after{content:"";position:absolute;top:100%;left:50%;border:7px solid transparent;border-top-color:white}.character:hover .speech,.character:focus-visible .speech,.character[aria-expanded="true"] .speech{opacity:1;visibility:visible;transform:translate(-50%,0)}.scroll-cue{position:absolute;bottom:34px;left:50%;display:grid;place-items:center;width:30px;height:30px;transform:translateX(-50%);z-index:5;color:#4b5563;animation:bounce 1s infinite}.scroll-cue svg{width:20px;height:20px}.falling-layer{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:1;transition:opacity 1s}.falling-head{position:absolute;top:-100px;pointer-events:none;animation:fall linear forwards}.falling-head img{width:100%;height:100%;object-fit:contain}.cursor-sparkle{position:fixed;z-index:100;pointer-events:none;width:15px;height:15px;animation:sparkle .8s linear forwards}.cursor-sparkle svg{width:100%;height:100%;fill:currentColor;stroke:none}.motion-toggle{position:absolute;right:16px;bottom:24px;width:32px;height:32px;display:grid;place-items:center;background:none;color:#64748b;z-index:6;opacity:.7}.motion-toggle svg{width:14px;height:14px}.motion-toggle:hover{opacity:1}
.content-section{width:76.5vw;max-width:1101.6px;margin:0 auto;padding:108.8px 20.4px}.section-title{font-size:47.6px;line-height:71.4px;font-weight:800;letter-spacing:-1.7px;margin:0 0 54.4px;display:inline-block}.about-layout{display:grid;grid-template-columns:1fr 1fr;gap:40.8px;align-items:start}.about-photo-block{min-width:0}.photo-carousel{position:relative;margin:0;overflow:hidden;border-radius:10.2px;background:var(--paper);aspect-ratio:3/4}.photo-carousel>img{width:100%;height:100%;object-fit:cover;object-position:50% 40%}.carousel-controls{position:absolute;top:50%;left:13.6px;right:13.6px;display:flex;align-items:center;justify-content:space-between;transform:translateY(-50%);pointer-events:none}.carousel-arrow{height:34px;width:34px;border-radius:50%;display:grid;place-items:center;background:rgb(255 255 255 / 80%);color:#d56e86;opacity:0;box-shadow:var(--shadow);transition:opacity .3s;pointer-events:auto}.photo-carousel:hover .carousel-arrow,.photo-carousel:focus-within .carousel-arrow{opacity:1}.carousel-arrow:hover{background:var(--paper)}.carousel-arrow svg{height:16px;width:16px}.carousel-dots{display:flex;justify-content:center;gap:3px;margin-top:8px;padding:0}.carousel-dots button{background:none;width:15px;height:22px;padding:2px}.carousel-dots button::after{content:"";display:block;width:10.2px;height:10.2px;border-radius:50%;background:#d1d5db}.carousel-dots button[aria-current="true"]::after{background:var(--accent)}.about-copy{display:flex;flex-direction:column;min-height:680px}.about-copy>p{font-size:17px;line-height:1.625;margin-bottom:20.4px}.tags{display:flex;flex-wrap:wrap;gap:6.8px;margin:10.2px 0 20.4px}.tag{font-size:13.6px;line-height:20.4px;padding:5.1px 10.2px;background:rgb(255 255 255 / 25%);border:1px solid rgb(255 255 255 / 40%);color:#333;border-radius:17px;box-shadow:0 3.4px 5.1px rgb(0 0 0 / 5%);transition:transform .3s,box-shadow .3s}.tag:hover{transform:translateY(-2.55px);box-shadow:0 6.8px 12.75px rgb(255 182 193 / 20%)}.about-resource{display:inline-block;text-decoration:none;font-size:17px;font-weight:700;margin:16px 0 22px;align-self:flex-start}.about-signoff{margin-top:auto;margin-left:auto;margin-right:-27.2px}.about-signoff>.character{width:297.5px;height:297.5px}.about-signoff img{width:100%;height:100%;object-fit:contain}.character-swap .alternate-character{position:absolute;inset:0;opacity:0}.character-swap:is(:hover,:focus-visible,[aria-expanded="true"])>img:first-child{opacity:0}.character-swap:is(:hover,:focus-visible,[aria-expanded="true"])>.alternate-character{opacity:1}.about-signoff .speech,.contact-character .speech{left:auto;right:85%;top:50%;bottom:auto;width:260px;transform:translate(14px,-50%)}.about-signoff .speech::after,.contact-character .speech::after{left:100%;top:50%;border-top-color:transparent;border-left-color:white}.about-signoff .character:is(:hover,:focus-visible,[aria-expanded="true"]) .speech,.contact-character .character:is(:hover,:focus-visible,[aria-expanded="true"]) .speech{transform:translate(0,-50%)}
.portfolio-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:27.2px}.project-card{min-width:0;overflow:hidden;border-radius:10.2px;background:white;box-shadow:var(--shadow);display:flex;flex-direction:column;transition:box-shadow .5s}.project-card:hover{box-shadow:0 20px 25px -5px rgb(0 0 0 / 10%),0 8px 10px -6px rgb(0 0 0 / 10%)}.project-visual{position:relative;aspect-ratio:16/9;overflow:hidden;background:var(--paper);display:block;width:100%;padding:0;text-align:left;text-decoration:none}.project-visual>img{height:100%;width:100%;object-fit:cover;transition:transform .7s}.project-card:hover .project-visual>img{transform:scale(1.05)}.project-cover{display:flex;align-items:center;justify-content:center;height:100%;padding:8px;background:#fff0f5}.project-cover img{width:100%;height:100%;object-fit:contain}.cover-water{background:#eef3ff}.cover-lettuce{background:#f6f5e8}.cover-snail{background:#f4efff}.project-overlay{position:absolute;inset:0;background:rgb(0 0 0 / 20%);display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .3s}.project-overlay>span{display:flex;align-items:center;gap:7px;background:#fff;border:1.7px solid var(--accent);color:#d56e86;border-radius:28px;padding:10px 18px;font-size:13.6px;font-weight:700;transform:translateY(13.6px);transition:transform .3s}.project-overlay svg{height:17px;width:17px}.project-visual:is(:hover,:focus-visible) .project-overlay{opacity:1}.project-visual:is(:hover,:focus-visible) .project-overlay>span{transform:none}.project-body{padding:20.4px;display:flex;flex-direction:column;flex:1}.project-body h3{font-size:17px;line-height:23.8px;color:var(--accent);margin:0 0 22px;font-weight:800}.project-body>p{font-size:13.6px;line-height:20.4px;margin:0 0 13.6px;color:#4b5563}.project-body .tags{margin:auto 0 0;gap:6.8px}.project-body .tag{font-size:11.9px;padding:3.4px 10.2px;line-height:17px}.project-link{background:none;color:#b94e70;text-align:left;text-decoration:underline;font-size:11.9px;padding:0;min-height:29px;align-self:flex-start;margin-top:10px}.project-link:hover{color:#263dff}.play-icon{display:none}
.contact-card{position:relative;padding:27.2px;min-height:333px;border-radius:10.2px;box-shadow:var(--shadow);background:white;overflow:visible}.contact-copy{position:relative;z-index:2;max-width:70%}.contact-link{display:flex;align-items:flex-start;gap:13.6px;text-decoration:none;min-height:61.2px;margin-bottom:0;font-size:13.6px}.contact-link strong{display:block;font-weight:700;margin-bottom:3.4px}.contact-link small{color:#4b5563;display:block;font-size:13.6px;line-height:20.4px}.contact-icon{width:40.8px;height:40.8px;border-radius:50%;background:rgb(255 182 193 / 20%);color:#e497a8;display:grid;place-items:center;flex:none}.contact-icon svg{height:18px;width:18px}.contact-link:hover small{color:#b94e70}.follow-links{margin-top:18px}.follow-links h3{font-size:13.6px;margin:0 0 13.6px;font-weight:700}.follow-links>div{display:flex;gap:17px}.follow-links a{height:37.4px;width:37.4px;display:grid;place-items:center;border-radius:50%;background:rgb(255 182 193 / 20%);color:#e497a8}.follow-links a:hover{background:var(--accent);color:white}.follow-links svg{width:17px;height:17px}.contact-character{position:absolute;right:-13.6px;bottom:0;z-index:3}.contact-character>.character{width:297.5px;height:297.5px}.contact-character img{width:100%;height:100%;object-fit:contain}.site-footer{position:relative;text-align:center;background:var(--paper);border-top:1px solid var(--line);padding:34px 100px 20.4px;min-height:147px}.site-footer p{font-size:13.6px;margin:0 0 15px}.site-footer small{font-size:11.9px;color:#4b5563}.footer-character{position:absolute;bottom:6.8px;width:108.8px;height:108.8px}.footer-character img{width:100%;height:100%;object-fit:contain}.footer-left{left:13.6px}.footer-right{right:13.6px}.footer-left .speech{left:100%;top:20%;bottom:auto;transform:translate(12px,0);width:230px}.footer-right .speech{left:auto;right:100%;top:20%;bottom:auto;transform:translate(-12px,0);width:230px}.footer-character .speech::after{display:none}.footer-left:is(:hover,:focus-visible,[aria-expanded="true"]) .speech{transform:translate(12px,-10px)}.footer-right:is(:hover,:focus-visible,[aria-expanded="true"]) .speech{transform:translate(-12px,-10px)}dialog{width:min(760px,calc(100% - 32px));max-height:85svh;border:0;border-radius:12px;padding:44px;box-shadow:0 20px 80px rgb(0 0 0 / 22%);color:#111;overscroll-behavior:contain}dialog::backdrop{background:rgb(0 0 0 / 40%)}dialog h2{font-size:25px;line-height:1.45;margin:0 30px 24px 0;color:#b94e70}dialog p{font-size:14px;line-height:1.9}dialog .source-note{color:#6b7280;font-size:12px}.close-dialog{position:sticky;float:right;top:0;right:0;background:var(--paper);width:40px;height:40px;border-radius:50%;display:grid;place-items:center;margin:-23px -23px 0 0}body:has(dialog[open]){overflow:hidden}
@keyframes gradient-flow{to{background-position:200% 50%}}@keyframes bounce{0%,100%{translate:0 -4px}50%{translate:0 0}}@keyframes fall{0%{transform:translateY(-10vh);opacity:0}10%,90%{opacity:1}100%{transform:translate(20px,115vh);opacity:0}}@keyframes sparkle{0%{transform:scale(0) translate(0,0) rotate(0);opacity:1}100%{transform:scale(1.5) translate(var(--tx),var(--ty)) rotate(180deg);opacity:0}}body.motion-paused *{animation-play-state:paused!important}.motion-paused .falling-layer{display:none}
@media(max-width:1023px){.portfolio-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.hero h1{font-size:clamp(40.8px,8.5vw,81.6px)}.characters{width:72vw}.characters>.character,.characters>.character:nth-child(2){height:24vw}.characters>.character>img,.characters>.character:nth-child(2)>img{height:24vw;width:24vw;margin-left:calc(50% - 12vw)}.about-copy>p{font-size:15.3px}.section-title{font-size:clamp(27.2px,4.25vw,47.6px)}.about-signoff{margin-right:0}.about-signoff>.character{width:230px;height:230px}}
@media(max-width:767px){.site-header{padding:0 max(20.4px,env(safe-area-inset-right)) 0 max(20.4px,env(safe-area-inset-left))}.menu-toggle{display:grid;place-items:center}.site-header nav{display:none;position:absolute;left:0;right:0;top:68px;padding:13.6px 20.4px;background:rgb(255 240 245 / 95%);gap:6px;border-bottom:1px solid var(--line)}.site-header nav.is-open{display:flex;align-items:flex-start;flex-direction:column}.site-header nav a{font-size:15.3px;min-height:29px}.site-header nav .language{margin-top:1px}.hero{min-height:700px;height:102svh}.hero-copy{top:23.677%;width:calc(76.5vw - 40.8px)}.hero h1{font-size:40.8px;line-height:61.2px;white-space:normal;letter-spacing:-1.7px}.hero-name{font-size:20.4px;line-height:27.2px;margin:6.8px 0 62.47px}.hero-role,.hero-school{font-size:15.3px;line-height:24.87px;max-width:193.17px;margin:0 auto 15.3px}.hero-school{max-width:220px;margin-bottom:0}.ghost{width:51vw;height:51vw}.characters{top:72.846%;width:52.57vw;max-width:none;display:flex;justify-content:center;align-items:center}.characters>.character,.characters>.character:nth-child(2){height:23.77vw;width:23.77vw;flex:0 0 23.77vw}.characters>.character:not(:first-child){margin-left:-9.415vw}.characters>.character>img,.characters>.character:nth-child(2)>img{height:23.77vw;width:23.77vw;margin:0}.speech{font-size:12px;max-width:150px;padding:8px 11px;bottom:calc(100% + 7px)}.scroll-cue{bottom:34px}.content-section{padding-top:81.6px;padding-bottom:81.6px}.section-title{font-size:27.2px;line-height:40.8px;margin-bottom:54.4px;letter-spacing:-1.7px}.about-layout{grid-template-columns:1fr;gap:40.8px}.photo-carousel{aspect-ratio:3/4}.about-copy{min-height:0}.about-copy>p{font-size:15.3px;line-height:1.625;margin-bottom:20.4px}.tag{font-size:13.6px;padding:5.1px 10.2px}.tags{gap:6.8px}.about-resource{font-size:15.3px}.about-signoff{margin-right:-27.2px;margin-top:12px}.about-signoff>.character{width:250px;height:250px}.about-signoff .speech{width:180px;left:50%;right:auto;top:0;bottom:auto;transform:translate(-50%,-100%)}.about-signoff .character:is(:hover,:focus-visible,[aria-expanded="true"]) .speech{transform:translate(-50%,-100%)}.about-signoff .speech::after{left:50%;top:100%;border-left-color:transparent;border-top-color:white}.portfolio-grid{grid-template-columns:1fr;gap:27.2px}.project-body{padding:20.4px}.project-body h3{font-size:17px;line-height:23.8px}.project-body>p{font-size:13.6px;line-height:20.4px}.project-body .tag{font-size:11.9px}.project-overlay>span{padding:9px 12px;font-size:12px}.contact-card{padding:27.2px;min-height:540px;overflow:hidden}.contact-copy{max-width:100%}.contact-link{gap:10px;min-height:70px}.contact-link small{font-size:12px;overflow-wrap:anywhere}.contact-link strong{font-size:13.6px}.contact-icon{width:34px;height:34px}.follow-links{margin-top:16px}.contact-character{width:212.5px;height:212.5px;right:-13.6px;bottom:0}.contact-character>.character{width:212.5px;height:212.5px}.contact-character .speech{width:185px;right:15px;left:auto;top:0;transform:translateY(-90%)}.contact-character .character:is(:hover,:focus-visible,[aria-expanded="true"]) .speech{transform:translateY(-100%)}.contact-character .speech::after{left:75%;top:100%;border-left-color:transparent;border-top-color:white}.site-footer{padding:34px 76px 20.4px;min-height:155px;overflow:hidden}.site-footer p{font-size:11.9px}.site-footer small{font-size:10.2px}.footer-character{width:68px;height:68px}.footer-left{left:13.6px}.footer-right{right:13.6px}.footer-character .speech{width:180px;max-width:180px;font-size:11px;top:auto;bottom:100%;left:auto;right:auto}.footer-left .speech{left:0;transform:none}.footer-right .speech{right:0;transform:none}.footer-character:is(:hover,:focus-visible,[aria-expanded="true"]) .speech{transform:translateY(-8px)}dialog{padding:30px 24px}dialog h2{font-size:20px;padding-top:15px}.close-dialog{margin:-16px -10px 0 0}dialog p{font-size:13px}}
@media(max-width:360px){.hero h1{font-size:37px}.hero-role,.hero-school{font-size:14px;line-height:22px}.about-signoff>.character{width:225px;height:225px}.contact-card{padding:22px}.contact-link{gap:8px}.contact-icon{width:29px;height:29px}.contact-icon svg{width:15px;height:15px}.contact-link small{font-size:11px}.site-footer{padding-left:72px;padding-right:72px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}.falling-layer,.cursor-sparkle{display:none}.hero h1{transform:none!important}}
.photo-track{height:100%;display:flex;transition:transform .5s ease-in-out}.photo-track>img{flex:0 0 100%;width:100%;height:100%;object-fit:cover;object-position:50% 40%}
.ghost img{transform:scale(.88);transform-origin:center}
html[lang="zh-CN"] .hero h1 span{display:inline-block;white-space:nowrap}