/* Shared document handoff and inert article-to-landing visual portal. */
@view-transition{navigation:auto}
html{background:#090909}
header{view-transition-name:grok-header}
.grok-landing-portal{position:fixed;inset:0;width:100%;height:100dvh;z-index:2147483000;overflow:hidden;pointer-events:none;background:transparent}
body.grok-morphing{pointer-events:none}
::view-transition-group(root),::view-transition-group(grok-header){animation-duration:320ms;animation-timing-function:cubic-bezier(.22,.8,.25,1)}
::view-transition-image-pair(root){isolation:isolate}
::view-transition-old(root){animation:grok-depart 180ms ease-out both;mix-blend-mode:normal}
::view-transition-new(root){animation:grok-arrive 320ms cubic-bezier(.22,.8,.25,1) both;mix-blend-mode:normal}
::view-transition-old(grok-header){animation:grok-header-out 120ms ease-out both}
::view-transition-new(grok-header){animation:grok-header-in 240ms ease-out both}
html[data-grok-entry="blog"]:not([data-grok-transition="native"]) .shell main{animation:grok-arrive 320ms cubic-bezier(.22,.8,.25,1) both}
@keyframes grok-depart{to{opacity:0;transform:translateY(-6px) scale(.994)}}
@keyframes grok-arrive{from{opacity:0;transform:translateY(10px) scale(1.006)}to{opacity:1;transform:none}}
@keyframes grok-header-out{to{opacity:0}}
@keyframes grok-header-in{from{opacity:0}to{opacity:1}}
@media(prefers-reduced-motion:reduce){
 @view-transition{navigation:none}
 html[data-grok-entry="blog"] .shell main{animation:none!important}
 ::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation:none!important}
}