chore: bump version to 2.3.20 and update dependencies

feat: enhance x01 score progress animations and effects
- Improved animation definitions for pulse-core and glass-charge effects.
- Adjusted timing and easing functions for smoother transitions.
- Updated CSS styles for score progress elements to enhance visual feedback.

fix: ensure ghost trail animations handle stale callbacks correctly
- Added logic to ignore stale animation cancel callbacks after score changes.

test: add comprehensive tests for x01 score progress features
- Implemented tests for new animation behaviors and visual effects.
- Verified correct rendering of score progress previews and dynamic updates.

Author: thomasasen

AGENTS.md

@@ -16,7 +16,8 @@ Priority: truthfulness, correctness, proportional validation.
 - use `$maintain-changelog` only when changelog, release-note, or compare-link work is explicitly in scope
 - do not run `git commit`, push, create PRs, or create releases without an explicit user request
 - final output must state what changed, what was validated, what remains unverified, and include a draft commit message when there are meaningful file changes
-- when SonarQube is relevant, run `npm test`; it includes `npm run sonar`, which must use `SONARQUBE_URL`/`SONARQUBE_TOKEN` from the environment or fall back to `~/.codex/config.toml` `[mcp_servers.sonarqube].env`
+- when SonarQube is relevant on new builds, run `npm test`; it includes `npm run sonar`, which must use `SONARQUBE_URL`/`SONARQUBE_TOKEN` from the environment or fall back to `~/.codex/config.toml` `[mcp_servers.sonarqube].env`
 - never claim SonarQube is unavailable before checking `npm run sonar`; never print or commit the SonarQube token
+- For minor changes, such as changing variable values, skip all tests. In general, keep in mind the proportionality of tests.
 
 Done means the change is in the right layer, scoped validation ran or is clearly blocked, and any skipped release, changelog, browser, or SonarQube verification is reported truthfully.

CHANGELOG.md

@@ -12,6 +12,15 @@ zum nächsten Release-Commit vorübergehend auf `HEAD` zeigen.
 Dieses Repository führt keine `Unreleased`-Sektion. Jeder dokumentierte Eintrag gehört
 direkt zu einer versionierten Release-Sektion.
 
+## [2.3.20] - 2026-06-16
+
+### Changed
+
+- Nutzerwirkung: `X01 Score Progress`-Effekte sind in der Konfiguration leichter vergleichbar: Die Effekt-Buttons zeigen längere Balken, `Ghost Trail` demonstriert eine echte Abnahme von `80 %` auf `15 %`, und die Hauptvorschau läuft als Prozentsequenz.
+  Technik: Die xConfig-Shell nutzt einen eigenen X01-Score-Progress-Preview-Controller mit loopbaren Runtime-Hosts, hält Render-Hooks stabil und deckt Button- sowie Hauptvorschau mit Shell-Regressionen ab.
+- Nutzerwirkung: `Pulse Core`, `Glass Charge` und `Ghost Trail` wirken klarer und stärker unterscheidbar; besonders Trails, Ladeglanz und Pulse-Peak sind besser wahrnehmbar.
+  Technik: Runtime-Keyframes, CSS-Animationen, Glow-/Sweep-Layer und Effekt-Dauern wurden gezielt nachgeschärft; Runtime-Regressionen sichern die neuen Effektverträge und den stabilen Ghost-Trail-Cleanup ab.
+
 ## [2.3.19] - 2026-06-05
 
 ### Added
@@ -1661,7 +1670,8 @@ direkt zu einer versionierten Release-Sektion.
   und Regressionstests eingeführt und die generierten README-/FEATURES-Texte wurden
   entsprechend synchronisiert.
 
-[2.3.19]: https://github.com/thomasasen/autodarts-xconfig/compare/d48730f...HEAD
+[2.3.20]: https://github.com/thomasasen/autodarts-xconfig/compare/09ae6b2...HEAD
+[2.3.19]: https://github.com/thomasasen/autodarts-xconfig/compare/d48730f...09ae6b2
 [2.3.18]: https://github.com/thomasasen/autodarts-xconfig/compare/0c88218...d48730f
 [2.3.17]: https://github.com/thomasasen/autodarts-xconfig/compare/3cbf7b3...0c88218
 [2.3.16]: https://github.com/thomasasen/autodarts-xconfig/compare/53e5d17...3cbf7b3

