model output
Claude Sonnet 4.6

CSS3 loading animations
A 0.86T 0.22
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  * { margin: 0; padding: 0; box-sizing: border-box; }
9  
10  body {
11    background-color: #0d0d0d;
12    display: flex;
13    justify-content: center;
14    align-items: flex-start;
15    min-height: 100vh;
16    padding-top: 50px;
17  }
18
19  .loading-text {
20    display: flex;
21    gap: 12px;
22    font-family: Arial, Helvetica, sans-serif;
23    font-size: 48px;
24    font-weight: bold;
25    letter-spacing: 0.15em;
26  }
27
28  .loading-text span {
29    color: #3a3a3a;
30    animation: pulse 1.4s ease-in-out infinite;
31  }
32
33  @keyframes pulse {
34    0%, 100% { color: #3a3a3a; }
35    50% { color: #666666; }
36  }
37
38  .loading-text span:nth-child(1) { animation-delay: 0s; }
39  .loading-text span:nth-child(2) { animation-delay: 0.2s; }
40  .loading-text span:nth-child(3) { animation-delay: 0.4s; }
41  .loading-text span:nth-child(4) { animation-delay: 0.6s; }
42  .loading-text span:nth-child(5) { animation-delay: 0.8s; }
43  .loading-text span:nth-child(6) { animation-delay: 1.0s; }
44  .loading-text span:nth-child(7) { animation-delay: 1.2s; }
45</style>
46</head>
47<body>
48  <div class="loading-text">
49    <span>L</span>
50    <span>O</span>
51    <span>A</span>
52    <span>D</span>
53    <span>I</span>
54    <span>N</span>
55    <span>G</span>
56  </div>
57</body>
58</html>