:root{font-family:Arial,"PingFang SC","Microsoft YaHei",sans-serif;color:#f5f6ef;background:#171a19;font-synthesis:none;--lime:#ddfa72;--ink:#171a19}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:65px}body{margin:0}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}button,a{-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible{outline:3px solid #7066f2;outline-offset:5px}img{display:block;max-width:100%}h1,h2,h3,p,figure{margin:0}button{color:inherit}button[hidden],a[hidden]{display:none}.skip-link{position:fixed;top:-60px;left:20px;padding:12px;background:var(--lime);color:var(--ink);z-index:100}.skip-link:focus{top:12px}.header{height:82px;padding:0 4vw;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #ffffff2a;background:#171a19;position:relative;z-index:5}.identity{font-weight:700;font-size:19px;display:flex;gap:14px;align-items:center}.identity span,.header-note{font:10px monospace;letter-spacing:1.5px}.header nav{display:flex;gap:32px;font-size:13px}.header sup{font-size:8px;color:var(--lime)}.hero{padding:28px 4vw 0;overflow:hidden;min-height:850px}.hero-label{display:flex;justify-content:space-between;font-size:12px;color:#bfc4bd}.hero-label>span:last-child{font:10px monospace;letter-spacing:2px}.hero-word{font-size:clamp(84px,16.8vw,270px);font-weight:800;letter-spacing:-.08em;line-height:1.1;color:var(--lime);display:flex;justify-content:space-between;padding-right:12px}.hero-word>span{font-weight:400;letter-spacing:-.15em}.hero-body{height:490px;position:relative;display:grid;grid-template-columns:1.1fr 1fr;gap:5vw}.hero-copy{padding:40px 0;z-index:2}.hello{font-size:12px;display:flex;gap:16px;align-items:center;margin-bottom:22px}.hello span{font-size:10px;border:1px solid #777e70;padding:6px 10px;border-radius:30px;color:var(--lime)}h1{font-size:clamp(28px,3.9vw,62px);line-height:1.3;letter-spacing:-.05em;font-weight:600}.hero-context{font-size:13px;color:#c0c4bb;line-height:1.9;margin-top:22px}.round-link{display:inline-flex;align-items:center;gap:24px;font-size:12px;margin-top:30px}.round-link b{display:grid;place-items:center;width:45px;height:45px;border:1px solid #737b69;border-radius:50%;font-size:23px;font-weight:400;transition:background .2s,color .2s,transform .3s}.round-link:hover b{background:var(--lime);color:#171a19;transform:rotate(45deg)}.portrait{position:absolute;right:2vw;top:-20px;width:36%;height:470px;transform:rotate(4deg);overflow:hidden;box-shadow:0 20px 60px #0005}.portrait img{width:100%;height:100%;object-fit:cover;object-position:50% 39%}.portrait figcaption{position:absolute;bottom:0;padding:22px 18px 15px;background:linear-gradient(transparent,#000b);width:100%;font-size:11px;display:flex;justify-content:space-between}.portrait small{font-size:9px}.hero-peek{position:absolute;width:27%;right:25%;bottom:13px;transform:rotate(-9deg);border:5px solid #e9eaf1;box-shadow:0 15px 50px #0007;background:#e9eaf1;z-index:3;transition:transform .45s}.hero-peek:hover{transform:rotate(-3deg) translateY(-10px)}.hero-peek img{width:100%;height:auto}.hero-peek span{color:#171a19;font:9px monospace;display:block;padding:7px}.hero-bottom{display:flex;justify-content:space-between;border-top:1px solid #ffffff26;padding:22px 0;font:10px monospace;color:#aeb4a5;gap:15px}.showcase{position:relative;background:#e5e6ee;color:#20222d}.stage{height:100svh;min-height:640px;position:relative;overflow:hidden;isolation:isolate}.stage-heading{position:absolute;top:34px;left:4vw;right:4vw;display:flex;align-items:center;justify-content:space-between;z-index:4}.stage-heading h2{font-size:14px;font-weight:500}.stage-heading h2 span{margin-left:20px;font-size:11px;color:#777984}.stage-heading>span{font:10px monospace;color:#767783}.stage-watermark{position:absolute;left:3vw;top:21%;font-size:12vw;line-height:.85;letter-spacing:-.07em;font-weight:800;color:#d1d3df;z-index:-1}.stage-copy{position:absolute;left:5vw;top:32%;width:24%;z-index:3}.scene-kicker{font:10px monospace;color:#646676;margin-bottom:22px}.stage-copy h3{font-size:clamp(26px,3.1vw,52px);line-height:1.2;letter-spacing:-.05em}.stage-copy>p:not(.scene-kicker){font-size:12px;line-height:1.8;margin-top:22px;color:#666876}.stage-copy .scene-credit{font-size:10px!important;margin-top:10px!important}.view-image{margin-top:28px;padding:0 0 10px;border:0;border-bottom:1px solid #999eab;background:none;font-size:12px;display:flex;justify-content:space-between;width:130px}.view-image span{font-size:20px}.repo-link{display:block;font-size:11px;margin-top:18px}.media-rig{position:absolute;left:4vw;top:13%;width:92vw;height:73%;transform-origin:50% 50%;z-index:2;will-change:transform}.deck{position:relative;width:100%;height:100%;perspective:1600px;transform-style:preserve-3d}.work-card{position:absolute;inset:0;width:100%;height:100%;padding:0;border:1px solid #fff9;border-radius:14px;background:#eef0f5;box-shadow:0 30px 65px #30384e29;overflow:hidden;transform-origin:8% 112%;visibility:hidden;display:flex;flex-direction:column;backface-visibility:hidden;text-align:left}.work-card.active{visibility:visible;z-index:2}.work-card.leaving{visibility:visible;z-index:3;pointer-events:none}.work-card>img{width:100%;height:calc(100% - 35px);object-fit:contain;flex:1;min-height:0}.card-label{display:flex;align-items:center;justify-content:space-between;padding:10px 18px;font:9px monospace;letter-spacing:1px;color:#646876;background:#fff8;flex-shrink:0;height:35px}.card-label b{font-size:20px;font-weight:400}.craft-chips{position:absolute;top:-40px;left:10%;right:8%;height:70px;display:flex;justify-content:space-around;z-index:-1}.craft-chips span{background:var(--lime);color:#252a1b;border:1px solid #bacd7d;width:65px;height:65px;border-radius:18px;display:grid;place-items:center;font-size:14px;box-shadow:0 6px 20px #474e3820;transform:translateY(70px) rotate(-12deg)}.craft-chips span:nth-child(even){background:#b7b2f2;border-color:#9d95e0;transform:translateY(70px) rotate(12deg)}.mobile-card{background:#a6b5f2;display:block}.mobile-card>img{position:absolute;right:13%;top:6%;height:85%;width:auto;max-width:43%;object-fit:contain;border:6px solid #252837;border-radius:22px;box-shadow:20px 30px 45px #25367640;transform:rotate(7deg)}.mobile-art{position:absolute;left:8%;top:24%;color:#253151;font-size:clamp(28px,5vw,80px);font-weight:800;letter-spacing:-.06em;line-height:.9}.mobile-art small{display:block;font-size:13px;font-weight:400;letter-spacing:0;margin-top:25px}.mobile-card .card-label{position:absolute;bottom:0;left:0;right:0;background:#8c9ddb}.bridge-card{background:#111827}.bridge-card .card-label{background:#242c40;color:#e2e7f5}.stage-footer{position:absolute;bottom:32px;left:4vw;right:4vw;display:flex;align-items:center;justify-content:space-between;gap:20px;z-index:5}.scene-count{font:11px monospace;color:#8e919e;white-space:nowrap}.scene-count b{font-size:24px;font-weight:400;color:#282c39}.scene-nav{display:flex;gap:4px}.scene-nav button{background:transparent;border:0;border-radius:30px;padding:11px 15px;color:#797d89;font-size:11px;transition:background .25s,color .25s}.scene-nav button span{font:9px monospace;margin-right:8px}.scene-nav button[aria-pressed=true]{background:#242735;color:#fff}.scene-nav button:hover{background:#cdd0df;color:#232630}.scroll-hint{font-size:10px;color:#777d8a}.stage-progress{position:absolute;bottom:0;width:100%;height:3px;background:#cdd0dd}.stage-progress i{display:block;width:100%;height:100%;background:#6670b5;transform:scaleX(0);transform-origin:left}.about{padding:80px 6vw 90px;background:#ddfa72;color:#202719;overflow:hidden}.about-top{display:flex;justify-content:space-between;font:10px monospace;letter-spacing:1px;margin-bottom:45px}.about h2{font-size:clamp(36px,6.4vw,100px);line-height:1.2;letter-spacing:-.06em;font-weight:500}.about h2 span{color:#718239}.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:12%;margin-top:70px;align-items:center}.about-visual{height:420px;position:relative;transform:rotate(-4deg);margin-left:6%;width:80%;overflow:hidden}.about-visual img{width:100%;height:100%;object-fit:cover;object-position:center 35%}.about-visual span{position:absolute;bottom:12px;right:15px;color:white;font-size:9px}.about-path{font-size:12px;border-bottom:1px solid #20271935;padding-bottom:20px;margin-bottom:25px}.about-copy>p:not(.about-path){font-size:clamp(16px,1.7vw,26px);line-height:1.8}.about-copy .about-small{font-size:13px!important;color:#5b6a35;margin-top:25px}.about-copy>a{display:flex;justify-content:space-between;border-bottom:1px solid #202719;padding:25px 0 14px;margin-top:15px;font-size:13px}.about-copy>a span{font-size:22px}footer{padding:55px 4vw 24px}.footer-big{display:flex;justify-content:space-between;align-items:center;font-size:clamp(40px,9.5vw,150px);font-weight:700;letter-spacing:-.06em;color:#ddfa72;line-height:1.1;padding-bottom:45px}.footer-big span{font-weight:400}footer>div{display:flex;justify-content:space-between;border-top:1px solid #ffffff25;padding-top:24px;color:#a9afa0;font-size:10px}.image-dialog{width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;border:0;padding:0;background:#151817;color:#eee}.image-dialog::backdrop{background:#151817ed}.dialog-bar{height:70px;padding:0 4vw;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #ffffff30}.dialog-bar h2{font-size:15px;font-weight:400}.dialog-close{background:none;color:#eee;border:1px solid #777;border-radius:30px;padding:10px 20px}.dialog-image{height:calc(100% - 112px);overflow:auto;display:grid;place-items:start center;padding:24px}.dialog-image img{max-width:100%;height:auto;max-height:none}.image-dialog>p{height:42px;padding:12px 4vw;font-size:10px;color:#aaa}body.modal-open{overflow:hidden}.js-motion .showcase{height:620svh}.js-motion .stage{position:sticky;top:0}.js-motion .stage-copy{opacity:0;transform:translateY(24px)}
@media(min-width:1600px){.hero-body{height:570px}.portrait{height:540px}.hero-peek{bottom:30px}}
@media(max-width:900px){.header-note{display:none}.identity span{display:none}.hero{min-height:760px}.hero-body{height:480px}.portrait{width:42%;right:0;height:410px;top:25px}.hero-copy{padding-top:30px}.hero-peek{width:34%;right:23%;bottom:0}.hello{display:block}.hello span{display:inline-block;margin-top:10px}.hero-context{font-size:12px}.hero-bottom>span:nth-child(2){display:none}.stage-copy{width:26%;left:4vw}.stage-copy h3{font-size:29px}.stage-footer{gap:10px}.scroll-hint{display:none}.scene-nav button{padding:10px}.stage-heading h2 span{display:none}.about-visual{height:340px}}
@media(max-width:640px){html{scroll-padding-top:15px}.header{height:68px;padding:0 6vw}.identity{font-size:16px}.header nav{gap:20px;font-size:12px}.hero{padding:22px 6vw 0;min-height:0}.hero-label{font-size:11px}.hero-label>span:last-child{display:none}.hero-word{font-size:18vw;padding:8px 0 20px}.hero-body{height:640px;display:block}.hero-copy{padding:0;position:relative}.hello{margin-bottom:15px;font-size:11px;display:flex;gap:10px}.hello span{margin:0;font-size:9px}h1{font-size:32px;line-height:1.35}.hero-context{font-size:11px;margin-top:16px}.round-link{margin-top:15px;gap:15px;font-size:11px}.round-link b{width:35px;height:35px;font-size:20px}.portrait{top:290px;right:2%;width:63%;height:320px;transform:rotate(5deg)}.portrait figcaption{font-size:9px;display:block}.portrait small{display:block;margin-top:5px}.hero-peek{width:55%;right:auto;left:0;bottom:30px;border-width:3px;transform:rotate(-10deg)}.hero-peek span{font-size:7px}.hero-bottom{font-size:8px;padding:18px 0}.js-motion .showcase{height:auto}.stage,.js-motion .stage{position:relative;height:790px;min-height:0}.stage-heading{top:28px;left:6vw;right:6vw}.stage-heading h2{font-size:13px}.stage-heading>span{font-size:8px}.stage-watermark{top:95px;left:6vw;font-size:21vw}.media-rig{top:140px;left:5vw;width:90vw;height:320px;transform:none!important}.work-card{border-radius:9px}.card-label{font-size:7px;padding:8px 12px;height:28px}.work-card>img{height:calc(100% - 28px)}.craft-chips{top:-27px;height:50px}.craft-chips span{width:46px;height:46px;border-radius:12px;font-size:11px;transform:translateY(0) rotate(-9deg)!important}.craft-chips span:nth-child(even){transform:translateY(0) rotate(9deg)!important}.stage-copy,.js-motion .stage-copy{left:6vw;top:493px;width:88%;opacity:1!important;transform:none!important}.scene-kicker{font-size:9px;margin-bottom:12px}.stage-copy h3{font-size:28px;line-height:1.2}.stage-copy h3 br{display:none}.stage-copy>p:not(.scene-kicker){font-size:11px;margin-top:12px}.stage-copy .scene-credit{font-size:9px!important;margin-top:5px!important}.view-image{position:absolute;right:0;top:4px;width:90px;font-size:10px;margin:0}.repo-link{font-size:10px;margin-top:12px}.stage-footer{left:6vw;right:6vw;bottom:32px;display:block}.scene-count{display:none}.scene-nav{justify-content:space-between;border-top:1px solid #c1c5d4;padding-top:16px;gap:2px}.scene-nav button{padding:10px 8px;font-size:9px}.scene-nav button span{display:block;margin:0 0 5px;font-size:8px}.stage-progress{display:none}.mobile-card>img{height:85%;right:12%}.mobile-art{font-size:34px;left:7%;top:27%}.mobile-art small{font-size:10px;margin-top:15px}.about{padding:45px 6vw 50px}.about-top{font-size:8px;margin-bottom:30px}.about h2{font-size:38px}.about-grid{gap:28px;margin-top:40px;grid-template-columns:1fr}.about-visual{height:330px;width:75%;margin-left:12%;transform:rotate(-4deg)}.about-copy>p:not(.about-path){font-size:20px}.about-copy .about-small{font-size:12px!important}.about-path{margin-top:10px;font-size:11px}.footer-big{font-size:12vw;padding-bottom:30px}footer{padding:36px 6vw 22px}footer>div{font-size:8px;gap:14px}footer>div>span:nth-child(2){display:none}.dialog-bar{height:60px}.dialog-bar h2{font-size:12px}.dialog-close{font-size:11px;padding:8px 14px}.dialog-image{padding:12px;height:calc(100% - 102px)}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}.js-motion .showcase{height:auto}.js-motion .stage{position:relative}.js-motion .stage-copy{opacity:1;transform:none}.media-rig{transform:translateX(19%) scale(.66)}.craft-chips span{transform:translateY(0)}.craft-chips span:nth-child(even){transform:translateY(0)}}

.arrow{display:inline-block;width:1em;height:1em;vertical-align:-.1em;flex-shrink:0}.hero-word .arrow{width:.76em;height:.76em}.round-link .arrow,.view-image .arrow{width:1em;height:1em}.fallback-gallery{padding:50px 6vw}.fallback-gallery>p{font-size:12px;margin:20px 0}.fallback-gallery figure{margin:30px 0}.fallback-gallery img{width:100%;height:auto;max-height:85vh;object-fit:contain;background:#d1d3df}.fallback-gallery figcaption{font-size:13px;margin-top:12px}

@media(min-width:641px) and (max-height:639px){.js-motion .showcase{height:auto}.js-motion .stage{position:relative;height:640px}.media-rig{transform:translateX(19%) scale(.66)}.js-motion .stage-copy{opacity:1;transform:none}.craft-chips span{transform:translateY(0) rotate(-12deg)}.craft-chips span:nth-child(even){transform:translateY(0) rotate(12deg)}}

/* Cinematic / blue hour — one continuous scene, not a collage. */
:root{--lime:#83cfff;--ink:#050a0e;color:#eef3f8;background:#050a0e}body{background:#050a0e}button:focus-visible,a:focus-visible{outline-color:#91d9ff}.header{height:90px;background:#050a0e;border:0;padding:0 7vw}.identity{font-size:17px;letter-spacing:.04em}.identity span{color:#8a9aa6;font-size:9px}.header nav{gap:38px;font-size:12px}.header-note{color:#9bb7c9;border:1px solid #40515b;border-radius:50px;padding:12px 22px;font-size:9px}.hero{position:relative;isolation:isolate;min-height:730px;height:calc(100svh - 90px);max-height:1000px;padding:26px 7vw 0;margin:0 12px;border-radius:0 0 24px 24px;background:#050a0e;--pointer-x:0px;--pointer-y:0px;--scroll-shift:0px}.hero-atmosphere{position:absolute;inset:0;z-index:-3;overflow:hidden;pointer-events:none}.blue-aura{position:absolute;left:2%;bottom:-30%;width:74%;height:105%;background:radial-gradient(ellipse at 47% 65%,#b4efff 0%,#49bcf3b0 16%,#1379b866 35%,#07253b33 56%,transparent 70%);filter:blur(30px);animation:blue-breathe 9s ease-in-out infinite alternate;transform:translate(var(--pointer-x),var(--pointer-y))}.hero-grid{position:absolute;inset:0;background-image:linear-gradient(#86c9f00a 1px,transparent 1px),linear-gradient(90deg,#86c9f00a 1px,transparent 1px);background-size:58px 58px;mask-image:radial-gradient(ellipse at 37% 80%,black,transparent 65%)}.glass-ray{position:absolute;left:-15%;width:140%;height:120px;top:38%;transform:rotate(31deg);background:linear-gradient(180deg,#a6ddff03,#bce7ff02);border-top:1px solid #b7e6ff13;border-bottom:1px solid #b7e6ff0d}.ray-two{top:74%;height:35px;opacity:.5}.hero-label{position:relative;z-index:4;color:#9aabb8;font:9px monospace;letter-spacing:2px;margin-bottom:26px}.hero-label>span:last-child{font-size:9px;letter-spacing:2px}.hero h1{position:relative;z-index:3;font-size:clamp(42px,5.8vw,94px);line-height:1.24;font-weight:400;letter-spacing:-.065em;max-width:1120px;margin:auto;text-shadow:0 2px 25px #02080c44}.hero h1>span{display:block}.hero h1>span:first-child{margin-left:5%}.hero h1>span:last-child{margin-left:35%;color:#f4f8fc}.portrait{position:absolute;left:3%;right:auto;top:auto;bottom:0;width:56%;height:79%;margin:0;transform:translate3d(var(--pointer-x),calc(var(--scroll-shift) + var(--pointer-y)),0);box-shadow:none;overflow:visible;z-index:1;transition:transform .35s ease-out}.portrait img{width:100%;height:100%;object-fit:contain;object-position:center bottom;mask-image:linear-gradient(to right,transparent 0%,black 13%,black 88%,transparent 100%);filter:saturate(.82)}.portrait figcaption{background:none;font:8px monospace;color:#94adbd;bottom:66px;left:28px;width:auto;padding:0;opacity:.65;writing-mode:vertical-rl}.hero-copy{position:absolute;left:57%;top:40%;width:34%;max-width:430px;z-index:4;padding:0}.hello{display:flex;font-size:16px;gap:14px;margin-bottom:22px;letter-spacing:.08em}.hello span{border-color:#315063;color:#a9c9dc;font-size:9px;letter-spacing:0;padding:5px 9px}.hero-intro{font-size:clamp(22px,2.2vw,34px);line-height:1.55;font-weight:400;letter-spacing:.02em}.hero-context{font-size:12px;line-height:1.9;color:#9eb0be;margin-top:18px}.hero-actions{display:flex;gap:12px;margin-top:28px}.primary-cta,.secondary-cta{display:flex;align-items:center;justify-content:space-between;gap:24px;border-radius:50px;font-size:12px;min-height:50px;padding:5px 7px 5px 24px;transition:transform .25s,box-shadow .25s}.primary-cta{background:#f0f7fc;color:#0b202d;min-width:170px}.primary-cta span{border-radius:50%;background:linear-gradient(135deg,#8edaff,#3c7df1);width:38px;height:38px;display:grid;place-items:center;font-size:21px;color:white}.secondary-cta{border:1px solid #607481;color:#deebf3;padding:5px 22px;min-width:145px}.secondary-cta span{color:#9ec4dc;font-size:18px}.hero-actions a:hover{transform:translateY(-3px);box-shadow:0 7px 30px #66bfff25}.hero-footnote{font-size:10px;line-height:1.9;color:#829aaa;margin-top:30px}.portrait-side{position:absolute;left:5%;bottom:18%;z-index:2;color:#bbddf3;font:9px monospace;letter-spacing:3px;display:flex;flex-direction:column;gap:12px}.portrait-side i{height:60px;border-left:1px solid #a2dbff66;margin-left:3px}.hero-bottom{position:absolute;bottom:0;left:6%;right:6%;z-index:5;border-color:#b5dbf020;font-size:8px;letter-spacing:1px;color:#91aaba;padding:20px 0}.hero-bottom>span:nth-child(2){color:#7892a3}.showcase{background:#070e15;color:#edf4fb}.stage{background:radial-gradient(ellipse at 72% 45%,#15344966,transparent 60%)}.stage-heading h2 span,.stage-heading>span{color:#758c9e}.stage-watermark{color:#0d1d29}.scene-kicker{color:#81bcdf}.stage-copy>p:not(.scene-kicker){color:#91a7b8}.view-image{border-color:#456277}.work-card{border-color:#52789366;background:#101b27;box-shadow:0 30px 80px #0008}.card-label{background:#10202e;color:#a7c3d7}.craft-chips span,.craft-chips span:nth-child(even){background:#132f43;border:1px solid #447696;color:#9edcff;box-shadow:0 0 28px #398bd622}.mobile-card{background:radial-gradient(ellipse at 80% 50%,#28597e,#0d2132)}.mobile-art{color:#a4d4f7}.mobile-card .card-label{background:#0e2638;color:#97bad2}.scene-count,.scroll-hint{color:#7e98ac}.scene-count b{color:#d8eaf6}.scene-nav button{color:#8aa7bc}.scene-nav button[aria-pressed=true]{background:#bedfff;color:#092133}.scene-nav button:hover{background:#23465f;color:#e2f2ff}.stage-progress{background:#142b3d}.stage-progress i{background:#6cbcff}.about{background:radial-gradient(ellipse at 15% 80%,#12364c66,transparent 58%),#090f15;color:#e2edf5;border-top:1px solid #5478912b}.about-top{color:#86a7be}.about h2 span{color:#6da6cb}.about-visual{transform:none;border-radius:8px;filter:saturate(.65);box-shadow:0 0 80px #408cc31a}.about-path{border-color:#4b71874a;color:#a1c7df}.about-copy .about-small{color:#8da6b9}.about-copy>a{border-color:#69879a}.footer-big{color:#a3d6fb;font-weight:400}footer>div{color:#8197a8}.image-dialog{background:#07121c}.image-dialog::backdrop{background:#03080ef2}.fallback-gallery img{background:#10202e}.scene-nav{border-color:#29475d}
@keyframes blue-breathe{from{opacity:.73;scale:1}to{opacity:1;scale:1.045}}
@media(min-width:1600px){.portrait{height:82%}.hero-copy{top:42%}}
@media(max-width:1000px){.hero{min-height:720px}.hero h1{font-size:6.2vw}.hero-copy{left:56%;width:39%;top:38%}.hero-actions{gap:8px}.primary-cta{min-width:145px;padding-left:18px}.secondary-cta{min-width:125px;padding:5px 16px}.portrait{width:62%;left:-3%;height:77%}.hello{display:flex}.hero-intro{font-size:27px}}
@media(max-width:640px){.header{height:74px;padding:0 7vw}.header nav{gap:20px}.hero{height:940px;min-height:0;max-height:none;margin:0 7px;padding:16px 6vw 0;border-radius:0 0 18px 18px}.hero-label{font-size:7px;letter-spacing:1.4px;margin-bottom:26px}.hero h1{font-size:clamp(30px,8.25vw,49px);line-height:1.35;letter-spacing:-.055em;z-index:4}.hero h1>span:first-child{margin-left:0}.hero h1>span:last-child{margin-left:13%}.portrait{left:-12%;width:118%;height:510px;bottom:auto;top:128px;transform:none!important;overflow:hidden;mask-image:linear-gradient(black 70%,transparent 100%)}.portrait img{object-position:center bottom}.portrait figcaption{left:18%;bottom:95px;font-size:7px}.blue-aura{left:-43%;bottom:auto;top:110px;width:180%;height:580px;filter:blur(25px);animation:none}.hero-grid{background-size:38px 38px}.hero-copy{top:auto;bottom:94px;left:7%;width:86%;max-width:none;padding:0;z-index:5}.hello{font-size:14px;gap:12px;margin-bottom:12px}.hello span{display:inline-block;margin:0;font-size:8px}.hero-intro{font-size:22px;line-height:1.5}.hero-intro br{display:none}.hero-context{font-size:11px;line-height:1.8;margin-top:12px}.hero-actions{margin-top:23px;gap:12px}.primary-cta,.secondary-cta{min-height:48px;font-size:11px}.primary-cta{min-width:166px}.secondary-cta{min-width:135px}.hero-footnote{margin-top:19px;font-size:9px}.hero-footnote br{display:none}.hero-bottom{left:7%;right:7%;font-size:7px;letter-spacing:.3px;padding:20px 0;gap:9px}.hero-bottom>span:nth-child(2){display:none}.portrait-side{top:300px;left:7%;bottom:auto;font-size:7px;letter-spacing:2px}.portrait-side i{height:40px}.about-visual{transform:none}.stage{background:radial-gradient(ellipse at 65% 28%,#173b5366,transparent 60%)}.stage-watermark{font-size:20vw}.about h2{font-size:36px}.footer-big{font-size:11vw}.glass-ray{top:28%}.ray-two{top:43%}}
@media(prefers-reduced-motion:reduce){.blue-aura{animation:none}.portrait{transform:none!important}.hero-atmosphere *{transform:none}.glass-ray{display:none}}

/* Mask the photograph itself, not an object-fit letterbox. */
.portrait{left:8%;width:auto;aspect-ratio:1122/1402}.portrait img{max-width:none;object-fit:fill;mask-image:linear-gradient(to bottom,transparent 0%,#000 14%,#000 100%),linear-gradient(to right,transparent 0%,#000 15%,#000 82%,transparent 100%);mask-composite:intersect}.primary-cta .arrow,.secondary-cta .arrow{width:18px;height:18px}.hero-bottom .arrow{transform:rotate(135deg)}
@media(max-width:1000px) and (min-width:641px){.portrait{left:0;width:auto}}
@media(max-width:640px){.portrait{left:50%;width:408px;height:510px;transform:translateX(-50%)!important}.hero-actions{display:flex;flex-wrap:wrap}.primary-cta,.secondary-cta{min-width:0;flex:1;gap:12px}.primary-cta{padding-left:18px}.secondary-cta{padding-left:16px;padding-right:16px}}

/* The approved photograph contains its own light; no synthetic stripe overlay. */
.blue-aura{transform:none}.hero-atmosphere .glass-ray{opacity:.45}.portrait img{filter:none}

/* Each artwork owns its frame ratio; the surrounding stage stays stable. */
.deck{margin-inline:auto;top:50%;transform:translateY(-50%);transition:width .65s cubic-bezier(.22,.68,.3,1),height .65s cubic-bezier(.22,.68,.3,1)}.mobile-card{display:flex;background:#101b27}.mobile-art{display:none}.mobile-card>img{position:static;right:auto;top:auto;width:100%;max-width:100%;height:calc(100% - 35px);min-height:0;object-fit:contain;border:0;border-radius:0;box-shadow:none;transform:none}.mobile-card .card-label{position:static;bottom:auto;left:auto;right:auto}.mobile-card .card-label{font-size:7px;letter-spacing:.15px;padding-inline:8px}.mobile-card .card-label b{font-size:14px}
@media(max-width:640px){.mobile-card>img{height:calc(100% - 28px)}.mobile-card .card-label{font-size:5px;padding-inline:5px}.mobile-card .card-label b{font-size:10px}.deck{transition-duration:.45s}}

.craft-chips{transition:opacity .3s}

/* Pixel-aligned photographic exposure, not a painted white beam. */
.portrait-light{display:none;position:absolute;inset:0;width:100%;height:100%;pointer-events:none;mask-image:linear-gradient(to bottom,transparent 0%,#000 14%,#000 100%),linear-gradient(to right,transparent 0%,#000 15%,#000 82%,transparent 100%);mask-composite:intersect}.interactive-light .portrait>img{filter:brightness(.53) saturate(.78) contrast(1.06)}.interactive-light .portrait-light{display:block}.portrait-light image{filter:brightness(1.22) saturate(.96) sepia(.12)}
@media(prefers-reduced-motion:reduce){.portrait-light{display:none!important}.interactive-light .portrait>img{filter:none}}
@media(max-width:640px){.portrait-light{display:none!important}.interactive-light .portrait>img{filter:none}}

/* The light travels across the whole hero; text/buttons stay above it. */
.scene-light{display:none;position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;overflow:hidden;mix-blend-mode:screen}.interactive-light .scene-light{display:block}.scene-light-band{filter:blur(1.5px)}
@media(prefers-reduced-motion:reduce){.scene-light{display:none!important}}
@media(max-width:640px){.scene-light{display:none!important}}

/* Identical edge matte on ambient and lit photograph; face/hair stay sharp. */
.portrait>img,.portrait-light{mask-image:linear-gradient(to bottom,transparent 0%,#000 13%,#000 92%,transparent 100%),linear-gradient(to right,transparent 0%,#000 22%,#000 78%,transparent 100%),radial-gradient(ellipse 70% 88% at 50% 45%,#000 58%,#000 70%,transparent 100%);mask-composite:intersect;mask-repeat:no-repeat}

/* Subject silhouette, not a feathered rectangular photograph. */
.interactive-light .portrait>img,.interactive-light .portrait-light{mask-image:url("portrait-silhouette.svg"),linear-gradient(to bottom,#000 0%,#000 86%,transparent 100%),linear-gradient(to right,transparent 0%,#000 19%,#000 81%,transparent 100%);mask-size:100% 100%;mask-composite:intersect;mask-repeat:no-repeat}.interactive-light .portrait>img{filter:brightness(.7) saturate(.84) contrast(1.02)}.portrait-light image{filter:brightness(1.07) saturate(.96) sepia(.07)}.blue-aura{background:radial-gradient(ellipse at 45% 55%,#2775a333 0%,#0d385a22 30%,transparent 66%);opacity:.55;animation:none;filter:blur(50px)}.scene-light-band{filter:blur(5px)}

/* Glyph-only response to the same scene light; no text/layout movement. */
.hero h1>span,.hero-intro{position:relative}.text-light-copy{display:none;position:absolute;inset:0;pointer-events:none;color:#fff0d7;white-space:inherit}.interactive-light.hero h1>span,.interactive-light .hero-intro{color:#b8c3cc}.interactive-light .text-light-copy{display:block}.hero h1>span>.text-light-copy{margin:0}

/* Original supplied Agent characters, returning from the reference showcase. */
.craft-chips{left:50%;right:auto;transform:translateX(-50%);height:140px;align-items:flex-end;justify-content:center;gap:0;pointer-events:none}.craft-chips img{width:22%;height:auto;max-height:145px;object-fit:contain;flex-shrink:0;transform:translateY(70px);filter:drop-shadow(0 8px 12px #0005);user-select:none}
@media(max-width:640px){.craft-chips{height:95px}.craft-chips img{max-height:95px;transform:none!important}}
@media(prefers-reduced-motion:reduce){.craft-chips img{transform:none!important}}
@media(min-width:641px) and (max-height:639px){.craft-chips img{transform:none!important}}

@media(min-width:641px) and (min-height:640px) and (prefers-reduced-motion:no-preference){.js-motion .showcase{height:545svh}}

/* The original architectural work comes first, uncropped and at its own ratio. */
.architecture{padding:95px 6vw 0;background:#080f15}.architecture-heading{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:36px}.architecture-heading p{font:9px monospace;letter-spacing:2px;color:#83a7bf;margin-bottom:16px}.architecture-heading h2{font-size:clamp(32px,4vw,64px);font-weight:400;letter-spacing:-.04em}.architecture-heading>span{font:10px monospace;color:#9cb3c2}.architecture-grid{display:grid;grid-template-columns:1fr 1fr;gap:46px 28px}.architecture-card-1{grid-column:1/-1}.architecture-open{display:block;overflow:hidden;border-radius:7px;background:#101b24;outline-offset:6px}.architecture-open img{width:100%;height:auto;display:block;transition:filter .3s}.architecture-open:hover img{filter:brightness(1.04)}.architecture-card figcaption{display:flex;justify-content:space-between;padding-top:15px;font-size:11px;color:#9ab2c4}.architecture-card figcaption>span:last-child{font:9px monospace;color:#65879e}.spatial-transition{padding:100px 0 90px;display:flex;align-items:flex-end;justify-content:space-between;gap:20px;border-bottom:1px solid #49667a33}.spatial-transition>span{font:9px monospace;color:#7895a9;letter-spacing:2px;padding-bottom:10px}.spatial-transition h2{font-size:clamp(30px,4.5vw,70px);font-weight:400;letter-spacing:-.05em;color:#c4d8e7}.spatial-transition>a{font-size:12px;display:flex;gap:25px;align-items:center;padding-bottom:10px}.spatial-transition .arrow{font-size:24px}
@media(max-width:640px){.architecture{padding:50px 6vw 0}.architecture-heading{margin-bottom:25px}.architecture-heading h2{font-size:31px}.architecture-heading>span{font-size:8px}.architecture-heading p{font-size:7px;letter-spacing:1px}.architecture-grid{grid-template-columns:1fr;gap:30px}.architecture-card-1{grid-column:auto}.architecture-card figcaption{font-size:10px;padding-top:10px}.architecture-card figcaption>span:last-child{font-size:8px}.spatial-transition{display:grid;grid-template-columns:1fr auto;padding:65px 0 50px;gap:20px}.spatial-transition>span{grid-column:1/-1;font-size:8px;padding:0}.spatial-transition h2{font-size:30px}.spatial-transition>a{font-size:10px;padding:0;gap:12px}}

/* A small architectural aperture: shadowed planes, a source, then a light spill. */
.spatial-transition{position:relative;isolation:isolate;overflow:hidden}.aperture-scene{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:-1}.spatial-transition>span,.spatial-transition h2,.spatial-transition>a{position:relative;z-index:1}.architecture-open{box-shadow:0 22px 55px #0005;border:1px solid #bac8d013}.craft-chips{height:180px}.craft-chips img{width:30%;max-height:190px;filter:drop-shadow(0 0 1px #b8c9d55c) drop-shadow(0 7px 10px #0005)}
@media(max-width:640px){.craft-chips{height:95px}.craft-chips img{width:22%;max-height:95px}.aperture-scene{opacity:.65}}

/* Overview, nearer facade, then a quieter receding facade — not equal cards. */
.architecture-grid{grid-template-columns:1.12fr .88fr;column-gap:4vw}.architecture-card-3{margin-top:clamp(45px,7vw,100px)}
@media(max-width:640px){.architecture-grid{grid-template-columns:1fr;column-gap:0}.architecture-card-3{margin-top:0}}

.craft-chips{opacity:var(--agent-reveal,1)}

.stage-watermark{opacity:.33}

/* Reference hierarchy: experts belong to the first card, never a detached sibling. */
.work-card[data-scene="0"]{overflow:visible;transform-style:preserve-3d}.work-card[data-scene="0"]>img{border-radius:13px 13px 0 0}.work-card[data-scene="0"]>.card-label{border-radius:0 0 13px 13px}.craft-chips{position:absolute;inset:0;width:100%!important;height:100%;display:block;transform:none;opacity:1;z-index:-1;pointer-events:none}.craft-chips img{position:absolute;top:0;left:10%;width:25%;height:auto;max-height:none;transform:translate3d(-50%,12%,0);transform-origin:50% 90%;opacity:0}.craft-chips img:nth-child(2){left:30%}.craft-chips img:nth-child(3){left:50%}.craft-chips img:nth-child(4){left:70%}.craft-chips img:nth-child(5){left:90%}.deck{transition:width .65s cubic-bezier(.22,.68,.3,1),height .65s cubic-bezier(.22,.68,.3,1),top .65s cubic-bezier(.22,.68,.3,1)}
@media(max-width:640px){.craft-chips{height:100%}.craft-chips img{width:25%;height:auto;max-height:none;transform:translate3d(-50%,-92%,0)!important;opacity:1}}
@media(prefers-reduced-motion:reduce){.craft-chips img{transform:translate3d(-50%,-92%,0)!important;opacity:1}}
@media(min-width:641px) and (max-height:639px){.craft-chips img{transform:translate3d(-50%,-92%,0)!important;opacity:1}}

/* Light is received by surfaces: warm source edges, cool falloff and cast shadows. */
.architecture{background:linear-gradient(115deg,#191a16 0%,#101a23 34%,#080f15 76%)}.architecture-open{border-top-color:#c0ac8188;border-left-color:#b8a47a44;border-right-color:#41647c55;box-shadow:14px 26px 42px #0008,-1px -1px 0 #d7c6a41f}.architecture-open:hover img{filter:none}.stage{background:linear-gradient(125deg,#25251c66,transparent 44%),linear-gradient(90deg,#080f15,#10202b)}.work-card{border-top-color:#c3b08b88;border-left-color:#b6a48044;border-right-color:#456a875c;box-shadow:16px 25px 48px #0009,0 -1px 0 #e4d3b31c}.about{background:linear-gradient(115deg,#292219 0%,#191d1d 38%,#0a1520 80%)}.about h2{color:#e8dfcf}.about-visual{border-top:1px solid #c5ae7a99;border-left:1px solid #ae956744;box-shadow:16px 24px 40px #0008}.about-top{color:#c2b59a}footer{position:relative;isolation:isolate;background:linear-gradient(105deg,#25231c 0%,#111b24 27%,#050a0e 70%)}footer::before{content:"";position:absolute;left:1.7vw;top:15px;width:1px;height:72%;background:linear-gradient(transparent,#d9c69d99 25%,#a5bdcf55 75%,transparent);pointer-events:none}.footer-big{font-size:clamp(30px,6vw,90px);color:#c8d7df;font-weight:400;gap:30px}
@media(max-width:640px){.footer-big{font-size:7vw;gap:15px}.architecture-open{box-shadow:7px 14px 24px #0007}.about h2{font-size:34px}.about-visual{box-shadow:10px 16px 26px #0008}}

/* Let the final UI recede, then leave a measured invitation rather than a hard stop. */
.stage::after{content:"";position:absolute;inset:0;z-index:4;pointer-events:none;background:#050a0e;opacity:var(--stage-dim,0)}footer{padding:105px 6vw 28px}.closing-note{display:block;border:0;padding:0;margin:0 0 30px;color:#e3ddd1}.closing-note h2{font-size:clamp(38px,5vw,76px);font-weight:400;letter-spacing:-.04em;line-height:1.3}.footer-big{font-size:16px;letter-spacing:0;max-width:380px;gap:40px;padding-bottom:65px;color:#a9c1d2}.footer-big .arrow{font-size:28px}footer::before{height:65%;opacity:.6}
@media(min-width:641px) and (min-height:640px) and (prefers-reduced-motion:no-preference){.js-motion .showcase{height:610svh}}
@media(max-width:640px){footer{padding:65px 6vw 24px}.closing-note{margin-bottom:24px}.closing-note h2{font-size:38px}.footer-big{font-size:13px;padding-bottom:48px;max-width:310px}.footer-big .arrow{font-size:23px}}

.about-visual{height:auto;aspect-ratio:1122/1402;max-height:none;max-width:470px;overflow:hidden}.about-visual img{width:100%;height:auto;object-fit:contain;filter:none}

/* UI receives the same upper-left source: a narrow warm reveal and a cool cast shadow. */
.stage{background:linear-gradient(125deg,#24221b55,transparent 44%),linear-gradient(90deg,#080f15,#0c1822)}/* No detached L-shaped backing: the card itself owns the complete boundary. */
.deck::before{content:none}.deck::after{content:"";position:absolute;inset:18px -22px -24px 18px;z-index:-3;pointer-events:none;background:#02070cb3;filter:blur(16px);border-radius:18px}

/* A concise introduction before the work; preserve the full portrait, not a crop. */
@media(min-width:641px){.about{padding-top:60px;padding-bottom:70px}.about-top{margin-bottom:32px}.about-grid{margin-top:38px}.about-visual{width:min(82%,44svh);max-width:440px;height:auto;aspect-ratio:1122/1402}}

/* Real early practice: model light first, drawings as a compact second register. */
.practice{padding:65px 6vw 55px;background:linear-gradient(115deg,#191a16 0%,#0e1821 50%,#080f15 88%)}.practice-heading{margin-bottom:38px}.practice-heading p{font:9px monospace;letter-spacing:2px;color:#b6a987;margin-bottom:15px}.practice-heading h2{font-size:clamp(32px,4.4vw,64px);font-weight:400;letter-spacing:-.04em;line-height:1.25}.practice-heading>span{display:block;margin-top:16px;font-size:11px;color:#91a6b5}.practice-models{display:grid;grid-template-columns:1.7fr .8fr;gap:4vw;align-items:center;max-width:1040px;margin:0 auto}.practice-model-detail{margin-top:48px}.practice-card{min-width:0}.practice-card img{display:block;width:100%;height:auto;filter:none}.practice-card figcaption{font-size:10px;line-height:1.6;color:#a3b4bf;margin-top:12px}.practice-drawings{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4vw;align-items:start;max-width:900px;margin:65px auto 0}.practice-drawings .architecture-open{width:fit-content;margin:0 auto}.practice-drawings img{width:auto;height:auto;max-width:100%;max-height:300px}.practice-drawings figcaption{text-align:center}.practice+.architecture{padding-top:55px}
@media(max-width:640px){.practice{padding:45px 6vw 30px}.practice-heading{margin-bottom:28px}.practice-heading h2{font-size:31px}.practice-heading p{font-size:8px}.practice-heading>span{font-size:10px}.practice-models{grid-template-columns:1fr;gap:28px}.practice-model-detail{width:62%;justify-self:end;margin-top:0}.practice-drawings{gap:14px;margin-top:35px}.practice-drawings img{max-height:210px}.practice-card figcaption{font-size:9px;margin-top:9px}.practice+.architecture{padding-top:35px}}

.architecture-heading .architecture-context{font:12px/1.7 Arial,"PingFang SC","Microsoft YaHei",sans-serif;letter-spacing:0;color:#9aafbe;margin:16px 0 0}

/* Practice photos open complete first; the untouched original is one link away. */
.dialog-original{font-size:11px;color:#bad1df;margin-left:auto;margin-right:24px;white-space:nowrap}.image-dialog.fit-practice .dialog-image{display:flex;align-items:center;justify-content:center;overflow:hidden}.image-dialog.fit-practice .dialog-image img{width:auto;height:auto;max-width:100%;max-height:100%;object-fit:contain}
@media(max-width:640px){.dialog-original{font-size:9px;margin-right:12px}.fit-practice .dialog-bar h2{max-width:45%;font-size:11px}}

/* One career chapter, two explicit provenance groups; no pinned image-by-image waits. */
.render-group-heading{display:flex;justify-content:space-between;align-items:center;margin:0 0 24px;color:#b1c2cd}.render-group-heading h3{font-size:15px;font-weight:400;letter-spacing:.03em}.render-group-heading>span{font:9px monospace;color:#758f9f}.render-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:36px 28px;align-items:start}.render-grid .render-card{grid-column:span 4;margin:0;min-width:0}.render-grid-hanhua .render-card:nth-child(1){grid-column:span 7}.render-grid-hanhua .render-card:nth-child(2){grid-column:span 5;margin-top:65px}.render-grid-hanhua .render-card:nth-child(5){margin-top:24px}.render-group-joint{margin-top:65px;padding-top:30px;border-top:1px solid #7f8c902b}.render-grid-joint .render-card:nth-child(2){margin-top:25px}.render-grid-joint .render-card:nth-child(3){margin-top:45px}
@media(max-width:640px){.render-group-heading{margin-bottom:20px}.render-group-heading h3{font-size:12px}.render-grid{grid-template-columns:1fr;gap:28px}.render-grid .render-card,.render-grid-hanhua .render-card:nth-child(1),.render-grid-hanhua .render-card:nth-child(2){grid-column:auto;margin-top:0}.render-grid-hanhua .render-card:nth-child(5),.render-grid-joint .render-card:nth-child(2),.render-grid-joint .render-card:nth-child(3){margin-top:0}.render-group-joint{margin-top:45px;padding-top:24px}}

/* The image is the occluder; its own scroll motion uncovers the introduction. */
.stage-copy{z-index:1}.media-rig{z-index:2}

@media(min-width:901px){.stage-copy{max-width:360px}}

/* A finite foundation sequence: one image and its caption share the same movement. */
.foundation{padding:0;background:linear-gradient(110deg,#191a17,#0b141d 65%,#080f15)}
.foundation-stage{padding:62px 7vw 35px;position:relative;overflow:hidden}
.foundation .practice-heading{margin:0 0 28px}.foundation .practice-heading h2{font-size:clamp(32px,4vw,58px)}
.foundation-phases{display:flex;gap:24px;margin-top:22px;font-size:11px;color:#82909a}.foundation-phases span{padding-bottom:9px;border-bottom:1px solid transparent}.foundation-phases .current{color:#e0c69e;border-color:#b69a70}
.foundation-frame{display:grid;grid-template-columns:.55fr 1fr;align-items:center;gap:6vw;max-width:1100px;margin:60px auto}.foundation-frame figcaption{margin:0;text-align:left}.foundation-frame figcaption>span{font-size:12px;color:#c3ad8a}.foundation-frame h3{font-size:clamp(22px,2.6vw,38px);font-weight:400;line-height:1.6;margin:16px 0 35px;color:#e5e9e9}.foundation-frame small{font:10px monospace;letter-spacing:2px;color:#8396a3}
.foundation-art{display:block;position:relative;overflow:hidden;aspect-ratio:var(--art-ratio);height:60svh;width:auto;max-width:100%;justify-self:center;border-radius:2px!important;box-shadow:20px 30px 60px #0007;border-top:1px solid #c6ad7955!important}.foundation-art img{width:100%;height:100%;object-fit:contain;max-width:none}.foundation-art.art-cropped img{position:absolute;left:0;top:var(--crop-top);width:100%;height:var(--crop-height);object-fit:fill}
.foundation-nav{display:none;align-items:center;justify-content:space-between;gap:20px;max-width:1100px;margin:20px auto 0}.foundation-nav>div{display:flex;gap:12px}.foundation-nav button{background:none;border:0;color:#8c9da8;font-size:11px;padding:10px}.foundation-nav button[aria-current=true]{color:#f0d2a0;border-bottom:1px solid #b69a70}.foundation-nav button:disabled{opacity:.3;cursor:default}
@media(min-width:761px) and (min-height:640px) and (prefers-reduced-motion:no-preference){.js-motion .foundation{height:430svh}.js-motion .foundation-stage{position:sticky;top:0;height:100svh;padding-top:36px;padding-bottom:20px}.js-motion .foundation .practice-heading{position:relative;z-index:2}.js-motion .foundation .practice-heading p{margin-bottom:8px}.js-motion .foundation .practice-heading h2{font-size:clamp(30px,3.2vw,46px)}.js-motion .foundation-phases{margin-top:14px}.js-motion .foundation-frames{position:relative;height:61svh;max-width:1100px;margin:0 auto}.js-motion .foundation-frame{position:absolute;inset:0;margin:0;will-change:transform,opacity}.js-motion .foundation-art{height:59svh;max-width:100%}.js-motion .foundation-nav{display:flex;margin-top:8px}.js-motion .foundation-frame:not(:first-child){opacity:0}}
@media(max-width:760px){.foundation-stage{padding:45px 6vw}.foundation-frame{display:flex;flex-direction:column;gap:20px;margin:65px auto}.foundation-frame figcaption{width:100%}.foundation-frame h3{font-size:24px;margin:8px 0}.foundation-frame small{display:none}.foundation-art{height:auto;width:min(100%,420px);max-height:none}.foundation-phases{gap:18px;font-size:10px}}
.image-dialog.fit-practice .dialog-image>.modal-crop{position:relative;overflow:hidden;aspect-ratio:var(--art-ratio);height:100%;max-width:100%;width:auto}.image-dialog.fit-practice .dialog-image>.modal-crop img{position:absolute;left:0;top:var(--crop-top);width:100%;height:var(--crop-height);max-width:none;max-height:none;object-fit:fill}.image-dialog.has-crop .dialog-image>img{display:none}
/* Paper sits upright; the model chapter opens into a wider, lower spatial view. */
@media(min-width:761px){.foundation-frame[data-foundation="3"],.foundation-frame[data-foundation="4"]{grid-template-columns:1fr .55fr}.foundation-frame[data-foundation="3"] figcaption,.foundation-frame[data-foundation="4"] figcaption{grid-column:2;grid-row:1}.foundation-frame[data-foundation="3"] .foundation-art,.foundation-frame[data-foundation="4"] .foundation-art{grid-column:1;grid-row:1}.foundation-frame[data-foundation="4"]{grid-template-columns:1.45fr .55fr;gap:4vw}.foundation-frame[data-foundation="4"] .foundation-art{height:auto;width:100%;max-height:59svh}.foundation-frame[data-foundation="4"] h3{font-size:clamp(22px,2.3vw,34px)}}
/* Moving light is received by the mount and cast into space, never painted over the work. */
.foundation-frame{--mount-light:1;--cast-x:18px;--cast-y:24px;--cast-blur:35px;isolation:isolate}.foundation-art{outline:4px solid rgb(185 166 131 / calc(var(--mount-light)*.35));outline-offset:0;box-shadow:-3px -3px 0 rgb(245 218 165 / calc(var(--mount-light)*.65)),var(--cast-x) var(--cast-y) var(--cast-blur) #000b,35px 14px 0 -8px #101b24!important}.foundation-frame:before{content:"";pointer-events:none;position:absolute;inset:8% 2% 8% 36%;z-index:-1;background:linear-gradient(125deg,rgb(181 150 95 / calc(var(--mount-light)*.13)),transparent 50%);border-left:1px solid rgb(210 178 122 / calc(var(--mount-light)*.16));transform:translateX(calc((1 - var(--mount-light))*26px));mask-image:linear-gradient(transparent,#000 18%,#000 75%,transparent)}.foundation-frame[data-foundation="3"]:before,.foundation-frame[data-foundation="4"]:before{inset:8% 36% 8% 0}.foundation-frame[data-foundation="3"] .foundation-art,.foundation-frame[data-foundation="4"] .foundation-art{outline-width:2px}
@media(max-width:760px),(prefers-reduced-motion:reduce){.foundation-frame:before{display:none}}
.foundation-frame{position:relative}@media(min-width:761px) and (min-height:640px) and (prefers-reduced-motion:no-preference){.js-motion .foundation-frame{position:absolute}}@media(min-width:761px){.foundation-frame[data-foundation="4"] .foundation-art{width:min(100%,calc(59svh * 1.3266));height:auto}}
/* Directional upper-left receiver, dark lower-right edges — not a gold outline. */
.foundation-art{outline:none!important;border-top:1px solid rgb(236 211 163 / calc(var(--mount-light)*.65))!important;border-left:1px solid rgb(198 174 132 / calc(var(--mount-light)*.4));border-right:1px solid #08111a!important;border-bottom:1px solid #050c12;box-shadow:-2px -3px 0 rgb(220 197 154 / calc(var(--mount-light)*.28)),var(--cast-x) var(--cast-y) var(--cast-blur) #000b,35px 14px 0 -8px #101b24!important}
/* Shared architectural notation: fine illuminated ticks, generous invisible hit areas. */
.scene-nav{position:relative;border:0;padding-top:0;gap:8px}.scene-nav button,.scene-nav button[aria-pressed=true],.scene-nav button:hover{position:relative;min-height:44px;min-width:44px;border-radius:0;background:transparent;color:#8197a6;padding:17px 12px 12px}.scene-nav button:before{content:"";position:absolute;left:12px;top:7px;width:10px;height:1px;background:#647985;transition:width .25s,background .25s}.scene-nav button[aria-pressed=true]{color:#ecdbc0}.scene-nav button[aria-pressed=true]:before{width:32px;background:#e5c996}.scene-nav button:hover{color:#fff3dc}.scene-nav .stage-progress{position:absolute;left:12px;right:12px;bottom:-5px;width:auto;height:1px;background:#8294a126}.scene-nav .stage-progress i{background:#d1b47b}
.foundation-nav button{position:relative;min-height:44px;min-width:44px;border-bottom:0!important;padding:16px 10px 9px}.foundation-nav>div button:before{content:"";position:absolute;top:8px;left:10px;width:8px;height:1px;background:#687b86;transition:width .25s}.foundation-nav>div button[aria-current=true]:before{width:24px;background:#e5c996}
.dialog-bar{border-bottom:0;position:relative}.dialog-bar:after{content:"";position:absolute;left:4vw;bottom:0;width:48px;height:1px;background:linear-gradient(90deg,#d4bc8e,#8294a100)}.dialog-close{position:relative;border:0;border-radius:0;min-width:72px;min-height:44px;padding:12px 16px;color:#e7ddcc}.dialog-close:before,.dialog-close:after{content:"";position:absolute;width:12px;height:1px;background:#a49b87;top:4px}.dialog-close:before{left:2px}.dialog-close:after{right:2px;top:auto;bottom:4px}.dialog-close:hover{background:#bfa77e12}.dialog-original{display:flex;align-items:center;min-height:44px;color:#b8ada0}.dialog-original:hover{color:#f2dfba}
@media(max-width:640px){.scene-nav{gap:2px}.scene-nav button{padding:16px 8px 10px}.scene-nav button:before{left:8px}.scene-nav button[aria-pressed=true]:before{width:22px}}
/* A shared dark architectural material, with chapter-specific walls and receivers. */
.spatial-room{position:relative;isolation:isolate;--room-light:.65;--room-shift:0px;--room-shadow:45px;--room-pointer:0}.spatial-surface{position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120' viewBox='0 0 120 120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.72' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' opacity='.075' filter='url(%23n)'/%3E%3C/svg%3E");opacity:1}.spatial-surface i{position:absolute;display:block;pointer-events:none}.surface-wall{left:0;top:-60px;bottom:-60px;width:43%;background:linear-gradient(104deg,#6b59452b,#33414b10 80%,#01070c50);border-right:1px solid #c1b39435;box-shadow:var(--room-shadow) 0 85px #0007;transform:translateY(var(--room-shift))}.surface-joint{left:43%;top:12%;width:2px;height:42%;background:linear-gradient(transparent,#ebd7acaa 25%,#7d9eaf55 75%,transparent);opacity:var(--room-light);transform:translateY(calc(var(--room-shift)*-1)) translateX(calc(var(--room-pointer)*12px))}.surface-joint:after{content:"";position:absolute;left:2px;top:0;width:150px;height:100%;background:linear-gradient(90deg,#a38a5729,transparent);clip-path:polygon(0 0,100% 22%,100% 100%,0 86%)}.surface-floor{left:-8%;right:-8%;bottom:-12%;height:35%;background:linear-gradient(170deg,#01080dbb,#13233033);border-top:1px solid #96a9b529;box-shadow:0 -22px 65px #0004;transform:translateY(calc(var(--room-shift)*.5)) skewY(-6deg);transform-origin:left}
.about .surface-wall{width:24%;background:linear-gradient(100deg,#89715638,#243a4220)}.about .surface-joint{left:24%;top:8%;height:70%}.about .surface-floor{bottom:-20%;height:35%}
.foundation-stage .surface-wall{width:18%;background:linear-gradient(105deg,#8872542e,#28343e14)}.foundation-stage .surface-joint{left:18%;height:55%;top:25%}.foundation-stage .surface-floor{bottom:-17%;height:33%}
.architecture .surface-wall{left:auto;right:0;width:25%;border-right:0;border-left:1px solid #96a2a72b;background:linear-gradient(90deg,#050c1255,#3d4b542b);box-shadow:calc(var(--room-shadow)*-1) 0 100px #0005}.architecture .surface-joint{left:75%;top:6%;height:24%}.architecture .surface-floor{height:12%;bottom:-4%}
.stage .surface-wall{width:37%;background:linear-gradient(110deg,#58677122,#11243022);border-color:#92a9b52b}.stage .surface-joint{left:37%;top:15%;height:47%;background:linear-gradient(transparent,#b4c6cf66,#b49b7455,transparent)}.stage .surface-floor{bottom:-17%;height:40%}
footer .surface-wall{width:73%;background:linear-gradient(105deg,#1c303a20,#6a56442c);border-color:#bfa77f55}footer .surface-joint{left:73%;top:2%;height:84%;background:linear-gradient(transparent,#ead5a699,transparent)}footer .surface-floor{height:24%;bottom:-15%}
@media(max-width:760px){.spatial-surface{background-size:100px 100px}.surface-joint:after{width:70px}.surface-wall{box-shadow:20px 0 45px #0005}.surface-floor{opacity:.7}}
/* The cursor is a tiny light source, not an animated ball. Native text selection stays native. */
.light-cursor{position:fixed;left:0;top:0;width:0;height:0;z-index:2147483647;pointer-events:none!important;opacity:0;contain:layout style;visibility:hidden}.light-cursor.visible{opacity:1;visibility:visible}.light-cursor.reading{opacity:0}.light-cursor:before{content:"";position:absolute;left:-2px;top:-2px;width:4px;height:4px;border-radius:50%;background:#e9f6ff;box-shadow:0 0 0 1px #081017,0 0 4px #c4e9ff66}.light-cursor i{position:absolute;left:-7px;top:-7px;width:14px;height:14px;border:1px solid #cae0e766;border-radius:50%;box-shadow:0 0 0 1px #06101777;transition:width .14s,height .14s,left .14s,top .14s,border-color .14s}.light-cursor.on-control i{width:28px;height:28px;left:-14px;top:-14px;border-color:#ead3a3cc}.light-cursor.on-control:before{background:#f4deb1}.light-cursor span{position:absolute;left:20px;top:-9px;white-space:nowrap;font:10px/18px Arial,"PingFang SC",sans-serif;letter-spacing:1px;color:#f4e6cd;text-shadow:0 1px 2px #000,0 0 3px #000;background:#07111bd9;padding:0 5px;border-left:1px solid #ceb88b88;opacity:0}.light-cursor.on-art span{opacity:1}
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){html.cursor-ready:not(.cursor-reading),html.cursor-ready:not(.cursor-reading) *{cursor:none!important}html.cursor-ready.cursor-reading,html.cursor-ready.cursor-reading *{cursor:text!important}}
@media(prefers-reduced-motion:reduce),(hover:none),(pointer:coarse){.light-cursor{display:none!important}.spatial-surface *{transform:none!important}}
.foundation-stage .surface-wall{width:var(--room-source,18%)}.foundation-stage .surface-joint{left:var(--room-source,18%)}.foundation-stage .surface-joint:after{transform:scaleX(var(--room-spill-scale,1));transform-origin:left}.stage .surface-wall{width:var(--room-source,37%)}.stage .surface-joint{left:var(--room-source,37%)}
.spatial-transition .aperture-scene{opacity:calc(.35 + var(--aperture-arrival,1)*.65);transform:translateX(calc((1 - var(--aperture-arrival,1))*-24px))}.light-cursor i{box-shadow:0 0 0 1px #081018b3,inset 0 0 0 1px #08101899}
@media(prefers-reduced-motion:reduce){.spatial-transition .aperture-scene{transform:none;opacity:1}}
/* Keep architectural joints out of the biography's reading plane. */
.about .surface-wall{width:4%}.about .surface-joint{left:4%}.about .surface-floor{bottom:-38%;height:30%;border-top-color:#96a9b515;transform:translateY(calc(var(--room-shift)*.5)) skewY(-3deg)}
.foundation-stage .surface-wall{width:var(--room-source,4%)}.foundation-stage .surface-joint{left:var(--room-source,4%)}
/* Original screenshot, a native viewport only: y44…1242 of 2048×1330. */
.work-card>.interface-viewport{display:block;position:relative;overflow:hidden;flex:1;min-height:0;width:100%;border-radius:13px 13px 0 0}.interface-viewport>img{position:absolute;left:0;top:-3.67278798%;display:block;width:100%;height:111.01836394%;max-width:none;object-fit:fill;filter:none}
.interface-fallback{display:block;position:relative;overflow:hidden;width:100%;aspect-ratio:2048/1198}.image-dialog.fit-interface .dialog-image>.modal-crop{width:min(100%,calc((100dvh - 160px)*1.70951586));height:auto;max-height:none;aspect-ratio:2048/1198}
/* One concise premise stays inside the image-occluded copy group. */
.stage-copy>p.scene-premise{font-size:11px;line-height:1.65;margin:0 0 12px;color:#a9b9c3}.stage-copy>p.scene-premise[hidden]{display:none}
/* Contact paths share the closing wall's fine, warm edges — not separate cards. */
.footer-contacts{display:flex;align-items:center;flex-wrap:wrap;gap:18px 38px;margin:0 0 65px;max-width:780px}.footer-contacts a{display:inline-flex;align-items:center;gap:20px;min-height:44px;padding:8px 0;border-bottom:1px solid #859dad55;color:#b9cbd6;font-size:15px;line-height:1.5;transition:color .18s,border-color .18s}.footer-contacts .arrow{width:18px;height:18px;color:#b5aa91}.footer-contacts a:hover,.footer-contacts a:focus-visible{color:#f1dfbd;border-bottom-color:#d7bb84}.footer-contacts a:hover .arrow,.footer-contacts a:focus-visible .arrow{color:#e4c996}
@media(max-width:640px){.footer-contacts{gap:14px 24px;margin-bottom:48px}.footer-contacts a{font-size:13px;gap:14px}.footer-contacts .arrow{width:16px;height:16px}}
@media(prefers-reduced-motion:reduce){.footer-contacts a{transition:none}}

/* Continuous four-corner frame; directional light is a fine edge, not a cut-off slab. */
.work-card{--frame-radius:14px;border-radius:var(--frame-radius);border:1px solid #738c9b77;border-top-color:#c7b48e88;border-left-color:#a3a59a77;border-right-color:#738d9c77;border-bottom-color:#627e8e77}
.work-card[data-scene="0"]>img,.work-card>.interface-viewport{border-radius:calc(var(--frame-radius) - 1px) calc(var(--frame-radius) - 1px) 0 0}.work-card[data-scene="0"]>.card-label{border-radius:0 0 calc(var(--frame-radius) - 1px) calc(var(--frame-radius) - 1px)}
@media(max-width:640px){.work-card{--frame-radius:9px}}