model output
GPT-5.4

Such Spinners, Much Loading
A 0.83T 0.24
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>Minimal Orbit Dot Loader</title>
7<style>
8  :root{
9    --bg:#ffffff;
10    --dark:#333336;
11    --size:50px;
12    --inner:24px;
13    --dur:1s;
14  }
15
16  html,body{
17    margin:0;
18    width:100%;
19    height:100%;
20    background:var(--bg);
21    overflow:hidden;
22  }
23
24  body{
25    display:grid;
26    place-items:center;
27  }
28
29  .loader{
30    position:relative;
31    width:var(--size);
32    height:var(--size);
33    border-radius:50%;
34    background:var(--dark);
35  }
36
37  .loader::before{
38    content:"";
39    position:absolute;
40    left:50%;
41    top:50%;
42    width:var(--inner);
43    height:var(--inner);
44    margin-left:calc(var(--inner) / -2);
45    margin-top:calc(var(--inner) / -2);
46    border-radius:50%;
47    background:var(--bg);
48    animation:orbit var(--dur) linear infinite;
49  }
50
51  @keyframes orbit{
52    0%   { transform:translate(0, 13px); }
53    25%  { transform:translate(0,-13px); }
54    50%  { transform:translate(0, 13px); }
55    75%  { transform:translate(0,-13px); }
56    100% { transform:translate(0, 13px); }
57  }
58</style>
59</head>
60<body>
61  <div class="loader" aria-label="loading"></div>
62</body>
63</html>