Skins padding fix (#2893)

## Description:

Fixes some visual issues in the skins modal **tailwind only changes +
small movement of logic check**

(padding issue)
<img width="830" height="155" alt="image"
src="https://github.com/user-attachments/assets/6581f887-ee23-4751-a9a3-82416aa1a381"
/>

(huge gap at bottom because it was trying to put a button there but then
stopping due to requirespurchase=false)
<img width="218" height="302" alt="image"
src="https://github.com/user-attachments/assets/0837b256-1137-4ae4-9940-8a4375143f54"
/>



Now:
<img width="303" height="297" alt="image"
src="https://github.com/user-attachments/assets/4ba1556a-444a-4e3e-9d1a-73355dd34dbb"
/>

<img width="844" height="213" alt="image"
src="https://github.com/user-attachments/assets/cce2472c-9ac4-4caf-8052-1d597610b1c9"
/>



## Please complete the following:

- [x] I have added screenshots for all UI updates
- [x] I process any text displayed to the user through translateText()
and I've added it to the en.json file
- [x] I have added relevant tests to the test directory
- [x] I confirm I have thoroughly tested these changes and take full
responsibility for any bugs introduced

## Please put your Discord username so you can be contacted if a bug or
regression is found:

w.o.n

src/client/TerritoryPatternsModal.ts

@@ -174,8 +174,8 @@ export class TerritoryPatternsModal extends BaseModal {
     }
 
     return html`
-      <div class="flex flex-col gap-4">
-        <div class="flex justify-center">
+      <div class="flex flex-col">
+        <div class="pt-4 flex justify-center">
           ${hasLinkedAccount(this.userMeResponse)
             ? this.renderMySkinsButton()
             : html``}

src/client/components/PatternButton.ts

@@ -137,9 +137,9 @@ export class PatternButton extends LitElement {
           </div>
         </button>
 
-        <div class="w-full mt-2">
-          ${this.requiresPurchase && this.pattern?.product
-            ? html`
+        ${this.requiresPurchase && this.pattern?.product
+          ? html`
+              <div class="w-full mt-2">
                 <button
                   class="w-full px-4 py-2 bg-green-500/20 text-green-400 border border-green-500/30 rounded-lg text-xs font-bold uppercase tracking-wider cursor-pointer transition-all duration-200
                    hover:bg-green-500/30 hover:shadow-[0_0_15px_rgba(74,222,128,0.2)]"
@@ -150,9 +150,9 @@ export class PatternButton extends LitElement {
                     >(${this.pattern.product.price})</span
                   >
                 </button>
-              `
-            : html`<div class="h-[34px]"></div>`}
-        </div>
+              </div>
+            `
+          : null}
       </div>
     `;
   }