model output
LLaMA 4 Scout

Only CSS: Infinite Plug In
A 0.29T 0.00
1<!DOCTYPE html>
2<html lang="en">
3<head>
4    <meta charset="UTF-8">
5    <meta name="viewport" content="width=device-width, initial-scale=1.0">
6    <title>Animation</title>
7    <style>
8        body {
9            margin: 0;
10            background-color: #fff;
11            overflow: hidden;
12        }
13        .cube {
14            position: absolute;
15            width: 50px;
16            height: 50px;
17            border-radius: 5px;
18        }
19        .box-1 {
20            background-color: #008000;
21            bottom: 0;
22            left: 0;
23            transform: translate(0, 0) rotateX(0deg) rotateY(0deg);
24            animation: box-1 8s linear infinite;
25        }
26        .box-2 {
27            background-color: #FFA500;
28            bottom: 0;
29            left: 100px;
30            transform: translate(0, 0) rotateX(0deg) rotateY(0deg);
31            animation: box-2 8s linear infinite;
32        }
33        .box-3 {
34            background-color: #0000FF;
35            bottom: 0;
36            left: 200px;
37            transform: translate(0, 0) rotateX(0deg) rotateY(0deg);
38            animation: box-3 8s linear infinite;
39        }
40        .cube-1 {
41            background-color: #0000FF;
42            top: 100px;
43            right: 100px;
44            animation: cube-1 8s linear infinite;
45        }
46        .cube-2 {
47            background-color: #800080;
48            top: 200px;
49            right: 100px;
50            animation: cube-2 8s linear infinite;
51        }
52        .cube-3 {
53            background-color: #964B00;
54            top: 300px;
55            right: 100px;
56            animation: cube-3 8s linear infinite;
57        }
58        @keyframes box-1 {
59            0% {
60                transform: translate(0, 0) rotateX(0deg) rotateY(0deg);
61            }
62            100% {
63                transform: translate(0, -500px) rotateX(0deg) rotateY(0deg);
64            }
65        }
66        @keyframes box-2 {
67            0% {
68                transform: translate(0, 0)  rotateX(0deg) rotateY(0deg);
69            }
70            100% {
71                transform: translate(100px, -500px) rotateX(0deg) rotateY(0deg);
72            }
73        }
74        @keyframes box-3 {
75            0% {
76                transform: translate(0, 0) rotateX(0deg) rotateY(0deg);
77            }
78            100% {
79                transform: translate(200px, -500px) rotateX(0deg) rotateY(0deg);
80            }
81        }
82        @keyframes cube-1 {
83            0% {
84                transform: translate(100px, 0) rotateX(0deg) rotateY(0deg);
85            }
86            100% {
87                transform: translate(100px, -500px) rotateX(0deg) rotateY(0deg);
88            }
89        }
90        @keyframes cube-2 {
91            0% {
92                transform: translate(0, 0) rotateX(0deg) rotateY(0deg);
93            }
94            100% {
95                transform: translate(-100px, -500px) rotateX(0deg) rotateY(0deg);
96            }
97        }
98        @keyframes cube-3 {
99            0% {
100                transform: translate(0, 0) rotateX(0deg) rotateY(0deg);
101            }
102            100% {
103                transform: translate(-200px, -500px) rotateX(0deg) rotateY(0deg);
104            }
105        }
106    </style>
107</head>
108<body>
109    <div class="box-1"></div>
110    <div class="box-2"></div>
111    <div class="box-3"></div>
112    <div class="cube-1"></div>
113    <div class="cube-2"></div>
114    <div class="cube-3"></div>
115</body>
116</html>