/* monovanilla-animations.css - MonoVanilla keyframes + overlay transition classes. */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    -webkit-animation-duration: .01ms !important;
            animation-duration: .01ms !important;
    -webkit-animation-iteration-count: 1 !important;
            animation-iteration-count: 1 !important;
    -webkit-transition-duration: .01ms !important;
            transition-duration: .01ms !important;
  }
}

@-webkit-keyframes spin { to { -webkit-transform: rotate(360deg); } }
@keyframes spin { to { -webkit-transform: rotate(360deg); transform: rotate(360deg); } }

@-webkit-keyframes ping { 75%, to { opacity: 0; -webkit-transform: scale(2); } }
@keyframes ping { 75%, to { opacity: 0; -webkit-transform: scale(2); transform: scale(2); } }

@-webkit-keyframes pulse { 50% { opacity: .5; } }
@keyframes pulse { 50% { opacity: .5; } }

@-webkit-keyframes rowFade {
  0% { opacity: 0; -webkit-transform: translateY(4px); }
  to { opacity: 1; -webkit-transform: translateY(0); }
}
@keyframes rowFade {
  0% { opacity: 0; -webkit-transform: translateY(4px); transform: translateY(4px); }
  to { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); }
}

@-webkit-keyframes treeNodeIn {
  0% { opacity: 0; -webkit-transform: translateY(4px); }
  to { opacity: 1; -webkit-transform: translateY(0); }
}
@keyframes treeNodeIn {
  0% { opacity: 0; -webkit-transform: translateY(4px); transform: translateY(4px); }
  to { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); }
}

@-webkit-keyframes cascaderColIn {
  0% { opacity: 0; -webkit-transform: translateY(4px); }
  to { opacity: 1; -webkit-transform: translateY(0); }
}
@keyframes cascaderColIn {
  0% { opacity: 0; -webkit-transform: translateY(4px); transform: translateY(4px); }
  to { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); }
}

@-webkit-keyframes tipPop {
  0% { opacity: 0; -webkit-filter: blur(4px); -webkit-transform: scale(.85); }
  to { opacity: 1; -webkit-filter: blur(0); -webkit-transform: scale(1); }
}
@keyframes tipPop {
  0% { opacity: 0; -webkit-filter: blur(4px); filter: blur(4px); -webkit-transform: scale(.85); transform: scale(.85); }
  to { opacity: 1; -webkit-filter: blur(0); filter: blur(0); -webkit-transform: scale(1); transform: scale(1); }
}

@-webkit-keyframes colorPanelIn {
  0% { opacity: 0; -webkit-transform: scale(.95); }
  to { opacity: 1; -webkit-transform: scale(1); }
}
@keyframes colorPanelIn {
  0% { opacity: 0; -webkit-transform: scale(.95); transform: scale(.95); }
  to { opacity: 1; -webkit-transform: scale(1); transform: scale(1); }
}

@-webkit-keyframes colorSwatchPop {
  0% { -webkit-transform: scale(.6); }
  to { -webkit-transform: scale(1); }
}
@keyframes colorSwatchPop {
  0% { -webkit-transform: scale(.6); transform: scale(.6); }
  to { -webkit-transform: scale(1); transform: scale(1); }
}

@-webkit-keyframes rateStarPop {
  0% { -webkit-transform: scale(.4); }
  60% { -webkit-transform: scale(1.2); }
  to { -webkit-transform: scale(1); }
}
@keyframes rateStarPop {
  0% { -webkit-transform: scale(.4); transform: scale(.4); }
  60% { -webkit-transform: scale(1.2); transform: scale(1.2); }
  to { -webkit-transform: scale(1); transform: scale(1); }
}

@-webkit-keyframes calendarPanelIn {
  0% { opacity: 0; -webkit-transform: rotateX(12deg) translateY(-4px) scale(.97); }
  to { opacity: 1; -webkit-transform: rotateX(0) translateY(0) scale(1); }
}
@keyframes calendarPanelIn {
  0% { opacity: 0; -webkit-transform: rotateX(12deg) translateY(-4px) scale(.97); transform: rotateX(12deg) translateY(-4px) scale(.97); }
  to { opacity: 1; -webkit-transform: rotateX(0) translateY(0) scale(1); transform: rotateX(0) translateY(0) scale(1); }
}

@-webkit-keyframes calendarMonthInRight {
  0% { opacity: 0; -webkit-transform: translate(28px); }
  to { opacity: 1; -webkit-transform: translate(0); }
}
@keyframes calendarMonthInRight {
  0% { opacity: 0; -webkit-transform: translate(28px); transform: translate(28px); }
  to { opacity: 1; -webkit-transform: translate(0); transform: translate(0); }
}

