model output
GPT-5.4

Exploring Bourbon
A 0.83T 0.26
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>Rotating Coin Dot</title>
7<style>
8  :root{
9    --bg:#d95d93;
10    --dot:#ffffff;
11    --shadow: rgba(0,0,0,.38);
12  }
13
14  html,body{
15    margin:0;
16    width:100%;
17    height:100%;
18    overflow:hidden;
19    background:var(--bg);
20  }
21
22  body{
23    display:grid;
24    place-items:center;
25  }
26
27  .scene{
28    position:relative;
29    width:100vw;
30    height:100vh;
31    background:var(--bg);
32  }
33
34  .dot{
35    position:absolute;
36    left:50%;
37    top:50%;
38    width:48px;
39    height:48px;
40    margin-left:-24px;
41    margin-top:-24px;
42    border-radius:50%;
43    background:var(--dot);
44    box-shadow:
45      6px 8px 0 -1px rgba(0,0,0,.28),
46      4px 6px 10px rgba(0,0,0,.18);
47    transform-origin:center center;
48    animation: flip 1.15s ease-in-out infinite;
49    will-change: transform, border-radius, box-shadow;
50  }
51
52  @keyframes flip{
53    0%, 100%{
54      transform: scaleX(1) scaleY(.82);
55      border-radius: 50%;
56      box-shadow:
57        6px 8px 0 -1px rgba(0,0,0,.28),
58        4px 6px 10px rgba(0,0,0,.18);
59    }
60    24%{
61      transform: scaleX(.42) scaleY(1);
62      border-radius: 50%;
63      box-shadow:
64        8px 8px 0 -1px rgba(0,0,0,.30),
65        5px 6px 10px rgba(0,0,0,.18);
66    }
67    50%{
68      transform: scaleX(1) scaleY(.82);
69      border-radius: 50%;
70      box-shadow:
71        6px 8px 0 -1px rgba(0,0,0,.28),
72        4px 6px 10px rgba(0,0,0,.18);
73    }
74    74%{
75      transform: scaleX(.42) scaleY(1);
76      border-radius: 50%;
77      box-shadow:
78        8px 8px 0 -1px rgba(0,0,0,.30),
79        5px 6px 10px rgba(0,0,0,.18);
80    }
81  }
82</style>
83</head>
84<body>
85  <div class="scene">
86    <div class="dot"></div>
87  </div>
88</body>
89</html>