.hero-stage{position:absolute;inset:0;z-index:-1}.hero-stage #hero-canvas{z-index:0}.hero-orbit-controls{display:none}
body[data-direction=hybrid]{--accent:#acdbef;--ink:#2e2838;--paper:#f7f3ec;--muted:#6c6273;--line:#ded6e2}
[data-direction=hybrid] .hero{height:max(850px,100svh);max-height:1040px;background:radial-gradient(ellipse at 77% 38%,#243a54 0,transparent 38%),radial-gradient(ellipse at 64% 71%,#462347 0,transparent 42%),#0b1020}
[data-direction=hybrid] .hero-art{opacity:.68;transition:opacity 1.2s,transform .2s linear;background-position:70% center}
[data-direction=hybrid].hero-world-ready .hero-art{opacity:0}
[data-direction=hybrid] .hero-shade{background:linear-gradient(90deg,#0b1020f0 0%,#0b1020c0 35%,transparent 74%),linear-gradient(0deg,#0b102055,transparent 40%)}
[data-direction=hybrid] .hero-stage{left:auto;right:-2%;top:70px;bottom:65px;width:64%;z-index:1}
[data-direction=hybrid] #hero-canvas{pointer-events:auto;touch-action:pan-y;cursor:grab}
[data-direction=hybrid] #hero-canvas:active{cursor:grabbing}
[data-direction=hybrid] .hero-copy{z-index:2;width:54%;pointer-events:none;padding-top:185px;padding-bottom:100px}
[data-direction=hybrid] .hero-copy a{pointer-events:auto}
[data-direction=hybrid] .hero h1{font-size:clamp(67px,6.5vw,101px);line-height:1.03;letter-spacing:-2px}
[data-direction=hybrid] .hero h1 em{color:#c3def1}
[data-direction=hybrid] .hero-intro{color:#bfc1d7;font-size:17px;max-width:410px}
[data-direction=hybrid] .hero .eyebrow{color:#ae9cbb;font-size:12px;letter-spacing:2px}
[data-direction=hybrid] .hero .button,[data-direction=hybrid] .site-header .button{background:#d8e6ef;color:#253146;box-shadow:0 0 30px #abc8ed15}
[data-direction=hybrid] .hero .button:hover,[data-direction=hybrid] .site-header .button:hover{background:#fff}
[data-direction=hybrid] .hero-foot{color:#a39bb7;border-color:#a1a9d426;z-index:3}
[data-direction=hybrid].hero-world-ready .hero-orbit-controls{position:absolute;display:flex;align-items:center;justify-content:center;gap:20px;bottom:10px;left:50%;transform:translateX(-50%);width:max-content;max-width:96%;font-size:11px;letter-spacing:1.4px;color:#a7a5c7}
.hero-orbit-controls button{width:44px;height:44px;border-radius:50%;border:1px solid #b8b5d446;background:#b8b5d409;color:#e2d9f5;font-size:20px;flex-shrink:0;transition:background .2s}
.hero-orbit-controls button:hover{background:#b8b5d425}
[data-direction=hybrid] .chapter-strip{background:#202039;color:#d0b8d8;border-top:1px solid #c3a9e324;border-bottom:1px solid #c3a9e324;padding-top:30px;padding-bottom:30px}
[data-direction=hybrid] .chapter-strip>span:nth-child(even){color:#84becf}
[data-direction=hybrid] .about h2 em,[data-direction=hybrid] .journey h3 em{color:#8b7196}
[data-direction=hybrid] .interests{background:radial-gradient(ellipse at 85% 70%,#25334c 0,transparent 65%),#111a2a;--muted:#b0b8ce;color:#eef1f7}
[data-direction=hybrid] .interests h2 em{color:#a5cddc}
[data-direction=hybrid] .interests .eyebrow{color:#a3adc7}
[data-direction=hybrid] .interest-menu button{color:#a1a9c2;border-color:#56657d55}
[data-direction=hybrid] .interest-menu button[aria-selected=true]{color:#d0eeff}
[data-direction=hybrid] .interest-panel img{border-radius:130px 130px 8px 8px;box-shadow:0 20px 60px #080d1690;filter:saturate(.9)}
[data-direction=hybrid] .interest-panel figcaption,[data-direction=hybrid] .interest-tags span{color:#a6b8cd}
[data-direction=hybrid] .interest-tags span{border-color:#708aa940}
[data-direction=hybrid] .play{min-height:750px;background:radial-gradient(ellipse at 77% 50%,#263a51,transparent 45%),radial-gradient(ellipse at 65% 80%,#402d55,transparent 55%),#0b1020}
[data-direction=hybrid] .play h2 em{color:#c2deea}
[data-direction=hybrid] .play .button{background:#d8e6ef;color:#253146}
[data-direction=hybrid] .portal-controls{bottom:20px}
[data-direction=hybrid] .reveal-enabled .reveal{transition-duration:1s}
.interest-panel figure{perspective:900px}.interest-panel img{transition:transform .6s cubic-bezier(.2,.7,.3,1),filter .6s;transform-origin:50% 70%}
.interest-panel.is-changing img{transform:rotateY(-8deg) translateY(8px);filter:saturate(.4)}
@media(min-width:1600px){[data-direction=hybrid] .hero-copy{padding-top:220px}[data-direction=hybrid] .hero-stage{width:63%;right:0}}
@media(max-width:1100px){[data-direction=hybrid] .hero-copy{width:55%;padding-top:175px}[data-direction=hybrid] .hero h1{font-size:clamp(65px,7.3vw,85px)}[data-direction=hybrid] .hero-intro{font-size:16px;max-width:325px}[data-direction=hybrid] .hero-stage{width:61%;right:-3%}.hero-orbit-controls span{font-size:9px;letter-spacing:1px}}
@media(max-width:800px) and (min-width:651px){[data-direction=hybrid] .hero-copy{width:62%;padding-top:165px}[data-direction=hybrid] .hero-stage{width:69%;right:-15%;top:220px;bottom:20px}[data-direction=hybrid] .hero-orbit-controls{bottom:50px!important;left:45%!important}.hero-orbit-controls span{max-width:125px;text-align:center}[data-direction=hybrid] .hero h1{font-size:69px}}
@media(max-width:650px){
 [data-direction=hybrid] .hero{height:auto;min-height:1040px;max-height:none;background:radial-gradient(ellipse at 50% 70%,#2b3450,transparent 45%),#0b1020}
 [data-direction=hybrid] .hero-copy{width:100%;padding:132px 7% 550px}
 [data-direction=hybrid] .hero h1{font-size:clamp(52px,12vw,72px);line-height:1.04;letter-spacing:-1px}
 [data-direction=hybrid] .hero .eyebrow{font-size:10px;letter-spacing:1.3px;margin-bottom:20px}
 [data-direction=hybrid] .hero-intro{font-size:16px;margin-top:24px;max-width:340px}
 [data-direction=hybrid] .hero-actions{margin-top:28px}
 [data-direction=hybrid] .hero-stage{inset:auto -4% 85px;width:108%;height:465px}
 [data-direction=hybrid] .hero-art{background-size:auto 650px;background-position:66% bottom}
 [data-direction=hybrid] .hero-shade{background:linear-gradient(180deg,#0b1020 0%,#0b1020f0 40%,transparent 72%)}
 [data-direction=hybrid].hero-world-ready .hero-orbit-controls{bottom:0;font-size:10px;gap:17px;letter-spacing:1px}
 [data-direction=hybrid] .hero-foot{font-size:10px;bottom:26px;gap:18px}
 [data-direction=hybrid] .play{min-height:0}
 html[lang=zh-Hant] [data-direction=hybrid] .hero-copy{padding-top:135px;padding-bottom:550px}
 html[lang=zh-Hant] [data-direction=hybrid] .hero h1{font-size:clamp(39px,9vw,54px);line-height:1.4;letter-spacing:0}
}
@media(prefers-reduced-motion:reduce){.interest-panel img{transition:none!important}}
.motion-paused .interest-panel img{transition:none!important}