@-webkit-keyframes calendarMonthInLeft {
  0% { opacity: 0; -webkit-transform: translate(-28px); }
  to { opacity: 1; -webkit-transform: translate(0); }
}
@keyframes calendarMonthInLeft {
  0% { opacity: 0; -webkit-transform: translate(-28px); transform: translate(-28px); }
  to { opacity: 1; -webkit-transform: translate(0); transform: translate(0); }
}

@-webkit-keyframes kineticShimmer {
  0% { -webkit-transform: translate(-100%); }
  45% { -webkit-transform: translate(100%); }
  to { -webkit-transform: translate(100%); }
}
@keyframes kineticShimmer {
  0% { -webkit-transform: translate(-100%); transform: translate(-100%); }
  45% { -webkit-transform: translate(100%); transform: translate(100%); }
  to { -webkit-transform: translate(100%); transform: translate(100%); }
}

@-webkit-keyframes mvTextShimmer {
  0% { background-position: 100% 0; }
  to { background-position: -100% 0; }
}
@keyframes mvTextShimmer {
  0% { background-position: 100% 0; }
  to { background-position: -100% 0; }
}

@-webkit-keyframes progressStripe {
  0% { background-position: 1rem 0; }
  to { background-position: 0 0; }
}
@keyframes progressStripe {
  0% { background-position: 1rem 0; }
  to { background-position: 0 0; }
}

@-webkit-keyframes shake {
  0%, to { -webkit-transform: translate(0); }
  20%, 60% { -webkit-transform: translate(-4px); }
  40%, 80% { -webkit-transform: translate(4px); }
}
@keyframes shake {
  0%, to { -webkit-transform: translate(0); transform: translate(0); }
  20%, 60% { -webkit-transform: translate(-4px); transform: translate(-4px); }
  40%, 80% { -webkit-transform: translate(4px); transform: translate(4px); }
}

@-webkit-keyframes uploadBreath {
  0%, to {
    border-color: rgb(24, 24, 27);
    border-color: var(--mv-ring, rgb(24, 24, 27));
    box-shadow: 0 0 rgba(24, 24, 27, 0);
  }
  50% {
    border-color: rgb(24, 24, 27);
    border-color: var(--mv-ring, rgb(24, 24, 27));
    box-shadow: 0 0 0 6px rgba(24, 24, 27, .12);
  }
}
@keyframes uploadBreath {
  0%, to {
    border-color: rgb(24, 24, 27);
    border-color: var(--mv-ring, rgb(24, 24, 27));
    box-shadow: 0 0 rgba(24, 24, 27, 0);
  }
  50% {
    border-color: rgb(24, 24, 27);
    border-color: var(--mv-ring, rgb(24, 24, 27));
    box-shadow: 0 0 0 6px rgba(24, 24, 27, .12);
  }
}

.animate-spin { -webkit-animation: spin 1s linear infinite; animation: spin 1s linear infinite; }
.animate-ping { -webkit-animation: ping 1s cubic-bezier(0, 0, .2, 1) infinite; animation: ping 1s cubic-bezier(0, 0, .2, 1) infinite; }
.animate-pulse { -webkit-animation: pulse 2s cubic-bezier(.4, 0, .6, 1) infinite; animation: pulse 2s cubic-bezier(.4, 0, .6, 1) infinite; }

.animate-row-fade { -webkit-animation: rowFade .3s cubic-bezier(.16, 1, .3, 1) both; animation: rowFade .3s cubic-bezier(.16, 1, .3, 1) both; }
.animate-cascader-col { -webkit-animation: cascaderColIn .28s cubic-bezier(.16, 1, .3, 1) both; animation: cascaderColIn .28s cubic-bezier(.16, 1, .3, 1) both; }
.tree-node-item { -webkit-animation: treeNodeIn .28s cubic-bezier(.16, 1, .3, 1) both; animation: treeNodeIn .28s cubic-bezier(.16, 1, .3, 1) both; }
.animate-tip-pop { -webkit-animation: tipPop .3s cubic-bezier(.16, 1, .3, 1) forwards; animation: tipPop .3s cubic-bezier(.16, 1, .3, 1) forwards; }
.color-panel-enter-active { -webkit-animation: colorPanelIn .32s cubic-bezier(.16, 1, .3, 1); animation: colorPanelIn .32s cubic-bezier(.16, 1, .3, 1); }
.color-swatch-pop { -webkit-animation: colorSwatchPop .25s cubic-bezier(.34, 1.56, .64, 1) both; animation: colorSwatchPop .25s cubic-bezier(.34, 1.56, .64, 1) both; }
.rate-star-pop { -webkit-animation: rateStarPop .3s cubic-bezier(.34, 1.56, .64, 1) both; animation: rateStarPop .3s cubic-bezier(.34, 1.56, .64, 1) both; }
.calendar-panel-enter-active { -webkit-animation: calendarPanelIn .32s cubic-bezier(.16, 1, .3, 1); animation: calendarPanelIn .32s cubic-bezier(.16, 1, .3, 1); }
.calendar-view-enter-right { -webkit-animation: calendarMonthInRight .32s cubic-bezier(.16, 1, .3, 1); animation: calendarMonthInRight .32s cubic-bezier(.16, 1, .3, 1); }
.calendar-view-enter-left { -webkit-animation: calendarMonthInLeft .32s cubic-bezier(.16, 1, .3, 1); animation: calendarMonthInLeft .32s cubic-bezier(.16, 1, .3, 1); }

