model output
Claude Sonnet 4.6

Simple Spinner
A 0.95T 0.28
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>Loading Animation</title>
7<style>
8  * {
9    margin: 0;
10    padding: 0;
11    box-sizing: border-box;
12  }
13
14  body {
15    background-color: #d4006a;
16    display: flex;
17    justify-content: center;
18    align-items: center;
19    height: 100vh;
20    overflow: hidden;
21  }
22
23  .loader {
24    display: flex;
25    align-items: center;
26    gap: 6px;
27  }
28
29  .dot {
30    width: 10px;
31    height: 10px;
32    background-color: white;
33    border-radius: 50%;
34    animation: pulse 1s ease-in-out infinite;
35  }
36
37  .dot:nth-child(1) { animation-delay: 0s; }
38  .dot:nth-child(2) { animation-delay: 0.2s; }
39  .dot:nth-child(3) { animation-delay: 0.4s; }
40  .dot:nth-child(4) { animation-delay: 0.6s; }
41  .dot:nth-child(5) { animation-delay: 0.8s; }
42
43  @keyframes pulse {
44    0%, 100% {
45      transform: scale(1);
46    }
47    50% {
48      transform: scale(2);
49    }
50  }
51</style>
52</head>
53<body>
54  <div class="loader">
55    <div class="dot"></div>
56    <div class="dot"></div>
57    <div class="dot"></div>
58    <div class="dot"></div>
59    <div class="dot"></div>
60  </div>
61</body>
62</html>