diff --git a/Jellyfin.Plugin.Seasonals/Configuration/configPage.html b/Jellyfin.Plugin.Seasonals/Configuration/configPage.html
index 78da4c2..d2c9e9f 100644
--- a/Jellyfin.Plugin.Seasonals/Configuration/configPage.html
+++ b/Jellyfin.Plugin.Seasonals/Configuration/configPage.html
@@ -88,7 +88,7 @@
 
                     <!-- Auto Selection Tab -->
                     <div id="seasonals-auto-selection" class="seasonals-tab-content" style="display: none;">
-                        <h3>Auto Selection Rules</h3>
+                        <h2>Auto Selection Rules</h2>
 
                         <div style="background-color: rgba(255, 255, 255, 0.05); border-left: 4px solid #00a4dc; border-radius: 4px; padding: 1em 1.5em; margin: 1.5em 0; display: flex; align-items: center; gap: 1em;">
                             <i class="material-icons" style="color: #00a4dc; font-size: 24px;">info</i>
@@ -99,7 +99,7 @@
                             <!-- Rules will be injected here via JS -->
                         </div>
 
-                        <button is="emby-button" type="button" class="raised button-accent block" onclick="SeasonalsConfigPage.addRule();">
+                        <button is="emby-button" type="button" class="raised button-accent block" onclick="SeasonalsConfigPage.addRule();" style="margin-top: 1em; display: inline-flex; align-items: center; gap: 0.4em;">
                             <i class="material-icons" style="font-size: 24px;">add</i>
                             <span>Add Rule</span>
                         </button>
@@ -774,7 +774,7 @@
                     var rules = document.querySelectorAll('.seasonal-rule');
                     rules.forEach((rule, index) => {
                         var name = rule.querySelector('.rule-name').value;
-                        rule.querySelector('.rule-title').innerText = `#${index + 1} ${name}`;
+                        rule.querySelector('.rule-title').innerText = '#' + (index + 1) + ' ' + name;
                     });
                 },