.animate-kinetic-shimmer { -webkit-animation: kineticShimmer 1.8s cubic-bezier(.85, 0, .15, 1) infinite; animation: kineticShimmer 1.8s cubic-bezier(.85, 0, .15, 1) infinite; }
.animate-progress-stripe { -webkit-animation: progressStripe 1s linear infinite; animation: progressStripe 1s linear infinite; }
.table-row-shimmer { -webkit-animation: mvTextShimmer 1.4s ease-in-out infinite; animation: mvTextShimmer 1.4s ease-in-out infinite; }

.mv-text-shimmer {
  -webkit-background-clip: text;
          background-clip: text;
  -webkit-text-fill-color: transparent;
          color: transparent;
  background-image: -webkit-linear-gradient(left, rgba(128, 128, 128, .3) 0%, rgba(128, 128, 128, .7) 50%, rgba(128, 128, 128, .3) 100%);
  background-image: linear-gradient(90deg, rgba(128, 128, 128, .3) 0%, rgba(128, 128, 128, .7) 50%, rgba(128, 128, 128, .3) 100%);
  background-size: 200% 100%;
  -webkit-animation: mvTextShimmer 1.4s ease-in-out infinite;
          animation: mvTextShimmer 1.4s ease-in-out infinite;
  -webkit-transition: color .4s ease, -webkit-text-fill-color .4s ease;
          transition: color .4s ease, -webkit-text-fill-color .4s ease;
}

.animate-shake { -webkit-animation: shake .3s cubic-bezier(.36, .07, .19, .97) both; animation: shake .3s cubic-bezier(.36, .07, .19, .97) both; }
.upload-drag-active { border-color: rgb(24, 24, 27); border-color: var(--mv-ring, rgb(24, 24, 27)); -webkit-animation: uploadBreath 1.4s ease-in-out infinite; animation: uploadBreath 1.4s ease-in-out infinite; }

.mv-stagger > *:nth-child(1)  { -webkit-animation-delay: 0s;    animation-delay: 0s; }
.mv-stagger > *:nth-child(2)  { -webkit-animation-delay: .03s;  animation-delay: .03s; }
.mv-stagger > *:nth-child(3)  { -webkit-animation-delay: .06s;  animation-delay: .06s; }
.mv-stagger > *:nth-child(4)  { -webkit-animation-delay: .09s;  animation-delay: .09s; }
.mv-stagger > *:nth-child(5)  { -webkit-animation-delay: .12s;  animation-delay: .12s; }
.mv-stagger > *:nth-child(6)  { -webkit-animation-delay: .15s;  animation-delay: .15s; }
.mv-stagger > *:nth-child(7)  { -webkit-animation-delay: .18s;  animation-delay: .18s; }
.mv-stagger > *:nth-child(8)  { -webkit-animation-delay: .21s;  animation-delay: .21s; }
.mv-stagger > *:nth-child(9)  { -webkit-animation-delay: .24s;  animation-delay: .24s; }
.mv-stagger > *:nth-child(10) { -webkit-animation-delay: .27s;  animation-delay: .27s; }
.mv-stagger > *:nth-child(11) { -webkit-animation-delay: .30s;  animation-delay: .30s; }
.mv-stagger > *:nth-child(12) { -webkit-animation-delay: .33s;  animation-delay: .33s; }
.mv-stagger > *:nth-child(13) { -webkit-animation-delay: .36s;  animation-delay: .36s; }
.mv-stagger > *:nth-child(14) { -webkit-animation-delay: .39s;  animation-delay: .39s; }
.mv-stagger > *:nth-child(15) { -webkit-animation-delay: .42s;  animation-delay: .42s; }
.mv-stagger > *:nth-child(16) { -webkit-animation-delay: .45s;  animation-delay: .45s; }

.mv-delay-1 { -webkit-animation-delay: .03s; animation-delay: .03s; }
.mv-delay-2 { -webkit-animation-delay: .06s; animation-delay: .06s; }
.mv-delay-3 { -webkit-animation-delay: .09s; animation-delay: .09s; }
.mv-delay-4 { -webkit-animation-delay: .12s; animation-delay: .12s; }
.mv-delay-5 { -webkit-animation-delay: .15s; animation-delay: .15s; }
.mv-delay-6 { -webkit-animation-delay: .18s; animation-delay: .18s; }
.mv-delay-7 { -webkit-animation-delay: .21s; animation-delay: .21s; }
.mv-delay-8 { -webkit-animation-delay: .24s; animation-delay: .24s; }

