feat(points): add effect engines and effects shop

src/components/EffectBackground.test.jsx

@@ -0,0 +1,26 @@
+// @vitest-environment jsdom
+import {afterEach, describe, expect, it} from 'vitest';
+import {cleanup, render} from '@testing-library/react';
+import EffectBackground, {EFFECTS} from './EffectBackground.jsx';
+
+afterEach(cleanup);
+
+describe('EffectBackground', () => {
+    it.each(EFFECTS)('renders %s hidden from screen readers with its engine class and shapes', (effect) => {
+        const {container} = render(<EffectBackground effect={effect} className="absolute inset-0"/>);
+
+        const root = container.querySelector('[data-effect]');
+        expect(root.dataset.effect).toBe(effect);
+        expect(root.getAttribute('aria-hidden')).toBe('true');
+        expect(root.classList.contains(`fx-bg-${effect}`)).toBe(true);
+        expect(root.classList.contains('fx')).toBe(true);
+        expect(root.classList.contains('absolute')).toBe(true);
+        expect(root.children.length).toBeGreaterThan(0);
+    });
+
+    it('renders nothing for an unknown effect', () => {
+        const {container} = render(<EffectBackground effect="matrix"/>);
+
+        expect(container.firstChild).toBeNull();
+    });
+});