继续更新

InfoGenie-frontend/public/60sapi/热搜榜单/猫眼电影实时票房/css/background.css

@@ -0,0 +1,79 @@
+.background-container {
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    z-index: -1;
+    overflow: hidden;
+    background: linear-gradient(180deg, #f0f9f2 0%, #f7fff8 55%, #eef7f1 100%);
+}
+
+.floating-blob {
+    position: absolute;
+    width: 420px;
+    height: 420px;
+    border-radius: 55% 45% 60% 40% / 50% 50% 45% 55%;
+    filter: blur(0px);
+    opacity: 0.28;
+    background: radial-gradient(circle at 30% 30%, rgba(129, 199, 132, 0.6), rgba(129, 199, 132, 0));
+    animation: drift 36s ease-in-out infinite;
+}
+
+.blob-1 {
+    top: -120px;
+    left: -160px;
+    animation-delay: 0s;
+}
+
+.blob-2 {
+    right: -120px;
+    bottom: -160px;
+    animation-delay: 8s;
+    background: radial-gradient(circle at 70% 70%, rgba(76, 175, 80, 0.5), rgba(76, 175, 80, 0));
+}
+
+.blob-3 {
+    top: 45%;
+    left: 55%;
+    animation-delay: 16s;
+    background: radial-gradient(circle at 40% 60%, rgba(165, 214, 167, 0.5), rgba(165, 214, 167, 0));
+}
+
+@keyframes drift {
+    0% {
+        transform: translate3d(0, 0, 0) scale(1);
+    }
+    33% {
+        transform: translate3d(30px, -40px, 0) scale(1.05);
+    }
+    66% {
+        transform: translate3d(-25px, 30px, 0) scale(0.95);
+    }
+    100% {
+        transform: translate3d(0, 0, 0) scale(1);
+    }
+}
+
+@media (max-width: 768px) {
+    .floating-blob {
+        width: 260px;
+        height: 260px;
+        opacity: 0.22;
+    }
+
+    .blob-1 {
+        top: -80px;
+        left: -120px;
+    }
+
+    .blob-2 {
+        right: -140px;
+        bottom: -140px;
+    }
+
+    .blob-3 {
+        top: 55%;
+        left: 48%;
+    }
+}