.mv-collapse { height: 0; overflow: hidden; }
.mv-collapsible { overflow: hidden; }

.mv-enter {
  opacity: 0;
  pointer-events: none;
  -webkit-transform: translateY(6px) scale(.98);
          transform: translateY(6px) scale(.98);
  -webkit-filter: blur(12px);
          filter: blur(12px);
  -webkit-transition: opacity .7s cubic-bezier(.16, 1, .3, 1),
                      -webkit-transform .7s cubic-bezier(.16, 1, .3, 1),
                      -webkit-filter .7s cubic-bezier(.16, 1, .3, 1);
          transition: opacity .7s cubic-bezier(.16, 1, .3, 1),
                      transform .7s cubic-bezier(.16, 1, .3, 1),
                      filter .7s cubic-bezier(.16, 1, .3, 1);
}
.mv-enter-active {
  opacity: 1;
  pointer-events: auto;
  -webkit-transform: translateY(0) scale(1);
          transform: translateY(0) scale(1);
  -webkit-filter: blur(0);
          filter: blur(0);
}

.mv-enter-lite {
  opacity: 0;
  pointer-events: none;
  -webkit-transform: translateY(6px);
          transform: translateY(6px);
  -webkit-transition: opacity .7s cubic-bezier(.16, 1, .3, 1),
                      -webkit-transform .7s cubic-bezier(.16, 1, .3, 1);
          transition: opacity .7s cubic-bezier(.16, 1, .3, 1),
                      transform .7s cubic-bezier(.16, 1, .3, 1);
}
.mv-enter-lite.mv-enter-active {
  opacity: 1;
  pointer-events: auto;
  -webkit-transform: translateY(0);
          transform: translateY(0);
}
.mv-enter-delay-1 { -webkit-transition-delay: .05s; transition-delay: .05s; }
.mv-enter-delay-2 { -webkit-transition-delay: .1s;  transition-delay: .1s; }
.mv-enter-delay-3 { -webkit-transition-delay: .15s; transition-delay: .15s; }
.mv-enter-delay-4 { -webkit-transition-delay: .2s;  transition-delay: .2s; }
.mv-enter-delay-5 { -webkit-transition-delay: .3s;  transition-delay: .3s; }
.mv-enter-delay-6 { -webkit-transition-delay: .4s;  transition-delay: .4s; }

.mv-press {
  -webkit-transition: -webkit-transform .15s cubic-bezier(.4, 0, .2, 1);
          transition: transform .15s cubic-bezier(.4, 0, .2, 1);
}
.mv-press:active {
  -webkit-transform: scale(.97);
          transform: scale(.97);
}
.mv-lift {
  -webkit-transition: -webkit-transform .2s cubic-bezier(.16, 1, .3, 1), box-shadow .2s ease;
          transition: transform .2s cubic-bezier(.16, 1, .3, 1), box-shadow .2s ease;
}

@media (hover: hover) {
  .mv-lift:hover {
    -webkit-transform: translateY(-2px);
            transform: translateY(-2px);
    box-shadow: 0 10px 24px rgba(0, 0, 0, .12);
  }
}

.mv-indicator {
  -webkit-transition: left .28s cubic-bezier(.25, 1, .5, 1), width .28s cubic-bezier(.25, 1, .5, 1);
          transition: left .28s cubic-bezier(.25, 1, .5, 1), width .28s cubic-bezier(.25, 1, .5, 1);
}

.mv-slide-track {
  -webkit-transition: -webkit-transform .5s cubic-bezier(.16, 1, .3, 1);
          transition: transform .5s cubic-bezier(.16, 1, .3, 1);
}

.mv-fade-item { opacity: 0; -webkit-transition: opacity .4s ease; transition: opacity .4s ease; }
.mv-fade-item.mv-fade-on { opacity: 1; }

.mv-reveal {
  max-height: 0;
  opacity: 0;
  overflow: hidden;
  -webkit-transform: translateY(4px);
          transform: translateY(4px);
  -webkit-transition: max-height .3s cubic-bezier(.25, 1, .5, 1), opacity .3s ease, -webkit-transform .3s ease;
          transition: max-height .3s cubic-bezier(.25, 1, .5, 1), opacity .3s ease, transform .3s ease;
}
.mv-reveal.mv-reveal-open {
  max-height: 500px;
  opacity: 1;
  -webkit-transform: translateY(0);
          transform: translateY(0);
}