dist/autodarts-xconfig.meta.js

@@ -1,7 +1,7 @@
 // ==UserScript==
 // @name         autodarts-xconfig
 // @namespace    https://github.com/thomasasen/autodarts-xconfig
-// @version      2.3.19
+// @version      2.3.20
 // @description  Modular, side-effect resistant Tampermonkey runtime for Autodarts enhancements.
 // @author       Thomas Asen
 // @license      MIT

dist/autodarts-xconfig.user.js

@@ -1,7 +1,7 @@
 // ==UserScript==
 // @name         autodarts-xconfig
 // @namespace    https://github.com/thomasasen/autodarts-xconfig
-// @version      2.3.19
+// @version      2.3.20
 // @description  Modular, side-effect resistant Tampermonkey runtime for Autodarts enhancements.
 // @author       Thomas Asen
 // @license      MIT

loader/autodarts-xconfig.user.js

@@ -1,6 +1,6 @@
 {
   "name": "autodarts-xconfig",
-  "version": "2.3.19",
+  "version": "2.3.20",
   "description": "Clean successor architecture for autodarts xConfig userscript modules",
   "type": "module",
   "imports": {

package-lock.json

@@ -13,7 +13,7 @@ import { createListenerRegistry } from "./listener-registry.js";
 import { createObserverRegistry } from "./observer-registry.js";
 
 const GLOBAL_NAMESPACE_KEY = "__adXConfig";
-const API_VERSION = "2.3.19";
+const API_VERSION = "2.3.20";
 const STARTUP_DEFER_INTERVAL_MS = 16;
 
 function getWindowTimerApi(windowRef) {

package.json

@@ -1023,14 +1023,20 @@ function cancelEffectAnimation(fillNode) {
   }
 }
 
-function clearTrailState(trailNode) {
+function clearTrailState(trailNode, expectedAnimation = null) {
   if (!trailNode) {
     return;
   }
 
   const runningAnimation = trailNode[TRAIL_ANIMATION_SLOT];
-  if (runningAnimation && typeof runningAnimation.cancel === "function") {
+  if (expectedAnimation && runningAnimation !== expectedAnimation) {
+    return;
+  }
+
+  if (!expectedAnimation && runningAnimation && typeof runningAnimation.cancel === "function") {
     try {
+      runningAnimation.onfinish = null;
+      runningAnimation.oncancel = null;
       runningAnimation.cancel();
     } catch (_) {
       // Ignore stale animation handles.
@@ -1058,22 +1064,23 @@ function createEffectAnimationDefinition(effect) {
   if (normalizedEffect === "pulse-core") {
     return {
       keyframes: [
-        { transform: "scaleY(1)", filter: "brightness(1.06) saturate(1.02)" },
-        { transform: "scaleY(1.24)", filter: "brightness(1.28) saturate(1.18)" },
-        { transform: "scaleY(1)", filter: "brightness(1.02) saturate(1.02)" },
+        { transform: "scaleY(1)", filter: "brightness(1.08) saturate(1.06)" },
+        { transform: "scaleY(1.38)", filter: "brightness(1.46) saturate(1.3)" },
+        { transform: "scaleY(1)", filter: "brightness(1.04) saturate(1.04)" },
       ],
-      options: { duration: 360, easing: "ease-out" },
+      options: { duration: 440, easing: "cubic-bezier(0.16, 0.9, 0.2, 1)" },
     };
   }
 
   if (normalizedEffect === "glass-charge") {
     return {
       keyframes: [
-        { filter: "brightness(1.04) saturate(1.04)", opacity: 0.94 },
-        { filter: "brightness(1.26) saturate(1.16)", opacity: 1 },
-        { filter: "brightness(1.02) saturate(1.02)", opacity: 0.96 },
+        { filter: "brightness(1.03) saturate(1.06)", opacity: 0.94, transform: "scaleY(1)" },
+        { filter: "brightness(1.18) saturate(1.16)", opacity: 0.98, transform: "scaleY(1.04)" },
+        { filter: "brightness(1.38) saturate(1.28)", opacity: 1, transform: "scaleY(1.1)" },
+        { filter: "brightness(1.05) saturate(1.08)", opacity: 0.96, transform: "scaleY(1)" },
       ],
-      options: { duration: 420, easing: "ease-in-out" },
+      options: { duration: 560, easing: "cubic-bezier(0.18, 0.82, 0.18, 1)" },
     };
   }
 
@@ -1111,23 +1118,39 @@ function triggerGhostTrail(trailNode, shouldTrigger, previousRatio, currentRatio
   const fromWidth = formatProgressWidth(isFiniteNumber(previousRatio) ? previousRatio : currentRatio);
   const toWidth = formatProgressWidth(currentRatio);
   trailNode.style?.setProperty?.(TRAIL_WIDTH_PROPERTY, fromWidth);
-  trailNode.style?.setProperty?.("opacity", "0.76");
+  trailNode.style?.setProperty?.("opacity", "0.92");
 
   const animation = trailNode.animate(
     [
-      { width: fromWidth, opacity: 0.76, filter: "blur(8px) brightness(1.28)" },
-      { width: toWidth, opacity: 0, filter: "blur(2px) brightness(1.02)" },
+      {
+        width: fromWidth,
+        opacity: 0.92,
+        filter: "blur(7px) brightness(1.38) saturate(1.18)",
+        offset: 0,
+      },
+      {
+        width: fromWidth,
+        opacity: 0.78,
+        filter: "blur(6px) brightness(1.32) saturate(1.14)",
+        offset: 0.32,
+      },
+      {
+        width: toWidth,
+        opacity: 0,
+        filter: "blur(2px) brightness(1.04) saturate(1.04)",
+        offset: 1,
+      },
     ],
     {
-      duration: 620,
+      duration: 1860,
       easing: "cubic-bezier(0.22, 1, 0.36, 1)",
       fill: "none",
       iterations: 1,
     }
   );
 
   trailNode[TRAIL_ANIMATION_SLOT] = animation;
-  const finish = () => clearTrailState(trailNode);
+  const finish = () => clearTrailState(trailNode, animation);
   animation.onfinish = finish;
   animation.oncancel = finish;
 }

src/core/bootstrap.js

@@ -240,9 +240,14 @@ ${HOST_SELECTOR} .${TRAIL_CLASS}{
   width:var(--ad-ext-x01-score-progress-trail-width);
   opacity:0;
   border-radius:inherit;
-  background:var(--ad-ext-x01-score-progress-fill-bg);
-  filter:blur(7px) brightness(1.18);
-  box-shadow:var(--ad-ext-x01-score-progress-fill-shadow);
+  background:
+    linear-gradient(90deg,rgba(255,255,255,.38) 0%,rgba(255,255,255,.18) 42%,rgba(255,255,255,0) 100%),
+    var(--ad-ext-x01-score-progress-fill-bg);
+  filter:blur(7px) brightness(1.24) saturate(1.12);
+  box-shadow:
+    var(--ad-ext-x01-score-progress-fill-shadow),
+    0 0 16px var(--ad-ext-x01-score-progress-fill-outline-active),
+    0 0 26px var(--ad-ext-x01-score-progress-fill-ambient-active);
   pointer-events:none;
 }
 
@@ -299,18 +304,25 @@ ${HOST_SELECTOR}.${ACTIVE_CLASS}.ad-ext-x01-score-progress--size-extrabreit{
 }
 
 ${HOST_SELECTOR}.${ACTIVE_CLASS} .${FILL_CLASS}.ad-ext-x01-score-progress__fill--effect-pulse-core{
-  animation:ad-ext-x01-score-progress-pulse-core 1.32s ease-in-out infinite;
+  transform-origin:center;
+  animation:ad-ext-x01-score-progress-pulse-core 1.22s cubic-bezier(.16,.9,.2,1) infinite;
 }
 
 ${HOST_SELECTOR}.${ACTIVE_CLASS} .${FILL_CLASS}.ad-ext-x01-score-progress__fill--effect-glass-charge{
-  animation:ad-ext-x01-score-progress-glass-charge-core 1.74s ease-in-out infinite;
+  animation:ad-ext-x01-score-progress-glass-charge-core 2.2s cubic-bezier(.18,.82,.18,1) infinite;
+  box-shadow:
+    var(--ad-ext-x01-score-progress-fill-shadow),
+    inset 0 1px 2px rgba(255,255,255,.34),
+    inset 0 -1px 4px rgba(255,255,255,.12);
 }
 
 ${HOST_SELECTOR}.${ACTIVE_CLASS} .${FILL_CLASS}.ad-ext-x01-score-progress__fill--effect-glass-charge::after{
   opacity:1;
-  background:linear-gradient(115deg,rgba(255,255,255,0) 18%,rgba(255,255,255,.12) 36%,rgba(255,255,255,.66) 50%,rgba(255,255,255,.12) 64%,rgba(255,255,255,0) 82%);
-  transform:translateX(-150%);
-  animation:ad-ext-x01-score-progress-glass-charge-sweep 1.74s cubic-bezier(.22,.9,.18,1) infinite;
+  background:
+    linear-gradient(115deg,rgba(255,255,255,0) 8%,rgba(255,255,255,.16) 27%,rgba(255,255,255,.76) 48%,rgba(255,255,255,.2) 68%,rgba(255,255,255,0) 92%),
+    linear-gradient(180deg,rgba(255,255,255,.28) 0%,rgba(255,255,255,0) 46%);
+  transform:translateX(-175%);
+  animation:ad-ext-x01-score-progress-glass-charge-sweep 2.2s cubic-bezier(.18,.82,.18,1) infinite;
 }
 
 ${HOST_SELECTOR}.${ACTIVE_CLASS} .${FILL_CLASS}.ad-ext-x01-score-progress__fill--effect-segment-drain{
@@ -342,18 +354,20 @@ ${HOST_SELECTOR}.${ACTIVE_CLASS} .${FILL_CLASS}.ad-ext-x01-score-progress__fill-
 }
 
 @keyframes ad-ext-x01-score-progress-pulse-core{
-  0%,100%{transform:scaleY(1);filter:brightness(1) saturate(1.02)}
-  50%{transform:scaleY(1.18);filter:brightness(1.2) saturate(1.18)}
+  0%,100%{transform:scaleY(1);filter:brightness(1.02) saturate(1.05);box-shadow:var(--ad-ext-x01-score-progress-fill-shadow)}
+  48%{transform:scaleY(1.34);filter:brightness(1.36) saturate(1.28);box-shadow:var(--ad-ext-x01-score-progress-fill-shadow),0 0 16px var(--ad-ext-x01-score-progress-fill-outline-active),0 0 26px var(--ad-ext-x01-score-progress-fill-ambient-active)}
 }
 
 @keyframes ad-ext-x01-score-progress-glass-charge-core{
-  0%,100%{filter:brightness(1.02) saturate(1.03)}
-  45%{filter:brightness(1.18) saturate(1.12)}
+  0%,100%{filter:brightness(1.02) saturate(1.05);box-shadow:var(--ad-ext-x01-score-progress-fill-shadow),inset 0 1px 2px rgba(255,255,255,.26),inset 0 -1px 3px rgba(255,255,255,.1)}
+  42%{filter:brightness(1.16) saturate(1.14);box-shadow:var(--ad-ext-x01-score-progress-fill-shadow),0 0 10px var(--ad-ext-x01-score-progress-fill-outline-active),inset 0 1px 4px rgba(255,255,255,.34),inset 0 -1px 5px rgba(255,255,255,.14)}
+  62%{filter:brightness(1.34) saturate(1.26);box-shadow:var(--ad-ext-x01-score-progress-fill-shadow),0 0 18px var(--ad-ext-x01-score-progress-fill-outline-active),0 0 30px var(--ad-ext-x01-score-progress-fill-ambient-active),inset 0 1px 6px rgba(255,255,255,.46),inset 0 -1px 8px rgba(255,255,255,.18)}
 }
 
 @keyframes ad-ext-x01-score-progress-glass-charge-sweep{
-  0%{transform:translateX(-150%)}
-  68%,100%{transform:translateX(155%)}
+  0%,16%{transform:translateX(-175%);opacity:.18}
+  56%{transform:translateX(-8%);opacity:1}
+  78%,100%{transform:translateX(175%);opacity:.16}
 }
 
 @keyframes ad-ext-x01-score-progress-segment-drain{