model output
GPT-5.4

Such Spinners, Much Loading
A 0.89T 0.19
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>Circle to Tilted Square Loop</title>
7<style>
8  html, body {
9    margin: 0;
10    width: 100%;
11    height: 100%;
12    background: #ffffff;
13    overflow: hidden;
14  }
15
16  body {
17    display: grid;
18    place-items: center;
19  }
20
21  .shape {
22    width: 50px;
23    height: 50px;
24    background: #333333;
25    animation: morph 1.6s ease-in-out infinite;
26    will-change: transform, border-radius;
27  }
28
29  @keyframes morph {
30    0%, 40%, 100% {
31      border-radius: 50%;
32      transform: rotate(0deg) scale(1);
33    }
34    50%, 90% {
35      border-radius: 0%;
36      transform: rotate(-5deg) scale(1);
37    }
38  }
39</style>
40</head>
41<body>
42  <div class="shape"></div>
43</body>
44</html>