@supports (animation-delay: var(--x, 0s)) {
  .animate-row-fade {
    -webkit-animation-duration: var(--duration-slow, .3s);
            animation-duration: var(--duration-slow, .3s);
    -webkit-animation-timing-function: var(--ease-swift, cubic-bezier(.16, 1, .3, 1));
            animation-timing-function: var(--ease-swift, cubic-bezier(.16, 1, .3, 1));
    -webkit-animation-delay: var(--row-delay, 0s);
            animation-delay: var(--row-delay, 0s);
  }
  .animate-cascader-col,
  .tree-node-item {
    -webkit-animation-duration: var(--duration-enter, .28s);
            animation-duration: var(--duration-enter, .28s);
    -webkit-animation-timing-function: var(--ease-swift, cubic-bezier(.16, 1, .3, 1));
            animation-timing-function: var(--ease-swift, cubic-bezier(.16, 1, .3, 1));
  }
  .animate-tip-pop {
    -webkit-animation-duration: var(--duration-slow, .3s);
            animation-duration: var(--duration-slow, .3s);
    -webkit-animation-timing-function: var(--ease-swift, cubic-bezier(.16, 1, .3, 1));
            animation-timing-function: var(--ease-swift, cubic-bezier(.16, 1, .3, 1));
  }
  .color-swatch-pop,
  .rate-star-pop {
    -webkit-animation-duration: var(--duration-base, .25s);
            animation-duration: var(--duration-base, .25s);
    -webkit-animation-timing-function: var(--ease-spring, cubic-bezier(.34, 1.56, .64, 1));
            animation-timing-function: var(--ease-spring, cubic-bezier(.34, 1.56, .64, 1));
  }
  .animate-shake {
    -webkit-animation-duration: var(--duration-slow, .3s);
            animation-duration: var(--duration-slow, .3s);
  }
  .mv-text-shimmer {
    -webkit-transition: color var(--duration-slower, .4s) ease, -webkit-text-fill-color var(--duration-slower, .4s) ease;
            transition: color var(--duration-slower, .4s) ease, -webkit-text-fill-color var(--duration-slower, .4s) ease;
  }
}

.message-flip-move,
.message-flip-enter-active,
.message-flip-leave-active {
  -webkit-transition: all .4s cubic-bezier(.16, 1, .3, 1);
          transition: all .4s cubic-bezier(.16, 1, .3, 1);
}
.message-flip-enter-from {
  opacity: 0;
  -webkit-filter: blur(15px); filter: blur(15px);
  -webkit-transform: translateY(-20px) scale(.5);
          transform: translateY(-20px) scale(.5);
}
.message-flip-leave-to {
  opacity: 0;
  -webkit-filter: blur(10px); filter: blur(10px);
  -webkit-transform: translateY(-15px) scale(0);
          transform: translateY(-15px) scale(0);
}

.notif-flip-right-move, .notif-flip-right-enter-active, .notif-flip-right-leave-active,
.notif-flip-left-move,  .notif-flip-left-enter-active,  .notif-flip-left-leave-active,
.notif-flip-top-move,   .notif-flip-top-enter-active,   .notif-flip-top-leave-active,
.notif-flip-bottom-move, .notif-flip-bottom-enter-active, .notif-flip-bottom-leave-active {
  -webkit-transition: all .4s cubic-bezier(.16, 1, .3, 1);
          transition: all .4s cubic-bezier(.16, 1, .3, 1);
}
.message-flip-move,
.notif-flip-right-move, .notif-flip-left-move, .notif-flip-top-move, .notif-flip-bottom-move {
  -webkit-transition: -webkit-transform .4s cubic-bezier(.16, 1, .3, 1);
          transition: transform .4s cubic-bezier(.16, 1, .3, 1);
}
.message-flip-leave-active,
.notif-flip-right-leave-active, .notif-flip-left-leave-active, .notif-flip-top-leave-active, .notif-flip-bottom-leave-active {
  position: absolute;
}
.notif-flip-right-enter-from {
  opacity: 0;
  -webkit-filter: blur(8px); filter: blur(8px);
  -webkit-transform: translate(40px) scale(.95);
          transform: translate(40px) scale(.95);
}
.notif-flip-right-leave-to {
  opacity: 0;
  -webkit-filter: blur(4px); filter: blur(4px);
  -webkit-transform: translate(20px) scale(.95);
          transform: translate(20px) scale(.95);
}
.notif-flip-left-enter-from {
  opacity: 0;
  -webkit-filter: blur(8px); filter: blur(8px);
  -webkit-transform: translate(-40px) scale(.95);
          transform: translate(-40px) scale(.95);
}
.notif-flip-left-leave-to {
  opacity: 0;
  -webkit-filter: blur(4px); filter: blur(4px);
  -webkit-transform: translate(-20px) scale(.95);
          transform: translate(-20px) scale(.95);
}
.notif-flip-top-enter-from {
  opacity: 0;
  -webkit-filter: blur(8px); filter: blur(8px);
  -webkit-transform: translateY(-40px) scale(.95);
          transform: translateY(-40px) scale(.95);
}
.notif-flip-top-leave-to {
  opacity: 0;
  -webkit-filter: blur(4px); filter: blur(4px);
  -webkit-transform: translateY(-20px) scale(.95);
          transform: translateY(-20px) scale(.95);
}
.notif-flip-bottom-enter-from {
  opacity: 0;
  -webkit-filter: blur(8px); filter: blur(8px);
  -webkit-transform: translateY(40px) scale(.95);
          transform: translateY(40px) scale(.95);
}
.notif-flip-bottom-leave-to {
  opacity: 0;
  -webkit-filter: blur(4px); filter: blur(4px);
  -webkit-transform: translateY(20px) scale(.95);
          transform: translateY(20px) scale(.95);
}

