model output
LLaMA 4 Scout

the deep blue (waves)
A 0.57T 0.29
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>The Deep Blue</title>
7    <style>
8        body {
9            margin: 0;
10            background-color: #212121;
11            display: flex;
12            justify-content: center;
13            align-items: center;
14            height: 100vh;
15            font-family: Arial, sans-serif;
16        }
17
18        .wave {
19            position: relative;
20            width: 100%;
21            height: 100vh;
22            background-color: #4567b7;
23            overflow: hidden;
24            line-height: 0;
25        }
26
27        .wave::before {
28            content: "";
29            position: absolute;
30            top: 0;
31            left: 0;
32            width: 100%;
33            height: 100%;
34            background: linear-gradient(to bottom, #4567b7 0%, #6495ed 100%);
35            z-index: 1;
36        }
37
38        .wave .text {
39            position: absolute;
40            top: 50%;
41            left: 50%;
42            transform: translate(-50%, -50%);
43            font-size: 24px;
44            color: white;
45            z-index: 2;
46        }
47
48        .animate {
49            animation: wave 3s infinite;
50        }
51
52        @keyframes wave {
53            0% {
54                clip-path: polygon(0 50%, 100% 50%, 100% 100%, 0 100%);
55            }
56            50% {
57                clip-path: polygon(0 40%, 100% 50%, 100% 100%, 0 100%);
58            }
59            100% {
60                clip-path: polygon(0 50%, 100% 50%, 100% 100%, 0 100%);
61            }
62        }
63    </style>
64</head>
65<body>
66    <div class="wave animate">
67        <span class="text">The deep blue</span>
68    </div>
69</body>
70</html>