/* Opt-in web motion. Existing components remain unchanged without the integration. */
[data-blu-component-motion=field] :is(.blu-text,.blu-textarea,.blu-select__trigger,.blu-choice__mark,.blu-text__action){transition:background-color var(--blu-component-motion-duration,280ms) var(--blu-component-motion-ease,ease),border-color var(--blu-component-motion-duration,280ms) var(--blu-component-motion-ease,ease),box-shadow var(--blu-component-motion-duration,280ms) var(--blu-component-motion-ease,ease),color var(--blu-component-motion-duration,280ms) var(--blu-component-motion-ease,ease)}
[data-blu-component-motion=field] .blu-choice--switch .blu-choice__mark::after{transition:transform var(--blu-component-motion-duration,320ms) var(--blu-component-motion-ease,cubic-bezier(.2,.8,.2,1))}
[data-blu-component-motion=field] .blu-choice--radio .blu-choice__mark::after{content:'';width:7px;height:7px;border-radius:50%;background:currentColor;transform:scale(0);transition:transform var(--blu-component-motion-duration,280ms) var(--blu-component-motion-ease,ease-out)}
[data-blu-component-motion=field] .blu-choice--radio input:checked+.blu-choice__mark::after{transform:scale(1)}
[data-blu-component-motion=field] .blu-select__trigger::after{transition:transform var(--blu-component-motion-duration,280ms) var(--blu-component-motion-ease,ease-out)}
[data-blu-component-motion=field] .blu-select__trigger[aria-expanded=true]::after{transform:translateY(2px) rotate(225deg)}
[data-blu-exit-visual] :disabled{opacity:1!important}
/* Focus rings and validation semantics stay immediate; only decorative feedback moves. */
:is([data-blu-motion=reduced],[data-blu-motion=off],.blu-motion-off) [data-blu-component-motion=field] *,
:is([data-blu-motion=reduced],[data-blu-motion=off],.blu-motion-off) [data-blu-component-motion=field] *::after{transition:none!important;animation:none!important}
@media(prefers-reduced-motion:reduce){[data-blu-component-motion=field] *,[data-blu-component-motion=field] *::after{transition:none!important;animation:none!important}}
[data-blu-surface-motion] :is(.blu-select__option,.blu-command__option,.blu-control){transition:background-color var(--blu-component-motion-duration,280ms) var(--blu-component-motion-ease,ease),color var(--blu-component-motion-duration,280ms) var(--blu-component-motion-ease,ease),border-color var(--blu-component-motion-duration,280ms) var(--blu-component-motion-ease,ease)}
:is([data-blu-motion=reduced],[data-blu-motion=off],.blu-motion-off) [data-blu-surface-motion] *{transition:none!important}
@media(prefers-reduced-motion:reduce){[data-blu-surface-motion] *{transition:none!important}}
/* Side drawers meet both viewport edges; the content scrolls between fixed header/footer. */
[data-blu-surface-motion=drawer].blu-overlay:is([data-placement=left],[data-placement=right]){padding:0;align-items:stretch}
[data-blu-surface-motion=drawer].blu-overlay:is([data-placement=left],[data-placement=right])>.blu-overlay__panel{margin:0;height:100dvh;max-height:100dvh;min-height:0;border-radius:0}
[data-blu-surface-motion=drawer] :is(.blu-overlay__header,.blu-overlay__footer){flex-shrink:0}
/* Existing notification keyframes are replaced by the scoped controller. */
[data-blu-component-motion=notifications] .blu-notification{animation:none}
[data-blu-component-motion=tree] .blu-tree__row{transition:background-color var(--blu-component-motion-duration,280ms) var(--blu-component-motion-ease,ease),color var(--blu-component-motion-duration,280ms) var(--blu-component-motion-ease,ease)}
[data-blu-surface-motion=picker] :is(.blu-picker__button,.blu-picker__input,.blu-picker__day){transition:background-color var(--blu-component-motion-duration,280ms) var(--blu-component-motion-ease,ease),border-color var(--blu-component-motion-duration,280ms) var(--blu-component-motion-ease,ease),color var(--blu-component-motion-duration,280ms) var(--blu-component-motion-ease,ease)}
:is([data-blu-motion=reduced],[data-blu-motion=off],.blu-motion-off) [data-blu-component-motion=tree] *{transition:none!important}
@media(prefers-reduced-motion:reduce){[data-blu-component-motion=tree] *{transition:none!important}}
/* Web-only active-location markers: existing links retain focus and behavior. */
.blu-motion-navigation-marker{position:absolute;display:block;border-radius:3px;background:var(--bluui-primary,#5144ed);pointer-events:none;transform-origin:top left;z-index:1}
.blu-motion-navigation-marker[hidden]{display:none}
.blu-motion-navigation-marker[data-kind=pagination]{box-sizing:border-box;border:2px solid var(--bluui-primary,#5144ed);border-radius:8px;background:transparent}
[data-blu-navigation-motion] .blu-navigation-menu .blu-navigation-menu__link--active{color:var(--bluui-primary,#5144ed);background:var(--bluui-color-primary-soft,#efedff)}
@media(forced-colors:active){.blu-motion-navigation-marker{background:Highlight}}
@media(forced-colors:active){.blu-motion-navigation-marker[data-kind=pagination]{background:transparent;border-color:Highlight}}

/* Shared finite transition settings; continuous loading keeps its own cadence. */
.blu-motion-button.blu-button{transition-duration:var(--blu-component-motion-duration,var(--blu-motion-duration));transition-timing-function:var(--blu-component-motion-ease,var(--blu-motion-ease))}
/* A preference may sit on the component root itself, not only its parent. */
:is([data-blu-component-motion],[data-blu-surface-motion],[data-blu-navigation-motion]):is([data-blu-motion=reduced],[data-blu-motion=off],.blu-motion-off) *,
:is([data-blu-component-motion],[data-blu-surface-motion],[data-blu-navigation-motion]):is([data-blu-motion=reduced],[data-blu-motion=off],.blu-motion-off) *::before,
:is([data-blu-component-motion],[data-blu-surface-motion],[data-blu-navigation-motion]):is([data-blu-motion=reduced],[data-blu-motion=off],.blu-motion-off) *::after{transition:none!important;animation:none!important}
