.hero .world-canvas{position:absolute;inset:0;width:100%;height:100%;z-index:4;pointer-events:none;opacity:0;transition:opacity .8s ease}
.has-webgl .hero .world-canvas{opacity:1}
.has-webgl .hero-book-fallback,.has-webgl .hero-planet-wrap{opacity:0!important;visibility:hidden!important}
.has-webgl .hero-copy{z-index:6}
.has-webgl .hero-object-label{display:grid;z-index:8;right:clamp(25px,5vw,85px);bottom:clamp(100px,13vh,160px);min-width:225px;padding:15px 18px 15px 19px;background:linear-gradient(105deg,#071724d9,#112b3bb0);border:1px solid #d9c18f80;border-left:2px solid #e6c891;box-shadow:0 24px 60px #0008,0 0 42px #d9b57417;backdrop-filter:blur(15px);color:#d5e1e4;font:500 9px "IBM Plex Mono",monospace;letter-spacing:.09em;line-height:1.5}
.hero-object-label strong{font:400 19px/1.15 var(--display);color:#f0d49d}
.hero-object-label button{border:0;border-top:1px solid #c8d9dc50;background:none;color:#f9e6c3;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 0 1px;text-align:left;font:600 12px var(--sans);letter-spacing:.02em;transition:color .25s,transform .25s}
.hero-object-label button:hover{color:#fff;transform:translateX(3px)}
.hero-object-label button span{font-size:17px;color:#e6c891}
.hero-3d-note{color:#b4c5cb!important;font:500 9px "IBM Plex Mono",monospace;letter-spacing:.08em}
.has-webgl .hero:after{background:radial-gradient(circle at 70% 42%,#d8b26d08,transparent 28%),linear-gradient(90deg,#02070f2e,transparent 67%)}
.has-webgl .hero-scene>img{opacity:.72}
.station-visual{transform-style:preserve-3d}
.station-stage{perspective:1200px}
.station-sheet.is-active:hover{transform:translate(-50%,-52%) rotateY(-9deg) rotateX(2deg) rotateZ(-1.5deg) scale(1.035);box-shadow:29px 42px 80px #000e,3px 3px 0 #d2b783}
.artifact-viewport{touch-action:pan-y;cursor:grab}
.artifact-viewport.is-dragging{cursor:grabbing}
.artifact-viewport:focus-visible{outline:2px solid #e6c891;outline-offset:5px}
.artifact-card{transform:translate(-50%,-50%) translateX(var(--travel,0%)) translateX(var(--drag-px,0px)) translateZ(var(--depth,0px)) rotateY(var(--yaw,0deg)) rotateY(var(--drag-tilt,0deg)) rotateZ(var(--roll,0deg));transition:transform .8s cubic-bezier(.18,.8,.2,1),opacity .6s,filter .6s,box-shadow .6s}
.artifact-card.is-active{box-shadow:0 55px 105px #000e,0 0 65px #e9c88625}
.artifact-card.is-active:after{border:1px solid #e6c589b8;box-shadow:inset 0 0 30px #e8c68e19}
.artifact-viewport:before{animation:gallery-breathe 7s ease-in-out infinite alternate}
@keyframes gallery-breathe{to{opacity:.4;scale:1.13}}
.visual-credit{display:block;margin-top:15px;color:#879daa;font:9px/1.6 "IBM Plex Mono",monospace;letter-spacing:.01em}
.visual-credit a{text-decoration:underline;text-underline-offset:3px}
@media(max-width:700px){.has-webgl .hero-scene>img{opacity:.8}.has-webgl .hero-object-label{right:auto;left:22px;bottom:90px;min-width:0;width:min(54vw,230px);padding:10px 12px;font-size:7px;gap:5px}.hero-object-label strong{font-size:15px}.hero-object-label button{font-size:10px;padding-top:8px}.hero-3d-note{display:none}.station-sheet.is-active:hover{transform:translate(-50%,-50%) scale(1)}}
@media(prefers-reduced-motion:reduce){.hero .world-canvas{display:none}.has-webgl .hero-book-fallback,.has-webgl .hero-planet-wrap{visibility:visible!important;opacity:1!important}.has-webgl .hero-object-label{display:none}.artifact-viewport:before{animation:none}}