chore(design): detector exceptions for game motion; XP bar animates transform

bounce-easing is the owner's direction (El3ab is a game: pops and overshoot);
side-tab flags the 3D bevel under buttons and cards. The XP bar used to
transition width (layout thrash); it now scales.
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

.impeccable/config.json

+{
+  "detector": {
+    "ignoreRules": [
+      "bounce-easing",
+      "side-tab"
+    ],
+    "ignoreFiles": [],
+    "ignoreValues": []
+  }
+}

public/css/core.css

@@ -162,7 +162,8 @@ html.no-chrome #hud, #hud:empty { display: none; }
 }
 .hud-level { font-size: 12px; font-weight: 700; color: var(--gold-soft); text-shadow: var(--text-shadow); }
 .hud-xp { display: block; width: 72px; height: 7px; margin-top: 4px; border-radius: 4px; background: rgba(0, 0, 0, 0.55); box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.7), 0 1px 0 rgba(255, 220, 160, 0.18); overflow: hidden; }
-.hud-xp > span { display: block; height: 100%; width: 0; border-radius: inherit; background: linear-gradient(180deg, #9BEBFF, #2A9BE6); transition: width 600ms var(--ease-out); }
+.hud-xp > span { display: block; height: 100%; width: 100%; border-radius: inherit; background: linear-gradient(180deg, #9BEBFF, #2A9BE6); transform: scaleX(var(--xp, 0)); transform-origin: 0 50%; transition: transform 600ms var(--ease-out); }
+[dir="rtl"] .hud-xp > span { transform-origin: 100% 50%; }
 
 .hud-stats {
   display: flex;

public/js/core/hud.js

@@ -61,7 +61,7 @@ function renderHud() {
       <span class="hud-avatar">${avatarMarkup(player, 34)}<span class="hud-level-badge num" id="hud-level">${level}</span></span>
       <span class="hud-who">
         <span class="hud-name">${escapeHtml(name)}</span>
-        <span class="hud-xp" aria-label="${t('hud.level')} ${level}"><span id="hud-xp" style="width:${xpPct(player)}%"></span></span>
+        <span class="hud-xp" aria-label="${t('hud.level')} ${level}"><span id="hud-xp" style="--xp:${xpPct(player) / 100}"></span></span>
       </span>
     </button>
     <div class="hud-stats">
@@ -190,7 +190,7 @@ function updateHud() {
   if (lastLevel && lvl > lastLevel) celebrateLevel(lvl);
   lastLevel = lvl;
   const xpEl = document.getElementById('hud-xp');
-  if (xpEl) xpEl.style.width = xpPct(player) + '%';
+  if (xpEl) xpEl.style.setProperty('--xp', String(xpPct(player) / 100));
   const nameEl = hudEl.querySelector('.hud-name');
   if (nameEl) nameEl.textContent = player.display_name || player.username || '';