@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+SC:wght@400;500;600&display=swap');
:root{--ink:#142019;--paper:#eeeadd;--jade:#aebdb1;--gold:#b89967;--red:#98422f;--ease:cubic-bezier(.76,0,.24,1)}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#101713;color:var(--ink);font-family:"Noto Serif SC","Songti SC",serif}button,a{font:inherit;color:inherit}button{cursor:pointer}.opening{position:fixed;z-index:999;inset:0;background:#0d1511;color:var(--paper);display:flex;flex-direction:column;justify-content:center;align-items:center;transition:transform .85s var(--ease)}.opening i{display:grid;place-items:center;width:56px;height:56px;border:1px solid var(--gold);font-style:normal;font-size:25px;color:var(--gold)}.opening b{font-size:clamp(38px,5vw,68px);font-weight:500;letter-spacing:.18em;margin:23px 0 13px;opacity:0;filter:blur(12px);transition:1s}.opening span{width:0;height:1px;background:var(--gold);transition:1s .15s}.opening small{margin-top:18px;letter-spacing:.22em;color:#ffffff80;opacity:0;transition:.8s .25s}.opening.show b,.opening.show small{opacity:1;filter:none}.opening.show span{width:190px}.opening.leave{transform:translateY(-102%)}.topbar{position:fixed;z-index:100;top:0;left:0;right:0;height:84px;padding:0 3vw;color:white;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;border-bottom:1px solid #ffffff27;mix-blend-mode:normal}.logo{display:flex;align-items:center;gap:11px;text-decoration:none;justify-self:start}.logo i,.final-brand i{width:34px;height:34px;border:1px solid;display:grid;place-items:center;font-style:normal}.logo b{font-weight:500;letter-spacing:.12em}.logo small{font:8px Georgia,serif;letter-spacing:.14em;opacity:.6}.chapter-name{font-size:10px;letter-spacing:.18em;color:#ffffff98}.sound-toggle{justify-self:end;border:0;background:none;color:white;display:flex;gap:9px;align-items:center;font-size:9px;letter-spacing:.1em}.sound-toggle i{width:12px;height:12px;background:linear-gradient(90deg,currentColor 1px,transparent 1px) 0 100%/3px 30%,linear-gradient(90deg,currentColor 1px,transparent 1px) 0 100%/3px 70%;opacity:.55}.sound-toggle.on i{animation:bars .65s steps(3) infinite}@keyframes bars{50%{transform:scaleY(.4)}}.experience,.scene{position:fixed;inset:0}.scene{visibility:hidden;pointer-events:none;overflow:hidden;transform:translateY(100%);transition:transform 1s var(--ease),visibility 0s 1s;will-change:transform}.scene.active{visibility:visible;pointer-events:auto;transform:none;transition:transform 1s var(--ease);z-index:3}.scene.before{visibility:visible;transform:translateY(-100%);transition:transform 1s var(--ease),visibility 0s 1s;z-index:2}.scene video{width:100%;height:100%;object-fit:cover}.veil{position:absolute;inset:0;background:linear-gradient(90deg,#0e1611db,transparent 67%),linear-gradient(0deg,#0e16116b,transparent 45%)}.scene-copy{position:absolute;z-index:2}.scene-copy>p:first-child,.pieces-head>p,.craft-panel>p{font:9px Georgia,serif;letter-spacing:.2em;color:#dfc799}.hero-title{left:7vw;top:50%;transform:translateY(-45%)}.hero-title h1,.story-title h2,.pieces-head h2,.craft-panel h2,.ritual-title h2{font-weight:500;letter-spacing:-.065em;line-height:1.06;margin:22px 0}.hero-title h1{font-size:clamp(65px,9vw,130px);color:white}.hero-title h1 span{font-size:.58em;letter-spacing:.13em}.hero-title>small{font-size:12px;color:#ffffffa5}.vertical{position:absolute;right:3vw;top:28%;writing-mode:vertical-rl;color:#ffffff9b;font-size:10px;letter-spacing:.32em}.scene-story{background:var(--paper)}.story-photo{position:absolute;left:0;top:0;bottom:0;width:52%;background:url('ceramics/brand-hero.png') center/cover;clip-path:inset(0 100% 0 0);transition:clip-path 1.2s .15s var(--ease)}.scene-story.active .story-photo{clip-path:inset(0)}.paper-wash{position:absolute;inset:0;background:linear-gradient(90deg,transparent 35%,var(--paper) 57%)}.story-title{left:8vw;top:19vh;color:var(--ink)}.story-title h2{font-size:clamp(42px,5.7vw,82px)}.story-title em,.ritual-title em{font-style:normal;color:var(--red)}.story-note{right:7vw;bottom:11vh;width:min(34vw,470px);background:#f7f3e9e8;padding:27px 31px;border-top:2px solid var(--red)}.story-note>span{font-size:11px;color:var(--red)}.story-note>p{line-height:1.9;color:#56615a}.story-note dl{margin:22px 0 0}.story-note dl div{display:grid;grid-template-columns:70px 1fr;padding:10px 0;border-top:1px solid #14201926}.story-note dt{font-size:9px;color:var(--gold)}.story-note dd{margin:0;font-size:11px}.scene-pieces{background:#0c1410;color:white}.pieces-head{left:6vw;top:15vh}.pieces-head h2{font-size:clamp(42px,5.6vw,78px)}.pieces-head>small{color:#ffffff68;font-size:10px}.piece-strip{position:absolute;z-index:2;left:36vw;right:4vw;top:17vh;bottom:12vh;display:flex;gap:5px}.piece{flex:1;min-width:48px;border:0;padding:0;background:#263129;color:white;overflow:hidden;position:relative;text-align:left;filter:grayscale(1);transition:flex .8s var(--ease),filter .5s}.piece.active{flex:5;filter:none}.piece>i{position:absolute;z-index:3;top:14px;left:14px;font:9px Georgia,serif;color:#ead4a8}.piece-art{position:absolute;inset:0;background-image:linear-gradient(0deg,#0d150fbf,transparent 57%),url('ceramics/product-overview.png');background-size:auto 160%;transition:transform .8s}.piece:hover .piece-art{transform:scale(1.04)}.piece[data-piece=teapot] .piece-art{background-position:44% 0}.piece[data-piece=fair] .piece-art{background-position:10% 53%}.piece[data-piece=cup] .piece-art{background-position:88% 53%}.piece[data-piece=filter] .piece-art{background-position:25% 100%}.piece[data-piece=tray] .piece-art{background-image:linear-gradient(0deg,#0d150fbf,transparent),url('ceramics/lifestyle-grid.png');background-position:20% 100%}.piece>b{position:absolute;z-index:3;left:17px;bottom:19px;font-size:25px;font-weight:500;white-space:nowrap;opacity:0;transform:translateY(12px);transition:.35s .2s}.piece.active>b{opacity:1;transform:none}.piece b small{display:block;font-size:9px;color:#ffffff88;margin-top:7px}.giant-word{position:absolute;left:3vw;bottom:-5vh;font-size:24vw;line-height:.7;color:#ffffff06;display:flex;pointer-events:none}.scene-craft{background:#d8d9cf}.craft-video{position:absolute;inset:0 42% 0 0;overflow:hidden}.craft-video:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 60%,#1017135c)}.craft-panel{right:0;top:0;bottom:0;width:42%;padding:18vh 6vw 11vh;background:#d8d9cf;display:flex;flex-direction:column}.craft-panel>small{color:var(--gold);font-size:10px;letter-spacing:.12em;margin-top:auto}.craft-panel h2{font-size:clamp(48px,6vw,84px);transition:.2s}.craft-description{line-height:2;color:#56615a;min-height:80px;transition:.2s}.switching{opacity:0;transform:translateY(8px)}.craft-tabs{display:flex;flex-direction:column;margin-top:auto}.craft-tabs button{border:0;border-top:1px solid #14201930;background:none;text-align:left;padding:14px 2px;color:#69726c}.craft-tabs button:last-child{border-bottom:1px solid #14201930}.craft-tabs button.active{color:var(--ink);padding-left:13px}.craft-tabs button:after{content:"↗";float:right;color:var(--red);opacity:0}.craft-tabs button.active:after{opacity:1}.scene-ritual{color:white}.end-veil{background:linear-gradient(90deg,#0c130fe0 0,#0c130f92 42%,transparent 73%),linear-gradient(0deg,#0c130f74,transparent 45%)}.ritual-title{left:7vw;top:21vh}.ritual-title h2{font-size:clamp(47px,6.5vw,92px)}.ritual-title>small{color:#ffffff9c}.final-brand{right:5vw;bottom:10vh;display:grid;justify-items:center}.final-brand i{color:#e5c895;border-color:#e5c895;font-style:normal}.final-brand p{font:8px Georgia,serif;letter-spacing:.2em}.final-brand button{margin-top:12px;padding:11px 14px;border:1px solid #ffffff7c;background:#1017138a;color:white;font-size:10px}.final-brand button span{color:var(--gold);margin-left:17px}.scene-nav{position:fixed;z-index:90;right:2.5vw;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:11px}.scene-nav button{width:5px;height:22px;border:0;padding:0;background:#ffffff5c;transition:.35s}.scene-nav button.active{height:48px;background:var(--gold)}.scene-count{position:fixed;z-index:90;left:3vw;bottom:3.5vh;color:white;display:flex;gap:10px;align-items:center;font:9px Georgia,serif}.scene-count i{display:block;width:60px;height:1px;background:#ffffff65}.transport{position:fixed;z-index:90;left:50%;bottom:2.5vh;transform:translateX(-50%);display:flex;align-items:center;color:white;background:#111a15b8;border:1px solid #ffffff29;backdrop-filter:blur(10px)}.transport>button{width:44px;height:44px;border:0;background:none;color:white}.transport>button:disabled{opacity:.25;cursor:default}.transport p{margin:0;padding:0 18px;border-inline:1px solid #ffffff1e;display:flex;gap:17px;align-items:center}.transport p span{font-size:8px;color:#ffffff64;letter-spacing:.12em}.transport p b{font-size:10px;font-weight:400}.transition-curtain{position:fixed;z-index:80;inset:0;pointer-events:none;overflow:hidden}.transition-curtain i{position:absolute;width:110vmax;height:110vmax;border-radius:50%;background:var(--paper);left:50%;top:50%;transform:translate(-50%,-50%) scale(0);opacity:.12}.transition-curtain.flash i{animation:curtain .9s var(--ease)}@keyframes curtain{45%{transform:translate(-50%,-50%) scale(1);opacity:.16}100%{transform:translate(-50%,-50%) scale(1);opacity:0}}
@media(max-width:760px){.topbar{height:67px;padding:0 15px;grid-template-columns:1fr auto}.logo small,.chapter-name{display:none}.sound-toggle span{font-size:0}.sound-toggle span:after{content:"声";font-size:9px}.hero-title{left:18px;right:18px;top:45%}.hero-title h1{font-size:17vw}.hero-title>small{display:block;line-height:1.8;max-width:280px}.vertical{display:none}.story-photo{width:100%;height:47%;bottom:auto}.paper-wash{background:linear-gradient(0deg,var(--paper) 48%,transparent 68%)}.story-title{left:18px;right:18px;top:31vh}.story-title h2{font-size:9.4vw}.story-note{left:18px;right:18px;bottom:8vh;width:auto;padding:18px}.pieces-head{left:18px;top:10vh}.pieces-head h2{font-size:12vw}.pieces-head>small{display:none}.piece-strip{left:13px;right:13px;top:37vh;bottom:10vh;gap:3px}.piece{min-width:25px}.piece.active{flex:7}.piece>b{left:10px;font-size:21px}.craft-video{inset:0 0 48%}.craft-panel{left:0;right:0;top:52%;width:auto;padding:5vh 20px 8vh}.craft-panel>small{margin-top:20px}.craft-panel h2{font-size:11vw;margin:10px 0}.craft-description{font-size:11px;min-height:48px;margin:0}.craft-tabs{margin-top:15px;flex-direction:row}.craft-tabs button{flex:1;border-bottom:1px solid #14201930;text-align:center;padding:10px 2px;font-size:10px}.craft-tabs button.active{padding-left:2px}.ritual-title{left:18px;right:18px;top:16vh}.ritual-title h2{font-size:12vw}.final-brand{right:18px;bottom:10vh}.scene-nav{display:none}.scene-count{left:15px;bottom:2.8vh}.transport{bottom:1.6vh}.transport p{padding:0 10px}.transport p span{display:none}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition-duration:.01ms!important}.opening{display:none}}
.scene-story .story-photo{background-image:url('ceramics/lifestyle-grid.png')!important;background-position:center top!important}.light-ui .topbar{color:var(--ink);border-color:#14201926}.light-ui .chapter-name{color:#14201999}.light-ui .scene-nav button{background:#1420194a}.light-ui .scene-nav button.active{background:var(--red)}
/* V3: cinematic cross-dissolve scenes; no vertical page movement. */
.experience .scene{transform:scale(1.035)!important;opacity:0;transition:opacity .72s ease,transform 1.15s var(--ease),visibility 0s .75s!important}.experience .scene.active{transform:scale(1)!important;opacity:1;transition:opacity .72s ease,transform 1.15s var(--ease)!important}.experience .scene.before{transform:scale(.985)!important;opacity:0}.light-ui .logo{color:white}.light-ui .chapter-name,.light-ui .sound-toggle{color:var(--ink)}
.scene-story .story-photo{background-image:url('ceramics/clean-set-v2.png')!important;background-position:center!important;background-size:cover!important;width:53%!important}.scene-story .paper-wash{background:linear-gradient(90deg,transparent 44%,var(--paper) 55%)!important}.scene-story .story-title{left:auto!important;right:6vw!important;top:17vh!important;width:39vw}.scene-story .story-title h2{font-size:clamp(35px,4.5vw,65px)!important}.scene-story .story-note{right:6vw!important;bottom:9vh!important;width:39vw!important;background:transparent!important;padding:22px 0!important}
.scene-pieces{background:#0c1410 url('ceramics/clean-set-v2.png') right center/68% auto no-repeat!important}.scene-pieces:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#0c1410 0 31%,#0c1410d9 39%,transparent 71%);pointer-events:none}.scene-pieces .pieces-head{z-index:3}.scene-pieces .piece-strip{z-index:4!important;left:35vw!important;right:4vw!important;top:auto!important;bottom:9vh!important;height:105px!important;display:grid!important;grid-template-columns:repeat(5,1fr)!important;gap:2px!important}.scene-pieces .piece{min-width:0!important;filter:none!important;flex:none!important;background:#111a15df!important;border-top:1px solid #ffffff42!important;padding:15px!important}.scene-pieces .piece.active{background:var(--paper)!important;color:var(--ink)!important}.scene-pieces .piece-art{display:none!important}.scene-pieces .piece>b{opacity:1!important;transform:none!important;left:14px!important;bottom:15px!important;font-size:19px!important}.scene-pieces .piece b small{color:inherit!important;opacity:.6}.scene-pieces .piece>i{left:14px!important;top:11px!important}.scene-pieces .piece.active>i{color:var(--red)!important}.scene-pieces .giant-word{display:none!important}
@media(max-width:760px){.scene-story .story-photo{width:100%!important;height:43%!important}.scene-story .paper-wash{background:linear-gradient(0deg,var(--paper) 54%,transparent 67%)!important}.scene-story .story-title{left:18px!important;right:18px!important;top:35vh!important;width:auto!important}.scene-story .story-title h2{font-size:8.8vw!important}.scene-story .story-note{left:18px!important;right:18px!important;bottom:7vh!important;width:auto!important;padding:12px 0!important}.scene-pieces{background-position:center 38%!important;background-size:auto 56%!important}.scene-pieces:after{background:linear-gradient(0deg,#0c1410 0 23%,transparent 48%),linear-gradient(180deg,#0c1410 0 25%,transparent 50%)!important}.scene-pieces .piece-strip{left:12px!important;right:12px!important;bottom:8vh!important;height:94px!important}.scene-pieces .piece{padding:8px!important}.scene-pieces .piece>b{left:7px!important;bottom:12px!important;font-size:13px!important}.scene-pieces .piece b small{display:none!important}.scene-pieces .piece>i{left:7px!important}}
.scene-pieces .piece>b{transition:transform .35s var(--ease),opacity .35s!important}.scene-pieces .piece:hover>b,.scene-pieces .piece:focus>b{transform:translateX(7px)!important}.scene-pieces .piece:hover,.scene-pieces .piece:focus{outline:1px solid var(--gold);outline-offset:-1px}.scene-pieces .piece:after{content:"打开 ↗";position:absolute;z-index:5;right:12px;top:10px;font-size:8px;letter-spacing:.1em;opacity:0;transition:.3s}.scene-pieces .piece:hover:after,.scene-pieces .piece:focus:after{opacity:1}
/* V4: one continuous warm-paper visual system across every chapter. */
html,body{background:var(--paper)!important;color:var(--ink)}
.opening{background:var(--paper)!important;color:var(--ink)!important}.opening small{color:#14201978!important}
.topbar,.light-ui .topbar{color:var(--ink)!important;background:linear-gradient(180deg,#eeeaddf2,#eeeaddc4 72%,transparent)!important;border-color:#14201926!important}.topbar .logo,.light-ui .logo,.topbar .chapter-name,.light-ui .chapter-name,.topbar .sound-toggle,.light-ui .sound-toggle{color:var(--ink)!important}
.scene-hero .veil{background:linear-gradient(90deg,#eeeaddf5 0,#eeeaddd9 25%,#eeeadd4d 55%,transparent 78%),linear-gradient(0deg,#eeeadd4f,transparent 48%)!important}.hero-title h1{color:var(--ink)!important}.hero-title>small,.vertical{color:#1420199c!important}
.scene-pieces{background-color:var(--paper)!important;background-image:url('ceramics/clean-set-v2.png')!important;color:var(--ink)!important}.scene-pieces:after{background:linear-gradient(90deg,var(--paper) 0 29%,#eeeadddc 39%,transparent 72%),linear-gradient(0deg,#eeeadd6e,transparent 48%)!important}.pieces-head>small{color:#14201978!important}.scene-pieces .piece{background:#eeeadddf!important;color:var(--ink)!important;border-color:#14201935!important;backdrop-filter:blur(10px)}.scene-pieces .piece.active{background:var(--ink)!important;color:var(--paper)!important}.scene-pieces .piece>i{color:var(--gold)!important}.scene-pieces .piece.active>i{color:#dfc799!important}
.scene-craft,.craft-panel{background:var(--paper)!important}.craft-video:after{background:linear-gradient(90deg,transparent 55%,var(--paper))!important}
.scene-ritual{color:var(--ink)!important}.scene-ritual .end-veil{background:linear-gradient(90deg,#eeeaddf3 0,#eeeadddc 36%,#eeeadd50 67%,transparent 86%),linear-gradient(0deg,#eeeadd5c,transparent 48%)!important}.ritual-title>small{color:#14201994!important}.final-brand i{color:var(--gold)!important;border-color:var(--gold)!important}.final-brand button{background:#eeeaddd9!important;color:var(--ink)!important;border-color:#14201975!important;backdrop-filter:blur(8px)}
.scene-nav button,.light-ui .scene-nav button{background:#14201946!important}.scene-nav button.active,.light-ui .scene-nav button.active{background:var(--gold)!important}.scene-count{color:var(--ink)!important}.scene-count i{background:#14201966!important}.transport{color:var(--ink)!important;background:#eeeadddc!important;border-color:#14201935!important}.transport>button{color:var(--ink)!important}.transport p{border-color:#14201924!important}.transport p span{color:#14201975!important}
@media(max-width:760px){.scene-pieces:after{background:linear-gradient(0deg,var(--paper) 0 25%,transparent 52%),linear-gradient(180deg,var(--paper) 0 23%,transparent 49%)!important}.scene-hero .veil{background:linear-gradient(0deg,#eeeaddf3 0,#eeeaddb8 42%,transparent 76%)!important}.scene-ritual .end-veil{background:linear-gradient(0deg,#eeeaddf2 0,#eeeaddc7 55%,transparent 85%)!important}}
/* V5: varied editorial compositions and scene-specific kinetic typography. */
.hero-index,.story-terms,.pieces-statement,.craft-aside,.ritual-caption{position:absolute;z-index:5;margin:0}
.scene-hero .hero-title{left:7vw;top:46%;width:54vw}.scene-hero .hero-title h1{font-size:clamp(74px,10.5vw,158px);line-height:.82;overflow:hidden}.scene-hero .hero-title h1 span{display:inline-block}.scene-hero .hero-title>p,.scene-hero .hero-title>small,.hero-index{opacity:0}.scene-hero.active .hero-title h1{animation:hero-title-in 1.05s .08s var(--ease) both}.scene-hero.active .hero-title h1 span{animation:hero-small-in .85s .35s var(--ease) both}.scene-hero.active .hero-title>p{animation:from-left .7s .48s var(--ease) both}.scene-hero.active .hero-title>small{animation:from-bottom .7s .62s var(--ease) both}.hero-index{right:5vw;bottom:14vh;display:grid;grid-template-columns:auto auto;gap:15px;align-items:end}.hero-index b{font:70px/.75 Georgia,serif;color:var(--gold)}.hero-index span{font-size:9px;line-height:1.8;letter-spacing:.15em}.scene-hero.active .hero-index{animation:scale-in .75s .72s var(--ease) both}
.scene-story .story-photo,.scene-story .paper-wash{display:none!important}.scene-story .story-title{left:10vw!important;right:auto!important;top:18vh!important;width:75vw!important}.scene-story .story-title>p{opacity:0}.scene-story .story-title h2{font-size:clamp(48px,6.6vw,96px)!important;line-height:1.13}.scene-story .story-title h2 br{display:none}.scene-story .story-title h2 em{display:block;margin-left:18vw}.scene-story.active .story-title>p{animation:from-left .65s .1s var(--ease) both}.scene-story.active .story-title h2{animation:story-words 1s .18s var(--ease) both}.story-terms{inset:auto 5vw 8vh 5vw;display:flex;justify-content:space-between;font-size:clamp(55px,8vw,120px);line-height:1;color:#1420190b;letter-spacing:.08em}.story-terms span{opacity:0}.scene-story.active .story-terms span:nth-child(1){animation:term-in .8s .48s var(--ease) both}.scene-story.active .story-terms span:nth-child(2){animation:term-in .8s .62s var(--ease) both}.scene-story.active .story-terms span:nth-child(3){animation:term-in .8s .76s var(--ease) both}.scene-story .story-note{right:6vw!important;bottom:8vh!important;width:30vw!important;padding:18px 0!important;border-top:1px solid var(--red)!important;opacity:0}.scene-story.active .story-note{animation:from-bottom .7s .68s var(--ease) both}
.scene-pieces .pieces-head>p,.scene-pieces .pieces-head h2,.scene-pieces .pieces-head>small,.pieces-statement{opacity:0}.scene-pieces.active .pieces-head>p{animation:from-left .55s .08s var(--ease) both}.scene-pieces.active .pieces-head h2{animation:clip-rise .85s .17s var(--ease) both}.scene-pieces.active .pieces-head>small{animation:from-bottom .55s .45s var(--ease) both}.pieces-statement{right:5vw;top:13vh;text-align:right;font-size:10px;line-height:1.9;color:#1420198a}.scene-pieces.active .pieces-statement{animation:from-right .65s .42s var(--ease) both}.scene-pieces .piece{opacity:0;transform:translateY(35px)}.scene-pieces.active .piece{animation:card-rise .72s var(--ease) both}.scene-pieces.active .piece:nth-child(1){animation-delay:.26s}.scene-pieces.active .piece:nth-child(2){animation-delay:.34s}.scene-pieces.active .piece:nth-child(3){animation-delay:.42s}.scene-pieces.active .piece:nth-child(4){animation-delay:.5s}.scene-pieces.active .piece:nth-child(5){animation-delay:.58s}
.craft-aside{left:3vw;top:19vh;color:#eeeaddbd;font-size:clamp(36px,5vw,74px);line-height:1.2;letter-spacing:.08em;writing-mode:vertical-rl;opacity:0}.scene-craft.active .craft-aside{animation:craft-aside-in .9s .2s var(--ease) both}.scene-craft .craft-video{clip-path:inset(0 100% 0 0)}.scene-craft.active .craft-video{animation:video-reveal 1.15s .05s var(--ease) both}.scene-craft .craft-panel>p:first-child,.scene-craft .craft-panel>small,.scene-craft .craft-panel h2,.scene-craft .craft-description,.scene-craft .craft-tabs{opacity:0}.scene-craft.active .craft-panel>p:first-child{animation:from-right .55s .22s var(--ease) both}.scene-craft.active .craft-panel>small{animation:from-bottom .55s .36s var(--ease) both}.scene-craft.active .craft-panel h2{animation:scale-in .8s .42s var(--ease) both}.scene-craft.active .craft-description{animation:from-bottom .6s .56s var(--ease) both}.scene-craft.active .craft-tabs{animation:from-bottom .65s .68s var(--ease) both}
.scene-ritual{background:var(--paper)!important}.scene-ritual>video{position:absolute;left:47%;top:8%;width:42%;height:84%;object-fit:cover;mask-image:linear-gradient(0deg,transparent,#000 12%,#000 88%,transparent),linear-gradient(90deg,transparent,#000 15%,#000 85%,transparent);-webkit-mask-image:linear-gradient(0deg,transparent,#000 12%,#000 88%,transparent)}.scene-ritual .end-veil{background:linear-gradient(90deg,var(--paper) 0 28%,transparent 53%,transparent 75%,var(--paper))!important}.scene-ritual .ritual-title{left:6vw;top:18vh;width:48vw}.scene-ritual .ritual-title>p,.scene-ritual .ritual-title h2,.scene-ritual .ritual-title>small,.ritual-caption,.final-brand{opacity:0}.scene-ritual .ritual-title h2{font-size:clamp(48px,6.5vw,94px);line-height:1.02}.scene-ritual.active .ritual-title>p{animation:from-left .55s .08s var(--ease) both}.scene-ritual.active .ritual-title h2{animation:ritual-type 1.05s .15s var(--ease) both}.scene-ritual.active .ritual-title>small{animation:from-bottom .6s .52s var(--ease) both}.ritual-caption{right:5vw;top:20vh;display:grid;grid-template-columns:auto auto;gap:13px 18px;align-items:baseline}.ritual-caption b{font-size:18px;color:var(--red);font-weight:500}.ritual-caption span{font-size:9px;letter-spacing:.08em}.scene-ritual.active .ritual-caption{animation:from-right .75s .55s var(--ease) both}.scene-ritual.active .final-brand{animation:scale-in .65s .75s var(--ease) both}
@keyframes hero-title-in{from{opacity:0;transform:translateX(-12vw) skewX(-8deg);clip-path:inset(0 100% 0 0)}to{opacity:1;transform:none;clip-path:inset(0)}}@keyframes hero-small-in{from{letter-spacing:.8em;opacity:0}to{opacity:1}}@keyframes from-left{from{opacity:0;transform:translateX(-35px)}to{opacity:1;transform:none}}@keyframes from-right{from{opacity:0;transform:translateX(35px)}to{opacity:1;transform:none}}@keyframes from-bottom{from{opacity:0;transform:translateY(25px)}to{opacity:1;transform:none}}@keyframes scale-in{from{opacity:0;transform:scale(.75)}to{opacity:1;transform:none}}@keyframes story-words{from{opacity:0;letter-spacing:.12em;filter:blur(8px)}to{opacity:1;letter-spacing:-.065em;filter:none}}@keyframes term-in{from{opacity:0;transform:translateY(60px)}to{opacity:1;transform:none}}@keyframes clip-rise{from{opacity:0;transform:translateY(70%);clip-path:inset(100% 0 0)}to{opacity:1;transform:none;clip-path:inset(0)}}@keyframes card-rise{to{opacity:1;transform:none}}@keyframes video-reveal{to{clip-path:inset(0)}}@keyframes craft-aside-in{from{opacity:0;transform:translateY(-60px);letter-spacing:.5em}to{opacity:1;transform:none}}@keyframes ritual-type{from{opacity:0;transform:scaleX(.65);transform-origin:left;filter:blur(6px)}to{opacity:1;transform:none;filter:none}}
@media(max-width:760px){.scene-hero .hero-title{left:18px;right:18px;top:45%;width:auto}.hero-index{right:18px;bottom:13vh}.hero-index b{font-size:42px}.story-terms{display:none}.scene-story .story-title{left:18px!important;right:18px!important;top:18vh!important;width:auto!important}.scene-story .story-title h2{font-size:10vw!important}.scene-story .story-title h2 br{display:block}.scene-story .story-title h2 em{margin:12px 0 0}.scene-story .story-note{left:18px!important;right:18px!important;bottom:10vh!important;width:auto!important}.pieces-statement{display:none}.craft-aside{left:12px;top:11vh;font-size:8vw}.scene-ritual>video{left:22%;top:3%;width:78%;height:68%}.scene-ritual .end-veil{background:linear-gradient(0deg,var(--paper) 0 42%,transparent 72%)!important}.scene-ritual .ritual-title{left:18px;right:18px;top:auto;bottom:13vh;width:auto}.scene-ritual .ritual-title h2{font-size:11.5vw}.ritual-caption{display:none}.scene-ritual .final-brand{right:18px;bottom:10vh}}
/* V6: autonomous film-like flow, organic media masks, and living type. */
.scene-nav,.scene-count{display:none!important}.transport{border:0!important;background:transparent!important;backdrop-filter:none!important;bottom:2vh!important}.transport>button{display:none!important}.transport p{border:0!important;padding:7px 12px!important;background:#eeeadd9c;border-radius:999px!important}.transport p span{display:none!important}.transport p b{font-size:8px!important;letter-spacing:.08em;color:#14201978}
.glyph{display:inline-block;will-change:transform,opacity}.scene.active .glyph{animation:glyph-pop .72s calc(var(--char)*.38s) var(--ease) both}.scene-settled .scene.active .glyph{animation:glyph-breathe 4.8s calc(var(--char)*-4s) ease-in-out infinite}.scene.active em .glyph{color:var(--red)}
.scene-hero .hero-title{width:66vw!important;top:47%!important}.scene-hero .hero-title h1{font-size:clamp(48px,7.4vw,108px)!important;line-height:.98!important;letter-spacing:-.075em!important;overflow:visible!important}.scene-hero .hero-title h1>span{font-size:.48em!important;letter-spacing:.18em!important}.scene-hero .hero-title h1 br{display:block}.hero-index{border-radius:50% 48% 56% 44%;padding:22px;background:#eeeadd8f;backdrop-filter:blur(10px)}
.scene-story .story-title{top:20vh!important}.scene-story .story-title h2{font-size:clamp(44px,5.7vw,82px)!important;max-width:980px}.story-terms span{animation-name:none}.scene-settled .scene-story.active .story-terms span{animation:term-drift 7s calc(var(--term,0)*-1s) ease-in-out infinite!important}.story-terms span:nth-child(1){--term:1}.story-terms span:nth-child(2){--term:2}.story-terms span:nth-child(3){--term:3}.scene-story .story-note{border-radius:50% 44% 48% 55%;padding:30px!important;border:1px solid #a33d2738!important;background:#f4f0e5a6!important}
.scene-pieces{background-image:none!important}.scene-pieces:before{content:"";position:absolute;right:3vw;top:9vh;width:61vw;height:67vh;background:url('ceramics/clean-set-v2.png') center/cover no-repeat;clip-path:polygon(50% 0,66% 13%,90% 8%,86% 32%,100% 50%,84% 67%,89% 93%,64% 87%,50% 100%,34% 86%,9% 93%,15% 67%,0 50%,15% 33%,9% 8%,35% 14%);filter:saturate(.78);animation:petal-breathe 10s ease-in-out infinite}.scene-pieces:after{background:linear-gradient(90deg,var(--paper) 0 28%,#eeeaddd7 37%,transparent 65%)!important}.scene-pieces .piece-strip{height:116px!important;gap:10px!important;background:transparent!important}.scene-pieces .piece{border:1px solid #14201925!important;border-radius:52% 48% 44% 56%/45% 57% 43% 55%!important;background:#eeeaddda!important;text-align:center!important;backdrop-filter:blur(12px);overflow:visible!important}.scene-pieces .piece:nth-child(even){border-radius:44% 56% 52% 48%/58% 43% 57% 42%!important}.scene-pieces .piece.active{background:var(--ink)!important;transform:translateY(-12px)!important}.scene-pieces .piece>b{left:50%!important;bottom:21px!important;transform:translateX(-50%)!important}.scene-pieces .piece:hover>b,.scene-pieces .piece:focus>b{transform:translateX(-50%) translateY(-5px)!important}.scene-pieces .piece>i{left:50%!important;top:18px!important;transform:translateX(-50%)}.scene-pieces .piece:after{right:50%!important;top:auto!important;bottom:7px;transform:translateX(50%)}
.scene-craft .craft-video{inset:7vh 45% 7vh 3vw!important;border-radius:42% 58% 48% 52%/55% 40% 60% 45%;overflow:hidden;clip-path:none!important;transform:scale(.92);opacity:0}.scene-craft.active .craft-video{animation:blob-reveal 1.1s .06s var(--ease) both}.scene-craft .craft-video:after{background:radial-gradient(circle at 70% 50%,transparent 0 38%,#eeeadd38 72%,var(--paper) 100%)!important}.scene-settled .scene-craft.active .craft-video{opacity:1;transform:scale(1);animation:blob-float 8s 1.1s ease-in-out infinite}.craft-aside{left:5vw!important;top:17vh!important;z-index:6!important}
.scene-ritual>video{left:auto!important;right:6vw!important;top:12vh!important;width:52vh!important;height:52vh!important;aspect-ratio:1;border-radius:50%!important;mask-image:radial-gradient(circle,#000 62%,transparent 72%)!important;-webkit-mask-image:radial-gradient(circle,#000 62%,transparent 72%)!important}.scene-ritual .end-veil{background:radial-gradient(circle at 77% 43%,transparent 0 18%,#eeeadd66 35%,var(--paper) 66%)!important}.scene-ritual .ritual-title{width:59vw!important}.scene-ritual .ritual-title h2{font-size:clamp(45px,5.7vw,82px)!important}.ritual-caption{right:7vw!important;top:auto!important;bottom:17vh!important;border-radius:999px;padding:16px 22px;background:#eeeaddc7;backdrop-filter:blur(10px)}
@keyframes glyph-pop{from{opacity:0;transform:translateY(85%) rotate(calc((var(--char) - .5)*12deg));filter:blur(5px)}to{opacity:1;transform:none;filter:none}}@keyframes glyph-breathe{0%,100%{transform:translateY(0);color:inherit}50%{transform:translateY(calc((var(--char) - .5)*7px));color:#365145}}@keyframes term-drift{0%,100%{opacity:.055;transform:translateY(0)}50%{opacity:.11;transform:translateY(-18px)}}@keyframes petal-breathe{0%,100%{transform:scale(.985) rotate(-.3deg)}50%{transform:scale(1.018) rotate(.3deg)}}@keyframes blob-reveal{from{opacity:0;transform:scale(.72) rotate(-5deg);border-radius:50%}to{opacity:1;transform:scale(1)}}@keyframes blob-float{0%,100%{border-radius:42% 58% 48% 52%/55% 40% 60% 45%;transform:translateY(0)}50%{border-radius:55% 45% 59% 41%/43% 58% 42% 57%;transform:translateY(-8px)}}
@media(max-width:760px){.scene-hero .hero-title{width:auto!important;top:47%!important}.scene-hero .hero-title h1{font-size:11.5vw!important;line-height:1.12!important}.hero-index{padding:13px}.scene-story .story-note{border-radius:26px!important;padding:18px!important}.scene-pieces:before{right:-18vw;top:15vh;width:118vw;height:52vh}.scene-pieces .piece-strip{height:90px!important;gap:3px!important}.scene-pieces .piece{border-radius:45% 55% 50% 50%!important}.scene-pieces .piece>b{font-size:11px!important;bottom:18px!important}.scene-pieces .piece>i{top:12px!important}.scene-craft .craft-video{inset:7vh 5vw 48% 5vw!important;border-radius:48% 52% 45% 55%/55% 46% 54% 45%}.scene-ritual>video{right:-8vw!important;top:9vh!important;width:74vw!important;height:74vw!important}.scene-ritual .ritual-title{width:auto!important}.ritual-caption{display:none!important}}
@media(pointer:fine){.reactive-text{--pointer-x:0;--pointer-y:0;transition:transform .48s var(--ease),letter-spacing .48s ease,color .35s;will-change:transform}.reactive-text.pointer-near:not(:has(.glyph)){transform:translate(calc(var(--pointer-x)*9px),calc(var(--pointer-y)*7px));letter-spacing:.025em;color:#294b3b}.reactive-text .glyph{transition:transform .55s cubic-bezier(.2,.9,.2,1),color .35s!important}.reactive-text.pointer-near .glyph{color:#294b3b}.scene.active .reactive-text.pointer-near .glyph{animation-play-state:paused}}
/* V7: collection scene centers the five actual objects, not a decorative frame. */
.scene-pieces:before{display:none!important}.scene-pieces:after{background:radial-gradient(circle at 50% 52%,#fff5 0,transparent 48%)!important}.scene-pieces .pieces-head{left:5vw!important;top:12vh!important}.scene-pieces .pieces-head h2{font-size:clamp(38px,4.6vw,66px)!important;line-height:1!important}.scene-pieces .pieces-head h2 br{display:none}.pieces-statement{right:5vw!important;top:14vh!important}
.scene-pieces .piece-strip{left:4vw!important;right:4vw!important;top:29vh!important;bottom:10vh!important;height:auto!important;display:grid!important;grid-template-columns:repeat(5,1fr)!important;gap:clamp(8px,1.5vw,24px)!important}.scene-pieces .piece{height:auto!important;border:0!important;border-radius:0!important;background:transparent!important;color:var(--ink)!important;overflow:visible!important;transform:none!important;backdrop-filter:none!important;padding:0!important}.scene-pieces .piece.active{background:transparent!important;color:var(--ink)!important;transform:translateY(-10px)!important}.scene-pieces .piece-art{display:block!important;position:absolute!important;inset:0 0 82px!important;background-size:cover!important;background-position:center!important;background-repeat:no-repeat!important;border-radius:50% 44% 52% 48%/45% 55% 45% 55%!important;filter:saturate(.86);box-shadow:0 20px 55px #625a4920;transition:transform .7s var(--ease),border-radius .7s var(--ease),filter .45s!important}.scene-pieces .piece:nth-child(even) .piece-art{border-radius:44% 56% 46% 54%/56% 43% 57% 44%!important}.scene-pieces .piece:hover .piece-art,.scene-pieces .piece:focus .piece-art,.scene-pieces .piece.active .piece-art{transform:scale(1.055) translateY(-7px)!important;filter:saturate(1)!important;border-radius:55% 45% 58% 42%/42% 57% 43% 58%!important}.scene-pieces .piece[data-piece=teapot] .piece-art{background-image:url('ceramics/item-teapot.png')!important}.scene-pieces .piece[data-piece=fair] .piece-art{background-image:url('ceramics/item-fairness.png')!important}.scene-pieces .piece[data-piece=cup] .piece-art{background-image:url('ceramics/item-cup.png')!important}.scene-pieces .piece[data-piece=filter] .piece-art{background-image:url('ceramics/item-filter.png')!important}.scene-pieces .piece[data-piece=tray] .piece-art{background-image:url('ceramics/item-tray.png')!important}.scene-pieces .piece>b{left:0!important;right:0!important;bottom:24px!important;transform:none!important;text-align:center!important;font-size:19px!important}.scene-pieces .piece:hover>b,.scene-pieces .piece:focus>b{transform:translateY(-4px)!important}.scene-pieces .piece b small{display:block!important;color:#1420198a!important}.scene-pieces .piece>i{left:50%!important;top:auto!important;bottom:6px!important;transform:translateX(-50%)!important;color:var(--gold)!important}.scene-pieces .piece:after{content:'查看详情 ↗'!important;top:18px!important;bottom:auto!important;right:50%!important;transform:translateX(50%)!important;padding:7px 11px;border-radius:999px;background:#eeeaddd9;color:var(--ink);white-space:nowrap;backdrop-filter:blur(8px)}
@media(max-width:760px){.scene-pieces .pieces-head{left:18px!important;top:9vh!important}.scene-pieces .pieces-head h2{font-size:10vw!important}.scene-pieces .piece-strip{left:14px!important;right:14px!important;top:25vh!important;bottom:9vh!important;grid-template-columns:repeat(2,1fr)!important;grid-template-rows:repeat(3,1fr)!important;gap:8px!important}.scene-pieces .piece:last-child{grid-column:1/3;width:48%;justify-self:center}.scene-pieces .piece-art{inset:0 0 38px!important}.scene-pieces .piece>b{bottom:11px!important;font-size:13px!important}.scene-pieces .piece b small{display:none!important}.scene-pieces .piece>i{display:none}.scene-pieces .piece:after{top:8px!important;font-size:7px}.scene-pieces .piece.active{transform:none!important}}
@media(max-width:760px){.scene-pieces .pieces-head h2 br{display:block!important}}
/* V8: the collection moves as a continuous leftward film strip. */
.scene-pieces .piece-strip.collection-marquee{right:auto!important;width:192vw!important;grid-template-columns:repeat(10,1fr)!important;animation:collection-left 14s linear infinite!important;will-change:transform}.scene-pieces .piece-strip.collection-marquee:hover,.scene-pieces .piece-strip.collection-marquee:focus-within{animation-play-state:paused!important}.scene-pieces .piece-clone{display:block}.craft-aside{color:#fff8e8!important;opacity:1;text-shadow:0 2px 18px #07100ddd,0 0 3px #07100d,-1px 0 #07100d,0 1px #07100d!important;-webkit-text-stroke:.25px #142019;mix-blend-mode:normal!important}.scene-craft.active .craft-aside{animation:craft-aside-in .9s .2s var(--ease) both,aside-glow 4s 1.2s ease-in-out infinite!important}
@keyframes collection-left{from{transform:translateX(0)}to{transform:translateX(-50%)}}@keyframes aside-glow{0%,100%{text-shadow:0 2px 16px #07100ddd,0 0 2px #07100d}50%{text-shadow:0 3px 24px #07100d,0 0 5px #07100d}}
@media(max-width:760px){.scene-pieces .piece-strip.collection-marquee{left:2vw!important;right:auto!important;top:26vh!important;bottom:12vh!important;width:480vw!important;display:grid!important;grid-template-columns:repeat(10,1fr)!important;grid-template-rows:1fr!important;gap:2vw!important}.scene-pieces .piece-strip.collection-marquee .piece{width:auto!important;grid-column:auto!important}.scene-pieces .piece-strip.collection-marquee .piece:last-child{width:auto!important;justify-self:stretch!important}.scene-pieces .piece-strip.collection-marquee .piece-art{inset:0 0 48px!important}}
.opening~.experience .scene-pieces .collection-marquee,.scene-pieces:not(.active) .collection-marquee{animation-play-state:paused!important}
/* V9: softer legibility and compact organic object windows. */
.craft-aside{color:#f4ead4!important;text-shadow:0 3px 14px #14201973!important;-webkit-text-stroke:0!important;filter:drop-shadow(0 1px 5px #14201955)}.scene-craft.active .craft-aside{animation:craft-aside-in .9s .2s var(--ease) both,aside-soft-glow 4s 1.2s ease-in-out infinite!important}
.scene-pieces .piece-art{top:44%!important;bottom:auto!important;left:3%!important;right:3%!important;width:auto!important;height:auto!important;aspect-ratio:1!important;transform:translateY(-50%)!important;border-radius:48% 52% 46% 54%/53% 45% 55% 47%!important}.scene-pieces .piece:nth-child(2n) .piece-art{border-radius:55% 45% 52% 48%/44% 56% 46% 54%!important}.scene-pieces .piece:nth-child(3n) .piece-art{border-radius:46% 54% 58% 42%/51% 43% 57% 49%!important}.scene-pieces .piece:hover .piece-art,.scene-pieces .piece:focus .piece-art,.scene-pieces .piece.active .piece-art{transform:translateY(-50%) scale(1.055)!important;border-radius:52% 48% 55% 45%/46% 57% 43% 54%!important}.scene-pieces .piece>b{bottom:33px!important}.scene-pieces .piece>i{bottom:14px!important}
@keyframes aside-soft-glow{0%,100%{text-shadow:0 3px 12px #14201966}50%{text-shadow:0 4px 18px #1420198a}}
@media(max-width:760px){.scene-pieces .piece-art{left:9%!important;right:9%!important;top:43%!important;bottom:auto!important}.scene-pieces .piece>b{bottom:16px!important}.scene-pieces .piece:after{top:10px!important}}
