/* Interface motion uses opacity and small translations; game rotors/reels own
   their timing. Never animate layout dimensions or blur the skin artwork. */
:root{--motion-fast:160ms;--motion-enter:220ms;--motion-ease:cubic-bezier(.22,.68,.2,1)}

@keyframes interface-enter{from{opacity:0}to{opacity:1}}
@keyframes interface-dialog-enter{from{opacity:0;translate:0 4px}to{opacity:1;translate:0 0}}

@media(prefers-reduced-motion:no-preference){
  html body :is(.auth-dialog,.profile-withdraw,.wallet-dialog,.ct-help-dialog,.up-help-dialog,.ad-dialog)[open]{animation:interface-dialog-enter var(--motion-enter) var(--motion-ease)}
  html body :is(.auth-dialog,.profile-withdraw,.wallet-dialog,.ct-help-dialog,.up-help-dialog,.ad-dialog)::backdrop{animation:interface-enter var(--motion-enter) ease-out}
  .ad-page{animation:interface-enter var(--motion-enter) ease-out}
}

/* Keep icons and button labels still; colour provides hover feedback. */
.bonus-join svg,.bonus-join:hover svg{transform:none;transition:none}
.profile-page button{transition:background-color var(--motion-fast) ease,color var(--motion-fast) ease,filter var(--motion-fast) ease}
.up-remove{transition:background-color var(--motion-fast) ease}
/* Hover changes only light and borders, never the position or size of skins. */
html body :is(.up-skin,.ct-skin)>img{scale:1!important;transition:none!important}
html body .profile-item,html body .profile-item:hover,html body .profile-item:focus-within{transform:none}
html body .profile-item__art img,html body .profile-item:hover .profile-item__art img{transform:scale(1.24);transition:opacity .22s ease}
html body .profile-best img,html body .profile-best:hover img{transform:none;transition:none}
.site-menu,.site-menu:popover-open,.ct-popover,.ct-popover:popover-open,.up-settings,.up-settings:popover-open{transition-timing-function:var(--motion-ease)}
.lang-menu{--lang-ease-out:var(--motion-ease);--lang-ease-in:ease-out}
.currency-menu{--currency-menu-ease-out:var(--motion-ease);--currency-menu-ease-in:ease-out}

/* No scale/bounce on the whole winning card: the skin keeps its final size. */
.orbit-track .is-winner-pop{animation:none}
.orbit-track .is-winner-pop img{animation:none}

@media(prefers-reduced-motion:reduce){
  html body *,html body *::before,html body *::after{animation-duration:0s!important;animation-delay:0s!important;transition-duration:0s!important;transition-delay:0s!important;scroll-behavior:auto!important}
}
