.loader{border:6px solid hsla(0,0%,100%,.3);border-top-color:#1d4ed8;border-radius:50%;width:50px;height:50px;animation:spin 1s linear infinite;box-shadow:0 0 10px rgba(108,99,255,.5)}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.loader-container{display:flex;justify-content:center;align-items:center;min-height:100vh;background:linear-gradient(180deg,#f3f4f6,#e5e7eb)}.fade-in{animation:fadeIn .5s ease-in-out}.fade-out{animation:fadeOut .5s ease-in-out}.template-float{animation:templateFloat 6s ease-in-out infinite}.template-glow{animation:templateGlow 2s ease-in-out infinite alternate}.template-slide-up{animation:templateSlideUp .8s cubic-bezier(.25,.46,.45,.94) forwards}.template-scale-in{animation:templateScaleIn .6s cubic-bezier(.25,.46,.45,.94) forwards}.template-blur-in{animation:templateBlurIn 1s ease-out forwards}.category-bounce{animation:categoryBounce .6s cubic-bezier(.68,-.55,.265,1.55) forwards}.gradient-shift{animation:gradientShift 8s ease-in-out infinite}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}@keyframes templateFloat{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}@keyframes templateGlow{0%{box-shadow:0 0 20px rgba(59,130,246,.3)}to{box-shadow:0 0 40px rgba(59,130,246,.6),0 0 60px rgba(147,51,234,.3)}}@keyframes templateSlideUp{0%{opacity:0;transform:translateY(60px)}to{opacity:1;transform:translateY(0)}}@keyframes templateScaleIn{0%{opacity:0;transform:scale(.8) rotateY(20deg)}to{opacity:1;transform:scale(1) rotateY(0deg)}}@keyframes templateBlurIn{0%{opacity:0;filter:blur(10px);transform:scale(1.1)}to{opacity:1;filter:blur(0);transform:scale(1)}}@keyframes categoryBounce{0%{opacity:0;transform:scale(.3) translateY(30px)}60%{opacity:1;transform:scale(1.05) translateY(-5px)}to{opacity:1;transform:scale(1) translateY(0)}}@keyframes gradientShift{0%,to{background-position:0 50%}50%{background-position:100% 50%}}.template-card{transition:all .4s cubic-bezier(.25,.46,.45,.94)}.template-card:hover{transform:translateY(-12px) scale(1.02);box-shadow:0 25px 50px rgba(0,0,0,.15)}@media (max-width:768px){.template-card:hover{transform:translateY(-6px) scale(1.01);box-shadow:0 15px 30px rgba(0,0,0,.1)}@keyframes templateFloat{0%,to{transform:translateY(0)}50%{transform:translateY(-5px)}}}