.dialog-mask-enter-active,
.dialog-mask-leave-active,
.drawer-mask-enter-active,
.drawer-mask-leave-active {
  -webkit-transition: opacity .4s cubic-bezier(.16, 1, .3, 1);
          transition: opacity .4s cubic-bezier(.16, 1, .3, 1);
}
.dialog-mask-enter-from,
.dialog-mask-leave-to,
.drawer-mask-enter-from,
.drawer-mask-leave-to { opacity: 0; }
.dialog-pop-enter-active,
.dialog-pop-leave-active {
  -webkit-transition: opacity .4s cubic-bezier(.16, 1, .3, 1), -webkit-transform .4s cubic-bezier(.16, 1, .3, 1), -webkit-filter .4s cubic-bezier(.16, 1, .3, 1);
          transition: opacity .4s cubic-bezier(.16, 1, .3, 1), transform .4s cubic-bezier(.16, 1, .3, 1), filter .4s cubic-bezier(.16, 1, .3, 1);
}
.dialog-pop-enter-from,
.dialog-pop-leave-to {
  opacity: 0;
  -webkit-filter: blur(16px); filter: blur(16px);
  -webkit-transform: scale(.92); transform: scale(.92);
}

.drawer-right-enter-active, .drawer-right-leave-active,
.drawer-left-enter-active,  .drawer-left-leave-active,
.drawer-top-enter-active,   .drawer-top-leave-active,
.drawer-bottom-enter-active, .drawer-bottom-leave-active {
  -webkit-transition: all .4s cubic-bezier(.16, 1, .3, 1);
          transition: all .4s cubic-bezier(.16, 1, .3, 1);
}
.drawer-right-enter-from,
.drawer-right-leave-to {
  -webkit-transform: translate(100%); transform: translate(100%);
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0);
}
.drawer-left-enter-from,
.drawer-left-leave-to {
  -webkit-transform: translate(-100%); transform: translate(-100%);
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0);
}
.drawer-top-enter-from,
.drawer-top-leave-to {
  -webkit-transform: translateY(-100%); transform: translateY(-100%);
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0);
}
.drawer-bottom-enter-from,
.drawer-bottom-leave-to {
  -webkit-transform: translateY(100%); transform: translateY(100%);
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0);
}

.dropdown-enter-active,
.dropdown-leave-active {
  -webkit-transition: opacity .4s cubic-bezier(.16, 1, .3, 1), -webkit-transform .4s cubic-bezier(.16, 1, .3, 1), -webkit-filter .4s cubic-bezier(.16, 1, .3, 1);
          transition: opacity .4s cubic-bezier(.16, 1, .3, 1), transform .4s cubic-bezier(.16, 1, .3, 1), filter .4s cubic-bezier(.16, 1, .3, 1);
  -webkit-transform-origin: 0 0; transform-origin: 0 0;
}
.dropdown-enter-from,
.dropdown-leave-to {
  opacity: 0;
  -webkit-filter: blur(16px); filter: blur(16px);
  -webkit-transform: scale(0); transform: scale(0);
}

.alert-expand-enter-active,
.alert-expand-leave-active {
  -webkit-transition: all .4s cubic-bezier(.16, 1, .3, 1);
          transition: all .4s cubic-bezier(.16, 1, .3, 1);
  overflow: hidden;
}
.alert-expand-enter-from,
.alert-expand-leave-to {
  opacity: 0;
  max-height: 0;
  -webkit-transform: translateY(-4px); transform: translateY(-4px);
}
.alert-icon-pop-enter-active,
.alert-icon-pop-leave-active {
  -webkit-transition: all .3s cubic-bezier(.34, 1.56, .64, 1);
          transition: all .3s cubic-bezier(.34, 1.56, .64, 1);
}
.alert-icon-pop-enter-from,
.alert-icon-pop-leave-to {
  opacity: 0;
  -webkit-transform: scale(.4); transform: scale(.4);
}

.backtop-fade-enter-active,
.backtop-fade-leave-active {
  -webkit-transition: opacity .4s cubic-bezier(.16, 1, .3, 1), -webkit-filter .4s cubic-bezier(.16, 1, .3, 1);
          transition: opacity .4s cubic-bezier(.16, 1, .3, 1), filter .4s cubic-bezier(.16, 1, .3, 1);
}
.backtop-fade-enter-from,
.backtop-fade-leave-to {
  opacity: 0;
  -webkit-filter: blur(12px); filter: blur(12px);
}

