@layer base{html{scroll-behavior:smooth}body{font-family:Inter,system-ui,-apple-system,sans-serif}}@media (max-width: 768px){body{overflow-x:hidden}button,a{-webkit-tap-highlight-color:transparent;touch-action:manipulation}*{-webkit-overflow-scrolling:touch}.mobile-card{transition:transform .2s ease,box-shadow .2s ease}.mobile-card:active{transform:scale(.98)}.mobile-button{min-height:44px;transition:all .2s ease}.mobile-button:active{transform:scale(.95)}input,select,textarea{font-size:16px}.bottom-nav{backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.mobile-product-grid{gap:12px;padding-bottom:100px}.mobile-header{backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.mobile-fade-in{animation:mobileSlideUp .3s ease-out}@keyframes mobileSlideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.mobile-filters{scrollbar-width:none;-ms-overflow-style:none}.mobile-filters::-webkit-scrollbar{display:none}.mobile-notification{position:fixed;top:20px;left:50%;transform:translate(-50%);z-index:9999;animation:mobileNotificationSlide .3s ease-out}@keyframes mobileNotificationSlide{0%{opacity:0;transform:translate(-50%) translateY(-20px)}to{opacity:1;transform:translate(-50%) translateY(0)}}.mobile-pull-refresh{overscroll-behavior:contain}.mobile-safe-area{padding-bottom:env(safe-area-inset-bottom)}.mobile-skeleton{background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0,#f0f0f0 75%);background-size:200% 100%;animation:mobileShimmer 1.5s infinite}@keyframes mobileShimmer{0%{background-position:-200% 0}to{background-position:200% 0}}}.line-clamp-1{display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}.line-clamp-2{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.line-clamp-3{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}@keyframes glow{0%,to{box-shadow:0 0 20px #22c55e4d}50%{box-shadow:0 0 30px #22c55e99}}@keyframes shimmer{0%{background-position:-200px 0}to{background-position:calc(200px + 100%) 0}}@keyframes bounce-in{0%{transform:scale(.3) rotate(-10deg);opacity:0}50%{transform:scale(1.05) rotate(5deg)}70%{transform:scale(.9) rotate(-2deg)}to{transform:scale(1) rotate(0);opacity:1}}@keyframes slide-up{0%{transform:translateY(30px);opacity:0}to{transform:translateY(0);opacity:1}}.animate-float{animation:float 3s ease-in-out infinite}.animate-glow{animation:glow 2s ease-in-out infinite alternate}.animate-shimmer{background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0,#f0f0f0 75%);background-size:200px 100%;animation:shimmer 1.5s infinite}.animate-bounce-in{animation:bounce-in .6s cubic-bezier(.68,-.55,.265,1.55)}.animate-slide-up{animation:slide-up .5s ease-out}.glass{background:#ffffff40;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.18)}.glass-dark{background:#00000040;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.18)}.gradient-primary{background:linear-gradient(135deg,#10b981,#3b82f6)}.gradient-secondary{background:linear-gradient(135deg,#f59e0b,#ef4444)}.gradient-accent{background:linear-gradient(135deg,#8b5cf6,#ec4899)}.hover-lift{transition:all .3s cubic-bezier(.4,0,.2,1)}.hover-lift:hover{transform:translateY(-8px) scale(1.02);box-shadow:0 20px 40px #0000001a}.hover-glow:hover{box-shadow:0 0 30px #22c55e66}.slider{-webkit-appearance:none;appearance:none;background:linear-gradient(to right,#10b981 0% 50%,#e5e7eb 50% 100%);outline:none;border-radius:15px}.slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:25px;height:25px;border-radius:50%;background:linear-gradient(135deg,#10b981,#3b82f6);cursor:pointer;box-shadow:0 4px 8px #0003;transition:all .3s ease}.slider::-webkit-slider-thumb:hover{transform:scale(1.2);box-shadow:0 6px 12px #0000004d}.slider::-moz-range-thumb{width:25px;height:25px;border-radius:50%;background:linear-gradient(135deg,#10b981,#3b82f6);cursor:pointer;border:none;box-shadow:0 4px 8px #0003;transition:all .3s ease}.slider::-moz-range-thumb:hover{transform:scale(1.2);box-shadow:0 6px 12px #0000004d}.text-gradient{background:linear-gradient(135deg,#10b981,#3b82f6);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.text-shadow{text-shadow:2px 2px 4px rgba(0,0,0,.1)}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:#f1f5f9;border-radius:10px}::-webkit-scrollbar-thumb{background:linear-gradient(135deg,#10b981,#3b82f6);border-radius:10px}::-webkit-scrollbar-thumb:hover{background:linear-gradient(135deg,#059669,#2563eb)}.loading-dots:after{content:"";animation:loading-dots 1.5s infinite}@keyframes loading-dots{0%,20%{content:"."}40%{content:".."}60%,to{content:"..."}}.particles{position:relative;overflow:hidden}.particles:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background-image:radial-gradient(circle at 20% 80%,rgba(34,197,94,.1) 0%,transparent 50%),radial-gradient(circle at 80% 20%,rgba(59,130,246,.1) 0%,transparent 50%),radial-gradient(circle at 40% 40%,rgba(139,92,246,.1) 0%,transparent 50%);animation:float 6s ease-in-out infinite;pointer-events:none}@keyframes fade-in{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes pulse-success{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.05);opacity:.8}}@keyframes card-hover{0%{transform:scale(1) rotateY(0)}to{transform:scale(1.02) rotateY(5deg)}}@keyframes gradient-flow{0%,to{background-position:0% 50%}50%{background-position:100% 50%}}.animate-fade-in{animation:fade-in .5s ease-out}.animate-pulse-success{animation:pulse-success 2s infinite}.animate-gradient{background-size:200% 200%;animation:gradient-flow 3s ease infinite}.hover\:scale-102:hover{transform:scale(1.02)}.perspective-1000{perspective:1000px}.transform-style-preserve-3d{transform-style:preserve-3d}.rotate-y-180{transform:rotateY(180deg)}.backface-hidden{backface-visibility:hidden}.card-3d{transform-style:preserve-3d;transition:transform .7s cubic-bezier(.4,0,.2,1)}.card-face{backface-visibility:hidden;position:absolute;width:100%;height:100%}.card-back{transform:rotateY(180deg)}.card-field-focus{transform:scale(1.05);color:#fbbf24;text-shadow:0 0 8px rgba(251,191,36,.5);transition:all .3s ease}.card-cvv-focus{transform:scale(1.1);color:#7c3aed;transition:all .3s ease}.checkout-card{transition:all .3s cubic-bezier(.4,0,.2,1)}.checkout-card:hover{transform:translateY(-2px);box-shadow:0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a}.payment-method-selected{background:linear-gradient(135deg,#8b5cf61a,#3b82f61a)}@media (max-width: 640px){.mobile-spacing{padding:1rem}.mobile-button{min-height:48px;font-size:16px}.payment-card-mobile{padding:1rem;margin-bottom:.75rem}.mobile-header{padding:.75rem 1rem}.mobile-input{min-height:48px;font-size:16px;padding:.75rem}.card-3d{transform-style:preserve-3d;transition:transform .5s ease}.perspective-1000{perspective:800px}}.card-3d{transform-style:preserve-3d;transition:transform .6s}.card-3d:hover{transform:rotateY(10deg) rotateX(5deg)}.loading-shimmer{background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0,#f0f0f0 75%);background-size:200% 100%;animation:shimmer 1.5s infinite}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.error-shake{animation:shake .5s ease-in-out}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-5px)}75%{transform:translate(5px)}}.progress-step{transition:all .3s ease}.progress-step.active{background:linear-gradient(135deg,#8b5cf6,#3b82f6);box-shadow:0 4px 14px #8b5cf666}.toast-success{background:linear-gradient(135deg,#10b981,#059669);color:#fff;border-radius:.75rem;padding:1rem;box-shadow:0 10px 15px -3px #0000001a}.toast-error{background:linear-gradient(135deg,#ef4444,#dc2626);color:#fff;border-radius:.75rem;padding:1rem;box-shadow:0 10px 15px -3px #0000001a}@keyframes card-flip{0%{transform:rotateY(0)}50%{transform:rotateY(-90deg)}to{transform:rotateY(180deg)}}@keyframes card-flip-back{0%{transform:rotateY(180deg)}50%{transform:rotateY(90deg)}to{transform:rotateY(0)}}.card-flipping{animation:card-flip .7s ease-in-out}.card-flipping-back{animation:card-flip-back .7s ease-in-out}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.card-3d{transition:none!important}.perspective-1000{perspective:none!important}}.StripeElement{background-color:#fff;border:2px solid #e5e7eb;border-radius:12px;padding:12px;font-size:16px;transition:all .3s ease}.StripeElement:focus,.StripeElement--focus{border-color:#7c3aed;box-shadow:0 0 0 3px #7c3aed33}.StripeElement--invalid{border-color:#ef4444;box-shadow:0 0 0 3px #ef444433}.StripeElement--complete{border-color:#10b981;box-shadow:0 0 0 3px #10b98133}@media (max-width: 768px){html,body{overflow-x:hidden!important;scrollbar-width:none!important;-ms-overflow-style:none!important}html::-webkit-scrollbar,body::-webkit-scrollbar{display:none!important;width:0px!important;background:transparent!important}*{scrollbar-width:none!important;-ms-overflow-style:none!important}*::-webkit-scrollbar{display:none!important;width:0px!important;background:transparent!important}.mobile-no-scroll{overflow:hidden!important;-webkit-overflow-scrolling:touch}.mobile-scroll-container{overflow-y:auto;height:100vh;-webkit-overflow-scrolling:touch;scrollbar-width:none!important;-ms-overflow-style:none!important}.mobile-scroll-container::-webkit-scrollbar{display:none!important;width:0px!important;background:transparent!important}.mobile-content-container{max-height:calc(100vh - 120px);overflow-y:auto;scrollbar-width:none!important;-ms-overflow-style:none!important}.mobile-content-container::-webkit-scrollbar{display:none!important;width:0px!important;background:transparent!important}}@media (max-width: 768px){::-webkit-scrollbar{display:none!important;width:0!important;height:0!important;background:transparent!important}::-webkit-scrollbar-track{display:none!important;background:transparent!important}::-webkit-scrollbar-thumb{display:none!important;background:transparent!important}html{scrollbar-width:none!important}body{-ms-overflow-style:none!important}}