#stage #gate{background:#081a20;isolation:isolate;--halo:207,219,205;--spark:248,230,167}
#gate[data-scene="kun"]{--halo:64,172,219;--spark:160,227,246}
#gate[data-scene="transform"]{--halo:156,207,219;--spark:243,224,157}
#gate[data-scene="peng"]{--halo:238,197,120;--spark:255,236,172}
#gate[data-scene="ding"]{--halo:209,150,76;--spark:249,210,134}
.scene-gallery,.scene-slide,.scene-light,.scene-shade,#home-particles{position:absolute;inset:0;pointer-events:none}
.scene-gallery{z-index:0;overflow:hidden}.scene-slide{opacity:0;transition:opacity .6s cubic-bezier(.22,.61,.36,1);overflow:hidden;--from-x:-1.2%;--from-y:.8%;--to-x:1.2%;--to-y:-.8%}.scene-slide.active{opacity:1}.scene-slide img{display:block;width:100%;height:100%;object-fit:cover;filter:saturate(1.12) brightness(1.03);transform-origin:52% 44%;animation:landscape-drift 7s ease-in-out infinite alternate;animation-play-state:paused}.scene-slide.active img{animation-play-state:running}
.scene-slide[data-scene="kun"]{--from-x:1.4%;--from-y:.2%;--to-x:-1.4%;--to-y:-.4%}.scene-slide[data-scene="transform"]{--from-x:.5%;--from-y:1.3%;--to-x:-.5%;--to-y:-1.3%}.scene-slide[data-scene="peng"]{--from-x:-1.4%;--from-y:1%;--to-x:1.4%;--to-y:-1%}.scene-slide[data-scene="ding"]{--from-x:1%;--from-y:-.5%;--to-x:-1%;--to-y:.5%}
@keyframes landscape-drift{from{transform:scale(1.07) translate(var(--from-x),var(--from-y))}to{transform:scale(1.16) translate(var(--to-x),var(--to-y))}}
.scene-light{z-index:1;inset:-15%;background:radial-gradient(ellipse at 76% 21%,rgba(var(--halo),.21),transparent 48%),linear-gradient(118deg,transparent 31%,rgba(var(--halo),.07) 43%,transparent 50%,rgba(var(--halo),.08) 60%,transparent 72%);mix-blend-mode:screen;animation:light-breath 18s ease-in-out infinite alternate}
@keyframes light-breath{from{opacity:.55;transform:translate(-2%,-1%) rotate(-2deg)}to{opacity:1;transform:translate(2%,1.5%) rotate(2deg)}}
.scene-mist{position:absolute;inset:-12%;z-index:1;pointer-events:none;mix-blend-mode:screen;opacity:.46}.scene-mist::before,.scene-mist::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 15% 84%,rgba(var(--halo),.26),transparent 32%),radial-gradient(ellipse at 82% 71%,rgba(var(--halo),.18),transparent 30%);animation:mist-drift 9s ease-in-out infinite alternate}.scene-mist::after{opacity:.65;background:radial-gradient(ellipse at 40% 90%,rgba(var(--halo),.24),transparent 38%);animation-duration:13s;animation-direction:alternate-reverse}#gate[data-scene="kun"] .scene-mist{opacity:.65}#gate[data-scene="ding"] .scene-mist{opacity:.25}@keyframes mist-drift{from{transform:translate(-5%,2%) scale(1);opacity:.45}to{transform:translate(5%,-2%) scale(1.08);opacity:.9}}
#home-particles{z-index:2;width:100%;height:100%;opacity:.8}.scene-shade{z-index:3;background:radial-gradient(ellipse at 50% 47%,#07161c66 0%,#07161c35 34%,transparent 66%),linear-gradient(0deg,#061216d9,transparent 24%,transparent 82%,#0719214d)}
#gate[data-scene="peng"] .scene-shade,#gate[data-scene="transform"] .scene-shade{background:radial-gradient(ellipse at 50% 47%,#03172099 0%,#07161c45 34%,transparent 70%),linear-gradient(0deg,#061216d9,transparent 24%,transparent 82%,#0719214d)}
.home-content{position:relative;z-index:4;display:flex;align-items:center;flex-direction:column;padding:0 20px 20px;max-width:95%}#gate h1{color:#fff4da;text-shadow:0 3px 24px #031719cc,0 0 65px #aab79a30}#gate .eyebrow{color:#f0dfb8;text-shadow:0 2px 12px #001b22}#gate .intro{color:#f4f0df;text-shadow:0 2px 14px #05212b,0 0 30px #001820}#gate .enter{background:#f0e6c9;border-color:#ffedb980;box-shadow:0 5px 32px #02151a80,0 0 32px #ead3a320;transition:background .25s,box-shadow .25s,transform .25s}#gate .enter:hover{background:#fff2ce;box-shadow:0 6px 40px #02151a80,0 0 45px #ead3a345;transform:translateY(-2px)}#gate #status{color:#e5e5d3;text-shadow:0 1px 8px #04151b}
.scene-caption{position:absolute;left:32px;bottom:27px;z-index:5;text-align:left;color:#f3e8ce;pointer-events:none;text-shadow:0 2px 14px #001a20}.scene-caption span{display:block;letter-spacing:.28em;font-size:10px;opacity:.72;margin-bottom:7px}.scene-caption strong{font-family:"Songti SC","Noto Serif CJK SC",serif;font-weight:500;font-size:21px;letter-spacing:.15em}.scene-caption p{font-family:"Songti SC",serif;font-size:12px;letter-spacing:.08em;margin:8px 0 0;opacity:.8}
.scene-controls{position:absolute;right:27px;bottom:30px;z-index:5;display:flex;align-items:center;gap:12px}.scene-tabs{display:flex;align-items:center;gap:5px;padding:4px;border:1px solid #e7e0c233;border-radius:24px;background:#091c264d;backdrop-filter:blur(12px)}.scene-controls button{color:#e9e8d9;background:transparent;border:0;font-size:12px;border-radius:20px;line-height:1.4;padding:7px 12px;transition:color .2s,background .3s}.scene-tabs button[aria-pressed="true"]{background:#ede4c4;color:#233f3d}.scene-controls button:hover{background:#e8e0be30;color:#fff2cc}.scene-controls button:focus-visible{outline:2px solid #f6e0a9;outline-offset:3px}#scene-pause{width:32px;height:32px;padding:0;border:1px solid #e7e0c240;background:#091c2666;font-size:15px}.paused .scene-slide img,.paused .scene-light{animation-play-state:paused!important}
@media(max-width:750px){.scene-caption{display:none}.scene-controls{left:12px;right:12px;bottom:12px;justify-content:center;gap:8px}.scene-controls button{font-size:10px;padding:6px 8px}#scene-pause{width:28px;height:28px}.home-content{padding-bottom:22px}#gate .home-content .intro,#gate .home-content .eyebrow{display:none}#gate h1{font-size:clamp(26px,5vw,42px);margin:5px 0 13px}#gate #status{font-size:10px;margin:8px 12px;line-height:1.5;max-width:90%}}
@container (max-height:380px){.scene-caption{display:none}.scene-controls{bottom:10px}.home-content{padding-bottom:24px}#gate .home-content .eyebrow,#gate .home-content .intro{display:none}#gate h1{font-size:clamp(26px,4vw,44px);margin:5px 0 14px}#gate #status{font-size:10px;margin:8px 12px}}
@media(prefers-reduced-motion:reduce){.scene-slide img,.scene-light{animation:none!important}.scene-slide{transition:opacity .2s}#home-particles{display:none}#gate .enter{transition:background .2s}#gate .enter:hover{transform:none}}

.ui-icon{display:inline-block;width:17px;height:17px;flex:none;vertical-align:middle}nav button,#gate .enter,.scene-tabs button,#scene-pause{display:inline-flex;align-items:center;justify-content:center;gap:7px}.scene-tabs .ui-icon{width:15px;height:15px}.destinations .ui-icon{width:15px;height:15px}#scene-pause .ui-icon{width:16px;height:16px}.spinning{animation:icon-spin 1s linear infinite}@keyframes icon-spin{to{transform:rotate(360deg)}}
.scene-light{animation-duration:8s}.paused .scene-mist::before,.paused .scene-mist::after{animation-play-state:paused!important}
@media(max-width:700px){nav .button-label{display:none}nav button{width:34px;height:32px;padding:6px}.scene-tabs .button-label{display:none}.scene-tabs button{width:32px;height:30px;padding:6px}.scene-tabs .ui-icon{width:17px;height:17px}.destinations a{gap:5px}}
@media(prefers-reduced-motion:reduce){.spinning,.scene-mist::before,.scene-mist::after{animation:none}}
