/* Decorative movement is brief and never changes the control's layout. */
@media screen {
  .pdsm-portal :is(.pdsm-icon,.ps-pita-ikon,.ld-ico,.ld-note .nico,.ld-dusunchip svg,.ld-dl svg,.pdx .step .ico,.apd-arrow svg,.pds-button svg,.pds-link-card svg) {
    transform-origin: center;
  }
  .pdsm-portal .pdsm-icon { transform-box: fill-box; }
  .pdsm-portal .ps-pita-ikon { display: inline-block; }
  .pdsm-icon:is([data-icon=next],[data-icon=enter],[data-icon=exit]) { --pdsm-icon-motion: pdsm-icon-forward; }
  .pdsm-icon[data-icon=prev] { --pdsm-icon-motion: pdsm-icon-back; }
  .pdsm-icon[data-icon=up] { --pdsm-icon-motion: pdsm-icon-up; }
  .pdsm-icon[data-icon=down] { --pdsm-icon-motion: pdsm-icon-down; }
  .pdsm-icon:is([data-icon=sun],[data-icon=clock],[data-icon=globe],[data-icon=history]) { --pdsm-icon-motion: pdsm-icon-turn; }
  .pdsm-icon[data-icon=heart] { --pdsm-icon-motion: pdsm-icon-pulse; }
}
@media screen and (prefers-reduced-motion: no-preference) {
  html:not(.pdsm-motion) .pdsm-portal .pdsm-icon-enter {
    animation: pdsm-icon-enter 380ms ease-out;
  }
  html:not(.pdsm-motion) .pdsm-portal .pdsm-icon-active {
    animation: var(--pdsm-icon-motion,pdsm-icon-lift) 460ms ease-out;
  }
}
@keyframes pdsm-icon-enter {
  from { opacity: .65; translate: 0 3px; scale: .94; }
  to { opacity: 1; translate: 0 0; scale: 1; }
}
@keyframes pdsm-icon-lift {
  0%,100% { translate: 0 0; rotate: 0deg; scale: 1; }
  40% { translate: 0 -2px; rotate: -5deg; scale: 1.07; }
  72% { translate: 0 -1px; rotate: 2deg; scale: 1.03; }
}
@keyframes pdsm-icon-forward {
  0%,100% { translate: 0 0; }
  45% { translate: 3px 0; }
}
@keyframes pdsm-icon-back {
  0%,100% { translate: 0 0; }
  45% { translate: -3px 0; }
}
@keyframes pdsm-icon-up {
  0%,100% { translate: 0 0; }
  45% { translate: 0 -3px; }
}
@keyframes pdsm-icon-down {
  0%,100% { translate: 0 0; }
  45% { translate: 0 3px; }
}
@keyframes pdsm-icon-turn {
  0%,100% { rotate: 0deg; scale: 1; }
  45% { rotate: 16deg; scale: 1.05; }
}
@keyframes pdsm-icon-pulse {
  0%,100% { scale: 1; }
  42% { scale: 1.1; }
  72% { scale: 1.03; }
}
@media screen and (prefers-reduced-motion: reduce) {
  .pdsm-portal :is(.pdsm-icon-enter,.pdsm-icon-active) {
    animation: none!important; opacity: 1!important;
    translate: none!important; rotate: none!important; scale: none!important;
  }
}
html.pdsm-motion .pdsm-portal :is(.pdsm-icon-enter,.pdsm-icon-active) {
  animation: none!important; opacity: 1!important;
  translate: none!important; rotate: none!important; scale: none!important;
}