@keyframes fadeInUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
@keyframes fadeInDown{from{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}
@keyframes fadeInLeft{from{opacity:0;transform:translateX(-20px)}to{opacity:1;transform:translateX(0)}}
@keyframes fadeInRight{from{opacity:0;transform:translateX(20px)}to{opacity:1;transform:translateX(0)}}
@keyframes scaleIn{from{opacity:0;transform:scale(0.9)}to{opacity:1;transform:scale(1)}}
@keyframes pulse{0%{transform:scale(1)}50%{transform:scale(1.05)}100%{transform:scale(1)}}
@keyframes shake{0%,100%{transform:translateX(0)}25%{transform:translateX(-5px)}75%{transform:translateX(5px)}}
@keyframes bounce{0%,20%,50%,80%,100%{transform:translateY(0)}40%{transform:translateY(-10px)}60%{transform:translateY(-5px)}}
.stui-vodlist li{animation:fadeInUp .5s ease backwards;transition:all .3s cubic-bezier(0.4,0,0.2,1)}
.stui-vodlist li:hover{animation:pulse .3s ease}
.stui-banner__item{animation:scaleIn .6s ease backwards}
.stui-content{animation:fadeInUp .6s ease backwards}
.stui-player{animation:fadeInUp .5s ease backwards}
.dropdown{animation:fadeInDown .3s ease backwards}
.stui-pannel__head{animation:fadeInDown .5s ease backwards}
.stui-vodlist__head{animation:fadeInLeft .5s ease backwards}
.stui-screen .item{animation:fadeInUp .5s ease backwards}
.stui-content__detail .play-btn a{animation:bounce 2s infinite;animation-play-state:paused}
.stui-content__detail .play-btn a:hover{animation-play-state:running}
.btn-blue{transition:all .3s cubic-bezier(0.4,0,0.2,1)}
.btn-blue:hover{transform:translateY(-3px) scale(1.02);box-shadow:0 8px 25px rgba(56,189,248,.4)}
.stui-vodlist li{animation-delay:.05s}
.stui-vodlist li:nth-child(1){animation-delay:.05s}
.stui-vodlist li:nth-child(2){animation-delay:.1s}
.stui-vodlist li:nth-child(3){animation-delay:.15s}
.stui-vodlist li:nth-child(4){animation-delay:.2s}
.stui-vodlist li:nth-child(5){animation-delay:.25s}
.stui-vodlist li:nth-child(6){animation-delay:.3s}
.stui-vodlist li:nth-child(7){animation-delay:.35s}
.stui-vodlist li:nth-child(8){animation-delay:.4s}
.stui-vodlist li:nth-child(9){animation-delay:.45s}
.stui-vodlist li:nth-child(10){animation-delay:.5s}
.stui-vodlist li:nth-child(11){animation-delay:.55s}
.stui-vodlist li:nth-child(12){animation-delay:.6s}
.stui-vodlist__thumb .play{transition:all .4s cubic-bezier(0.68,-0.55,0.265,1.55)}
.stui-vodlist li:hover .stui-vodlist__thumb .play{animation:scaleIn .3s ease}
.stui-play__list li a,.stui-content__playlist li a{transition:all .2s cubic-bezier(0.4,0,0.2,1)}
.stui-play__list li.active a,.stui-play__list li a:hover,.stui-content__playlist li.active a,.stui-content__playlist li a:hover{transform:scale(1.05)}
.stui-header__menu li a{transition:all .3s cubic-bezier(0.4,0,0.2,1);position:relative;overflow:hidden}
.stui-header__menu li a::before{content:"";position:absolute;top:50%;left:50%;width:0;height:0;background:rgba(255,255,255,.2);border-radius:50%;transform:translate(-50%,-50%);transition:width .4s,height .4s}
.stui-header__menu li a:hover::before{width:200px;height:200px}
.dropdown ul li a{transition:all .2s ease}
.dropdown ul li a:hover{transform:translateX(5px)}
.foot60_top_btn{transition:all .4s cubic-bezier(0.68,-0.55,0.265,1.55)}
.foot60_top_btn:hover{transform:translateY(-5px) rotate(360deg)}
.stui-screen .item ul li a{transition:all .3s cubic-bezier(0.4,0,0.2,1);position:relative}
.stui-screen .item ul li a::after{content:"";position:absolute;bottom:0;left:50%;width:0;height:2px;background:#38bdf8;transition:all .3s ease;transform:translateX(-50%)}
.stui-screen .item ul li.active a::after,.stui-screen .item ul li a:hover::after{width:100%}
.stui-player__side .tab li a{transition:all .3s ease}
.stui-player__side .tab li.active a,.stui-player__side .tab li a:hover{transform:translateY(-2px)}
.stui-player__detail .more a{transition:all .3s cubic-bezier(0.4,0,0.2,1)}
.stui-player__detail .more a:hover{transform:translateY(-2px) scale(1.05)}
.page-box a,.page-box span{transition:all .3s cubic-bezier(0.4,0,0.2,1)}
.page-box a:hover,.page-box span.active:hover{transform:translateY(-2px) scale(1.1)}
.stui-content__thumb .pic{transition:all .5s cubic-bezier(0.4,0,0.2,1)}
.stui-content__thumb .pic:hover{transform:scale(1.02)}
.stui-content__detail .title{background:linear-gradient(90deg,#38bdf8 0%,#0ea5e9 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;background-size:200% auto;animation:gradientMove 3s linear infinite}
@keyframes gradientMove{0%{background-position:0 50%}100%{background-position:200% 50%}}
.stui-vodlist__thumb.banner{position:relative;overflow:hidden}
.stui-vodlist__thumb.banner::after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(45deg,rgba(56,189,248,.1) 0%,rgba(15,23,42,.3) 100%);animation:bannerShine 3s ease-in-out infinite}
@keyframes bannerShine{0%,100%{opacity:.3}50%{opacity:.6}}
.stui-vodlist li{position:relative;overflow:hidden}
.stui-vodlist li::before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(56,189,248,.1),transparent);transition:left .5s ease}
.stui-vodlist li:hover::before{left:100%}
.stui-content__detail .desc{position:relative;overflow:hidden}
.stui-content__detail .desc::before{content:"";position:absolute;top:0;left:0;width:3px;height:100%;background:linear-gradient(180deg,#38bdf8 0%,#0ea5e9 100%);animation:borderPulse 2s ease-in-out infinite}
@keyframes borderPulse{0%,100%{opacity:.5}50%{opacity:1}}
.stui-player__video{position:relative;overflow:hidden}
.stui-player__video::after{content:"";position:absolute;top:50%;left:50%;width:0;height:0;border:2px solid rgba(56,189,248,.5);border-radius:50%;transform:translate(-50%,-50%);animation:ripple 2s ease-out infinite}
@keyframes ripple{0%{width:0;height:0;opacity:1}100%{width:200px;height:200px;opacity:0}}
.stui-play__list li a,.stui-content__playlist li a{position:relative;overflow:hidden}
.stui-play__list li a::before,.stui-content__playlist li a::before{content:"";position:absolute;top:50%;left:50%;width:0;height:0;background:rgba(255,255,255,.2);border-radius:50%;transform:translate(-50%,-50%);transition:width .4s,height .4s}
.stui-play__list li a:hover::before,.stui-content__playlist li a:hover::before{width:150px;height:150px}
.stui-header__logo .logo{transition:all .3s ease}
.stui-header__logo .logo:hover{transform:scale(1.05)}
.stui_header__user li a{transition:all .3s cubic-bezier(0.68,-0.55,0.265,1.55)}
.stui_header__user li a:hover{transform:rotate(360deg) scale(1.1)}
.dropdown{transition:all .3s cubic-bezier(0.4,0,0.2,1)}
.stui-pannel{transition:all .3s ease}
.stui-pannel:hover{box-shadow:0 8px 30px rgba(56,189,248,.15)}
.stui-vodlist__detail .title a{position:relative;display:inline-block}
.stui-vodlist__detail .title a::after{content:"";position:absolute;bottom:-2px;left:0;width:0;height:2px;background:#38bdf8;transition:width .3s ease}
.stui-vodlist__detail .title a:hover::after{width:100%}
.stui-player__side .tab-content{scroll-behavior:smooth}
.stui-player__side .tab-content::-webkit-scrollbar{scroll-behavior:smooth}
.stui-player__side .tab-content{transition:all .3s ease}
@media(prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
