/* styles/motion-presets.css */
.blu-motion-enter-fade,
.blu-motion-fade-in {
  animation: blu-motion-enter-fade var(--blu-motion-duration) var(--blu-motion-ease) var(--blu-motion-delay) both;
}
@keyframes blu-motion-enter-fade {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.blu-motion-exit-fade,
.blu-motion-fade-out {
  animation: blu-motion-exit-fade var(--blu-motion-duration) var(--blu-motion-ease) var(--blu-motion-delay) both;
}
@keyframes blu-motion-exit-fade {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
.blu-motion-enter-slide-up,
.blu-motion-slide-up {
  animation: blu-motion-enter-slide-up var(--blu-motion-duration) var(--blu-motion-ease) var(--blu-motion-delay) both;
}
@keyframes blu-motion-enter-slide-up {
  0% {
    opacity: 0;
    transform: translateY(var(--blu-motion-distance));
  }
  100% {
    opacity: 1;
    transform: none;
  }
}
.blu-motion-exit-slide-up {
  animation: blu-motion-exit-slide-up var(--blu-motion-duration) var(--blu-motion-ease) var(--blu-motion-delay) both;
}
@keyframes blu-motion-exit-slide-up {
  0% {
    opacity: 1;
    transform: none;
  }
  100% {
    opacity: 0;
    transform: translateY(calc(-1 * var(--blu-motion-distance)));
  }
}
.blu-motion-enter-slide-down {
  animation: blu-motion-enter-slide-down var(--blu-motion-duration) var(--blu-motion-ease) var(--blu-motion-delay) both;
}
@keyframes blu-motion-enter-slide-down {
  0% {
    opacity: 0;
    transform: translateY(calc(-1 * var(--blu-motion-distance)));
  }
  100% {
    opacity: 1;
    transform: none;
  }
}
.blu-motion-exit-slide-down {
  animation: blu-motion-exit-slide-down var(--blu-motion-duration) var(--blu-motion-ease) var(--blu-motion-delay) both;
}
@keyframes blu-motion-exit-slide-down {
  0% {
    opacity: 1;
    transform: none;
  }
  100% {
    opacity: 0;
    transform: translateY(var(--blu-motion-distance));
  }
}
.blu-motion-enter-slide-left {
  animation: blu-motion-enter-slide-left var(--blu-motion-duration) var(--blu-motion-ease) var(--blu-motion-delay) both;
}
@keyframes blu-motion-enter-slide-left {
  0% {
    opacity: 0;
    transform: translateX(var(--blu-motion-distance));
  }
  100% {
    opacity: 1;
    transform: none;
  }
}
.blu-motion-exit-slide-left {
  animation: blu-motion-exit-slide-left var(--blu-motion-duration) var(--blu-motion-ease) var(--blu-motion-delay) both;
}
@keyframes blu-motion-exit-slide-left {
  0% {
    opacity: 1;
    transform: none;
  }
  100% {
    opacity: 0;
    transform: translateX(calc(-1 * var(--blu-motion-distance)));
  }
}
.blu-motion-enter-slide-right {
  animation: blu-motion-enter-slide-right var(--blu-motion-duration) var(--blu-motion-ease) var(--blu-motion-delay) both;
}
@keyframes blu-motion-enter-slide-right {
  0% {
    opacity: 0;
    transform: translateX(calc(-1 * var(--blu-motion-distance)));
  }
  100% {
    opacity: 1;
    transform: none;
  }
}
.blu-motion-exit-slide-right {
  animation: blu-motion-exit-slide-right var(--blu-motion-duration) var(--blu-motion-ease) var(--blu-motion-delay) both;
}
@keyframes blu-motion-exit-slide-right {
  0% {
    opacity: 1;
    transform: none;
  }
  100% {
    opacity: 0;
    transform: translateX(var(--blu-motion-distance));
  }
}
.blu-motion-enter-zoom-in,
.blu-motion-scale-in {
  animation: blu-motion-enter-zoom-in var(--blu-motion-duration) var(--blu-motion-ease) var(--blu-motion-delay) both;
}
@keyframes blu-motion-enter-zoom-in {
  0% {
    opacity: 0;
    transform: scale(.92);
  }
  100% {
    opacity: 1;
    transform: none;
  }
}
.blu-motion-exit-zoom-in {
  animation: blu-motion-exit-zoom-in var(--blu-motion-duration) var(--blu-motion-ease) var(--blu-motion-delay) both;
}
@keyframes blu-motion-exit-zoom-in {
  0% {
    opacity: 1;
    transform: none;
  }
  100% {
    opacity: 0;
    transform: scale(1.08);
  }
}
.blu-motion-enter-zoom-out {
  animation: blu-motion-enter-zoom-out var(--blu-motion-duration) var(--blu-motion-ease) var(--blu-motion-delay) both;
}
@keyframes blu-motion-enter-zoom-out {
  0% {
    opacity: 0;
    transform: scale(1.08);
  }
  100% {
    opacity: 1;
    transform: none;
  }
}
.blu-motion-exit-zoom-out {
  animation: blu-motion-exit-zoom-out var(--blu-motion-duration) var(--blu-motion-ease) var(--blu-motion-delay) both;
}
@keyframes blu-motion-exit-zoom-out {
  0% {
    opacity: 1;
    transform: none;
  }
  100% {
    opacity: 0;
    transform: scale(.92);
  }
}
.blu-motion-enter-rotate-left {
  animation: blu-motion-enter-rotate-left var(--blu-motion-duration) var(--blu-motion-ease) var(--blu-motion-delay) both;
}
@keyframes blu-motion-enter-rotate-left {
  0% {
    opacity: 0;
    transform: rotate(8deg) scale(.97);
  }
  100% {
    opacity: 1;
    transform: none;
  }
}
.blu-motion-exit-rotate-left {
  animation: blu-motion-exit-rotate-left var(--blu-motion-duration) var(--blu-motion-ease) var(--blu-motion-delay) both;
}
@keyframes blu-motion-exit-rotate-left {
  0% {
    opacity: 1;
    transform: none;
  }
  100% {
    opacity: 0;
    transform: rotate(-8deg) scale(.97);
  }
}
.blu-motion-enter-rotate-right {
  animation: blu-motion-enter-rotate-right var(--blu-motion-duration) var(--blu-motion-ease) var(--blu-motion-delay) both;
}
@keyframes blu-motion-enter-rotate-right {
  0% {
    opacity: 0;
    transform: rotate(-8deg) scale(.97);
  }
  100% {
    opacity: 1;
    transform: none;
  }
}
.blu-motion-exit-rotate-right {
  animation: blu-motion-exit-rotate-right var(--blu-motion-duration) var(--blu-motion-ease) var(--blu-motion-delay) both;
}
@keyframes blu-motion-exit-rotate-right {
  0% {
    opacity: 1;
    transform: none;
  }
  100% {
    opacity: 0;
    transform: rotate(8deg) scale(.97);
  }
}
.blu-motion-enter-flip-x {
  animation: blu-motion-enter-flip-x var(--blu-motion-duration) var(--blu-motion-ease) var(--blu-motion-delay) both;
}
@keyframes blu-motion-enter-flip-x {
  0% {
    opacity: 0;
    transform: perspective(600px) rotateX(30deg);
  }
  100% {
    opacity: 1;
    transform: none;
  }
}
.blu-motion-exit-flip-x {
  animation: blu-motion-exit-flip-x var(--blu-motion-duration) var(--blu-motion-ease) var(--blu-motion-delay) both;
}
@keyframes blu-motion-exit-flip-x {
  0% {
    opacity: 1;
    transform: none;
  }
  100% {
    opacity: 0;
    transform: perspective(600px) rotateX(-30deg);
  }
}
.blu-motion-enter-flip-y {
  animation: blu-motion-enter-flip-y var(--blu-motion-duration) var(--blu-motion-ease) var(--blu-motion-delay) both;
}
@keyframes blu-motion-enter-flip-y {
  0% {
    opacity: 0;
    transform: perspective(600px) rotateY(30deg);
  }
  100% {
    opacity: 1;
    transform: none;
  }
}
.blu-motion-exit-flip-y {
  animation: blu-motion-exit-flip-y var(--blu-motion-duration) var(--blu-motion-ease) var(--blu-motion-delay) both;
}
@keyframes blu-motion-exit-flip-y {
  0% {
    opacity: 1;
    transform: none;
  }
  100% {
    opacity: 0;
    transform: perspective(600px) rotateY(-30deg);
  }
}
.blu-motion-enter-pop {
  animation: blu-motion-enter-pop var(--blu-motion-duration) var(--blu-motion-ease) var(--blu-motion-delay) both;
}
@keyframes blu-motion-enter-pop {
  0% {
    opacity: 0;
    transform: scale(.9);
  }
  72% {
    opacity: 1;
    transform: scale(1.025);
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}
.blu-motion-exit-pop {
  animation: blu-motion-exit-pop var(--blu-motion-duration) var(--blu-motion-ease) var(--blu-motion-delay) both;
}
@keyframes blu-motion-exit-pop {
  0% {
    opacity: 1;
    transform: scale(1);
  }
  25% {
    opacity: 1;
    transform: scale(1.025);
  }
  100% {
    opacity: 0;
    transform: scale(.9);
  }
}
.blu-motion-enter-bounce {
  animation: blu-motion-enter-bounce var(--blu-motion-duration) var(--blu-motion-ease) var(--blu-motion-delay) both;
}
@keyframes blu-motion-enter-bounce {
  0% {
    opacity: 0;
    transform: translateY(var(--blu-motion-distance));
  }
  72% {
    opacity: 1;
    transform: translateY(-3px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
.blu-motion-exit-bounce {
  animation: blu-motion-exit-bounce var(--blu-motion-duration) var(--blu-motion-ease) var(--blu-motion-delay) both;
}
@keyframes blu-motion-exit-bounce {
  0% {
    opacity: 1;
    transform: translateY(0);
  }
  25% {
    opacity: 1;
    transform: translateY(-3px);
  }
  100% {
    opacity: 0;
    transform: translateY(var(--blu-motion-distance));
  }
}
.blu-motion-enter-wipe-up {
  animation: blu-motion-enter-wipe-up var(--blu-motion-duration) var(--blu-motion-ease) var(--blu-motion-delay) both;
}
@keyframes blu-motion-enter-wipe-up {
  0% {
    opacity: 0;
    clip-path: inset(100% 0 0 0);
  }
  100% {
    opacity: 1;
    clip-path: inset(0 0 0 0);
  }
}
.blu-motion-exit-wipe-up {
  animation: blu-motion-exit-wipe-up var(--blu-motion-duration) var(--blu-motion-ease) var(--blu-motion-delay) both;
}
@keyframes blu-motion-exit-wipe-up {
  0% {
    opacity: 1;
    clip-path: inset(0 0 0 0);
  }
  100% {
    opacity: 0;
    clip-path: inset(0 0 100% 0);
  }
}
.blu-motion-enter-wipe-down {
  animation: blu-motion-enter-wipe-down var(--blu-motion-duration) var(--blu-motion-ease) var(--blu-motion-delay) both;
}
@keyframes blu-motion-enter-wipe-down {
  0% {
    opacity: 0;
    clip-path: inset(0 0 100% 0);
  }
  100% {
    opacity: 1;
    clip-path: inset(0 0 0 0);
  }
}
.blu-motion-exit-wipe-down {
  animation: blu-motion-exit-wipe-down var(--blu-motion-duration) var(--blu-motion-ease) var(--blu-motion-delay) both;
}
@keyframes blu-motion-exit-wipe-down {
  0% {
    opacity: 1;
    clip-path: inset(0 0 0 0);
  }
  100% {
    opacity: 0;
    clip-path: inset(100% 0 0 0);
  }
}
.blu-motion-enter-wipe-left {
  animation: blu-motion-enter-wipe-left var(--blu-motion-duration) var(--blu-motion-ease) var(--blu-motion-delay) both;
}
@keyframes blu-motion-enter-wipe-left {
  0% {
    opacity: 0;
    clip-path: inset(0 0 0 100%);
  }
  100% {
    opacity: 1;
    clip-path: inset(0 0 0 0);
  }
}
.blu-motion-exit-wipe-left {
  animation: blu-motion-exit-wipe-left var(--blu-motion-duration) var(--blu-motion-ease) var(--blu-motion-delay) both;
}
@keyframes blu-motion-exit-wipe-left {
  0% {
    opacity: 1;
    clip-path: inset(0 0 0 0);
  }
  100% {
    opacity: 0;
    clip-path: inset(0 100% 0 0);
  }
}
.blu-motion-enter-wipe-right {
  animation: blu-motion-enter-wipe-right var(--blu-motion-duration) var(--blu-motion-ease) var(--blu-motion-delay) both;
}
@keyframes blu-motion-enter-wipe-right {
  0% {
    opacity: 0;
    clip-path: inset(0 100% 0 0);
  }
  100% {
    opacity: 1;
    clip-path: inset(0 0 0 0);
  }
}
.blu-motion-exit-wipe-right {
  animation: blu-motion-exit-wipe-right var(--blu-motion-duration) var(--blu-motion-ease) var(--blu-motion-delay) both;
}
@keyframes blu-motion-exit-wipe-right {
  0% {
    opacity: 1;
    clip-path: inset(0 0 0 0);
  }
  100% {
    opacity: 0;
    clip-path: inset(0 0 0 100%);
  }
}
.blu-motion-enter-circle-reveal {
  animation: blu-motion-enter-circle-reveal var(--blu-motion-duration) var(--blu-motion-ease) var(--blu-motion-delay) both;
}
@keyframes blu-motion-enter-circle-reveal {
  0% {
    opacity: 0;
    clip-path: circle(0% at 50% 50%);
  }
  100% {
    opacity: 1;
    clip-path: circle(72% at 50% 50%);
  }
}
.blu-motion-exit-circle-reveal {
  animation: blu-motion-exit-circle-reveal var(--blu-motion-duration) var(--blu-motion-ease) var(--blu-motion-delay) both;
}
@keyframes blu-motion-exit-circle-reveal {
  0% {
    opacity: 1;
    clip-path: circle(72% at 50% 50%);
  }
  100% {
    opacity: 0;
    clip-path: circle(0% at 50% 50%);
  }
}
.blu-motion-enter-blur-clear {
  animation: blu-motion-enter-blur-clear var(--blu-motion-duration) var(--blu-motion-ease) var(--blu-motion-delay) both;
}
@keyframes blu-motion-enter-blur-clear {
  0% {
    opacity: 0;
    filter: blur(6px);
  }
  100% {
    opacity: 1;
    filter: blur(0px);
  }
}
.blu-motion-exit-blur-clear {
  animation: blu-motion-exit-blur-clear var(--blu-motion-duration) var(--blu-motion-ease) var(--blu-motion-delay) both;
}
@keyframes blu-motion-exit-blur-clear {
  0% {
    opacity: 1;
    filter: blur(0px);
  }
  100% {
    opacity: 0;
    filter: blur(6px);
  }
}
.blu-motion-ease-standard {
  --blu-motion-ease: cubic-bezier(.2,.8,.2,1);
}
.blu-motion-ease-in {
  --blu-motion-ease: cubic-bezier(.42,0,1,1);
}
.blu-motion-ease-out {
  --blu-motion-ease: cubic-bezier(0,0,.58,1);
}
.blu-motion-ease-in-out {
  --blu-motion-ease: cubic-bezier(.42,0,.58,1);
}
.blu-motion-ease-linear {
  --blu-motion-ease: linear;
}
.blu-motion-ease-spring {
  --blu-motion-ease: cubic-bezier(.34,1.25,.64,1);
}
.blu-motion-origin-center {
  transform-origin: 50% 50%;
}
.blu-motion-origin-top {
  transform-origin: 50% 0%;
}
.blu-motion-origin-bottom {
  transform-origin: 50% 100%;
}
.blu-motion-origin-left {
  transform-origin: 0% 50%;
}
.blu-motion-origin-right {
  transform-origin: 100% 50%;
}
.blu-motion-origin-top-left {
  transform-origin: 0% 0%;
}
.blu-motion-origin-top-right {
  transform-origin: 100% 0%;
}
.blu-motion-origin-bottom-left {
  transform-origin: 0% 100%;
}
.blu-motion-origin-bottom-right {
  transform-origin: 100% 100%;
}

/* styles/motion-tokens.css */
:root {
  --blu-motion-fast: 280ms;
  --blu-motion-normal: 450ms;
  --blu-motion-slow: 750ms;
}

/* styles/motion-optional.css */
.blu-motion-ripple,
.blu-motion-shimmer {
  position: absolute;
  inset: 0;
  overflow: hidden;
  border-radius: inherit;
  pointer-events: none !important;
}
.blu-motion-ripple__wave {
  position: absolute;
  border-radius: 50%;
  background: var(--blu-ripple-color,currentColor);
  pointer-events: none !important;
  opacity: 0;
}
.blu-motion-choice-ripple {
  inset: -10px;
  border-radius: 999px;
  --blu-ripple-color:var(--bluui-primary,#4f46e5);
}
.blu-motion-shimmer__beam {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(
      100deg,
      transparent 20%,
      var(--blu-shimmer-color,#ffffffb8) 50%,
      transparent 80%);
  animation: blu-motion-shimmer var(--blu-shimmer-duration,1800ms) ease-in-out infinite;
}
@keyframes blu-motion-shimmer {
  from {
    transform: translateX(-100%);
  }
  to {
    transform: translateX(100%);
  }
}
.blu-motion-shimmer[data-paused=true] .blu-motion-shimmer__beam {
  animation-play-state: paused;
}
.blu-motion-icon {
  display: block;
  width: 24px;
  height: 24px;
  overflow: visible;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
  pointer-events: none;
}
.blu-motion-emphasis {
  position: absolute;
  pointer-events: none !important;
  color: var(--blu-emphasis-color,currentColor);
}
.blu-motion-emphasis--underline {
  inset: auto 0 0;
  height: 2px;
  background: currentColor;
  transform-origin: left center;
  border-radius: 2px;
}
.blu-motion-emphasis--border {
  inset: 0;
  border-radius: inherit;
}
.blu-motion-emphasis--border svg {
  display: block;
  width: 100%;
  height: 100%;
  fill: none;
  stroke: currentColor;
  stroke-width: 2px;
}
:is([data-blu-motion=reduced], [data-blu-motion=off], .blu-motion-off) :is(.blu-motion-shimmer__beam, .blu-motion-ripple__wave) {
  display: none;
  animation: none !important;
}
@media (prefers-reduced-motion: reduce) {
  .blu-motion-shimmer__beam,
  .blu-motion-ripple__wave {
    display: none;
    animation: none !important;
  }
}
@media (forced-colors: active) {
  .blu-motion-shimmer__beam,
  .blu-motion-ripple__wave {
    display: none;
  }
  .blu-motion-emphasis {
    color: Highlight;
  }
}

/* styles/motion.css */
:root {
  --blu-motion-duration: var(--blu-motion-normal);
  --blu-motion-delay: 0ms;
  --blu-motion-distance: 12px;
  --blu-motion-ease: cubic-bezier(.2, .8, .2, 1);
}
.blu-motion-fast {
  --blu-motion-duration: var(--blu-motion-fast);
}
.blu-motion-slow {
  --blu-motion-duration: var(--blu-motion-slow);
}
.blu-motion-delay-1 {
  --blu-motion-delay: 60ms;
}
.blu-motion-delay-2 {
  --blu-motion-delay: 120ms;
}
.blu-motion-delay-3 {
  --blu-motion-delay: 180ms;
}
.blu-motion-spin {
  animation: blu-motion-spin 800ms linear infinite;
}
.blu-motion-pulse {
  animation: blu-motion-pulse 900ms ease-in-out 3;
}
.blu-motion-hover-lift {
  transition: transform var(--blu-motion-duration) var(--blu-motion-ease), box-shadow var(--blu-motion-duration) var(--blu-motion-ease);
}
@media (hover: hover) {
  .blu-motion-hover-lift:hover {
    transform: translateY(calc(-1 * var(--blu-motion-lift-distance, 4px)));
    box-shadow: 0 8px 20px #28334b12;
  }
}
.blu-motion-hover-lift:is(:focus-visible, [data-blu-lifted=true]) {
  transform: translateY(calc(-1 * var(--blu-motion-lift-distance, 4px)));
  box-shadow: 0 8px 20px #28334b12;
}
.blu-motion-expand {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows var(--blu-motion-duration) var(--blu-motion-ease);
}
.blu-motion-expand[data-open=true] {
  grid-template-rows: 1fr;
}
.blu-motion-expand > * {
  min-height: 0;
  overflow: hidden;
}
@keyframes blu-motion-spin {
  to {
    transform: rotate(360deg);
  }
}
@keyframes blu-motion-pulse {
  50% {
    opacity: .45;
  }
}
.blu-motion-button.blu-button {
  display: inline-grid;
  gap: 0;
  transition-duration: var(--blu-motion-duration);
}
.blu-motion-button__face,
.blu-motion-button__reserve {
  grid-area: 1 / 1;
  padding-inline: 24px;
}
.blu-motion-button__face {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.blu-motion-button__reserve {
  visibility: hidden;
  pointer-events: none;
}
.blu-motion-button .blu-button__spinner {
  position: absolute;
  inset-inline-start: 0;
}
.blu-motion-button[data-spinner-position=Trailing] .blu-button__spinner {
  inset-inline-start: auto;
  inset-inline-end: 0;
}
.blu-motion-button .blu-button__spinner[hidden] {
  display: none;
}
.blu-motion-button.blu-button--loading {
  pointer-events: auto;
}
.blu-motion-sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}
.blu-loading {
  display: flex;
  align-items: center;
  gap: 10px;
  font: inherit;
  color: inherit;
}
.blu-loading [hidden] {
  display: none !important;
}
.blu-loading__visual {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
}
.blu-loading[data-variant=Spinner] .blu-loading__visual {
  border: 2px solid currentColor;
  border-right-color: transparent;
  border-radius: 50%;
  animation: blu-motion-spin 800ms linear infinite;
}
.blu-loading[data-variant=Spinner] i {
  display: none;
}
.blu-loading[data-variant=Dots] .blu-loading__visual {
  display: flex;
  align-items: center;
  width: 32px;
  gap: 3px;
}
.blu-loading[data-variant=Dots] i {
  width: 7px;
  height: 7px;
  background: currentColor;
  border-radius: 50%;
  animation: blu-motion-pulse 900ms ease-in-out infinite;
}
.blu-loading[data-variant=Dots] i:nth-child(2) {
  animation-delay: 150ms;
}
.blu-loading[data-variant=Dots] i:nth-child(3) {
  animation-delay: 300ms;
}
.blu-loading progress {
  width: 100%;
  height: 8px;
  accent-color: var(--bluui-primary, #5145e5);
  border: 0;
  border-radius: 8px;
  background: #e7e8f1;
  overflow: hidden;
}
.blu-loading progress::-webkit-progress-bar {
  background: #e7e8f1;
  border-radius: 8px;
}
.blu-loading progress::-webkit-progress-value {
  background: var(--bluui-primary, #5145e5);
  border-radius: 8px;
}
.blu-loading progress::-moz-progress-bar {
  background: var(--bluui-primary, #5145e5);
}
.blu-loading[data-variant=Bar] {
  flex-direction: column;
  align-items: stretch;
}
.blu-loading__bar {
  height: 8px;
  overflow: hidden;
  border-radius: 8px;
  background: #e7e8f1;
}
.blu-loading__bar::after {
  content: "";
  display: block;
  width: 35%;
  height: 100%;
  background: var(--bluui-primary, #5145e5);
  border-radius: inherit;
  animation: blu-motion-progress 1.2s ease-in-out infinite alternate;
}
@keyframes blu-motion-progress {
  to {
    transform: translateX(185%);
  }
}
:is([data-blu-motion=off], [data-blu-motion=reduced], .blu-motion-off),
:is([data-blu-motion=off], [data-blu-motion=reduced], .blu-motion-off) * {
  --blu-motion-duration: 0ms;
  --blu-motion-delay: 0ms;
}
:is([data-blu-motion=off], [data-blu-motion=reduced], .blu-motion-off) :is([class*=blu-motion-], .blu-button__spinner, .blu-loading__visual, .blu-loading i),
:is([data-blu-motion=off], [data-blu-motion=reduced], .blu-motion-off)[class*=blu-motion-],
.blu-motion-off {
  animation: none !important;
  transition: none !important;
}
:is([data-blu-motion=off], [data-blu-motion=reduced], .blu-motion-off) .blu-loading__bar::after {
  animation: none !important;
}
:is([data-blu-motion=off], [data-blu-motion=reduced], .blu-motion-off) .blu-motion-hover-lift:is(:hover, :focus-visible, [data-blu-lifted=true]) {
  transform: none;
}
@media (prefers-reduced-motion: reduce) {
  [class*=blu-motion-],
  .blu-button__spinner,
  .blu-loading__visual,
  .blu-loading i,
  .blu-loading__bar::after {
    animation: none !important;
    transition: none !important;
  }
  .blu-motion-hover-lift:is(:hover, :focus-visible, [data-blu-lifted=true]) {
    transform: none;
  }
}
.blu-motion-press[data-blu-pressed=true] {
  transform: scale(.97);
}
.blu-motion-highlight {
  animation: blu-motion-highlight 1400ms ease-in-out 1;
}
.blu-motion-nudge {
  animation: blu-motion-nudge 280ms var(--blu-motion-ease) 1;
}
@keyframes blu-motion-highlight {
  45% {
    box-shadow: 0 0 0 4px var(--blu-motion-highlight, #7770ed40);
  }
}
@keyframes blu-motion-nudge {
  25% {
    transform: translateX(-3px);
  }
  60% {
    transform: translateX(3px);
  }
}
:is([data-blu-motion=off], [data-blu-motion=reduced], .blu-motion-off) .blu-motion-press[data-blu-pressed=true],
.blu-motion-press.blu-motion-off[data-blu-pressed=true] {
  transform: none;
}
@media (prefers-reduced-motion: reduce) {
  .blu-motion-press[data-blu-pressed=true] {
    transform: none;
  }
}
.blu-motion-photo-frame {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}
.blu-motion-photo-frame > img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.blu-motion-border-glow {
  position: absolute;
  inset: -1px;
  border-radius: inherit;
  pointer-events: none !important;
  z-index: 1;
  filter: drop-shadow(0 0 4px var(--blu-glow-halo,#9b85ee80));
}
.blu-motion-border-glow__rim {
  position: absolute;
  inset: 0;
  padding: var(--blu-glow-width,2px);
  border-radius: inherit;
  overflow: hidden;
  pointer-events: none !important;
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  mask-composite: exclude;
}
.blu-motion-border-glow__beam {
  position: absolute;
  left: 50%;
  top: 50%;
  width: var(--blu-glow-size,1800px);
  height: var(--blu-glow-size,1800px);
  background:
    conic-gradient(
      transparent 0deg,
      transparent 240deg,
      var(--blu-glow-tail,#b5a4ef60) 265deg,
      var(--blu-glow-color,#8060dd) 295deg,
      var(--blu-glow-tip,#d7c6ff) 315deg,
      transparent 340deg);
  transform: translate(-50%, -50%) rotate(0turn);
  animation: blu-border-orbit var(--blu-glow-duration,12s) linear infinite;
}
.blu-motion-border-glow[data-paused=true] .blu-motion-border-glow__beam {
  animation-play-state: paused;
}
@keyframes blu-border-orbit {
  from {
    transform: translate(-50%, -50%) rotate(0turn);
  }
  to {
    transform: translate(-50%, -50%) rotate(1turn);
  }
}
:is([data-blu-motion=reduced], [data-blu-motion=off], .blu-motion-off) .blu-motion-border-glow {
  filter: none;
}
:is([data-blu-motion=reduced], [data-blu-motion=off], .blu-motion-off) .blu-motion-border-glow__rim {
  background: var(--blu-glow-static,#b5a4ef80);
}
:is([data-blu-motion=reduced], [data-blu-motion=off], .blu-motion-off) .blu-motion-border-glow__beam {
  animation: none !important;
  display: none;
}
@media (prefers-reduced-motion: reduce) {
  .blu-motion-border-glow {
    filter: none;
  }
  .blu-motion-border-glow__rim {
    background: var(--blu-glow-static,#b5a4ef80);
  }
  .blu-motion-border-glow__beam {
    animation: none !important;
    display: none;
  }
}
@media (forced-colors: active) {
  .blu-motion-border-glow {
    display: none;
  }
}
[data-blu-content-motion] .blu-profile-card {
  transition: translate var(--blu-component-motion-duration,450ms) var(--blu-component-motion-ease,ease-in-out);
}
[data-blu-content-motion] .blu-profile-card:is(:hover, :focus-within) {
  translate: 0 -4px;
}
:is([data-blu-motion=reduced], [data-blu-motion=off], .blu-motion-off) [data-blu-content-motion] .blu-profile-card,
[data-blu-content-motion]:is([data-blu-motion=reduced], [data-blu-motion=off], .blu-motion-off) .blu-profile-card {
  translate: none;
  transition: none;
}
[data-blu-content-motion] :is(.blu-tree-select__check, .blu-video-player__heatmap) {
  transition-duration: var(--blu-component-motion-duration,450ms);
  transition-timing-function: var(--blu-component-motion-ease,ease-in-out);
}
:is([data-blu-motion=reduced], [data-blu-motion=off], .blu-motion-off) [data-blu-content-motion] :is(.blu-tree-select__check, .blu-video-player__heatmap) {
  transition: none;
}
@media (prefers-reduced-motion: reduce) {
  [data-blu-content-motion] .blu-profile-card {
    translate: none;
    transition: none;
  }
}
[data-blu-content-motion=chip] .blu-chip__select {
  border-radius: inherit;
}
[data-blu-content-motion=skeleton] .blu-skeleton--animated::after {
  animation-duration: 1800ms;
  animation-iteration-count: 2;
}
[data-blu-component-motion=statistic] .blu-statistic__loading {
  animation-duration: 1800ms;
  animation-iteration-count: 2;
}
:is([data-blu-motion=reduced], [data-blu-motion=off], .blu-motion-off) [data-blu-content-motion=skeleton] .blu-skeleton--animated::after {
  animation: none !important;
  display: none;
}
:is([data-blu-motion=reduced], [data-blu-motion=off], .blu-motion-off) [data-blu-component-motion=statistic] .blu-statistic__loading {
  animation: none !important;
}
@media (prefers-reduced-motion: reduce) {
  [data-blu-content-motion=skeleton] .blu-skeleton--animated::after {
    animation: none !important;
    display: none;
  }
  [data-blu-component-motion=statistic] .blu-statistic__loading {
    animation: none !important;
  }
}
[data-blu-content-motion=media-image] img {
  transition-duration: var(--blu-component-motion-duration,650ms);
  transition-timing-function: var(--blu-component-motion-ease,ease-in-out);
}
:is([data-blu-motion=reduced], [data-blu-motion=off], .blu-motion-off) [data-blu-content-motion=media-image] img {
  transition: none !important;
  transform: none !important;
}
[data-blu-content-motion] .blu-button {
  transition-duration: var(--blu-component-motion-duration,280ms);
}
:is([data-blu-motion=reduced], [data-blu-motion=off], .blu-motion-off) [data-blu-content-motion] *,
:is([data-blu-motion=reduced], [data-blu-motion=off], .blu-motion-off) [data-blu-content-motion] *::before,
:is([data-blu-motion=reduced], [data-blu-motion=off], .blu-motion-off) [data-blu-content-motion] *::after,
[data-blu-content-motion]:is([data-blu-motion=reduced], [data-blu-motion=off], .blu-motion-off) *,
[data-blu-content-motion]:is([data-blu-motion=reduced], [data-blu-motion=off], .blu-motion-off) *::before,
[data-blu-content-motion]:is([data-blu-motion=reduced], [data-blu-motion=off], .blu-motion-off) *::after {
  transition: none !important;
  animation: none !important;
}