:root{--primary-gradient:linear-gradient(135deg,#87CEEB 0%,#87CEEB 100%);--secondary-gradient:linear-gradient(135deg,#00b38a 0%,#00d4a4 100%);--accent-gradient:linear-gradient(135deg,#fd9810 0%,#F63 100%);--bg-color:#f8f9fa;--card-bg:#ffffff;--text-primary:#333333;--text-secondary:#666666;--text-muted:#999999;--border-color:#e0e0e0;--success-color:#4CAF50;--error-color:#f44336;--shadow-sm:0 2px 8px rgba(0,0,0,0.1);--shadow-md:0 4px 16px rgba(0,0,0,0.15);--shadow-lg:0 10px 40px rgba(0,0,0,0.2);--border-radius-sm:8px;--border-radius-md:15px;--border-radius-lg:25px;--transition:all 0.3s cubic-bezier(0.4,0,0.2,1)}
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:'Segoe UI',Tahoma,Geneva,Verdana,sans-serif;background:var(--primary-gradient);min-height:100vh;display:flex;align-items:center;justify-content:center;padding:0px;background-attachment:fixed}
.background-bubbles{position:fixed;top:0;left:0;width:100%;height:100%;z-index:-1;overflow:hidden}
.bubble{position:absolute;border-radius:50%;background:rgba(255,255,255,0.3);animation:float 8s ease-in-out infinite}
.bubble:nth-child(1){width:80px;height:80px;top:10%;left:10%;animation-delay:0s}
.bubble:nth-child(2){width:60px;height:60px;top:30%;right:20%;animation-delay:1s}
.bubble:nth-child(3){width:100px;height:100px;bottom:20%;left:30%;animation-delay:2s}
.bubble:nth-child(4){width:50px;height:50px;bottom:40%;right:15%;animation-delay:3s}
.bubble:nth-child(5){width:120px;height:120px;top:20%;left:20%;animation-delay:4s}
.bubble:nth-child(6){width:70px;height:70px;bottom:30%;left:20%;animation-delay:5s}
.bubble:nth-child(7){width:90px;height:90px;top:40%;right:30%;animation-delay:6s}
.bubble:nth-child(8){width:60px;height:60px;top:60%;left:15%;animation-delay:7s}
.bubble:nth-child(9){width:110px;height:110px;top:70%;right:10%;animation-delay:0.5s}
.bubble:nth-child(10){width:40px;height:40px;top:15%;right:15%;animation-delay:1.5s}
.bubble:nth-child(11){width:80px;height:80px;bottom:10%;right:30%;animation-delay:2.5s}
.bubble:nth-child(12){width:100px;height:100px;top:50%;left:40%;animation-delay:3.5s}
@keyframes float{0%,100%{transform:translateY(0) scale(1);opacity:0.4}50%{transform:translateY(-30px) scale(1.1);opacity:0.6}}