:root{--paper:#f1eee6;--ink:#303b34;--muted:#7b8075;--red:#a44938;--serif:'Songti SC','STSong','Noto Serif CJK SC',serif}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:20px}body{margin:0;background:var(--paper);color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,'PingFang SC',sans-serif;-webkit-font-smoothing:antialiased}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:2px solid var(--red);outline-offset:7px}.skip{position:fixed;z-index:100;left:20px;top:-70px;padding:12px;background:white;color:#222}.skip:focus{top:20px}.header{position:absolute;top:0;left:0;z-index:10;width:100%;padding:32px 4.5%;display:flex;justify-content:space-between;align-items:center;color:#fff}.brand{display:flex;align-items:center;gap:14px}.brand>span:first-child{font:32px var(--serif);letter-spacing:.18em}.seal{display:grid;place-items:center;background:var(--red);font:17px var(--serif);width:27px;height:29px;border:1px solid #d9a694}.brand-en{padding-left:15px;margin-left:3px;border-left:1px solid #ffffff55;font-size:9px;letter-spacing:2.4px;line-height:1.7}.header nav{display:flex;gap:43px;font-size:12px;letter-spacing:2px}.header nav a{padding:10px 0;border-bottom:1px solid transparent}.header nav a:hover{border-color:#ffffff88}.header nav span{margin-left:14px}.hero{height:100svh;min-height:680px;max-height:1300px;position:relative;overflow:hidden;background:#344c43;color:white}.hero-slides,.hero-slide,.hero-shade{position:absolute;inset:0}.hero-slide{opacity:0;transition:opacity 1.8s ease;overflow:hidden}.hero-slide.active{opacity:1}.hero-slide img{width:100%;height:100%;object-fit:cover;object-position:center 43%;transform:scale(1.02)}.hero-slide.active img{animation:slow-pan 9s ease-out forwards}@keyframes slow-pan{to{transform:scale(1.075)}}.hero-shade{background:linear-gradient(90deg,rgba(13,35,29,.44),rgba(13,35,29,.05) 65%),linear-gradient(0deg,rgba(15,31,26,.6),transparent 40%,transparent 80%,rgba(15,31,26,.35));pointer-events:none}.vertical-note{position:absolute;right:4.5%;top:28%;writing-mode:vertical-rl;font:12px var(--serif);letter-spacing:5px;color:#fff9}.hero-copy{position:absolute;left:8.2%;top:30%;z-index:2}.eyebrow{font-size:10px;letter-spacing:2.7px;font-weight:400;line-height:1.8;color:var(--muted);margin:0 0 25px}.eyebrow.light{color:#fff9;font-size:9px;letter-spacing:3px}h1{font:clamp(46px,4.8vw,82px)/1.42 var(--serif);letter-spacing:.18em;margin:0;position:relative;text-shadow:0 2px 30px #182a2930;font-weight:400}h1 span{padding-left:.7em}.title-dot{display:inline-block;width:9px;height:9px;background:#bd5e45;border-radius:50%;margin:0 0 8px 10px}.hero-caption{font:14px/2.3 var(--serif);letter-spacing:4px;color:#fff9;margin:25px 0}.explore{display:flex;align-items:center;justify-content:space-between;width:157px;font-size:11px;letter-spacing:3px;border-bottom:1px solid #ffffff60;padding:12px 0}.explore span{font-size:20px;transition:transform .3s}.explore:hover span{transform:translateY(5px)}.hero-bottom{position:absolute;bottom:35px;left:4.5%;right:4.5%;display:flex;align-items:center;justify-content:space-between;font-size:10px;letter-spacing:2px}.hero-controls{display:flex;gap:22px;align-items:center}.counter{font-size:13px;letter-spacing:2px;font-variant-numeric:tabular-nums}.counter i{font-style:normal;opacity:.45;font-size:10px;letter-spacing:1px;padding-left:6px}.dots{display:flex;gap:9px}.dots button{padding:7px 0;width:19px;border:0;background:transparent;position:relative}.dots button:after{content:'';display:block;height:2px;background:#ffffff55}.dots button.active:after{background:#fff}.play-button{border:1px solid #ffffff55;border-radius:50%;background:transparent;width:32px;height:32px;display:grid;place-items:center;color:inherit;font-size:11px;letter-spacing:0}.scroll-note span{margin-left:15px}footer{border-top:1px solid #63735a25;display:flex;justify-content:space-between;align-items:center;padding:40px 8.5%;color:#64705f}.footer-name{font:25px var(--serif);letter-spacing:7px;display:flex;align-items:center;gap:15px}.footer-name span{font:8px -apple-system,sans-serif;letter-spacing:2px}footer p{font:12px var(--serif);letter-spacing:3px}.back-top{font-size:10px;letter-spacing:2px}dialog{border:0;padding:50px 70px;background:#17221ef5;max-width:100vw;max-height:100svh;width:100vw;height:100svh;color:white}dialog::backdrop{background:#101b18ed}dialog[open]{display:flex;align-items:center;justify-content:center}dialog img{max-width:85vw;max-height:85svh;object-fit:contain}.close-lightbox{position:absolute;top:23px;right:30px;border:0;background:none;color:white;font-size:12px;letter-spacing:2px;padding:10px}.lightbox-prev,.lightbox-next{position:absolute;top:48%;border:1px solid #fff6;background:transparent;border-radius:50%;width:40px;height:40px;color:white}.lightbox-prev{left:20px}.lightbox-next{right:20px}dialog p{position:absolute;bottom:10px;font-size:11px;letter-spacing:3px}
@media(min-width:1600px){.hero-copy{top:31%}}
@media(max-width:760px){.header{padding:23px 6%}.brand{gap:9px}.brand>span:first-child{font-size:27px}.seal{width:22px;height:25px;font-size:14px}.brand-en{display:none}.header nav{font-size:10px;gap:21px;letter-spacing:1px}.header nav span{display:none}.hero{min-height:700px;max-height:980px}.hero-slide img{object-position:58% center}.hero-shade{background:linear-gradient(0deg,#0d231bd9,transparent 78%),linear-gradient(90deg,#112f292b,transparent)}.hero-copy{left:8%;top:auto;bottom:130px}.eyebrow.light{font-size:7px;letter-spacing:2px;margin-bottom:18px}h1{font-size:45px;line-height:1.45;letter-spacing:7px}.title-dot{height:6px;width:6px}.hero-caption{font-size:12px;line-height:2;margin:17px 0;letter-spacing:3px}.explore{font-size:10px;width:138px}.vertical-note{top:22%;font-size:10px;right:7%}.hero-bottom{bottom:27px;left:7%;right:7%}.scene-label,.scroll-note{display:none}.hero-controls{width:100%;justify-content:space-between;gap:12px}.dots{gap:7px}.dots button{width:16px}footer{padding:28px 8%;flex-wrap:wrap;gap:20px}footer p{order:3;flex-basis:100%;font-size:11px;margin:0}.footer-name{font-size:22px}.footer-name span{font-size:7px}.back-top{font-size:9px}.lightbox-prev{left:6px}.lightbox-next{right:6px}dialog{padding:50px 35px}dialog img{max-width:80vw}.close-lightbox{right:12px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.hero-slide{transition:none}.hero-slide.active img{animation:none}.work-card{transition:none}}

/* A continuous cylindrical gallery: equal panels, one shared horizontal axis. */
.gallery{--gallery-text:#e8e2ce;--gallery-muted:#b8baa5;position:relative;padding:92px 0 50px;background:radial-gradient(ellipse at 50% 52%,#30423a 0%,#1c2d26 45%,#14231e 100%);color:var(--gallery-text);overflow:hidden}
.gallery-heading{max-width:1440px;margin:0 auto 10px;padding:0 8%;display:flex;align-items:flex-end;justify-content:space-between;gap:30px}
.gallery .eyebrow{color:#b6bb9e;font-size:10px;letter-spacing:2.8px;margin:0 0 18px}
.gallery h2{font:clamp(27px,3vw,43px)/1.6 var(--serif);font-weight:400;letter-spacing:4px;margin:0}.gallery h2 span{color:#aeb79f}
.gallery-intro{color:#b3b9a6;font:12px/2.2 var(--serif);letter-spacing:1.7px;margin:0 0 8px}
.gallery-stage{position:relative;height:clamp(470px,36vw,610px);margin:0 auto;isolation:isolate;overflow:hidden}
.gallery-ambience{position:absolute;inset:15% 10% 0;background:radial-gradient(ellipse at 50% 70%,#acb18712,transparent 67%);pointer-events:none}
.work-track{position:absolute;inset:0;z-index:1;perspective-origin:50% 50%;transform-style:preserve-3d;touch-action:pan-y;cursor:grab;outline-offset:-5px}
.work-track:active{cursor:grabbing}
.gallery-stage:before,.gallery-stage:after{content:'';position:absolute;top:0;bottom:0;width:5.5%;z-index:100;pointer-events:none}.gallery-stage:before{left:0;background:linear-gradient(90deg,#17261feb,transparent)}.gallery-stage:after{right:0;background:linear-gradient(-90deg,#17261feb,transparent)}
.flow-card{position:absolute;left:50%;top:50%;width:clamp(118px,8.2vw,168px);aspect-ratio:3/5;height:auto;padding:0;border:1px solid #c1ae7899;border-radius:6px;background:#18271f;color:#eee7d5;box-shadow:0 18px 28px #0004;will-change:transform;transform-origin:center;backface-visibility:hidden;cursor:pointer;overflow:hidden;user-select:none;-webkit-user-select:none}
.flow-card img{width:100%;height:100%;position:absolute;inset:0;display:block;object-fit:cover;object-position:50% 50%;pointer-events:none}
.flow-card:hover,.flow-card:focus-visible{border-color:#e5d29d;box-shadow:0 20px 40px #0008,0 0 0 1px #e5d29d55}
.flow-number{position:absolute;left:9px;top:9px;background:#132019aa;color:#eee5cb;font:10px Georgia,serif;padding:4px 5px;border:1px solid #c3b78355;line-height:1}
.flow-detail{position:absolute;bottom:0;left:0;right:0;display:flex;flex-direction:column;align-items:stretch;justify-content:flex-end;gap:5px;min-height:72px;padding:24px 10px 10px;background:linear-gradient(0deg,#102018ed,#10201865 72%,transparent);text-align:left;pointer-events:none}
.flow-detail span:first-child{font:7px/1.2 Georgia,serif;letter-spacing:1.2px;color:#e0dbc5;white-space:nowrap}
.flow-detail span:last-child{display:flex;justify-content:space-between;align-items:center;font:12px/1.3 var(--serif);letter-spacing:1px;white-space:nowrap}.flow-detail i{font:13px/1 Georgia,serif}
.flow-hint{position:absolute;z-index:110;bottom:12px;left:0;right:0;text-align:center;font:10px var(--serif);letter-spacing:4px;color:#b5b99c80;pointer-events:none}
.gallery-bottom{margin:8px auto 0;padding:16px 0 0;border-top:1px solid #c8c39a30;max-width:1100px;width:84%;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:24px}
.work-info .eyebrow{display:block;font-size:9px;line-height:1.4;margin:0 0 8px}.work-info p{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 16px;font:20px/1.4 var(--serif);font-variant-numeric:tabular-nums;margin:0;letter-spacing:2px}.work-info p span{font:10px/1.5 -apple-system,sans-serif;color:#afb69e;letter-spacing:1px;margin:0;white-space:nowrap}
.work-controls{display:flex;align-items:center;gap:12px}.gallery .counter{font:italic 21px/1.4 Georgia,serif;font-variant-numeric:tabular-nums;min-width:70px;color:#d2bc83;white-space:nowrap;margin-right:12px}.gallery .counter i{font-size:13px}
.gallery-arrow{position:static;flex:0 0 40px;width:40px;height:40px;border-radius:50%;border:1px solid #c7c29e65;background:transparent;color:#e8e2ce;font-size:20px}.gallery-arrow:hover,.flow-toggle:hover{background:#c7c29e18;border-color:#d2bc83}
.flow-toggle{min-width:88px;padding:11px 16px;border:1px solid #c7c29e65;border-radius:30px;background:transparent;color:#e8e2ce;font-size:10px;letter-spacing:1px;white-space:nowrap}
.thumbs{display:flex;justify-content:flex-start;gap:11px;max-width:1100px;width:84%;margin:20px auto 0;padding:4px 0 12px;overflow-x:auto;scrollbar-color:#b9b28e50 transparent;scrollbar-width:thin}.thumbs button{flex:0 0 32px;width:32px;height:44px;padding:3px;background:none;border:1px solid transparent;opacity:.38;transition:opacity .25s}.thumbs button.active{opacity:1;border-color:#d2bc83}.thumbs button:hover{opacity:1}.thumbs img{height:100%;width:100%;object-fit:contain}
@media(min-width:1600px){.gallery-stage{height:660px}}
@media(max-width:760px){.gallery{padding:60px 0 36px}.gallery-heading{padding:0 8%;display:block;margin:0}.gallery .eyebrow{font-size:8px;letter-spacing:2px;margin-bottom:12px}.gallery h2{font-size:27px;letter-spacing:2px}.gallery-intro{font-size:11px;line-height:2;margin:16px 0 0;letter-spacing:1px}.gallery-stage{height:450px;margin-top:8px}.flow-card{width:128px;height:auto}.flow-detail span:first-child{font-size:7px}.flow-detail span:last-child{font-size:12px}.gallery-stage:before,.gallery-stage:after{width:5%}.flow-hint{bottom:10px;font-size:9px;letter-spacing:3px}.gallery-bottom{width:84%;margin-top:8px;padding-top:14px;display:block}.work-info p{font-size:20px}.work-info p span{margin:0;font-size:9px;letter-spacing:0}.work-controls{margin-top:16px;justify-content:flex-end;gap:12px}.gallery .counter{margin-right:auto;font-size:21px}.gallery-arrow{width:36px;height:36px;flex-basis:36px;font-size:18px}.flow-toggle{padding:10px 13px;font-size:10px;min-width:82px}.thumbs{width:84%;justify-content:flex-start;margin-top:18px;gap:9px}.thumbs button{flex-basis:29px;width:29px;height:40px}}