.mv-message-stack {
  position: fixed; top: 24px; left: 0; right: 0; z-index: 99999;
  display: -webkit-box; display: -webkit-flex; display: flex;
  -webkit-box-orient: vertical; -webkit-flex-direction: column; flex-direction: column;
  -webkit-box-align: center; -webkit-align-items: center; align-items: center;
  padding: 0 16px; pointer-events: none;
}
.mv-message {
  pointer-events: auto;
  display: -webkit-box; display: -webkit-flex; display: flex;
  -webkit-box-align: center; -webkit-align-items: center; align-items: center;
  max-width: 576px; padding: 12px 16px; margin: 0 0 12px;
  border: 1px solid #e4e4e7; border-color: var(--mv-card-bd, #e4e4e7);
  border-radius: 8px;
  background: rgba(255, 255, 255, .6);
  background: var(--mv-msg-bg, rgba(255, 255, 255, .6));
  color: #09090b; color: var(--mv-fg, #09090b);
  box-shadow: 0 8px 30px rgba(0, 0, 0, .08);
  -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
  font-size: 14px; font-weight: 600; line-height: 1; letter-spacing: -.025em;
}
.mv-message:last-child { margin-bottom: 0; }
.mv-message[data-type="success"] {
  border-color: rgba(16, 185, 129, .5); border-color: var(--mv-success-50, rgba(16, 185, 129, .5));
  color: #10b981; color: var(--mv-success, #10b981);
}
.mv-message[data-type="error"] {
  border-color: rgba(239, 68, 68, .5); border-color: var(--mv-destructive-50, rgba(239, 68, 68, .5));
  color: #ef4444; color: var(--mv-destructive, #ef4444);
}
.mv-message[data-type="warning"] {
  border-color: rgba(245, 158, 11, .5); border-color: var(--mv-warning-50, rgba(245, 158, 11, .5));
  color: #f59e0b; color: var(--mv-warning, #f59e0b);
}
.mv-msg-icon {
  display: block; width: 16px; height: 16px; margin-right: 12px;
  -webkit-flex-shrink: 0; flex-shrink: 0;
}
.mv-msg-text { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; }
.mv-msg-close {
  display: -webkit-box; display: -webkit-flex; display: flex;
  -webkit-box-align: center; -webkit-align-items: center; align-items: center;
  margin-left: 8px; padding: 2px; border: 0; border-radius: 4px;
  background: transparent; color: inherit; opacity: .6; cursor: pointer;
  -webkit-transition: background-color .2s; transition: background-color .2s;
}
.mv-msg-close svg { display: block; width: 14px; height: 14px; }
.mv-msg-close:active { -webkit-transform: scale(.9); transform: scale(.9); }
@media (hover: hover) {
  .mv-msg-close:hover { background: #f4f4f5; background: var(--mv-secondary, #f4f4f5); }
}

.mv-notif-stack {
  position: fixed; z-index: 99999; pointer-events: none;
  display: -webkit-box; display: -webkit-flex; display: flex;
  -webkit-box-orient: vertical; -webkit-flex-direction: column; flex-direction: column;
  width: 100%; max-width: calc(100vw - 32px);
}
.mv-notif-stack[data-side="right"] {
  top: 24px; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%);
  -webkit-box-align: end; -webkit-align-items: flex-end; align-items: flex-end;
}
.mv-notif-stack[data-side="left"] {
  top: 24px; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%);
  -webkit-box-align: start; -webkit-align-items: flex-start; align-items: flex-start;
}
.mv-notif-stack[data-side="bottom"] {
  bottom: 24px; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%);
  -webkit-box-align: end; -webkit-align-items: flex-end; align-items: flex-end;
}
.mv-notif-stack[data-side="top"] {
  top: 24px; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%);
  -webkit-box-align: center; -webkit-align-items: center; align-items: center;
}
@media (min-width: 640px) {
  .mv-notif-stack { max-width: 360px; }
  .mv-notif-stack[data-side="right"]  { left: auto; right: 24px; -webkit-transform: none; transform: none; }
  .mv-notif-stack[data-side="left"]   { left: 24px; right: auto; -webkit-transform: none; transform: none; }
  .mv-notif-stack[data-side="bottom"] { left: auto; right: 24px; -webkit-transform: none; transform: none; }
}
.mv-notif {
  pointer-events: auto; position: relative; width: 100%;
  margin: 0 0 12px; overflow: hidden;
  border: 1px solid #e4e4e7; border-color: var(--mv-card-bd, #e4e4e7);
  border-radius: 11px;
  background: rgba(255, 255, 255, .96); background: var(--mv-surface-95, rgba(255, 255, 255, .96));
  box-shadow: 0 1px 2px rgba(0, 0, 0, .06), 0 16px 36px -18px rgba(0, 0, 0, .5);
  -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px);
}
.mv-notif:last-child { margin-bottom: 0; }
.mv-notif-row {
  display: -webkit-box; display: -webkit-flex; display: flex;
  -webkit-box-align: start; -webkit-align-items: flex-start; align-items: flex-start;
  padding: 12px 12px 14px;
}
.mv-notif-iconwrap {
  position: relative; width: 28px; height: 28px; min-width: 28px; margin: 0 12px 0 0;
  display: -webkit-box; display: -webkit-flex; display: flex;
  -webkit-box-align: center; -webkit-align-items: center; align-items: center;
  -webkit-box-pack: center; -webkit-justify-content: center; justify-content: center;
  border-radius: 8px; background: #f4f4f5; background: var(--mv-soft, #f4f4f5);
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, .06);
  -webkit-flex-shrink: 0; flex-shrink: 0;
}
.mv-notif-icon { display: block; width: 16px; height: 16px; color: #18181b; color: var(--mv-primary, #18181b); }
.mv-notif[data-type="success"] .mv-notif-iconwrap { background: rgba(16, 185, 129, .14); }
.mv-notif[data-type="success"] .mv-notif-icon { color: #10b981; color: var(--mv-success, #10b981); }
.mv-notif[data-type="warning"] .mv-notif-iconwrap { background: rgba(245, 158, 11, .16); }
.mv-notif[data-type="warning"] .mv-notif-icon { color: #f59e0b; color: var(--mv-warning, #f59e0b); }
.mv-notif[data-type="error"] .mv-notif-iconwrap { background: rgba(239, 68, 68, .14); }
.mv-notif[data-type="error"] .mv-notif-icon { color: #ef4444; color: var(--mv-destructive, #ef4444); }
.mv-notif-body {
  -webkit-box-flex: 1; -webkit-flex: 1 1 auto; flex: 1 1 auto;
  min-width: 0; overflow: hidden;
}
.mv-notif-title {
  margin: 2px 0 0; font-size: 13px; font-weight: 600; line-height: 1.3;
  color: #09090b; color: var(--mv-fg, #09090b);
}
.mv-notif-text {
  margin: 3px 0 0; font-size: 12px; line-height: 1.55; color: #71717a;
  color: var(--mv-muted, #71717a); word-wrap: break-word; white-space: pre-wrap;
}
.mv-notif-close {
  display: -webkit-box; display: -webkit-flex; display: flex;
  -webkit-box-align: center; -webkit-align-items: center; align-items: center;
  -webkit-box-pack: center; -webkit-justify-content: center; justify-content: center;
  width: 28px; height: 28px; min-width: 28px; margin-left: 4px; padding: 0;
  border: 0; border-radius: 8px; background: transparent;
  color: #71717a; color: var(--mv-muted, #71717a);
  cursor: pointer; -webkit-flex-shrink: 0; flex-shrink: 0;
  -webkit-transition: background-color .2s, color .2s; transition: background-color .2s, color .2s;
}
.mv-notif-close svg { display: block; width: 15px; height: 15px; opacity: .7; }
.mv-notif-close:active { -webkit-transform: scale(.9); transform: scale(.9); }
@media (hover: hover) {
  .mv-notif-close:hover { background: #f4f4f5; background: var(--mv-soft, #f4f4f5); color: #18181b; color: var(--mv-fg, #18181b); }
}
.mv-notif-timer {
  position: absolute; left: 0; right: 0; bottom: 0; height: 3px;
  background: #e4e4e7; background: var(--mv-track, #e4e4e7);
}
.mv-notif-timer-bar {
  display: block; width: 100%; height: 100%;
  background: #a1a1aa; background: var(--mv-muted, #a1a1aa);
  box-shadow: 0 0 5px rgba(161, 161, 170, .5);
  -webkit-transform-origin: left center; transform-origin: left center;
  -webkit-animation-name: mv-notif-timer; animation-name: mv-notif-timer;
  -webkit-animation-timing-function: linear; animation-timing-function: linear;
  -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards;
  -webkit-animation-duration: 5000ms; animation-duration: 5000ms;
}
.mv-notif[data-type="success"] .mv-notif-timer-bar { background: #10b981; background: var(--mv-success, #10b981); box-shadow: 0 0 5px rgba(16, 185, 129, .5); }
.mv-notif[data-type="warning"] .mv-notif-timer-bar { background: #f59e0b; background: var(--mv-warning, #f59e0b); box-shadow: 0 0 5px rgba(245, 158, 11, .5); }
.mv-notif[data-type="error"] .mv-notif-timer-bar { background: #ef4444; background: var(--mv-destructive, #ef4444); box-shadow: 0 0 5px rgba(239, 68, 68, .5); }
@-webkit-keyframes mv-notif-timer {
  from { -webkit-transform: scaleX(1); transform: scaleX(1); }
  to { -webkit-transform: scaleX(0); transform: scaleX(0); }
}
@keyframes mv-notif-timer {
  from { -webkit-transform: scaleX(1); transform: scaleX(1); }
  to { -webkit-transform: scaleX(0); transform: scaleX(0); }
}