model output
Claude Sonnet 4.6

Google+ Jingle
A 0.82T 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>Bell Animation</title>
7<style>
8  * { margin: 0; padding: 0; box-sizing: border-box; }
9  body { background: white; width: 100vw; height: 100vh; overflow: hidden; }
10
11  .bell-container {
12    position: absolute;
13    left: 140px;
14    top: 100px;
15    transform-origin: center top;
16    animation: bellSwing 1.2s ease-in-out infinite;
17  }
18
19  @keyframes bellSwing {
20    0%   { transform: rotate(20deg); }
21    25%  { transform: rotate(0deg); }
22    50%  { transform: rotate(-20deg); }
23    75%  { transform: rotate(0deg); }
24    100% { transform: rotate(20deg); }
25  }
26
27  .bell-svg {
28    width: 70px;
29    height: 80px;
30  }
31</style>
32</head>
33<body>
34
35<div class="bell-container">
36  <svg class="bell-svg" viewBox="0 0 70 80" xmlns="http://www.w3.org/2000/svg">
37    <!-- Ring at top -->
38    <circle cx="35" cy="7" r="5" fill="none" stroke="#bbb" stroke-width="2.5"/>
39    
40    <!-- Bell body -->
41    <path d="M35 12 
42             C35 12, 15 20, 12 45 
43             L12 58 
44             Q12 62 16 62 
45             L54 62 
46             Q58 62 58 58 
47             L58 45 
48             C55 20, 35 12, 35 12 Z" 
49          fill="#c8c8c8"/>
50    
51    <!-- Bell bottom rim -->
52    <rect x="10" y="58" width="50" height="7" rx="3.5" fill="#bbb"/>
53    
54    <!-- Clapper -->
55    <circle cx="35" cy="70" r="5" fill="#aaa"/>
56    
57    <!-- Eyes -->
58    <circle cx="28" cy="38" r="2.5" fill="#999"/>
59    <circle cx="42" cy="38" r="2.5" fill="#999"/>
60    
61    <!-- Smile -->
62    <path d="M27 47 Q35 53 43 47" fill="none" stroke="#999" stroke-width="2" stroke-linecap="round"/>
63  </svg>
64</div>
65
66</body>
67</html>