style: wrap tier billing line under price and keep amounts with units

The longer billing lines added with the annual prices broke across two or three lines beside the price and split amounts from their units.

Co-Authored-By: Claude <noreply@anthropic.com>

website/static/style.css

@@ -1457,8 +1457,9 @@ th[data-sort].sort-asc::after {
 
 .tier-price {
   display: flex;
+  flex-wrap: wrap;
   align-items: baseline;
-  gap: 0.55rem;
+  gap: 0.35rem 0.55rem;
   margin-bottom: 0.25rem;
 }
 

website/templates/sponsorship.html

@@ -116,7 +116,7 @@
           <p class="tier-eyebrow">Headline Sponsor</p>
           <p class="tier-price">
             <span class="tier-amount">$500</span>
-            <span class="tier-cadence">/ month or $4,500 / year</span>
+            <span class="tier-cadence">/&nbsp;month or $4,500&nbsp;/&nbsp;year</span>
           </p>
           <p class="tier-summary">
             Logo pinned at the top of the README. Logo on the website.
@@ -139,7 +139,7 @@
           <p class="tier-eyebrow">Featured Sponsor</p>
           <p class="tier-price">
             <span class="tier-amount">$200</span>
-            <span class="tier-cadence">/ month or $1,800 / year</span>
+            <span class="tier-cadence">/&nbsp;month or $1,800&nbsp;/&nbsp;year</span>
           </p>
           <p class="tier-summary">
             Small logo and text link pinned at the top of the README. Logo and
@@ -166,7 +166,7 @@
           <p class="tier-eyebrow">Indie Dev Sponsor</p>
           <p class="tier-price">
             <span class="tier-amount">$99</span>
-            <span class="tier-cadence">/ month, $249 / quarter, or $891 / year</span>
+            <span class="tier-cadence">/&nbsp;month, $249&nbsp;/&nbsp;quarter, or $891&nbsp;/&nbsp;year</span>
           </p>
           <p class="tier-summary">
             Lower-cost text link for eligible indie developers and solo