body { background-color: #050507; color: white; overflow-x: hidden; }

.glass-card { background: rgba(255, 255, 255, 0.03); backdrop-filter: blur(15px); -webkit-backdrop-filter: blur(15px); border: 1px solid rgba(255, 255, 255, 0.1); box-shadow: 0 10px 30px rgba(0,0,0,0.5); }
.glass-nav { background: rgba(0, 0, 0, 0.2); backdrop-filter: blur(20px); }

.text-gradient { background: linear-gradient(135deg, #fff 0%, #aaa 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
.accent-gradient-bg { background: linear-gradient(135deg, #6366f1 0%, #a855f7 100%); }
.accent-gradient-text { background: linear-gradient(135deg, #6366f1 0%, #a855f7 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }

@keyframes num-spin { 0% { content: "12"; } 10% { content: "38"; } 20% { content: "51"; } 30% { content: "88"; } 40% { content: "99"; } 100% { content: "22"; } }
@keyframes num-spin-final { 0% { content: "99"; } 100% { content: "73"; } }

#profit-num:after { content: "10"; animation: num-spin 0.4s steps(10) forwards; }
#optimize-num:after { content: "30"; animation: num-spin-final 0.2s steps(10) forwards; animation-delay: 0.4s; }

.calculator-card:hover #profit-num:after { animation: num-spin 0.8s steps(20) alternate-reverse 2; }
.calculator-card:hover #optimize-num:after { animation: num-spin-final 0.4s steps(20) alternate-reverse 2; animation-delay: 0s;}

#particle-bg { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: -1; opacity: 0.15; }
