/* Brumes — dimensional portals, layered light, and progressive motion. */
body{overflow-x:clip;background:var(--brand-blue)}
.header-inner{gap:20px}.header-actions{display:flex;align-items:center;gap:14px}.desktop-nav{gap:25px;font-size:.875rem}.brand-name{font-size:1.55rem;letter-spacing:.2em}
.motion-toggle{display:inline-flex;align-items:center;gap:8px;min-height:42px;padding:8px 12px;background:transparent;border:1px solid var(--line);border-radius:30px;color:var(--muted);font:400 .875rem/1.2 var(--sans);cursor:pointer}.motion-toggle[aria-pressed=true]{color:#fcf3bb;border-color:#d0a14455}.motion-toggle:hover{background:#ffffff08}.motion-toggle .icon{width:16px;height:16px}.motion-toggle:disabled{cursor:default;opacity:.65}

[data-tilt]{--rx:0deg;--ry:0deg;--lift:0px;--light-x:50%;--light-y:50%;transform:perspective(1200px) rotateX(var(--rx)) rotateY(var(--ry)) translateZ(var(--lift));transform-style:preserve-3d;transition:transform .55s cubic-bezier(.2,.8,.2,1),box-shadow .4s}
[data-tilt].is-tracking{transition:box-shadow .4s;will-change:transform}

.atmosphere{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:1}.atmosphere canvas{display:block;width:100%;height:100%;opacity:.8}

.game-shell{box-shadow:0 16px 45px -28px #000e}.game-tabs a{font-size:.875rem}.game-name>span{font-size:.75rem;letter-spacing:.08em}.change-world{font-size:.875rem}.game-tabs a[aria-current=page]{box-shadow:inset 0 -14px 25px -22px var(--accent)}
.hub-hero{perspective:1400px}.hub-hero>img,.stream-hero>img{transform:scale(1.09) translate(var(--scene-x,0px),var(--scene-y,0px));transition:transform .55s ease}.hub-hero.is-tracking>img,.stream-hero.is-tracking>img{transition:none}.hub-hero-inner,.stream-intro-grid{position:relative;z-index:2}.hub-hero-inner>div{transform:translate(var(--copy-x,0px),var(--copy-y,0px));transition:transform .5s ease}.hub-hero.is-tracking .hub-hero-inner>div{transition:none}
.hero-depth-line{position:absolute;top:10%;right:9%;bottom:12%;width:31%;border:1px solid #ffffff22;border-radius:50% 50% 2px 2px;transform:rotateY(-28deg) translateZ(-50px);box-shadow:12px 0 0 -11px #ffffff22,24px 0 0 -23px #ffffff16;pointer-events:none}
.hub-section-link{position:relative;border-radius:10px;background:linear-gradient(145deg,#2b2f495e,#17192c);box-shadow:0 13px 28px -20px #0009;overflow:visible}.hub-section-link>div{min-width:0}.hub-section-link::before{content:'';position:absolute;inset:0;pointer-events:none;border-radius:inherit;background:radial-gradient(ellipse at var(--light-x) var(--light-y),#ffffff0c,transparent 70%)}
.character-card{position:relative;overflow:visible;border-radius:12px;box-shadow:0 25px 40px -30px #000;transform-style:preserve-3d}.character-card:hover{transform:perspective(1200px) rotateX(var(--rx)) rotateY(var(--ry)) translateZ(var(--lift));box-shadow:0 35px 50px -25px #000a}.character-art{border-radius:11px 11px 0 0}.character-copy{background:linear-gradient(145deg,#232740ee,#1b1d35fa);border-radius:0 0 11px 11px}
.stream-identity{transform-style:preserve-3d}.stream-identity>.streamer-logo{transform:translateZ(40px)}.stream-identity>p{transform:translateZ(60px)}.portal-stream{border-radius:14px;box-shadow:0 25px 50px -32px #0009}.portal-stream-logo{display:block;transform-style:preserve-3d}.portal-stream-logo>.streamer-logo{transform:translateZ(25px)}
.game-tabs a:focus-visible{outline-offset:-4px}.reveal-item{transition:opacity .65s ease,translate .65s cubic-bezier(.2,.7,.2,1)}.motion-on .reveal-item.is-pending{opacity:0;translate:0 20px}.motion-off .reveal-item{opacity:1;translate:none}
@view-transition{navigation:auto}
::view-transition-old(root){animation:brumes-depart .25s ease both}::view-transition-new(root){animation:brumes-arrive .4s cubic-bezier(.2,.65,.2,1) both}
@keyframes brumes-depart{to{opacity:0;transform:scale(.985)}}@keyframes brumes-arrive{from{opacity:0;transform:translateY(12px) scale(1.01)}to{opacity:1;transform:none}}
@keyframes orbit-drift{to{transform:rotateX(72deg) rotateZ(12deg) translateY(20px)}}

.motion-off [data-tilt]{--rx:0deg!important;--ry:0deg!important;--lift:0px!important;--image-x:0px!important;--image-y:0px!important}.motion-off [data-parallax]{--scene-x:0px!important;--scene-y:0px!important;--copy-x:0px!important;--copy-y:0px!important}
.motion-off::view-transition-old(root),.motion-off::view-transition-new(root){animation:none}
@media(max-width:1200px){.header-join{display:none}.header-inner{gap:15px}.desktop-nav{gap:20px}.game-tabs a{padding-inline:9px}}
@media(max-width:900px){.desktop-nav{gap:15px;font-size:.8rem}.motion-toggle{padding:9px}.motion-toggle>span{display:none}.brand-name{font-size:1.4rem}.game-tabs a{font-size:.8rem}}
@media(max-width:760px){
 .header-inner{gap:12px}.header-actions{margin-left:auto}.motion-toggle{min-width:42px;min-height:42px}

 .atmosphere canvas{opacity:.5}.hero-depth-line{right:4%;width:55%;opacity:.6}.hub-hero{min-height:540px}.hub-hero-inner>div{transform:none!important}
 .game-tabs a{font-size:.875rem;min-height:45px;padding:10px 6px}.game-name>span{font-size:.75rem;letter-spacing:0}.game-name>strong{font-size:1.25rem}.game-identity{min-height:65px}.change-world{font-size:.75rem}.ffxiv .game-tabs a:last-child{min-height:40px;font-size:.875rem}.game-tabs{grid-template-columns:repeat(3,minmax(0,1fr))}
 .hub-section-link>div,.hub-section-icon,.hub-section-link>.icon{transform:none}.stream-identity>.streamer-logo{transform:translateZ(20px)}
}
@media(max-width:400px){.game-tabs a{font-size:.8125rem}.change-world{max-width:90px;text-align:right}.game-name>span{font-size:.75rem}.game-name>strong{font-size:1.1rem}}
@media(prefers-reduced-motion:reduce){
 [data-tilt],[data-parallax]{--rx:0deg!important;--ry:0deg!important;--lift:0px!important;--image-x:0px!important;--image-y:0px!important;--scene-x:0px!important;--scene-y:0px!important;--copy-x:0px!important;--copy-y:0px!important;transition:none!important}
 .reveal-item{opacity:1!important;translate:none!important;transition:none!important}::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation:none!important}
}
