.portfolio-experience{color:#e8e9ea;height:100dvh;font-family:var(--font-sans),Arial,"Microsoft YaHei",sans-serif;--muted:#92969c;--rail-speed:0;background:#08090a;position:fixed;inset:0;overflow:hidden}.portfolio-experience button{color:inherit;cursor:pointer;background:0 0;border:0;font-family:inherit;font-size:14px}:is(.portfolio-experience button:focus-visible,.portfolio-experience a:focus-visible){outline-offset:7px;outline:2px solid #d5e0eb}.portfolio-experience .exp-nav{z-index:80;-webkit-backdrop-filter:none;backdrop-filter:none;background:linear-gradient(#08090af2,#08090a33);border:0;height:64px;padding:0 3vw;font-size:13px;inset:0 0 auto}.exp-nav>div{align-items:center;gap:28px}.exp-nav .brand{letter-spacing:-.09em;font-size:23px;font-weight:800}.exp-nav button{letter-spacing:.06em;font-size:13px;font-weight:450}.exp-nav .index-toggle{border:1px solid #ffffff30;border-radius:24px;padding:10px 18px}.exp-viewport{touch-action:none;isolation:isolate;width:100%;height:100%;overflow:hidden;scroll-behavior:auto!important}.exp-track{align-items:stretch;width:max-content;height:100%;display:flex}.rail-chapter{flex:none;height:100%;display:flex}.rail-cell{contain:layout style;flex:none;height:100%;margin:0;position:relative;overflow:hidden}.hero-cell{width:100vw}.exp-viewport:after{content:"";z-index:2;pointer-events:none;background:radial-gradient(ellipse 280px 170px at var(--drag-x,50%) var(--drag-y,50%),#c2d3e212,transparent 75%);mix-blend-mode:screen;opacity:0;transition:opacity .65s;position:fixed;inset:0}.exp-viewport.rail-dragging:after{opacity:1}.portfolio-experience .hero-sequence{height:100%;min-height:0;padding:0;display:block}.portfolio-experience .sequence-stage{height:100%;min-height:0;inset:0}.portfolio-experience .sequence-video{filter:saturate(.78)brightness(.88);transition:opacity .35s,visibility .35s;transform:none}.portfolio-experience .hero-identity{width:auto;max-width:48vw;right:5vw}.portfolio-experience .hero-identity h1{font-size:clamp(35px,4.5vw,90px)}.portfolio-experience .hero-identity p{letter-spacing:.1em;font-size:13px;line-height:1.9}.portfolio-experience .hero-identity button{letter-spacing:.1em;padding-bottom:10px;font-size:13px}.portfolio-experience .sequence-grade{background:linear-gradient(#0000 74%,#08090acc),linear-gradient(90deg,#08090a35,#0000 35% 65%,#08090a45)}.portfolio-experience .orbit-project{grid-template-columns:45px 1fr;column-gap:12px;width:23vw;max-width:360px}.portfolio-experience .orbit-project:nth-child(n+8){grid-template-columns:1fr 45px}.portfolio-experience .orbit-project span{font-size:12px}.portfolio-experience .orbit-project strong{letter-spacing:-.01em;font-size:clamp(14px,1.2vw,23px);font-weight:500;line-height:1.12}.portfolio-experience .orbit-project small{color:#d0d1d7aa;font-size:12px;line-height:1.7}.portfolio-experience .phase-piano .orbit-project{opacity:.9}.portfolio-experience .orbit-project:hover strong{color:#fff;transform:translate(5px)}.orbit-project strong{transition:transform .5s cubic-bezier(.2,.8,.2,1)}.piano-explore,.film-skip{z-index:20;letter-spacing:.12em;text-align:center;white-space:nowrap;position:absolute;bottom:100px;left:50%;transform:translate(-50%)}.piano-explore span{color:#bbbec2;letter-spacing:.1em;margin-top:10px;font-size:12px;display:block}.film-skip{bottom:110px}.chapter-intro{background:#0b0c0e;grid-template-columns:58% 42%;gap:0;width:100vw;padding:100px 4vw 110px;display:grid}.chapter-cover{background:#0b0c0e;align-self:center;height:100%;position:relative;overflow:hidden}.rail-image{will-change:transform;transform-origin:50%;-webkit-backface-visibility:hidden;backface-visibility:hidden;width:100%;height:100%}.rail-image img,.rail-image video{object-fit:contain;-webkit-user-select:none;user-select:none;width:100%;height:100%}.chapter-cover .rail-image img,.chapter-cover .rail-image video{object-fit:cover}.chapter-cover:after{content:"";pointer-events:none;position:absolute;inset:0;box-shadow:inset -80px 0 90px -75px #0b0c0e}.chapter-caption{flex-direction:column;justify-content:center;min-height:0;padding:3vh 0 1vh 4vw;display:flex;position:relative}.chapter-kicker{letter-spacing:.14em;color:#8e949e;margin:0 0 24px;font-size:12px}.chapter-kicker span{margin-left:26px}.chapter-caption h2{text-transform:uppercase;letter-spacing:-.055em;overflow-wrap:anywhere;margin:0 0 14px;font-size:clamp(32px,4.7vw,88px);font-weight:650;line-height:.98}.chapter-caption h3{letter-spacing:.08em;margin:0 0 10px;font-size:20px;font-weight:300}.chapter-role{color:#90969d;margin:0 0 20px;font-size:13px}.chapter-description{overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#484b50 transparent;max-height:30vh;padding-right:10px;overflow:auto}.chapter-description p{color:#b8bcc2;margin:0 0 18px;font-size:16px;font-weight:350;line-height:1.6}.chapter-description p[lang=zh-CN]{color:#969ba3;font-size:15px;line-height:1.9}.chapter-caption>a{letter-spacing:.08em;border-bottom:1px solid #92969c60;align-self:start;margin-top:20px;padding-bottom:8px;font-size:13px}.chapter-caption>a span{letter-spacing:.02em;color:#8e949e;margin-top:6px;font-size:12px;display:block}.chapter-caption>*{opacity:0;transition:opacity .85s,translate 1.1s cubic-bezier(.16,1,.3,1);translate:0 32px}.cell-visible .chapter-caption>*{opacity:1;translate:0}.chapter-caption h2{transition-delay:70ms}.chapter-caption h3{transition-delay:.12s}.chapter-description{transition-delay:.17s}.chapter-caption>a{transition-delay:.23s}.media-cell{background:#08090a;flex-direction:column;justify-content:center;width:88vw;padding:100px 3vw 110px;display:flex}.media-window{isolation:isolate;clip-path:inset(5%);opacity:.55;background:#0c0d0e;height:calc(100% - 42px);transition:clip-path 1.05s cubic-bezier(.16,1,.3,1),opacity .9s;position:relative;overflow:hidden}.cell-visible .media-window{clip-path:inset(0);opacity:1}.media-window:after{content:"";pointer-events:none;opacity:calc(var(--rail-speed)*.22);mix-blend-mode:screen;background:linear-gradient(110deg,#0000 30%,#b3c5d033,#0000 62%);position:absolute;inset:0}.media-cell figcaption{color:#a9adb4;letter-spacing:.02em;justify-content:space-between;padding-top:20px;font-size:13px;display:flex}.media-cell figcaption small{color:#676d76;margin-left:16px;font-size:12px}.image-zoom{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);opacity:0;border-radius:24px;padding:10px 18px;transition:opacity .3s;position:absolute;bottom:18px;right:18px;background:#090a0abf!important;border:1px solid #fff3!important;font-size:12px!important}.media-window:hover .image-zoom{opacity:1}.image-zoom:focus-visible{opacity:1}.rail-dragging .image-zoom{pointer-events:none}.exp-dock{z-index:80;-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px);background:#090a0bb8;border:1px solid #ffffff20;border-radius:30px;justify-content:space-between;align-items:center;gap:20px;height:48px;padding:0 22px;display:flex;position:fixed;bottom:22px;left:3vw;right:200px;box-shadow:0 6px 30px #0003}.exp-dock>div{align-items:center;gap:16px;display:flex}.exp-dock button{white-space:nowrap;letter-spacing:.05em;font-size:12px}.dock-current{color:#b2b6bf;text-overflow:ellipsis;white-space:nowrap;font-size:12px;overflow:hidden}.ambient-control{z-index:90!important;bottom:23px!important;right:3vw!important}.exp-index{z-index:85;-webkit-backdrop-filter:blur(28px);backdrop-filter:blur(28px);overscroll-behavior:contain;opacity:0;visibility:hidden;transform-origin:100% 0;scrollbar-width:thin;background:#111316f5;border:1px solid #ffffff20;border-radius:18px;width:min(510px,94vw);padding:24px;transition:opacity .25s,transform .45s cubic-bezier(.2,.8,.2,1),visibility .3s;position:fixed;top:76px;bottom:90px;right:3vw;overflow:auto;transform:translateY(-14px)scale(.97)}.index-open{opacity:1;visibility:visible;transform:none}.exp-index>p{letter-spacing:.1em;color:#999da4;margin:0 0 14px;font-size:12px}.exp-index>button{text-align:left;border-bottom:1px solid #ffffff12;grid-template-columns:26px 1fr 42px;align-items:center;gap:16px;width:100%;padding:13px 0;display:grid}.exp-index strong{font-size:17px;font-weight:450;line-height:1.15}.exp-index small{color:#9196a0;margin-top:6px;font-size:12px;font-weight:300;display:block}.exp-index span,.exp-index time{color:#747a83;font-size:12px}.exp-index button:hover,.exp-index button[aria-current=true]{color:#fff;background:#ffffff08}.exp-index button[aria-current=true] strong{font-weight:750}.contact-cell{background:#0b0c0e;grid-template-columns:1fr 1.2fr;gap:9vw;width:100vw;padding:110px 6vw 112px;display:grid}.contact-summary{scrollbar-width:thin;min-height:0;overflow:auto}.contact-summary h2{letter-spacing:-.075em;margin:30px 0;font-size:clamp(70px,11vw,180px);font-weight:250;line-height:.78}.contact-summary h2 b{font-weight:750}.contact-summary h3{font-size:23px;font-weight:350}.contact-summary>p:not(.chapter-kicker){color:#b0b6bf;font-size:13px;line-height:1.8}.contact-summary .contact-bio{max-width:430px;font-size:16px!important}.contact-summary>a{margin-top:20px;font-size:18px;display:block}.contact-timeline{overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#42464d transparent;touch-action:pan-y;height:100%;padding-right:16px;overflow:auto}.contact-timeline article{border-top:1px solid #ffffff14;grid-template-columns:115px 1fr;gap:22px;padding:22px 0;display:grid}.contact-timeline time{color:#848b95;font-size:12px}.contact-timeline h3{letter-spacing:-.03em;margin:0 0 9px;font-size:26px;font-weight:450}.contact-timeline p{color:#9fa4ad;margin:0 0 6px;font-size:13px;line-height:1.6}.contact-timeline b{color:#d0d3d8;font-weight:600}.contact-timeline small{color:#7c828c;font-size:12px}.exp-detail{z-index:60;overscroll-behavior:contain;background:#08090a;height:100dvh;padding-bottom:110px;animation:.65s cubic-bezier(.16,1,.3,1) detail-arrive;inset:0;overflow:hidden auto;position:fixed!important}.exp-detail .project-hero{padding-top:130px}.exp-detail .project-story p{font-size:16px;line-height:1.8}.exp-detail .gallery-item{opacity:1!important;filter:none!important;clip-path:none!important;transform:none!important}.detail-image{width:100%;padding:0;display:block}.detail-next{letter-spacing:-.03em;margin:40px auto;font-weight:600;display:block;font-size:clamp(24px,5vw,80px)!important}.exp-zoom{color:#fff;overscroll-behavior:contain;background:#08090a;border:0;width:100vw;max-width:none;height:100dvh;max-height:none;margin:0;padding:70px 3vw 40px;position:fixed;inset:0;overflow:auto}.exp-zoom::backdrop{background:#000e}.exp-zoom img{width:100%;max-width:2400px;height:auto;margin:auto}.exp-zoom .zoom-close{z-index:2;background:#111e;border:1px solid #fff5;border-radius:28px;padding:12px 20px;position:fixed;top:16px;right:24px}.exp-detail:focus{outline:none}@keyframes detail-arrive{0%{opacity:0;filter:blur(8px);transform:translate(7vw)}to{opacity:1;filter:none;transform:none}}@media (max-width:900px){.portfolio-experience .exp-nav{height:60px;padding:0 18px}.exp-nav>div{gap:16px}.exp-nav button,.exp-nav a{font-size:11px}.exp-nav .index-toggle{padding:8px 12px}.portfolio-experience .hero-identity{max-width:none;inset:auto 7vw 23%}.portfolio-experience .hero-identity h1{font-size:8vw}.portfolio-experience .hero-identity p{font-size:12px}.portfolio-experience .orbit-project{width:39vw;grid-template-columns:1fr!important}.portfolio-experience .orbit-project:nth-child(n+8){text-align:right}.portfolio-experience .orbit-project span{display:none}.portfolio-experience .orbit-project strong,.portfolio-experience .orbit-project small{grid-column:1!important}.portfolio-experience .orbit-project strong{font-size:14px}.portfolio-experience .orbit-project small{font-size:12px}.portfolio-experience .orbit-project:nth-child(-n+7){left:5vw}.portfolio-experience .orbit-project:nth-child(n+8){right:5vw}.piano-explore{bottom:112px;font-size:12px!important}.piano-explore span{font-size:12px}.chapter-intro{grid-template-rows:40% 60%;grid-template-columns:1fr;padding:76px 6vw 104px}.chapter-caption{justify-content:start;padding:20px 0 0}.chapter-caption h2{margin-bottom:7px;font-size:clamp(27px,7vw,50px)}.chapter-caption h3{margin-bottom:7px;font-size:17px}.chapter-kicker{margin-bottom:12px;font-size:12px}.chapter-role{margin-bottom:10px;font-size:12px}.chapter-description{touch-action:pan-y;min-height:0;max-height:13vh}.chapter-description p{font-size:14px;line-height:1.6}.chapter-description p[lang=zh-CN]{font-size:14px}.chapter-caption>a{margin-top:12px;font-size:12px}.chapter-caption>a span{margin-left:12px;display:inline}.media-cell{width:94vw;padding:82px 5vw 110px}.media-cell figcaption{gap:20px;font-size:12px}.media-cell figcaption small{display:none}.image-zoom{opacity:1;padding:9px 12px;bottom:10px;right:10px;font-size:11px!important}.exp-dock{gap:12px;height:42px;padding:0 14px;bottom:70px;left:14px;right:14px}.exp-dock>div{gap:14px}.dock-current,.exp-dock button{font-size:11px}.ambient-control{bottom:14px!important;right:16px!important}.contact-cell{grid-template-rows:42% 58%;grid-template-columns:1fr;gap:24px;padding:84px 6vw 128px}.contact-summary h2{margin:12px 0;font-size:60px;line-height:.9}.contact-summary h2 br{display:none}.contact-summary h3{font-size:16px;display:inline}.contact-summary>p:not(.chapter-kicker){margin:9px 0;font-size:12px}.contact-summary .contact-bio{display:none}.contact-summary>a{margin:10px 18px 0 0;font-size:14px;display:inline-block}.contact-timeline article{grid-template-columns:92px 1fr;gap:12px;padding:16px 0}.contact-timeline h3{font-size:21px}.exp-index{top:72px;bottom:125px;right:14px}.exp-detail .project-hero h1{font-size:12vw}.exp-detail .project-hero{padding-top:100px}.exp-detail .project-gallery{padding-bottom:60px}}@media (max-height:680px) and (min-width:901px){.chapter-intro,.media-cell{padding-top:84px;padding-bottom:92px}.chapter-caption h2{font-size:4vw}.chapter-description{max-height:22vh}.chapter-caption .chapter-kicker{margin-bottom:12px}.chapter-caption>a{margin-top:12px}.portfolio-experience .orbit-project strong{font-size:14px}.contact-cell{padding-top:86px;padding-bottom:94px}}@media (prefers-reduced-motion:reduce){.portfolio-experience *,.portfolio-experience :before,.portfolio-experience :after{transition:none!important;animation:none!important}.chapter-caption>*{opacity:1;translate:none}.media-window{clip-path:none;opacity:1}.rail-image{transform:none!important}}
