:root{--primary-blue: #3b82f6;--primary-light: #60a5fa;--primary-dark: #2563eb;--primary-glow: rgba(59, 130, 246, .3);--accent-cyan: #0ea5e9;--accent-teal: #14b8a6;--accent-purple: #8b5cf6;--bg-base: #f0f9ff;--bg-gradient-start: #e0f2fe;--bg-gradient-mid: #eef2ff;--bg-gradient-end: #f0fdfa;--glass-white: rgba(255, 255, 255, .65);--glass-white-light: rgba(255, 255, 255, .85);--glass-border: rgba(59, 130, 246, .08);--glass-border-light: rgba(59, 130, 246, .12);--text-primary: #1e3a5f;--text-secondary: #334155;--text-muted: #64748b;--text-blue: #3b82f6;--shadow-light: rgba(59, 130, 246, .04);--shadow-medium: rgba(59, 130, 246, .08);--shadow-card: rgba(59, 130, 246, .1);--radius-sm: 12px;--radius-md: 16px;--radius-lg: 20px;--radius-xl: 24px;--gradient-primary: linear-gradient(135deg, #3b82f6 0%, #60a5fa 50%, #0ea5e9 100%);--gradient-card: linear-gradient(135deg, rgba(59,130,246,.06) 0%, rgba(14,165,233,.04) 100%)}*{margin:0;padding:0;box-sizing:border-box}html,body,#app{margin:0;padding:0;height:100%;width:100%;overflow:hidden}body{font-family:Inter,PingFang SC,Microsoft YaHei,-apple-system,sans-serif;-webkit-font-smoothing:antialiased;background:var(--bg-base)}.app-container{position:relative;height:100%;width:100%;overflow:hidden}.app-background{position:fixed;top:0;left:0;right:0;bottom:0;z-index:0;overflow:hidden;pointer-events:none}.background-gradient{position:absolute;top:0;left:0;right:0;bottom:0;background:radial-gradient(ellipse at 20% 20%,rgba(59,130,246,.08) 0%,transparent 50%),radial-gradient(ellipse at 80% 80%,rgba(14,165,233,.06) 0%,transparent 50%),radial-gradient(ellipse at 50% 50%,rgba(6,182,212,.04) 0%,transparent 60%),linear-gradient(135deg,var(--bg-gradient-start) 0%,var(--bg-gradient-mid) 40%,var(--bg-gradient-end) 100%)}.background-glows{position:absolute;top:0;left:0;right:0;bottom:0}.glow-circle{position:absolute;border-radius:50%;filter:blur(120px);opacity:.5}.glow-circle--1{width:800px;height:800px;top:-20%;left:-15%;background:linear-gradient(135deg,#3b82f64d,#0ea5e933);animation:floatGlow1 30s ease-in-out infinite}.glow-circle--2{width:600px;height:600px;bottom:-15%;right:-10%;background:linear-gradient(135deg,#0ea5e940,#06b6d433);animation:floatGlow2 35s ease-in-out infinite}.glow-circle--3{width:500px;height:500px;top:40%;left:50%;transform:translate(-50%,-50%);background:linear-gradient(135deg,#3b82f626,#0ea5e91a);animation:floatGlow3 25s ease-in-out infinite}@keyframes floatGlow1{0%,to{transform:translate(0)}33%{transform:translate(40px,40px)}66%{transform:translate(-30px,30px)}}@keyframes floatGlow2{0%,to{transform:translate(0)}33%{transform:translate(-40px,-40px)}66%{transform:translate(30px,-30px)}}@keyframes floatGlow3{0%,to{transform:translate(-50%,-50%) scale(1);opacity:.5}50%{transform:translate(-50%,-50%) scale(1.15);opacity:.6}}.water-droplets{position:absolute;top:0;left:0;right:0;bottom:0}.droplet{position:absolute;background:linear-gradient(135deg,#fff9,#bae6fd80 40%,#3b82f633);border-radius:50%/60% 60% 40% 40%;box-shadow:inset -2px -2px 4px #fff6,inset 2px 2px 4px #3b82f61a,0 4px 12px #3b82f61a;animation:dropletFloat ease-in-out infinite}@keyframes dropletFloat{0%,to{opacity:.4;transform:translateY(0) rotate(0)}50%{opacity:.7;transform:translateY(-15px) rotate(5deg)}}.float-bubbles{position:absolute;top:0;left:0;right:0;bottom:0}.bubble{position:absolute;background:#fff9;border-radius:50%;box-shadow:0 0 6px #3b82f626;animation:bubbleFloat ease-in-out infinite}@keyframes bubbleFloat{0%,to{opacity:.3;transform:translateY(0) scale(1)}50%{opacity:.6;transform:translateY(-20px) scale(1.1)}}.molecule-decoration{position:absolute;top:0;left:0;right:0;bottom:0}.molecule{position:absolute;opacity:.5;animation:moleculeFloat ease-in-out infinite}.molecule--1{width:120px;height:120px;top:15%;right:8%;animation-duration:28s}.molecule--2{width:100px;height:100px;bottom:20%;left:5%;animation-duration:32s;animation-delay:-10s}@keyframes moleculeFloat{0%,to{transform:translate(0) rotate(0)}25%{transform:translate(15px,10px) rotate(5deg)}50%{transform:translateY(20px) rotate(0)}75%{transform:translate(-15px,10px) rotate(-5deg)}}.grid-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(rgba(59,130,246,.02) 1px,transparent 1px),linear-gradient(90deg,rgba(59,130,246,.02) 1px,transparent 1px);background-size:48px 48px}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#3b82f626;border-radius:3px}::-webkit-scrollbar-thumb:hover{background:#3b82f640}