:root{--m-fast:180ms;--m-reveal:820ms;--m-soft:1100ms;--m-stagger:75ms;--m-exit:260ms;--m-enter:440ms;--m-distance:22px;--m-ease:cubic-bezier(.19,1,.22,1);--m-wipe:cubic-bezier(.76,0,.24,1)}
.mgs-route-screen{display:none;position:fixed;inset:0;z-index:1000;background:#090a0b;color:#eeeae0;pointer-events:none;align-items:center;justify-content:center;flex-direction:column;gap:22px;contain:layout paint}
.mgs-route-screen img{width:70px;height:70px;object-fit:contain}.mgs-route-screen p{font:500 12px/1.5 Instrument,Arial,sans-serif;letter-spacing:.22em}.mgs-route-screen>span{width:48px;height:1px;background:#efd053;transform-origin:left}
html[data-route-phase] .mgs-route-screen{display:flex}
html[data-route-phase=exit] .mgs-route-screen{animation:m-route-cover var(--m-exit) var(--m-wipe) both}
html[data-route-phase=reveal] .mgs-route-screen{animation:m-route-reveal var(--m-enter) var(--m-wipe) both}
html[data-route-kind=intro] .mgs-route-screen img{animation:m-mark .65s var(--m-ease) both}
html[data-route-kind=intro] .mgs-route-screen p{animation:m-label .6s .1s var(--m-ease) both}
html[data-route-kind=intro] .mgs-route-screen>span{animation:m-line .7s var(--m-ease) both}
@keyframes m-route-cover{from{transform:translate3d(0,100%,0)}to{transform:translateZ(0)}}
@keyframes m-route-reveal{from{transform:translateZ(0)}to{transform:translate3d(0,-101%,0)}}
@keyframes m-mark{from{opacity:0;transform:scale(.86) rotate(-9deg)}to{opacity:1;transform:none}}
@keyframes m-label{from{opacity:0;clip-path:inset(0 100% 0 0);transform:translateY(7px)}to{opacity:1;clip-path:inset(0);transform:none}}
@keyframes m-line{from{transform:scaleX(0)}to{transform:scaleX(1)}}
/* Motion never establishes a permanent hidden state. */
.x-revealed{animation:none!important}
html:not([data-motion=reduce]) .primary-nav a{position:relative;transition:color var(--m-fast)}
.primary-nav a::after{content:'';position:absolute;inset:auto 0 -8px;height:1px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform var(--m-fast) var(--m-ease)}
.primary-nav a:is(:hover,:focus-visible)::after{transform:scaleX(1)}
.x-action span{transition:transform var(--m-fast) var(--m-ease)}.x-action:focus-visible span{transform:translate(3px,-3px)}
.header-actions .interface-symbol{transition:transform .32s var(--m-ease)}[data-interface]:is(:hover,:focus-visible) .interface-symbol{transform:rotate(90deg)}
.showcase-controls button,.button{transition:background var(--m-fast),color var(--m-fast),transform var(--m-fast)}.showcase-controls button:active,.button:active{transform:translateY(2px)}
.field input,.field textarea,.field select{transition:border-color var(--m-fast),box-shadow var(--m-fast)}.field :is(input,textarea,select):focus{border-bottom-color:var(--azul-action-text);box-shadow:0 1px 0 var(--azul-action-text)}
.x-ecosystem summary>span{transition:transform .4s var(--m-ease)}
.drawer{transition:transform .5s var(--m-wipe),visibility .5s}.drawer[data-open=true] nav a{animation:m-drawer .65s var(--m-ease) both}.drawer nav a:nth-child(2){animation-delay:45ms}.drawer nav a:nth-child(3){animation-delay:90ms}.drawer nav a:nth-child(4){animation-delay:135ms}.drawer nav a:nth-child(5){animation-delay:180ms}.drawer nav a:nth-child(6){animation-delay:225ms}
.drawer[data-open=true]{visibility:visible;transition:transform .5s var(--m-wipe)}
@keyframes m-drawer{from{opacity:.2;transform:translateX(18px)}to{opacity:1;transform:none}}
.interface-panel:not([hidden]){animation:m-settings .35s var(--m-ease) both}@keyframes m-settings{from{transform:translateX(28px)}to{transform:none}}
.showcase-slide{transition:opacity .75s var(--m-ease),visibility .75s}.showcase-slide.is-active .showcase-title{animation:m-title 950ms var(--m-ease) both}.showcase-slide.is-active .showcase-copy .eyebrow{animation:m-copy .6s 80ms var(--m-ease) both}.showcase-slide.is-active .showcase-copy .rule-link{animation:m-copy .65s 180ms var(--m-ease) both}
@keyframes m-title{from{clip-path:inset(0 0 100% 0);transform:translateY(20px)}to{clip-path:inset(0);transform:none}}
@keyframes m-copy{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:none}}
.showcase-slide.is-active picture img{animation:m-film 10s linear both}.showcase-slide.is-active .showcase-video{animation:m-film 10s linear both}@keyframes m-film{from{transform:scale(1.025)}to{transform:scale(1)}}
.showcase-indicators button{position:relative;overflow:hidden}.showcase-indicators button::after{content:'';position:absolute;bottom:0;left:0;width:100%;height:1px;background:#efd053;transform:scaleX(0);transform-origin:left}.showcase-indicators button[aria-current=true]::after{animation:m-progress 10s linear both}.editorial-hero[data-rotation=paused] .showcase-indicators button::after,.editorial-hero[data-rotation=paused] .showcase-slide.is-active picture img,.editorial-hero[data-rotation=paused] .showcase-slide.is-active .showcase-video{animation-play-state:paused}
@keyframes m-progress{to{transform:scaleX(1)}}
.x-fukanzen::before{transform:translate3d(0,var(--m-depth,0px),0) rotate(-25deg)}
@media(hover:hover) and (pointer:fine){html:not([data-motion=reduce]) .x-art-image img{translate:0 var(--m-depth,0px);scale:1.025}.x-gateway:focus-visible img{transform:scale(1.04)}}
[data-motion=reduce] .mgs-route-screen{display:none!important}[data-motion=reduce] *,[data-motion=reduce] *::before,[data-motion=reduce] *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}[data-motion=reduce] .x-art-image img{translate:none;scale:1}[data-motion=reduce] .primary-nav a::after{display:none}
[data-motion=reduce] .x-fukanzen::before{transform:rotate(-25deg)}
@media(prefers-reduced-motion:reduce){.mgs-route-screen{display:none!important}*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}