diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml
new file mode 100644
index 0000000..d3e251c
--- /dev/null
+++ b/.github/workflows/ci.yml
@@ -0,0 +1,24 @@
+name: CI
+
+on:
+  push:
+    branches: [master]
+  pull_request:
+    branches: [master]
+
+jobs:
+  test:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+
+      - name: Setup Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: 22
+
+      - name: Install dependencies
+        run: npm ci
+
+      - name: Run tests
+        run: npm test
diff --git a/__tests__/data_flow.test.mjs b/__tests__/data_flow.test.mjs
new file mode 100644
index 0000000..eb88042
--- /dev/null
+++ b/__tests__/data_flow.test.mjs
@@ -0,0 +1,185 @@
+import { describe, it } from './runner.mjs';
+import Ajv from 'ajv';
+import addFormats from 'ajv-formats';
+import schema from '../src/viewer/schema.json' with { type: 'json' };
+
+const ajv = new Ajv({ strict: false });
+addFormats(ajv);
+const validate = ajv.compile(schema);
+
+describe('Data flow: popup -> storage -> viewer', () => {
+  it('should pass a scraped HLS entry through schema validation', () => {
+    // Simulate popup scraping an HLS stream
+    const scrapedEntry = {
+      url: 'https://stream.example.com/watch',
+      src: 'https://cdn.example.com/live/playlist.m3u8',
+      poster: 'https://cdn.example.com/live/thumb.jpg',
+      tab: 'Live Broadcast',
+      hlsManifest: 'https://cdn.example.com/live/playlist.m3u8',
+      mediaType: 'hls',
+    };
+
+    // Validate against schema (as storage layer would)
+    const valid = validate(scrapedEntry);
+    if (!valid) {
+      throw new Error(`Scraped HLS entry fails schema: ${JSON.stringify(validate.errors)}`);
+    }
+
+    // Verify the viewer would detect it as HLS
+    const isHls = (entry) => typeof entry === 'object' && entry.mediaType === 'hls';
+    if (!isHls(scrapedEntry)) {
+      throw new Error('Scraped HLS entry not detected as HLS by viewer');
+    }
+
+    // Verify the viewer would resolve the manifest
+    const resolveHlsManifest = (entry) => {
+      if (typeof entry === 'object' && entry.hlsManifest) return entry.hlsManifest;
+      return null;
+    };
+    const manifest = resolveHlsManifest(scrapedEntry);
+    if (manifest !== 'https://cdn.example.com/live/playlist.m3u8') {
+      throw new Error(`Manifest URL wrong: ${manifest}`);
+    }
+  });
+
+  it('should pass a scraped direct entry through schema validation', () => {
+    const scrapedEntry = {
+      url: 'https://video.example.com/watch',
+      src: 'https://cdn.example.com/video.mp4',
+      poster: 'https://cdn.example.com/thumb.jpg',
+      tab: 'Video Page',
+    };
+
+    const valid = validate(scrapedEntry);
+    if (!valid) {
+      throw new Error(`Scraped direct entry fails schema: ${JSON.stringify(validate.errors)}`);
+    }
+
+    const isHls = (entry) => typeof entry === 'object' && entry.mediaType === 'hls';
+    if (isHls(scrapedEntry)) {
+      throw new Error('Direct entry falsely detected as HLS');
+    }
+
+    const resolveSrc = (entry) => {
+      if (typeof entry === 'string') return entry;
+      return entry.src || entry.url || '';
+    };
+    const src = resolveSrc(scrapedEntry);
+    if (src !== 'https://cdn.example.com/video.mp4') {
+      throw new Error(`Src URL wrong: ${src}`);
+    }
+  });
+
+  it('should survive a round-trip: storage serialization -> deserialization', () => {
+    const originalEntry = {
+      url: 'https://example.com/stream',
+      src: 'https://cdn.example.com/stream.m3u8',
+      poster: 'https://example.com/thumb.jpg',
+      tab: 'HLS Stream',
+      hlsManifest: 'https://cdn.example.com/stream.m3u8',
+      mediaType: 'hls',
+    };
+
+    // Simulate storage round-trip (JSON serialization)
+    const serialized = JSON.stringify(originalEntry);
+    const deserialized = JSON.parse(serialized);
+
+    // Validate after deserialization
+    const valid = validate(deserialized);
+    if (!valid) {
+      throw new Error(`Round-tripped entry fails schema: ${JSON.stringify(validate.errors)}`);
+    }
+
+    // Verify fields are intact
+    if (deserialized.mediaType !== 'hls') {
+      throw new Error('mediaType lost during round-trip');
+    }
+    if (deserialized.hlsManifest !== 'https://cdn.example.com/stream.m3u8') {
+      throw new Error('hlsManifest lost during round-trip');
+    }
+
+    // Verify viewer still detects it correctly
+    const isHls = (entry) => typeof entry === 'object' && entry.mediaType === 'hls';
+    if (!isHls(deserialized)) {
+      throw new Error('Round-tripped entry not detected as HLS');
+    }
+  });
+
+  it('should handle batch entries from popup -> storage -> viewer pipeline', () => {
+    // Simulate popup storing multiple entries
+    const popupEntries = [
+      { url: 'https://example.com/1', src: 'https://cdn.example.com/1.mp4', tab: 'Tab 1' },
+      {
+        url: 'https://example.com/2',
+        src: 'https://cdn.example.com/2.m3u8',
+        hlsManifest: 'https://cdn.example.com/2.m3u8',
+        mediaType: 'hls',
+        tab: 'Tab 2',
+      },
+      { url: 'https://example.com/3', src: 'https://cdn.example.com/3.webm', mediaType: 'direct', tab: 'Tab 3' },
+    ];
+
+    // Validate all entries
+    for (const [i, entry] of popupEntries.entries()) {
+      const valid = validate(entry);
+      if (!valid) {
+        throw new Error(`Entry ${i} fails schema: ${JSON.stringify(validate.errors)}`);
+      }
+    }
+
+    // Simulate storage round-trip
+    const serialized = JSON.stringify(popupEntries);
+    const deserialized = JSON.parse(serialized);
+
+    // Verify viewer can process all entries
+    const isHls = (entry) => typeof entry === 'object' && entry.mediaType === 'hls';
+    const resolveSrc = (entry) => {
+      if (typeof entry === 'string') return entry;
+      return entry.src || entry.url || '';
+    };
+    const resolveHlsManifest = (entry) => {
+      if (typeof entry === 'object' && entry.hlsManifest) return entry.hlsManifest;
+      return null;
+    };
+
+    // Entry 0: legacy (no mediaType)
+    if (isHls(deserialized[0])) throw new Error('Entry 0 should not be HLS');
+    if (resolveSrc(deserialized[0]) !== 'https://cdn.example.com/1.mp4') throw new Error('Entry 0 src wrong');
+
+    // Entry 1: HLS
+    if (!isHls(deserialized[1])) throw new Error('Entry 1 should be HLS');
+    if (resolveHlsManifest(deserialized[1]) !== 'https://cdn.example.com/2.m3u8') throw new Error('Entry 1 manifest wrong');
+
+    // Entry 2: explicit direct
+    if (isHls(deserialized[2])) throw new Error('Entry 2 should not be HLS');
+    if (resolveSrc(deserialized[2]) !== 'https://cdn.example.com/3.webm') throw new Error('Entry 2 src wrong');
+  });
+
+  it('should reject malformed entries that could crash the viewer', () => {
+    const malformedEntries = [
+      { hlsManifest: 'https://example.com/stream.m3u8' }, // missing url
+      { url: 'https://example.com/video.mp4', mediaType: 'invalid' }, // invalid mediaType
+      { url: 'not-a-url' }, // technically valid per schema (format: uri not enforced by Ajv without custom formats)
+    ];
+
+    for (const [i, entry] of malformedEntries.entries()) {
+      const valid = validate(entry);
+      if (!valid && i < 2) {
+        // Expected failures for entries 0 and 1
+        continue;
+      }
+    }
+
+    // Entry 0 (missing url) should be rejected
+    const entry0Valid = validate(malformedEntries[0]);
+    if (entry0Valid) {
+      throw new Error('Entry without url should be rejected');
+    }
+
+    // Entry 1 (invalid mediaType) should be rejected
+    const entry1Valid = validate(malformedEntries[1]);
+    if (entry1Valid) {
+      throw new Error('Entry with invalid mediaType should be rejected');
+    }
+  });
+});
diff --git a/__tests__/run.mjs b/__tests__/run.mjs
new file mode 100644
index 0000000..1d4b674
--- /dev/null
+++ b/__tests__/run.mjs
@@ -0,0 +1,11 @@
+/**
+ * Test entry point — imports all test suites then runs them.
+ */
+import './schema.test.mjs';
+import './viewer_units.test.mjs';
+import './data_flow.test.mjs';
+import './viewer_integration.test.mjs';
+import { run } from './runner.mjs';
+
+const result = await run();
+process.exit(result.totalFailed > 0 ? 1 : 0);
diff --git a/__tests__/runner.mjs b/__tests__/runner.mjs
new file mode 100644
index 0000000..7d50bd6
--- /dev/null
+++ b/__tests__/runner.mjs
@@ -0,0 +1,80 @@
+/**
+ * Minimal test runner — describe/it with timing and summary.
+ * No external dependencies. Import this from test files.
+ */
+
+const suites = [];
+let currentSuite = null;
+let totalTests = 0;
+let totalPassed = 0;
+let totalFailed = 0;
+const failures = [];
+
+export function describe(name, fn) {
+  currentSuite = { name, tests: [], passed: 0, failed: 0, duration: 0 };
+  suites.push(currentSuite);
+  fn();
+  currentSuite = null;
+}
+
+export function it(name, fn) {
+  if (!currentSuite) {
+    throw new Error(`it() called outside describe(). Test: "${name}"`);
+  }
+  currentSuite.tests.push({ name, fn, async: typeof fn === 'function' });
+}
+
+// Run all suites and print results
+export async function run() {
+  let globalStart = Date.now();
+
+  for (const suite of suites) {
+    const suiteStart = Date.now();
+    process.stdout.write(`\n${suite.name}\n${'─'.repeat(suite.name.length + 2)}\n`);
+
+    for (const test of suite.tests) {
+      totalTests++;
+      const testStart = Date.now();
+      try {
+        const result = test.fn();
+        if (result instanceof Promise) {
+          await result;
+        }
+        const ms = Date.now() - testStart;
+        totalPassed++;
+        suite.passed++;
+        process.stdout.write(`  ✓ ${test.name} (${ms}ms)\n`);
+      } catch (err) {
+        const ms = Date.now() - testStart;
+        totalFailed++;
+        suite.failed++;
+        failures.push({ suite: suite.name, test: test.name, error: err.message, stack: err.stack });
+        process.stdout.write(`  ✗ ${test.name} (${ms}ms)\n`);
+        process.stdout.write(`    → ${err.message}\n`);
+      }
+    }
+
+    suite.duration = Date.now() - suiteStart;
+  }
+
+  const totalMs = Date.now() - globalStart;
+
+  process.stdout.write(`\n${'='.repeat(60)}\n`);
+  process.stdout.write(`Results: ${totalPassed}/${totalTests} passed`);
+  if (totalFailed > 0) {
+    process.stdout.write(` | ${totalFailed} FAILED`);
+  }
+  process.stdout.write(` | ${totalMs}ms\n`);
+  process.stdout.write(`${'='.repeat(60)}\n`);
+
+  if (failures.length > 0) {
+    process.stdout.write(`\nFailures:\n`);
+    for (const f of failures) {
+      process.stdout.write(`  [${f.suite}] ${f.test}\n`);
+      process.stdout.write(`    Error: ${f.error}\n`);
+      process.stdout.write(`    ${f.stack.split('\n')[1].trim()}\n`);
+    }
+  }
+
+  return { totalTests, totalPassed, totalFailed, totalMs, failures };
+}
diff --git a/__tests__/schema.test.mjs b/__tests__/schema.test.mjs
new file mode 100644
index 0000000..5972686
--- /dev/null
+++ b/__tests__/schema.test.mjs
@@ -0,0 +1,123 @@
+import { describe, it } from './runner.mjs';
+import Ajv from 'ajv';
+import addFormats from 'ajv-formats';
+import schema from '../src/viewer/schema.json' with { type: 'json' };
+
+const ajv = new Ajv({ strict: false });
+addFormats(ajv);
+const validate = ajv.compile(schema);
+
+describe('Schema: VideoEntry with HLS fields', () => {
+  it('should validate a legacy entry (url only)', () => {
+    const entry = { url: 'https://example.com/video.mp4' };
+    const valid = validate(entry);
+    if (!valid) {
+      throw new Error(`Legacy entry rejected: ${JSON.stringify(validate.errors)}`);
+    }
+  });
+
+  it('should validate a full legacy entry (all original fields)', () => {
+    const entry = {
+      url: 'https://example.com/video.mp4',
+      src: 'https://example.com/video.mp4',
+      poster: 'https://example.com/thumb.jpg',
+      tab: 'Video Page',
+    };
+    const valid = validate(entry);
+    if (!valid) {
+      throw new Error(`Full legacy entry rejected: ${JSON.stringify(validate.errors)}`);
+    }
+  });
+
+  it('should validate an HLS entry with hlsManifest and mediaType', () => {
+    const entry = {
+      url: 'https://example.com/playlist.m3u8',
+      src: 'https://example.com/playlist.m3u8',
+      hlsManifest: 'https://cdn.example.com/stream.m3u8',
+      mediaType: 'hls',
+      poster: 'https://example.com/thumb.jpg',
+      tab: 'HLS Stream Page',
+    };
+    const valid = validate(entry);
+    if (!valid) {
+      throw new Error(`HLS entry rejected: ${JSON.stringify(validate.errors)}`);
+    }
+  });
+
+  it('should validate an HLS entry with only hlsManifest (mediaType omitted)', () => {
+    const entry = {
+      url: 'https://example.com/page',
+      hlsManifest: 'https://cdn.example.com/stream.m3u8',
+    };
+    const valid = validate(entry);
+    if (!valid) {
+      throw new Error(`HLS entry with only hlsManifest rejected: ${JSON.stringify(validate.errors)}`);
+    }
+  });
+
+  it('should validate an entry with mediaType=direct', () => {
+    const entry = {
+      url: 'https://example.com/video.mp4',
+      mediaType: 'direct',
+    };
+    const valid = validate(entry);
+    if (!valid) {
+      throw new Error(`Direct entry rejected: ${JSON.stringify(validate.errors)}`);
+    }
+  });
+
+  it('should reject entries without url', () => {
+    const entry = {
+      hlsManifest: 'https://cdn.example.com/stream.m3u8',
+      mediaType: 'hls',
+    };
+    const valid = validate(entry);
+    if (valid) {
+      throw new Error('Entry without url should be rejected but was accepted');
+    }
+  });
+
+  it('should reject invalid mediaType values', () => {
+    const entry = {
+      url: 'https://example.com/video.mp4',
+      mediaType: 'dash',
+    };
+    const valid = validate(entry);
+    if (valid) {
+      throw new Error('Invalid mediaType "dash" should be rejected but was accepted');
+    }
+  });
+
+  it('should reject additional properties', () => {
+    const entry = {
+      url: 'https://example.com/video.mp4',
+      customField: 'value',
+    };
+    const valid = validate(entry);
+    if (valid) {
+      throw new Error('Entry with additional properties should be rejected but was accepted');
+    }
+  });
+
+  it('should validate poster as null', () => {
+    const entry = {
+      url: 'https://example.com/video.mp4',
+      poster: null,
+    };
+    const valid = validate(entry);
+    if (!valid) {
+      throw new Error(`Entry with null poster rejected: ${JSON.stringify(validate.errors)}`);
+    }
+  });
+
+  it('should validate hlsManifest as URI format', () => {
+    const entry = {
+      url: 'https://example.com/page',
+      hlsManifest: 'https://stream.example.com/hls/playlist.m3u8',
+    };
+    const valid = validate(entry);
+    if (!valid) {
+      throw new Error(`Valid hlsManifest URI rejected: ${JSON.stringify(validate.errors)}`);
+    }
+  });
+});
diff --git a/__tests__/viewer_integration.test.mjs b/__tests__/viewer_integration.test.mjs
new file mode 100644
index 0000000..2d2fd43
--- /dev/null
+++ b/__tests__/viewer_integration.test.mjs
@@ -0,0 +1,511 @@
+import { describe, it } from './runner.mjs';
+import { JSDOM } from 'jsdom';
+import * as fs from 'fs';
+import * as path from 'path';
+import { fileURLToPath } from 'url';
+
+const __dirname = path.dirname(fileURLToPath(import.meta.url));
+const viewerSource = fs.readFileSync(
+  path.join(__dirname, '../src/viewer/viewer.js'),
+  'utf-8'
+);
+
+/**
+ * Create a JSDOM environment with mocked Chrome extension APIs.
+ *
+ * @param {object} options
+ * @param {object} options.storageData - Initial chrome.storage.local contents
+ * @param {string} options.url - Page URL (must include query params viewer.js reads at load)
+ * @param {string} options.options.hlsMode - 'native' (Safari-like: window.HLS undefined),
+ *   'mocked' (Hls.js loaded with mocked API), or 'none' (no mocking — CDN fetches hang)
+ */
+function createBrowserEnv({ storageData = {}, url = 'https://example.com/viewer/viewer.html', hlsMode = 'mocked' } = {}) {
+  const html = `<!DOCTYPE html><html><body><div id="panels"></div></body></html>`;
+
+  const dom = new JSDOM(html, {
+    url,
+    runScripts: 'dangerously',
+    resources: 'usable',
+  });
+
+  const win = dom.window;
+
+  // Shared mutable storage object
+  const storage = { ...storageData };
+  win.chrome = {
+    storage: {
+      local: {
+        get: (keys) =>
+          new Promise((resolve) => {
+            const result = {};
+            for (const key of (keys || [])) result[key] = storage[key];
+            resolve(result);
+          }),
+        set: (data) =>
+          new Promise((resolve) => {
+            for (const [k, v] of Object.entries(data)) storage[k] = v;
+            resolve();
+          }),
+        remove: (keys) =>
+          new Promise((resolve) => {
+            for (const key of (keys || [])) delete storage[key];
+            resolve();
+          }),
+      },
+    },
+  };
+
+  // Mock HLS to avoid hanging on CDN fetch in jsdom.
+  // jsdom does not fire onerror for dynamically loaded <script> tags,
+  // so loadHlsJs() would block forever trying CDN fallbacks.
+  // 'mocked' mode provides a fake Hls.js that records calls for verification.
+  // 'native' mode sets HLS = undefined so viewer.js takes the Safari native path.
+  const hlsCalls = { instances: [], loaded: false };
+  if (hlsMode === 'mocked') {
+    win.HLS = class MockHLS {
+      constructor(opts) {
+        hlsCalls.instances.push({ opts, destroyed: false, events: {}, source: null, media: null });
+      }
+      static get Events() {
+        return {
+          MANIFEST_PARSED: 'manifestParsed',
+          ERROR: 'error',
+          DESTROYING: 'destroying',
+        };
+      }
+      static get ErrorTypes() {
+        return { NETWORK_ERROR: 'networkError', MEDIA_ERROR: 'mediaError' };
+      }
+      static isSupported() {
+        return true;
+      }
+      loadSource(src) {
+        const inst = hlsCalls.instances[hlsCalls.instances.length - 1];
+        inst.source = src;
+      }
+      attachMedia(media) {
+        const inst = hlsCalls.instances[hlsCalls.instances.length - 1];
+        inst.media = media;
+      }
+      on(event, handler) {
+        const inst = hlsCalls.instances[hlsCalls.instances.length - 1];
+        if (!inst.events[event]) inst.events[event] = [];
+        inst.events[event].push(handler);
+      }
+      destroy() {
+        const inst = hlsCalls.instances[hlsCalls.instances.length - 1];
+        inst.destroyed = true;
+      }
+      startLoad() {}
+      recoverMediaError() {}
+    };
+    hlsCalls.loaded = true;
+  } else if (hlsMode === 'native') {
+    // Simulate Safari — window.HLS exists but isSupported() returns false.
+    // viewer.js then falls through to video.src = manifestUrl (native HLS).
+    win.HLS = class MockHLS_Native {
+      static isSupported() {
+        return false; // Safari has native HLS, Hls.js is not needed
+      }
+    };
+  }
+
+  // Track console output
+  const consoleLogs = [];
+  const consoleErrors = [];
+  const origConsole = { ...win.console };
+  win.console = {
+    ...origConsole,
+    log: (...args) => consoleLogs.push(args.map(String).join(' ')),
+    error: (...args) => {
+      consoleErrors.push(args.map(String).join(' '));
+      origConsole.error.apply(origConsole, args);
+    },
+    warn: (...args) => {
+      consoleLogs.push(args.map(String).join(' '));
+      origConsole.warn.apply(origConsole, args);
+    },
+  };
+
+  return { dom, win, storage, consoleLogs, consoleErrors, hlsCalls };
+}
+
+describe('Integration: viewer.js with HLS entries', () => {
+  it('should render HLS video entries and use Hls.js to play HLS streams', () => {
+    const storageData = {};
+    const viewerId = 'test_viewer_1';
+    storageData[viewerId] = [
+      {
+        url: 'https://example.com/stream',
+        src: 'https://example.com/stream',
+        hlsManifest: 'https://cdn.example.com/live/playlist.m3u8',
+        mediaType: 'hls',
+        poster: 'https://example.com/thumb.jpg',
+        tab: 'Live Stream',
+      },
+      {
+        url: 'https://example.com/video.mp4',
+        src: 'https://example.com/video.mp4',
+        mediaType: 'direct',
+        tab: 'Regular Video',
+      },
+    ];
+
+    const url = `https://example.com/viewer/viewer.html?id=${viewerId}&grid=2`;
+    const { dom, consoleLogs, hlsCalls } = createBrowserEnv({ storageData, url, hlsMode: 'mocked' });
+
+    dom.window.eval(viewerSource);
+
+    return new Promise((resolve, reject) => {
+      setTimeout(() => {
+        try {
+          const panels = dom.window.document.querySelectorAll('.panel');
+          if (panels.length !== 4) {
+            reject(new Error(`Expected 4 panels (2x2 grid), got ${panels.length}`));
+            return;
+          }
+
+          const videos = dom.window.document.querySelectorAll('video');
+          if (videos.length < 2) {
+            reject(new Error(`Expected at least 2 video elements, got ${videos.length}`));
+            return;
+          }
+
+          // Status overlay
+          const overlay = dom.window.document.getElementById('viewer-status');
+          if (!overlay || !overlay.textContent.includes('2 video')) {
+            reject(new Error(`Missing/incorrect status overlay: "${overlay ? overlay.textContent : 'null'}"`));
+            return;
+          }
+
+          // HLS detection in console logs
+          const hlsLogs = consoleLogs.filter(
+            (l) => l.includes('HLS detected') || l.includes('HLS')
+          );
+          if (hlsLogs.length === 0) {
+            reject(new Error(`No HLS detection in logs. Logs: ${consoleLogs.join(' | ')}`));
+            return;
+          }
+
+          // Verify Hls.js was actually instantiated for the HLS entry
+          if (hlsCalls.instances.length < 1) {
+            reject(new Error('Expected at least 1 HLS instance, got 0'));
+            return;
+          }
+
+          // Verify the HLS instance was attached to a video and loaded the manifest
+          const hlsInst = hlsCalls.instances[0];
+          if (!hlsInst.source || !hlsInst.source.includes('m3u8')) {
+            reject(new Error(`HLS source not set to m3u8 URL: ${hlsInst.source}`));
+            return;
+          }
+          if (!hlsInst.media || hlsInst.media.tagName !== 'VIDEO') {
+            reject(new Error('HLS not attached to a <video> element'));
+            return;
+          }
+
+          resolve();
+        } catch (e) {
+          reject(e);
+        }
+      }, 500);
+    });
+  });
+
+  it('should handle legacy entries (no HLS fields) with standard playback', () => {
+    const storageData = {};
+    const viewerId = 'test_legacy';
+    storageData[viewerId] = [
+      { url: 'https://example.com/video.mp4', src: 'https://example.com/video.mp4', tab: 'Old Video' },
+      'https://example.com/another.mp4',
+    ];
+
+    const url = `https://example.com/viewer/viewer.html?id=${viewerId}&grid=2`;
+    const { dom, hlsCalls } = createBrowserEnv({ storageData, url, hlsMode: 'mocked' });
+
+    dom.window.eval(viewerSource);
+
+    return new Promise((resolve, reject) => {
+      setTimeout(() => {
+        try {
+          const videos = dom.window.document.querySelectorAll('video');
+          if (videos.length < 2) {
+            reject(new Error(`Expected at least 2 video elements, got ${videos.length}`));
+            return;
+          }
+
+          // First video should have src set directly (standard playback)
+          const video0Src = videos[0].getAttribute('src');
+          if (!video0Src || !video0Src.includes('example.com')) {
+            reject(new Error(`Video 0 src not set: ${video0Src}`));
+            return;
+          }
+
+          // No HLS instances should have been created
+          if (hlsCalls.instances.length > 0) {
+            reject(new Error(`Expected 0 HLS instances for legacy entries, got ${hlsCalls.instances.length}`));
+            return;
+          }
+
+          resolve();
+        } catch (e) {
+          reject(e);
+        }
+      }, 500);
+    });
+  });
+
+  it('should show "No viewer ID provided" when id param is missing', () => {
+    const { dom } = createBrowserEnv();
+
+    dom.window.eval(viewerSource);
+
+    const panels = dom.window.document.getElementById('panels');
+    if (!panels.innerHTML.includes('No viewer ID provided')) {
+      throw new Error(`Expected "No viewer ID provided", got: ${panels.innerHTML}`);
+    }
+  });
+
+  it('should handle empty video list gracefully', () => {
+    const storageData = {};
+    const viewerId = 'test_empty';
+    storageData[viewerId] = [];
+
+    const url = `https://example.com/viewer/viewer.html?id=${viewerId}&grid=2`;
+    const { dom } = createBrowserEnv({ storageData, url });
+
+    dom.window.eval(viewerSource);
+
+    return new Promise((resolve, reject) => {
+      setTimeout(() => {
+        try {
+          const panels = dom.window.document.querySelectorAll('.panel');
+          if (panels.length !== 4) {
+            reject(new Error(`Expected 4 empty panels, got ${panels.length}`));
+            return;
+          }
+          const emptyPanels = dom.window.document.querySelectorAll('.panel.empty');
+          if (emptyPanels.length !== 4) {
+            reject(new Error(`Expected 4 empty panels, got ${emptyPanels.length}`));
+            return;
+          }
+          resolve();
+        } catch (e) {
+          reject(e);
+        }
+      }, 500);
+    });
+  });
+
+  it('should render correct grid size based on grid param', () => {
+    const storageData = {};
+    const viewerId = 'test_grid3';
+    storageData[viewerId] = [{ url: 'https://example.com/1.mp4' }];
+
+    const url = `https://example.com/viewer/viewer.html?id=${viewerId}&grid=3`;
+    const { dom } = createBrowserEnv({ storageData, url });
+
+    dom.window.eval(viewerSource);
+
+    return new Promise((resolve, reject) => {
+      setTimeout(() => {
+        try {
+          const panels = dom.window.document.querySelectorAll('.panel');
+          if (panels.length !== 9) {
+            reject(new Error(`Expected 9 panels (3x3), got ${panels.length}`));
+            return;
+          }
+          resolve();
+        } catch (e) {
+          reject(e);
+        }
+      }, 500);
+    });
+  });
+
+  it('should render tag labels when tags param is provided', () => {
+    const storageData = {};
+    const viewerId = 'test_tags';
+    storageData[viewerId] = [
+      { url: 'https://example.com/1.mp4', tab: 'Stream 1' },
+      { url: 'https://example.com/2.mp4', tab: 'Stream 2' },
+    ];
+
+    const tags = ['Live Stream 1', 'Live Stream 2'];
+    const tagsParam = encodeURIComponent(JSON.stringify(tags));
+    const url = `https://example.com/viewer/viewer.html?id=${viewerId}&grid=2&tags=${tagsParam}`;
+    const { dom } = createBrowserEnv({ storageData, url });
+
+    dom.window.eval(viewerSource);
+
+    return new Promise((resolve, reject) => {
+      setTimeout(() => {
+        try {
+          const labels = dom.window.document.querySelectorAll('.panel-label');
+          if (labels.length < 2) {
+            reject(new Error(`Expected 2 labels, got ${labels.length}`));
+            return;
+          }
+          if (labels[0].textContent !== 'Live Stream 1') {
+            reject(new Error(`Label 0 wrong: "${labels[0].textContent}"`));
+            return;
+          }
+          resolve();
+        } catch (e) {
+          reject(e);
+        }
+      }, 500);
+    });
+  });
+
+  it('should handle mixed HLS and direct entries in same grid', () => {
+    const storageData = {};
+    const viewerId = 'test_mixed';
+    storageData[viewerId] = [
+      {
+        url: 'https://example.com/hls',
+        hlsManifest: 'https://cdn.example.com/hls/stream.m3u8',
+        mediaType: 'hls',
+        tab: 'HLS',
+      },
+      {
+        url: 'https://example.com/direct.mp4',
+        src: 'https://example.com/direct.mp4',
+        mediaType: 'direct',
+        tab: 'MP4',
+      },
+      { url: 'https://example.com/legacy.mp4', tab: 'Legacy' },
+    ];
+
+    const url = `https://example.com/viewer/viewer.html?id=${viewerId}&grid=2`;
+    const { dom, consoleLogs, hlsCalls } = createBrowserEnv({ storageData, url, hlsMode: 'mocked' });
+
+    dom.window.eval(viewerSource);
+
+    return new Promise((resolve, reject) => {
+      setTimeout(() => {
+        try {
+          const videos = dom.window.document.querySelectorAll('video');
+          if (videos.length < 3) {
+            reject(new Error(`Expected at least 3 videos, got ${videos.length}`));
+            return;
+          }
+
+          // HLS detection in logs
+          const hlsLogs = consoleLogs.filter(
+            (l) => l.includes('HLS detected') || l.includes('HLS')
+          );
+          if (hlsLogs.length === 0) {
+            reject(new Error(`No HLS logs. All: ${consoleLogs.join(' | ')}`));
+            return;
+          }
+
+          // Only one HLS instance (for the HLS entry)
+          if (hlsCalls.instances.length !== 1) {
+            reject(new Error(`Expected 1 HLS instance, got ${hlsCalls.instances.length}`));
+            return;
+          }
+
+          // Direct entry video should have src set directly
+          const directVideo = videos[1];
+          if (!directVideo.getAttribute('src') || !directVideo.getAttribute('src').includes('direct.mp4')) {
+            reject(new Error(`Direct video src wrong: ${directVideo.getAttribute('src')}`));
+            return;
+          }
+
+          resolve();
+        } catch (e) {
+          reject(e);
+        }
+      }, 500);
+    });
+  });
+
+  it('should fall back to native playback when HLS is not supported (Safari mode)', () => {
+    const storageData = {};
+    const viewerId = 'test_safari';
+    storageData[viewerId] = [
+      {
+        url: 'https://example.com/stream',
+        hlsManifest: 'https://cdn.example.com/live/playlist.m3u8',
+        mediaType: 'hls',
+      },
+    ];
+
+    const url = `https://example.com/viewer/viewer.html?id=${viewerId}&grid=1`;
+    const { dom } = createBrowserEnv({ storageData, url, hlsMode: 'native' });
+
+    dom.window.eval(viewerSource);
+
+    return new Promise((resolve, reject) => {
+      setTimeout(() => {
+        try {
+          const videos = dom.window.document.querySelectorAll('video');
+          if (videos.length !== 1) {
+            reject(new Error(`Expected 1 video, got ${videos.length}`));
+            return;
+          }
+
+          // In native mode, video.src should be set to the manifest URL directly
+          const src = videos[0].getAttribute('src');
+          if (!src || !src.includes('m3u8')) {
+            reject(new Error(`Expected src to be m3u8 URL, got: ${src}`));
+            return;
+          }
+
+          resolve();
+        } catch (e) {
+          reject(e);
+        }
+      }, 500);
+    });
+  });
+
+  it('should fall back to src when mediaType=hls but hlsManifest is missing', () => {
+    const storageData = {};
+    const viewerId = 'test_missing_manifest';
+    storageData[viewerId] = [
+      {
+        url: 'https://example.com/page',
+        src: 'https://example.com/video.mp4',
+        mediaType: 'hls',
+        // hlsManifest intentionally missing
+      },
+    ];
+
+    const url = `https://example.com/viewer/viewer.html?id=${viewerId}&grid=1`;
+    const { dom, hlsCalls } = createBrowserEnv({ storageData, url, hlsMode: 'mocked' });
+
+    dom.window.eval(viewerSource);
+
+    return new Promise((resolve, reject) => {
+      setTimeout(() => {
+        try {
+          const videos = dom.window.document.querySelectorAll('video');
+          if (videos.length !== 1) {
+            reject(new Error(`Expected 1 video, got ${videos.length}`));
+            return;
+          }
+
+          // Since hlsManifest is missing, viewer.js should fall back to resolveSrc
+          // The src should be set directly (not through HLS)
+          const src = videos[0].getAttribute('src');
+          if (!src || !src.includes('video.mp4')) {
+            reject(new Error(`Expected fallback to src, got: ${src}`));
+            return;
+          }
+
+          // No HLS instance should have been created
+          if (hlsCalls.instances.length > 0) {
+            reject(new Error(`Expected 0 HLS instances, got ${hlsCalls.instances.length}`));
+            return;
+          }
+
+          resolve();
+        } catch (e) {
+          reject(e);
+        }
+      }, 500);
+    });
+  });
+});
diff --git a/__tests__/viewer_units.test.mjs b/__tests__/viewer_units.test.mjs
new file mode 100644
index 0000000..67bcb58
--- /dev/null
+++ b/__tests__/viewer_units.test.mjs
@@ -0,0 +1,192 @@
+import { describe, it } from './runner.mjs';
+import { JSDOM } from 'jsdom';
+
+describe('Viewer: resolveSrc()', () => {
+  // We extract the pure logic functions from viewer.js for unit testing.
+  // Since viewer.js uses browser globals, we test the logic independently.
+  const resolveSrc = (entry) => {
+    if (typeof entry === 'string') return entry;
+    return entry.src || entry.url || '';
+  };
+
+  it('should resolve string entries directly', () => {
+    const result = resolveSrc('https://example.com/video.mp4');
+    if (result !== 'https://example.com/video.mp4') {
+      throw new Error(`Expected original string, got: ${result}`);
+    }
+  });
+
+  it('should prefer src over url in object entries', () => {
+    const entry = { url: 'https://example.com/page', src: 'https://cdn.example.com/stream.mp4' };
+    const result = resolveSrc(entry);
+    if (result !== 'https://cdn.example.com/stream.mp4') {
+      throw new Error(`Expected src, got: ${result}`);
+    }
+  });
+
+  it('should fall back to url when src is missing', () => {
+    const entry = { url: 'https://example.com/video.mp4' };
+    const result = resolveSrc(entry);
+    if (result !== 'https://example.com/video.mp4') {
+      throw new Error(`Expected url, got: ${result}`);
+    }
+  });
+
+  it('should return empty string for empty object', () => {
+    const entry = {};
+    const result = resolveSrc(entry);
+    if (result !== '') {
+      throw new Error(`Expected empty string, got: ${result}`);
+    }
+  });
+});
+
+describe('Viewer: isHls()', () => {
+  const isHls = (entry) => {
+    return entry !== null && typeof entry === 'object' && entry.mediaType === 'hls';
+  };
+
+  it('should detect HLS entries with mediaType=hls', () => {
+    const entry = { url: 'https://example.com/stream', mediaType: 'hls', hlsManifest: 'https://cdn.example.com/stream.m3u8' };
+    if (!isHls(entry)) {
+      throw new Error('HLS entry not detected');
+    }
+  });
+
+  it('should NOT detect direct mediaType', () => {
+    const entry = { url: 'https://example.com/video.mp4', mediaType: 'direct' };
+    if (isHls(entry)) {
+      throw new Error('Direct entry falsely detected as HLS');
+    }
+  });
+
+  it('should NOT detect entries without mediaType (backward compat)', () => {
+    const entry = { url: 'https://example.com/video.mp4' };
+    if (isHls(entry)) {
+      throw new Error('Legacy entry without mediaType falsely detected as HLS');
+    }
+  });
+
+  it('should NOT detect string entries', () => {
+    if (isHls('https://example.com/video.mp4')) {
+      throw new Error('String entry falsely detected as HLS');
+    }
+  });
+
+  it('should NOT detect null entries (null guard)', () => {
+    // With the null guard, isHls(null) safely returns false instead of throwing
+    if (isHls(null)) {
+      throw new Error('Null entry falsely detected as HLS');
+    }
+  });
+});
+
+describe('Viewer: resolveHlsManifest()', () => {
+  const resolveHlsManifest = (entry) => {
+    if (typeof entry === 'object' && entry.hlsManifest) {
+      return entry.hlsManifest;
+    }
+    return null;
+  };
+
+  it('should return hlsManifest URL when present', () => {
+    const entry = { url: 'https://example.com/page', hlsManifest: 'https://cdn.example.com/stream.m3u8' };
+    const result = resolveHlsManifest(entry);
+    if (result !== 'https://cdn.example.com/stream.m3u8') {
+      throw new Error(`Expected hlsManifest URL, got: ${result}`);
+    }
+  });
+
+  it('should return null when hlsManifest is missing', () => {
+    const entry = { url: 'https://example.com/video.mp4' };
+    const result = resolveHlsManifest(entry);
+    if (result !== null) {
+      throw new Error(`Expected null, got: ${result}`);
+    }
+  });
+
+  it('should return null for string entries', () => {
+    const result = resolveHlsManifest('https://example.com/video.mp4');
+    if (result !== null) {
+      throw new Error(`Expected null for string, got: ${result}`);
+    }
+  });
+});
+
+describe('Viewer: DOM setup via jsdom', () => {
+  it('should create panels container and video elements', () => {
+    const dom = new JSDOM(`
+      <!DOCTYPE html>
+      <html><body><div id="panels"></div></body></html>
+    `);
+    const panelsEl = dom.window.document.getElementById('panels');
+    if (!panelsEl) {
+      throw new Error('panels element not found');
+    }
+
+    // Simulate what viewer.js does: create panels
+    const panel = dom.window.document.createElement('div');
+    panel.classList.add('panel');
+    const video = dom.window.document.createElement('video');
+    video.autoplay = true;
+    video.muted = true;
+    video.loop = true;
+    video.playsInline = true;
+    video.src = 'https://example.com/video.mp4';
+    panel.appendChild(video);
+    panelsEl.appendChild(panel);
+
+    const videos = panelsEl.querySelectorAll('video');
+    if (videos.length !== 1) {
+      throw new Error(`Expected 1 video, got ${videos.length}`);
+    }
+    if (!videos[0].autoplay) throw new Error('autoplay not set');
+    if (!videos[0].muted) throw new Error('muted not set');
+    if (!videos[0].loop) throw new Error('loop not set');
+    if (!videos[0].playsInline) throw new Error('playsInline not set');
+  });
+
+  it('should create an NxN grid layout', () => {
+    const dom = new JSDOM(`
+      <!DOCTYPE html>
+      <html><body><div id="panels"></div></body></html>
+    `);
+    const panelsEl = dom.window.document.getElementById('panels');
+    const gridN = 3;
+
+    for (let i = 0; i < gridN * gridN; i++) {
+      const panel = dom.window.document.createElement('div');
+      panel.classList.add('panel');
+      panelsEl.appendChild(panel);
+    }
+
+    panelsEl.style.gridTemplateColumns = `repeat(${gridN}, 1fr)`;
+    panelsEl.style.gridTemplateRows = `repeat(${gridN}, 1fr)`;
+
+    const panels = panelsEl.querySelectorAll('.panel');
+    if (panels.length !== 9) {
+      throw new Error(`Expected 9 panels, got ${panels.length}`);
+    }
+    if (panelsEl.style.gridTemplateColumns !== 'repeat(3, 1fr)') {
+      throw new Error('Grid columns not set correctly');
+    }
+  });
+
+  it('should handle empty panels correctly', () => {
+    const dom = new JSDOM(`
+      <!DOCTYPE html>
+      <html><body><div id="panels"></div></body></html>
+    `);
+    const panelsEl = dom.window.document.getElementById('panels');
+
+    const panel = dom.window.document.createElement('div');
+    panel.classList.add('panel');
+    panel.classList.add('empty');
+    panelsEl.appendChild(panel);
+
+    const emptyPanels = panelsEl.querySelectorAll('.panel.empty');
+    if (emptyPanels.length !== 1) {
+      throw new Error(`Expected 1 empty panel, got ${emptyPanels.length}`);
+    }
+  });
+});
diff --git a/package-lock.json b/package-lock.json
index 6e76b9e..9809d17 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -8,14 +8,146 @@
       "name": "goon-plugin",
       "version": "0.1.0",
       "devDependencies": {
+        "ajv": "^8.17.1",
+        "ajv-formats": "^3.0.1",
         "chrome-types": "^0.1.336",
         "eslint": "^9.0.0",
+        "jsdom": "^24.1.3",
         "sharp": "^0.34.5",
         "typescript": "^5.7.0",
         "vite": "^6.0.0",
         "vitest": "^3.0.0"
       }
     },
+    "node_modules/@asamuzakjp/css-color": {
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/@asamuzakjp/css-color/-/css-color-3.2.0.tgz",
+      "integrity": "sha512-K1A6z8tS3XsmCMM86xoWdn7Fkdn9m6RSVtocUrJYIwZnFVkng/PvkEoWtOWmP+Scc6saYWHWZYbndEEXxl24jw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@csstools/css-calc": "^2.1.3",
+        "@csstools/css-color-parser": "^3.0.9",
+        "@csstools/css-parser-algorithms": "^3.0.4",
+        "@csstools/css-tokenizer": "^3.0.3",
+        "lru-cache": "^10.4.3"
+      }
+    },
+    "node_modules/@csstools/color-helpers": {
+      "version": "5.1.0",
+      "resolved": "https://registry.npmjs.org/@csstools/color-helpers/-/color-helpers-5.1.0.tgz",
+      "integrity": "sha512-S11EXWJyy0Mz5SYvRmY8nJYTFFd1LCNV+7cXyAgQtOOuzb4EsgfqDufL+9esx72/eLhsRdGZwaldu/h+E4t4BA==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/csstools"
+        },
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/csstools"
+        }
+      ],
+      "license": "MIT-0",
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@csstools/css-calc": {
+      "version": "2.1.4",
+      "resolved": "https://registry.npmjs.org/@csstools/css-calc/-/css-calc-2.1.4.tgz",
+      "integrity": "sha512-3N8oaj+0juUw/1H3YwmDDJXCgTB1gKU6Hc/bB502u9zR0q2vd786XJH9QfrKIEgFlZmhZiq6epXl4rHqhzsIgQ==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/csstools"
+        },
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/csstools"
+        }
+      ],
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "peerDependencies": {
+        "@csstools/css-parser-algorithms": "^3.0.5",
+        "@csstools/css-tokenizer": "^3.0.4"
+      }
+    },
+    "node_modules/@csstools/css-color-parser": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/@csstools/css-color-parser/-/css-color-parser-3.1.0.tgz",
+      "integrity": "sha512-nbtKwh3a6xNVIp/VRuXV64yTKnb1IjTAEEh3irzS+HkKjAOYLTGNb9pmVNntZ8iVBHcWDA2Dof0QtPgFI1BaTA==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/csstools"
+        },
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/csstools"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "@csstools/color-helpers": "^5.1.0",
+        "@csstools/css-calc": "^2.1.4"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "peerDependencies": {
+        "@csstools/css-parser-algorithms": "^3.0.5",
+        "@csstools/css-tokenizer": "^3.0.4"
+      }
+    },
+    "node_modules/@csstools/css-parser-algorithms": {
+      "version": "3.0.5",
+      "resolved": "https://registry.npmjs.org/@csstools/css-parser-algorithms/-/css-parser-algorithms-3.0.5.tgz",
+      "integrity": "sha512-DaDeUkXZKjdGhgYaHNJTV9pV7Y9B3b644jCLs9Upc3VeNGg6LWARAT6O+Q+/COo+2gg/bM5rhpMAtf70WqfBdQ==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/csstools"
+        },
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/csstools"
+        }
+      ],
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "peerDependencies": {
+        "@csstools/css-tokenizer": "^3.0.4"
+      }
+    },
+    "node_modules/@csstools/css-tokenizer": {
+      "version": "3.0.4",
+      "resolved": "https://registry.npmjs.org/@csstools/css-tokenizer/-/css-tokenizer-3.0.4.tgz",
+      "integrity": "sha512-Vd/9EVDiu6PPJt9yAh6roZP6El1xHrdvIVGjyBsHR0RYwNHgL7FJPyIIW4fANJNG6FtyZfvlRPpFI4ZM/lubvw==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/csstools"
+        },
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/csstools"
+        }
+      ],
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      }
+    },
     "node_modules/@emnapi/runtime": {
       "version": "1.10.0",
       "resolved": "https://registry.npmjs.org/@emnapi/runtime/-/runtime-1.10.0.tgz",
@@ -575,6 +707,30 @@
         "url": "https://opencollective.com/eslint"
       }
     },
+    "node_modules/@eslint/eslintrc/node_modules/ajv": {
+      "version": "6.15.0",
+      "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.15.0.tgz",
+      "integrity": "sha512-fgFx7Hfoq60ytK2c7DhnF8jIvzYgOMxfugjLOSMHjLIPgenqa7S7oaagATUq99mV6IYvN2tRmC0wnTYX6iPbMw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "fast-deep-equal": "^3.1.1",
+        "fast-json-stable-stringify": "^2.0.0",
+        "json-schema-traverse": "^0.4.1",
+        "uri-js": "^4.2.2"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/epoberezkin"
+      }
+    },
+    "node_modules/@eslint/eslintrc/node_modules/json-schema-traverse": {
+      "version": "0.4.1",
+      "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-0.4.1.tgz",
+      "integrity": "sha512-xbbCH5dCYU5T8LcEhhuh7HJ88HXuW3qsI3Y0zOZFKfZEHcpWiHU/Jxzk629Brsab/mMiHQti9wMP+845RPe3Vg==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/@eslint/js": {
       "version": "9.39.4",
       "resolved": "https://registry.npmjs.org/@eslint/js/-/js-9.39.4.tgz",
@@ -1670,23 +1826,51 @@
         "acorn": "^6.0.0 || ^7.0.0 || ^8.0.0"
       }
     },
+    "node_modules/agent-base": {
+      "version": "7.1.4",
+      "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-7.1.4.tgz",
+      "integrity": "sha512-MnA+YT8fwfJPgBx3m60MNqakm30XOkyIoH1y6huTQvC0PwZG7ki8NacLBcrPbNoo8vEZy7Jpuk7+jMO+CUovTQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 14"
+      }
+    },
     "node_modules/ajv": {
-      "version": "6.15.0",
-      "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.15.0.tgz",
-      "integrity": "sha512-fgFx7Hfoq60ytK2c7DhnF8jIvzYgOMxfugjLOSMHjLIPgenqa7S7oaagATUq99mV6IYvN2tRmC0wnTYX6iPbMw==",
+      "version": "8.20.0",
+      "resolved": "https://registry.npmjs.org/ajv/-/ajv-8.20.0.tgz",
+      "integrity": "sha512-Thbli+OlOj+iMPYFBVBfJ3OmCAnaSyNn4M1vz9T6Gka5Jt9ba/HIR56joy65tY6kx/FCF5VXNB819Y7/GUrBGA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "fast-deep-equal": "^3.1.1",
-        "fast-json-stable-stringify": "^2.0.0",
-        "json-schema-traverse": "^0.4.1",
-        "uri-js": "^4.2.2"
+        "fast-deep-equal": "^3.1.3",
+        "fast-uri": "^3.0.1",
+        "json-schema-traverse": "^1.0.0",
+        "require-from-string": "^2.0.2"
       },
       "funding": {
         "type": "github",
         "url": "https://github.com/sponsors/epoberezkin"
       }
     },
+    "node_modules/ajv-formats": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/ajv-formats/-/ajv-formats-3.0.1.tgz",
+      "integrity": "sha512-8iUql50EUR+uUcdRQ3HDqa6EVyo3docL8g5WJ3FNcWmu62IbkGUue/pEyLBW8VGKKucTPgqeks4fIU1DA4yowQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ajv": "^8.0.0"
+      },
+      "peerDependencies": {
+        "ajv": "^8.0.0"
+      },
+      "peerDependenciesMeta": {
+        "ajv": {
+          "optional": true
+        }
+      }
+    },
     "node_modules/ansi-styles": {
       "version": "4.3.0",
       "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
@@ -1720,6 +1904,13 @@
         "node": ">=12"
       }
     },
+    "node_modules/asynckit": {
+      "version": "0.4.0",
+      "resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz",
+      "integrity": "sha512-Oei9OH4tRh0YqU3GxhX79dM/mwVgvbZJaSNaRk+bshkj0S5cfHcgYakreBjrHwatXKbz+IoIdYLxrKim2MjW0Q==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/balanced-match": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz",
@@ -1748,6 +1939,20 @@
         "node": ">=8"
       }
     },
+    "node_modules/call-bind-apply-helpers": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/call-bind-apply-helpers/-/call-bind-apply-helpers-1.0.2.tgz",
+      "integrity": "sha512-Sp1ablJ0ivDkSzjcaJdxEunN5/XvksFJ2sMBFfq6x0ryhQV/2b/KwFe21cMpmHtPOSij8K99/wSfoEuTObmuMQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "es-errors": "^1.3.0",
+        "function-bind": "^1.1.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
     "node_modules/callsites": {
       "version": "3.1.0",
       "resolved": "https://registry.npmjs.org/callsites/-/callsites-3.1.0.tgz",
@@ -1829,6 +2034,19 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/combined-stream": {
+      "version": "1.0.8",
+      "resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.8.tgz",
+      "integrity": "sha512-FQN4MRfuJeHf7cBbBMJFXhKSDq+2kAArBlmRBvcvFE5BB1HZKXtSFASDhdlz9zOYwxh8lDdnvmMOe/+5cdoEdg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "delayed-stream": "~1.0.0"
+      },
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
     "node_modules/concat-map": {
       "version": "0.0.1",
       "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz",
@@ -1851,6 +2069,41 @@
         "node": ">= 8"
       }
     },
+    "node_modules/cssstyle": {
+      "version": "4.6.0",
+      "resolved": "https://registry.npmjs.org/cssstyle/-/cssstyle-4.6.0.tgz",
+      "integrity": "sha512-2z+rWdzbbSZv6/rhtvzvqeZQHrBaqgogqt85sqFNbabZOuFbCVFb8kPeEtZjiKkbrm395irpNKiYeFeLiQnFPg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@asamuzakjp/css-color": "^3.2.0",
+        "rrweb-cssom": "^0.8.0"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/cssstyle/node_modules/rrweb-cssom": {
+      "version": "0.8.0",
+      "resolved": "https://registry.npmjs.org/rrweb-cssom/-/rrweb-cssom-0.8.0.tgz",
+      "integrity": "sha512-guoltQEx+9aMf2gDZ0s62EcV8lsXR+0w8915TC3ITdn2YueuNjdAYh/levpU9nFaoChh9RUS5ZdQMrKfVEN9tw==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/data-urls": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/data-urls/-/data-urls-5.0.0.tgz",
+      "integrity": "sha512-ZYP5VBHshaDAiVZxjbRVcFJpc+4xGgT0bK3vzy1HLN8jTO975HEbuYzZJcHoQEY5K1a0z8YayJkyVETa08eNTg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "whatwg-mimetype": "^4.0.0",
+        "whatwg-url": "^14.0.0"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
     "node_modules/debug": {
       "version": "4.4.3",
       "resolved": "https://registry.npmjs.org/debug/-/debug-4.4.3.tgz",
@@ -1869,6 +2122,13 @@
         }
       }
     },
+    "node_modules/decimal.js": {
+      "version": "10.6.0",
+      "resolved": "https://registry.npmjs.org/decimal.js/-/decimal.js-10.6.0.tgz",
+      "integrity": "sha512-YpgQiITW3JXGntzdUmyUR1V812Hn8T1YVXhCu+wO3OpS4eU9l4YdD3qjyiKdV6mvV29zapkMeD390UVEf2lkUg==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/deep-eql": {
       "version": "5.0.2",
       "resolved": "https://registry.npmjs.org/deep-eql/-/deep-eql-5.0.2.tgz",
@@ -1886,6 +2146,16 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/delayed-stream": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz",
+      "integrity": "sha512-ZySD7Nf91aLB0RxL4KGrKHBXl7Eds1DAmEdcoVawXnLD7SDhpNgtuII2aAkg7a7QS41jxPSZ17p4VdGnMHk3MQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.4.0"
+      }
+    },
     "node_modules/detect-libc": {
       "version": "2.1.2",
       "resolved": "https://registry.npmjs.org/detect-libc/-/detect-libc-2.1.2.tgz",
@@ -1895,6 +2165,54 @@
         "node": ">=8"
       }
     },
+    "node_modules/dunder-proto": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/dunder-proto/-/dunder-proto-1.0.1.tgz",
+      "integrity": "sha512-KIN/nDJBQRcXw0MLVhZE9iQHmG68qAVIBg9CqmUYjmQIhgij9U5MFvrqkUL5FbtyyzZuOeOt0zdeRe4UY7ct+A==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind-apply-helpers": "^1.0.1",
+        "es-errors": "^1.3.0",
+        "gopd": "^1.2.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/entities": {
+      "version": "6.0.1",
+      "resolved": "https://registry.npmjs.org/entities/-/entities-6.0.1.tgz",
+      "integrity": "sha512-aN97NXWF6AWBTahfVOIrB/NShkzi5H7F9r1s9mD3cDj4Ko5f2qhhVoYMibXF7GlLveb/D2ioWay8lxI97Ven3g==",
+      "dev": true,
+      "license": "BSD-2-Clause",
+      "engines": {
+        "node": ">=0.12"
+      },
+      "funding": {
+        "url": "https://github.com/fb55/entities?sponsor=1"
+      }
+    },
+    "node_modules/es-define-property": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/es-define-property/-/es-define-property-1.0.1.tgz",
+      "integrity": "sha512-e3nRfgfUZ4rNGL232gUgX06QNyyez04KdjFrF+LTRoOXmrOgFKDg4BCdsjW8EnT69eqdYGmRpJwiPVYNrCaW3g==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/es-errors": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/es-errors/-/es-errors-1.3.0.tgz",
+      "integrity": "sha512-Zf5H2Kxt2xjTvbJvP2ZWLEICxA6j+hAmMzIlypy4xcBg1vKVnx89Wy0GbS+kf5cwCVFFzdCFh2XSCFNULS6csw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
     "node_modules/es-module-lexer": {
       "version": "1.7.0",
       "resolved": "https://registry.npmjs.org/es-module-lexer/-/es-module-lexer-1.7.0.tgz",
@@ -1902,6 +2220,35 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/es-object-atoms": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/es-object-atoms/-/es-object-atoms-1.1.2.tgz",
+      "integrity": "sha512-HWcBoN6NileqtSydK2FqHbS/LoDd2pqrnQHLyJzBj4kOp/ky2MWMN694xOfkK8/SnUsW2DH7EfyVlydKCsm1Zw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "es-errors": "^1.3.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/es-set-tostringtag": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/es-set-tostringtag/-/es-set-tostringtag-2.1.0.tgz",
+      "integrity": "sha512-j6vWzfrGVfyXxge+O0x5sh6cvxAog0a/4Rdd2K36zCMV5eJ+/+tOAngRO8cODMNWbVRdVlmGZQL2YS3yR8bIUA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "es-errors": "^1.3.0",
+        "get-intrinsic": "^1.2.6",
+        "has-tostringtag": "^1.0.2",
+        "hasown": "^2.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
     "node_modules/esbuild": {
       "version": "0.25.12",
       "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.25.12.tgz",
@@ -2047,6 +2394,30 @@
         "url": "https://opencollective.com/eslint"
       }
     },
+    "node_modules/eslint/node_modules/ajv": {
+      "version": "6.15.0",
+      "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.15.0.tgz",
+      "integrity": "sha512-fgFx7Hfoq60ytK2c7DhnF8jIvzYgOMxfugjLOSMHjLIPgenqa7S7oaagATUq99mV6IYvN2tRmC0wnTYX6iPbMw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "fast-deep-equal": "^3.1.1",
+        "fast-json-stable-stringify": "^2.0.0",
+        "json-schema-traverse": "^0.4.1",
+        "uri-js": "^4.2.2"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/epoberezkin"
+      }
+    },
+    "node_modules/eslint/node_modules/json-schema-traverse": {
+      "version": "0.4.1",
+      "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-0.4.1.tgz",
+      "integrity": "sha512-xbbCH5dCYU5T8LcEhhuh7HJ88HXuW3qsI3Y0zOZFKfZEHcpWiHU/Jxzk629Brsab/mMiHQti9wMP+845RPe3Vg==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/espree": {
       "version": "10.4.0",
       "resolved": "https://registry.npmjs.org/espree/-/espree-10.4.0.tgz",
@@ -2152,6 +2523,23 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/fast-uri": {
+      "version": "3.1.5",
+      "resolved": "https://registry.npmjs.org/fast-uri/-/fast-uri-3.1.5.tgz",
+      "integrity": "sha512-gHwA1O9LDIcKunMKhObS/HimwtehO1nPUECKAu5TpKgaO19fcWEl4bliWe1jWxVFvIXztJjjQ4L8XQ1EU9f7Jw==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/fastify"
+        },
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/fastify"
+        }
+      ],
+      "license": "BSD-3-Clause"
+    },
     "node_modules/fdir": {
       "version": "6.5.0",
       "resolved": "https://registry.npmjs.org/fdir/-/fdir-6.5.0.tgz",
@@ -2221,6 +2609,23 @@
       "dev": true,
       "license": "ISC"
     },
+    "node_modules/form-data": {
+      "version": "4.0.6",
+      "resolved": "https://registry.npmjs.org/form-data/-/form-data-4.0.6.tgz",
+      "integrity": "sha512-vKatAh4SlVfgbv+YtmhiRjhEMJsYpsG1Y2rMQtR+SVSbytsSD1YGzDIcrAJmdFec88u/+VoGmxnl+80gL1tRCQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "asynckit": "^0.4.0",
+        "combined-stream": "^1.0.8",
+        "es-set-tostringtag": "^2.1.0",
+        "hasown": "^2.0.4",
+        "mime-types": "^2.1.35"
+      },
+      "engines": {
+        "node": ">= 6"
+      }
+    },
     "node_modules/fsevents": {
       "version": "2.3.3",
       "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz",
@@ -2236,6 +2641,55 @@
         "node": "^8.16.0 || ^10.6.0 || >=11.0.0"
       }
     },
+    "node_modules/function-bind": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.2.tgz",
+      "integrity": "sha512-7XHNxH7qX9xG5mIwxkhumTox/MIRNcOgDrxWsMt2pAr23WHp6MrRlN7FBSFpCpr+oVO0F744iUgR82nJMfG2SA==",
+      "dev": true,
+      "license": "MIT",
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/get-intrinsic": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/get-intrinsic/-/get-intrinsic-1.3.0.tgz",
+      "integrity": "sha512-9fSjSaos/fRIVIp+xSJlE6lfwhES7LNtKaCBIamHsjr2na1BiABJPo0mOjjz8GJDURarmCPGqaiVg5mfjb98CQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind-apply-helpers": "^1.0.2",
+        "es-define-property": "^1.0.1",
+        "es-errors": "^1.3.0",
+        "es-object-atoms": "^1.1.1",
+        "function-bind": "^1.1.2",
+        "get-proto": "^1.0.1",
+        "gopd": "^1.2.0",
+        "has-symbols": "^1.1.0",
+        "hasown": "^2.0.2",
+        "math-intrinsics": "^1.1.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/get-proto": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/get-proto/-/get-proto-1.0.1.tgz",
+      "integrity": "sha512-sTSfBjoXBp89JvIKIefqw7U2CCebsc74kiY6awiGogKtoSGbgjYE/G/+l9sF3MWFPNc9IcoOC4ODfKHfxFmp0g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "dunder-proto": "^1.0.1",
+        "es-object-atoms": "^1.0.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
     "node_modules/glob-parent": {
       "version": "6.0.2",
       "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-6.0.2.tgz",
@@ -2262,6 +2716,19 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/gopd": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/gopd/-/gopd-1.2.0.tgz",
+      "integrity": "sha512-ZUKRh6/kUFoAiTAtTYPZJ3hw9wNxx+BIBOijnlG9PnrJsCcSjs1wyyD6vJpaYtgnzDrKYRSqf3OO6Rfa93xsRg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/has-flag": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz",
@@ -2272,6 +2739,102 @@
         "node": ">=8"
       }
     },
+    "node_modules/has-symbols": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/has-symbols/-/has-symbols-1.1.0.tgz",
+      "integrity": "sha512-1cDNdwJ2Jaohmb3sg4OmKaMBwuC48sYni5HUw2DvsC8LjGTLK9h+eb1X6RyuOHe4hT0ULCW68iomhjUoKUqlPQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/has-tostringtag": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/has-tostringtag/-/has-tostringtag-1.0.2.tgz",
+      "integrity": "sha512-NqADB8VjPFLM2V0VvHUewwwsw0ZWBaIdgo+ieHtK3hasLz4qeCRjYcqfB6AQrBggRKppKF8L52/VqdVsO47Dlw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "has-symbols": "^1.0.3"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/hasown": {
+      "version": "2.0.4",
+      "resolved": "https://registry.npmjs.org/hasown/-/hasown-2.0.4.tgz",
+      "integrity": "sha512-T2UbfbBEF32wiepXIsMlTW9+dDYC6wMh/t/vYA4tuOMKqWz/n3vr1NFSxQiyP+zk2mXsoMA/i/7qV6LKut1t1A==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "function-bind": "^1.1.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/html-encoding-sniffer": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/html-encoding-sniffer/-/html-encoding-sniffer-4.0.0.tgz",
+      "integrity": "sha512-Y22oTqIU4uuPgEemfz7NDJz6OeKf12Lsu+QC+s3BVpda64lTiMYCyGwg5ki4vFxkMwQdeZDl2adZoqUgdFuTgQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "whatwg-encoding": "^3.1.1"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/http-proxy-agent": {
+      "version": "7.0.2",
+      "resolved": "https://registry.npmjs.org/http-proxy-agent/-/http-proxy-agent-7.0.2.tgz",
+      "integrity": "sha512-T1gkAiYYDWYx3V5Bmyu7HcfcvL7mUrTWiM6yOfa3PIphViJ/gFPbvidQ+veqSOHci/PxBcDabeUNCzpOODJZig==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "agent-base": "^7.1.0",
+        "debug": "^4.3.4"
+      },
+      "engines": {
+        "node": ">= 14"
+      }
+    },
+    "node_modules/https-proxy-agent": {
+      "version": "7.0.6",
+      "resolved": "https://registry.npmjs.org/https-proxy-agent/-/https-proxy-agent-7.0.6.tgz",
+      "integrity": "sha512-vK9P5/iUfdl95AI+JVyUuIcVtd4ofvtrOr3HNtM2yxC9bnMbEdp3x01OhQNnjb8IJYi38VlTE3mBXwcfvywuSw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "agent-base": "^7.1.2",
+        "debug": "4"
+      },
+      "engines": {
+        "node": ">= 14"
+      }
+    },
+    "node_modules/iconv-lite": {
+      "version": "0.6.3",
+      "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.6.3.tgz",
+      "integrity": "sha512-4fCk79wshMdzMp2rH06qWrJE4iolqLhCUH+OiuIgU++RB0+94NlDL81atO7GX55uUKueo0txHNtvEyI6D7WdMw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "safer-buffer": ">= 2.1.2 < 3.0.0"
+      },
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
     "node_modules/ignore": {
       "version": "5.3.2",
       "resolved": "https://registry.npmjs.org/ignore/-/ignore-5.3.2.tgz",
@@ -2332,6 +2895,13 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/is-potential-custom-element-name": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/is-potential-custom-element-name/-/is-potential-custom-element-name-1.0.1.tgz",
+      "integrity": "sha512-bCYeRA2rVibKZd+s2625gGnGF/t7DSqDs4dP7CrLA1m7jKWz6pps0LpYLJN8Q64HtmPKJ1hrN3nzPNKFEKOUiQ==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/isexe": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/isexe/-/isexe-2.0.0.tgz",
@@ -2359,6 +2929,47 @@
         "js-yaml": "bin/js-yaml.js"
       }
     },
+    "node_modules/jsdom": {
+      "version": "24.1.3",
+      "resolved": "https://registry.npmjs.org/jsdom/-/jsdom-24.1.3.tgz",
+      "integrity": "sha512-MyL55p3Ut3cXbeBEG7Hcv0mVM8pp8PBNWxRqchZnSfAiES1v1mRnMeFfaHWIPULpwsYfvO+ZmMZz5tGCnjzDUQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "cssstyle": "^4.0.1",
+        "data-urls": "^5.0.0",
+        "decimal.js": "^10.4.3",
+        "form-data": "^4.0.0",
+        "html-encoding-sniffer": "^4.0.0",
+        "http-proxy-agent": "^7.0.2",
+        "https-proxy-agent": "^7.0.5",
+        "is-potential-custom-element-name": "^1.0.1",
+        "nwsapi": "^2.2.12",
+        "parse5": "^7.1.2",
+        "rrweb-cssom": "^0.7.1",
+        "saxes": "^6.0.0",
+        "symbol-tree": "^3.2.4",
+        "tough-cookie": "^4.1.4",
+        "w3c-xmlserializer": "^5.0.0",
+        "webidl-conversions": "^7.0.0",
+        "whatwg-encoding": "^3.1.1",
+        "whatwg-mimetype": "^4.0.0",
+        "whatwg-url": "^14.0.0",
+        "ws": "^8.18.0",
+        "xml-name-validator": "^5.0.0"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "peerDependencies": {
+        "canvas": "^2.11.2"
+      },
+      "peerDependenciesMeta": {
+        "canvas": {
+          "optional": true
+        }
+      }
+    },
     "node_modules/json-buffer": {
       "version": "3.0.1",
       "resolved": "https://registry.npmjs.org/json-buffer/-/json-buffer-3.0.1.tgz",
@@ -2367,9 +2978,9 @@
       "license": "MIT"
     },
     "node_modules/json-schema-traverse": {
-      "version": "0.4.1",
-      "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-0.4.1.tgz",
-      "integrity": "sha512-xbbCH5dCYU5T8LcEhhuh7HJ88HXuW3qsI3Y0zOZFKfZEHcpWiHU/Jxzk629Brsab/mMiHQti9wMP+845RPe3Vg==",
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-1.0.0.tgz",
+      "integrity": "sha512-NM8/P9n3XjXhIZn1lLhkFaACTOURQXjWhV4BA/RnOv8xvgqtqpAX9IO4mRQxSx1Rlo4tqzeqb0sOlruaOy3dug==",
       "dev": true,
       "license": "MIT"
     },
@@ -2434,6 +3045,13 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/lru-cache": {
+      "version": "10.4.3",
+      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-10.4.3.tgz",
+      "integrity": "sha512-JNAzZcXrCt42VGLuYz0zfAzDfAvJWW6AfYlDBQyDV5DClI2m5sAmK+OIO7s59XfsRsWHp02jAJrRadPRGTt6SQ==",
+      "dev": true,
+      "license": "ISC"
+    },
     "node_modules/magic-string": {
       "version": "0.30.21",
       "resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.30.21.tgz",
@@ -2444,6 +3062,39 @@
         "@jridgewell/sourcemap-codec": "^1.5.5"
       }
     },
+    "node_modules/math-intrinsics": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/math-intrinsics/-/math-intrinsics-1.1.0.tgz",
+      "integrity": "sha512-/IXtbwEk5HTPyEwyKX6hGkYXxM9nbj64B+ilVJnC/R6B0pH5G4V3b0pVbL7DBj4tkhBAppbQUlf6F6Xl9LHu1g==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/mime-db": {
+      "version": "1.52.0",
+      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.52.0.tgz",
+      "integrity": "sha512-sPU4uV7dYlvtWJxwwxHD0PuihVNiE7TyAbQ5SWxDCB9mUYvOgroQOwYQQOKPJ8CIbE+1ETVlOoK1UC2nU3gYvg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/mime-types": {
+      "version": "2.1.35",
+      "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.35.tgz",
+      "integrity": "sha512-ZDY+bPm5zTTF+YpCrAU9nK0UgICYPT0QtT1NZWFv4s++TNkcgVaT0g6+4R2uI4MjQjzysHB1zxuWL50hzaeXiw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "mime-db": "1.52.0"
+      },
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
     "node_modules/minimatch": {
       "version": "3.1.5",
       "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.1.5.tgz",
@@ -2490,6 +3141,13 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/nwsapi": {
+      "version": "2.2.24",
+      "resolved": "https://registry.npmjs.org/nwsapi/-/nwsapi-2.2.24.tgz",
+      "integrity": "sha512-7YRhZ3jS45LwmSCT4b2sVFHt/WuovaktDU07QrtOBY2PXskss5a9jfmR9jptyumwXST+rFjrmppMY1KT/yn35A==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/optionator": {
       "version": "0.9.4",
       "resolved": "https://registry.npmjs.org/optionator/-/optionator-0.9.4.tgz",
@@ -2553,6 +3211,19 @@
         "node": ">=6"
       }
     },
+    "node_modules/parse5": {
+      "version": "7.3.0",
+      "resolved": "https://registry.npmjs.org/parse5/-/parse5-7.3.0.tgz",
+      "integrity": "sha512-IInvU7fabl34qmi9gY8XOVxhYyMyuH2xUNpb2q8/Y+7552KlejkRvqvD19nMoUW/uQGGbqNpA6Tufu5FL5BZgw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "entities": "^6.0.0"
+      },
+      "funding": {
+        "url": "https://github.com/inikulin/parse5?sponsor=1"
+      }
+    },
     "node_modules/path-exists": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-4.0.0.tgz",
@@ -2649,6 +3320,19 @@
         "node": ">= 0.8.0"
       }
     },
+    "node_modules/psl": {
+      "version": "1.15.0",
+      "resolved": "https://registry.npmjs.org/psl/-/psl-1.15.0.tgz",
+      "integrity": "sha512-JZd3gMVBAVQkSs6HdNZo9Sdo0LNcQeMNP3CozBJb3JYC/QUYZTnKxP+f8oWRX4rHP5EurWxqAHTSwUCjlNKa1w==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "punycode": "^2.3.1"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/lupomontero"
+      }
+    },
     "node_modules/punycode": {
       "version": "2.3.1",
       "resolved": "https://registry.npmjs.org/punycode/-/punycode-2.3.1.tgz",
@@ -2659,6 +3343,30 @@
         "node": ">=6"
       }
     },
+    "node_modules/querystringify": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/querystringify/-/querystringify-2.2.0.tgz",
+      "integrity": "sha512-FIqgj2EUvTa7R50u0rGsyTftzjYmv/a3hO345bZNrqabNqjtgiDMgmo4mkUjd+nzU5oF3dClKqFIPUKybUyqoQ==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/require-from-string": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/require-from-string/-/require-from-string-2.0.2.tgz",
+      "integrity": "sha512-Xf0nWe6RseziFMu+Ap9biiUbmplq6S9/p+7w7YXP/JBHhrUDDUhwa+vANyubuqfZWTveU//DYVGsDG7RKL/vEw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/requires-port": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/requires-port/-/requires-port-1.0.0.tgz",
+      "integrity": "sha512-KigOCHcocU3XODJxsu8i/j8T9tzT4adHiecwORRQ0ZZFcp7ahwXuRU1m+yuO90C5ZUyGeGfocHDI14M3L3yDAQ==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/resolve-from": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/resolve-from/-/resolve-from-4.0.0.tgz",
@@ -2721,6 +3429,33 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/rrweb-cssom": {
+      "version": "0.7.1",
+      "resolved": "https://registry.npmjs.org/rrweb-cssom/-/rrweb-cssom-0.7.1.tgz",
+      "integrity": "sha512-TrEMa7JGdVm0UThDJSx7ddw5nVm3UJS9o9CCIZ72B1vSyEZoziDqBYP3XIoi/12lKrJR8rE3jeFHMok2F/Mnsg==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/safer-buffer": {
+      "version": "2.1.2",
+      "resolved": "https://registry.npmjs.org/safer-buffer/-/safer-buffer-2.1.2.tgz",
+      "integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/saxes": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/saxes/-/saxes-6.0.0.tgz",
+      "integrity": "sha512-xAg7SOnEhrm5zI3puOOKyy1OMcMlIJZYNJY7xLBwSze0UjhPLnWfj2GF2EpT0jmzaJKIWKHLsaSSajf35bcYnA==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "xmlchars": "^2.2.0"
+      },
+      "engines": {
+        "node": ">=v12.22.7"
+      }
+    },
     "node_modules/semver": {
       "version": "7.8.1",
       "resolved": "https://registry.npmjs.org/semver/-/semver-7.8.1.tgz",
@@ -2870,6 +3605,13 @@
         "node": ">=8"
       }
     },
+    "node_modules/symbol-tree": {
+      "version": "3.2.4",
+      "resolved": "https://registry.npmjs.org/symbol-tree/-/symbol-tree-3.2.4.tgz",
+      "integrity": "sha512-9QNk5KwDF+Bvz+PyObkmSYjI5ksVUYtjW7AU22r2NKcfLJcXp96hkDWU3+XndOsUb+AQ9QhfzfCT2O+CNWT5Tw==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/tinybench": {
       "version": "2.9.0",
       "resolved": "https://registry.npmjs.org/tinybench/-/tinybench-2.9.0.tgz",
@@ -2931,6 +3673,35 @@
         "node": ">=14.0.0"
       }
     },
+    "node_modules/tough-cookie": {
+      "version": "4.1.4",
+      "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-4.1.4.tgz",
+      "integrity": "sha512-Loo5UUvLD9ScZ6jh8beX1T6sO1w2/MpCRpEP7V280GKMVUQ0Jzar2U3UJPsrdbziLEMMhu3Ujnq//rhiFuIeag==",
+      "dev": true,
+      "license": "BSD-3-Clause",
+      "dependencies": {
+        "psl": "^1.1.33",
+        "punycode": "^2.1.1",
+        "universalify": "^0.2.0",
+        "url-parse": "^1.5.3"
+      },
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/tr46": {
+      "version": "5.1.1",
+      "resolved": "https://registry.npmjs.org/tr46/-/tr46-5.1.1.tgz",
+      "integrity": "sha512-hdF5ZgjTqgAntKkklYw0R03MG2x/bSzTtkxmIRw/sTNV8YXsCJ1tfLAX23lhxhHJlEf3CRCOCGGWw3vI3GaSPw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "punycode": "^2.3.1"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
     "node_modules/tslib": {
       "version": "2.8.1",
       "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.8.1.tgz",
@@ -2965,6 +3736,16 @@
         "node": ">=14.17"
       }
     },
+    "node_modules/universalify": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/universalify/-/universalify-0.2.0.tgz",
+      "integrity": "sha512-CJ1QgKmNg3CwvAv/kOFmtnEN05f0D/cn9QntgNOQlQF9dgvVTHj3t+8JPdjqawCHk7V/KA+fbUqzZ9XWhcqPUg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 4.0.0"
+      }
+    },
     "node_modules/uri-js": {
       "version": "4.4.1",
       "resolved": "https://registry.npmjs.org/uri-js/-/uri-js-4.4.1.tgz",
@@ -2975,6 +3756,17 @@
         "punycode": "^2.1.0"
       }
     },
+    "node_modules/url-parse": {
+      "version": "1.5.10",
+      "resolved": "https://registry.npmjs.org/url-parse/-/url-parse-1.5.10.tgz",
+      "integrity": "sha512-WypcfiRhfeUP9vvF0j6rw0J3hrWrw6iZv3+22h6iRMJ/8z1Tj6XfLP4DsUix5MhMPnXpiHDoKyoZ/bdCkwBCiQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "querystringify": "^2.1.1",
+        "requires-port": "^1.0.0"
+      }
+    },
     "node_modules/vite": {
       "version": "6.4.2",
       "resolved": "https://registry.npmjs.org/vite/-/vite-6.4.2.tgz",
@@ -3146,6 +3938,67 @@
         }
       }
     },
+    "node_modules/w3c-xmlserializer": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/w3c-xmlserializer/-/w3c-xmlserializer-5.0.0.tgz",
+      "integrity": "sha512-o8qghlI8NZHU1lLPrpi2+Uq7abh4GGPpYANlalzWxyWteJOCsr/P+oPBA49TOLu5FTZO4d3F9MnWJfiMo4BkmA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "xml-name-validator": "^5.0.0"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/webidl-conversions": {
+      "version": "7.0.0",
+      "resolved": "https://registry.npmjs.org/webidl-conversions/-/webidl-conversions-7.0.0.tgz",
+      "integrity": "sha512-VwddBukDzu71offAQR975unBIGqfKZpM+8ZX6ySk8nYhVoo5CYaZyzt3YBvYtRtO+aoGlqxPg/B87NGVZ/fu6g==",
+      "dev": true,
+      "license": "BSD-2-Clause",
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/whatwg-encoding": {
+      "version": "3.1.1",
+      "resolved": "https://registry.npmjs.org/whatwg-encoding/-/whatwg-encoding-3.1.1.tgz",
+      "integrity": "sha512-6qN4hJdMwfYBtE3YBTTHhoeuUrDBPZmbQaxWAqSALV/MeEnR5z1xd8UKud2RAkFoPkmB+hli1TZSnyi84xz1vQ==",
+      "deprecated": "Use @exodus/bytes instead for a more spec-conformant and faster implementation",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "iconv-lite": "0.6.3"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/whatwg-mimetype": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/whatwg-mimetype/-/whatwg-mimetype-4.0.0.tgz",
+      "integrity": "sha512-QaKxh0eNIi2mE9p2vEdzfagOKHCcj1pJ56EEHGQOVxp8r9/iszLUUV7v89x9O1p/T+NlTM5W7jW6+cz4Fq1YVg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/whatwg-url": {
+      "version": "14.2.0",
+      "resolved": "https://registry.npmjs.org/whatwg-url/-/whatwg-url-14.2.0.tgz",
+      "integrity": "sha512-De72GdQZzNTUBBChsXueQUnPKDkg/5A5zp7pFDuQAj5UFoENpiACU0wlCvzpAGnTkj++ihpKwKyYewn/XNUbKw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "tr46": "^5.1.0",
+        "webidl-conversions": "^7.0.0"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
     "node_modules/which": {
       "version": "2.0.2",
       "resolved": "https://registry.npmjs.org/which/-/which-2.0.2.tgz",
@@ -3189,6 +4042,45 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/ws": {
+      "version": "8.21.3",
+      "resolved": "https://registry.npmjs.org/ws/-/ws-8.21.3.tgz",
+      "integrity": "sha512-201TZ/kPWxoPr/OKWjquZR1SWKXcvxdH+e1xrx89b3YbmzLMFCLfnaG1HFIgWzJOEWZ7MvpK++odZufgYR50Rw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=10.0.0"
+      },
+      "peerDependencies": {
+        "bufferutil": "^4.0.1",
+        "utf-8-validate": ">=5.0.2"
+      },
+      "peerDependenciesMeta": {
+        "bufferutil": {
+          "optional": true
+        },
+        "utf-8-validate": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/xml-name-validator": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/xml-name-validator/-/xml-name-validator-5.0.0.tgz",
+      "integrity": "sha512-EvGK8EJ3DhaHfbRlETOWAS5pO9MZITeauHKJyb8wyajUfQUenkIg2MvLDTZ4T/TgIcm3HU0TFBgWWboAZ30UHg==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/xmlchars": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/xmlchars/-/xmlchars-2.2.0.tgz",
+      "integrity": "sha512-JZnDKK8B0RCDw84FNdDAIpZK+JuJw+s7Lz8nksI7SIuU3UXJJslUthsi+uWBUYOwPFwW7W7PRLRfUKpxjtjFCw==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/yocto-queue": {
       "version": "0.1.0",
       "resolved": "https://registry.npmjs.org/yocto-queue/-/yocto-queue-0.1.0.tgz",
diff --git a/package.json b/package.json
index 76ea0bc..149dbae 100644
--- a/package.json
+++ b/package.json
@@ -9,13 +9,16 @@
     "build": "vite build",
     "lint": "eslint .",
     "lint:fix": "eslint . --fix",
-    "test": "vitest run",
+    "test": "node __tests__/run.mjs",
     "test:watch": "vitest",
     "check": "tsc --noEmit"
   },
   "devDependencies": {
+    "ajv": "^8.17.1",
+    "ajv-formats": "^3.0.1",
     "chrome-types": "^0.1.336",
     "eslint": "^9.0.0",
+    "jsdom": "^24.1.3",
     "sharp": "^0.34.5",
     "typescript": "^5.7.0",
     "vite": "^6.0.0",
diff --git a/src/types.ts b/src/types.ts
new file mode 100644
index 0000000..8345a5f
--- /dev/null
+++ b/src/types.ts
@@ -0,0 +1,74 @@
+/**
+ * Shared type definitions for the Goon Plugin.
+ *
+ * These types define the canonical video object shape used across:
+ * - chrome.storage.local (persistence layer)
+ * - Popup scan logic (index.js)
+ * - Viewer grid renderer (viewer.js)
+ *
+ * TypeScript project is configured (tsconfig.json) but source files
+ * are currently .js. The JSDoc-style interface below documents the
+ * contract; `tsc --noEmit` validates .js files against these types
+ * when @type references are used.
+ */
+
+/**
+ * Media delivery format of the video source.
+ * - 'direct' : plain MP4/WebM blob served via HTTP(S)
+ * - 'hls'    : HTTP Live Streaming manifest (.m3u8)
+ */
+export type MediaType = 'direct' | 'hls';
+
+/**
+ * A single video entry discovered by a tab scan.
+ *
+ * All fields except `url` are optional to preserve backward
+ * compatibility with entries written by older extension versions.
+ *
+ * @example
+ *   // Legacy entry (still valid)
+ *   { url: "https://example.com/video.mp4" }
+ *
+ * @example
+ *   // Full entry with HLS support
+ *   {
+ *     url: "https://example.com/playlist.m3u8",
+ *     src: "https://example.com/playlist.m3u8",
+ *     poster: "https://example.com/thumbnail.jpg",
+ *     tab: "Video Tab",
+ *     hlsManifest: "https://cdn.example.com/stream.m3u8",
+ *     mediaType: "hls"
+ *   }
+ */
+export interface VideoEntry {
+  /** Primary video URL. May point to the source file or the HLS manifest. */
+  url: string;
+
+  /** Direct source URL extracted from the <video> element (data-* or src). */
+  src?: string;
+
+  /** Poster / thumbnail image URL. */
+  poster?: string | null;
+
+  /** Title of the browser tab where the video was found. */
+  tab?: string;
+
+  /**
+   * URL to an HLS manifest (.m3u8).
+   *
+   * When present, the viewer loads Hls.js to play adaptive streams.
+   * Backward compatible: older entries simply omit this field.
+   */
+  hlsManifest?: string;
+
+  /**
+   * Media delivery format.
+   *
+   * Defaults to 'direct' when omitted. Set to 'hls' when the video
+   * is delivered via HTTP Live Streaming.
+   *
+   * Backward compatible: entries without this field are treated as
+   * `mediaType === 'direct'`.
+   */
+  mediaType?: MediaType;
+}
diff --git a/src/viewer/schema.json b/src/viewer/schema.json
new file mode 100644
index 0000000..5fe41ec
--- /dev/null
+++ b/src/viewer/schema.json
@@ -0,0 +1,55 @@
+{
+  "$schema": "http://json-schema.org/draft-07/schema#",
+  "title": "VideoEntry",
+  "description": "A single video entry discovered by a Goon Plugin tab scan. Stored in chrome.storage.local.",
+  "type": "object",
+  "required": ["url"],
+  "properties": {
+    "url": {
+      "type": "string",
+      "format": "uri",
+      "description": "Primary video URL. May point to the source file or the HLS manifest."
+    },
+    "src": {
+      "type": "string",
+      "format": "uri",
+      "description": "Direct source URL extracted from the <video> element (data-* attributes or src attribute)."
+    },
+    "poster": {
+      "type": ["string", "null"],
+      "format": "uri",
+      "description": "Poster / thumbnail image URL."
+    },
+    "tab": {
+      "type": "string",
+      "description": "Title of the browser tab where the video was found."
+    },
+    "hlsManifest": {
+      "type": "string",
+      "format": "uri",
+      "description": "URL to an HLS manifest (.m3u8). When present, the viewer loads Hls.js to play adaptive streams."
+    },
+    "mediaType": {
+      "type": "string",
+      "enum": ["direct", "hls"],
+      "description": "Media delivery format. Defaults to 'direct' when omitted. Set to 'hls' for HTTP Live Streaming."
+    }
+  },
+  "additionalProperties": false,
+  "examples": [
+    {
+      "url": "https://example.com/video.mp4",
+      "src": "https://example.com/video.mp4",
+      "poster": "https://example.com/thumbnail.jpg",
+      "tab": "Video Page"
+    },
+    {
+      "url": "https://example.com/playlist.m3u8",
+      "src": "https://example.com/playlist.m3u8",
+      "hlsManifest": "https://cdn.example.com/stream.m3u8",
+      "mediaType": "hls",
+      "poster": "https://example.com/thumbnail.jpg",
+      "tab": "HLS Stream Page"
+    }
+  ]
+}
diff --git a/src/viewer/viewer.js b/src/viewer/viewer.js
index d1e5c62..eaad192 100644
--- a/src/viewer/viewer.js
+++ b/src/viewer/viewer.js
@@ -1,6 +1,7 @@
 /**
  * viewer.js — Goon Viewer page logic.
  * Reads video URLs from chrome.storage and renders them in a dynamic NxN grid.
+ * Supports HLS playback via hls.js when mediaType is 'hls'.
  */
 
 const params = new URLSearchParams(location.search);
@@ -9,6 +10,110 @@ const gridN = parseInt(params.get('grid'), 10) || 2;
 const tags = params.get('tags') ? JSON.parse(params.get('tags')) : [];
 const panelsEl = document.getElementById('panels');
 
+const HLS_CDNS = [
+  'https://cdn.jsdelivr.net/npm/hls.js@1/dist/hls.min.js',
+  'https://unpkg.com/hls.js@1/dist/hls.min.js',
+];
+
+/** Load hls.js from CDN. Caches the promise so it's only fetched once. */
+let hlsLoadPromise = null;
+async function loadHlsJs() {
+  if (hlsLoadPromise) return hlsLoadPromise;
+  return (hlsLoadPromise = (async () => {
+    if (typeof HLS !== 'undefined') return window.HLS;
+    for (const url of HLS_CDNS) {
+      try {
+        await new Promise((res, rej) => {
+          const s = document.createElement('script');
+          s.src = url;
+          s.onload = res;
+          s.onerror = rej;
+          document.head.appendChild(s);
+        });
+        if (typeof HLS !== 'undefined') return window.HLS;
+      } catch {
+        /* try next CDN */
+      }
+    }
+    throw new Error('Failed to load hls.js from any CDN');
+  })());
+}
+
+/** Play an HLS manifest on a <video> element. Loads hls.js if needed. */
+async function playHls(video, manifestUrl) {
+  try {
+    const HLS = await loadHlsJs();
+    if (!HLS || !HLS.isSupported()) {
+      // native HLS (Safari) or undefined — fall back to plain src
+      video.src = manifestUrl;
+      return;
+    }
+    const hls = new HLS({ debug: false, enableWorker: true, lowLatencyMode: false });
+    hls.loadSource(manifestUrl);
+    hls.attachMedia(video);
+    video._hls = hls;
+
+    hls.on(HLS.Events.MANIFEST_PARSED, () => video.play().catch(() => {}));
+
+    hls.on(HLS.Events.ERROR, (_ev, data) => {
+      if (!data.fatal) return;
+      switch (data.type) {
+        case HLS.ErrorTypes.NETWORK_ERROR: hls.startLoad(); break;
+        case HLS.ErrorTypes.MEDIA_ERROR: hls.recoverMediaError(); break;
+        default: destroyHls(video);
+      }
+    });
+  } catch (err) {
+    console.error('[goon-viewer] HLS init failed:', err.message);
+  }
+}
+
+/** Destroy the HLS instance on a video element, if any. */
+function destroyHls(video) {
+  if (video._hls) { video._hls.destroy(); delete video._hls; }
+}
+
+/** Resolve the src URL from a video entry (string or object). */
+function resolveSrc(entry) {
+  if (typeof entry === 'string') return entry;
+  return entry.src || entry.url || '';
+}
+
+/** Check if entry is HLS media. */
+function isHls(entry) {
+  return entry !== null && typeof entry === 'object' && entry.mediaType === 'hls';
+}
+
+/** Create a <video> for a single entry — HLS or standard. */
+async function createVideoElement(entry) {
+  const video = document.createElement('video');
+  video.autoplay = true;
+  video.muted = true;
+  video.loop = true;
+  video.playsInline = true;
+
+  if (isHls(entry) && entry.hlsManifest) {
+    console.log('[goon-viewer] HLS detected, manifest:', entry.hlsManifest);
+    await playHls(video, entry.hlsManifest);
+  } else {
+    video.src = resolveSrc(entry);
+  }
+
+  return video;
+}
+
+/** Show an error overlay on a panel. */
+function showPanelError(panel, msg) {
+  const el = document.createElement('div');
+  el.className = 'panel-error';
+  el.style.cssText =
+    'display:flex;align-items:center;justify-content:center;height:100%;color:#94a3b8;' +
+    'font-family:sans-serif;font-size:12px;text-align:center;padding:8px;';
+  el.textContent = msg || 'Failed to load video';
+  panel.innerHTML = '';
+  panel.appendChild(el);
+}
+
 // Fetch stored video URLs and render panels
 async function init() {
   console.log('[goon-viewer] init called, id:', id, 'url:', location.href);
@@ -25,7 +130,9 @@ async function init() {
 
   const overlay = document.createElement('div');
   overlay.id = 'viewer-status';
-  overlay.style.cssText = 'position:absolute;top:0;left:0;right:0;background:rgba(0,0,0,0.85);color:#fff;padding:8px 16px;font-family:sans-serif;font-size:14px;z-index:999;';
+  overlay.style.cssText =
+    'position:absolute;top:0;left:0;right:0;background:rgba(0,0,0,0.85);color:#fff;' +
+    'padding:8px 16px;font-family:sans-serif;font-size:14px;z-index:999;';
   document.body.style.position = 'relative';
   document.body.insertBefore(overlay, document.body.firstChild);
 
@@ -40,21 +147,26 @@ async function init() {
     panel.classList.add('panel');
 
     if (i < videoUrls.length && videoUrls[i]) {
-      const video = document.createElement('video');
-      video.src = (typeof videoUrls[i] === 'object') ? videoUrls[i].src : videoUrls[i];
-      video.autoplay = true;
-      video.muted = true;
-      video.loop = true;
-      video.playsInline = true;
-      console.log('[goon-viewer] panel', i + 1, '/', totalPanels, ':', videoUrls[i]);
-      panel.appendChild(video);
+      try {
+        const video = await createVideoElement(videoUrls[i]);
+        panel.appendChild(video);
 
-      // Add tab label if available
-      if (tags[i]) {
-        const label = document.createElement('div');
-        label.className = 'panel-label';
-        label.textContent = tags[i];
-        panel.appendChild(label);
+        // Listen for load errors on standard videos
+        video.addEventListener('error', () => {
+          console.error('[goon-viewer] Video load error on panel', i + 1);
+          showPanelError(panel, 'Failed to load video');
+        });
+
+        // Add tab label if available
+        if (tags[i]) {
+          const label = document.createElement('div');
+          label.className = 'panel-label';
+          label.textContent = tags[i];
+          panel.appendChild(label);
+        }
+      } catch (err) {
+        console.error('[goon-viewer] Error creating video panel', i + 1, ':', err);
+        showPanelError(panel, 'Error: ' + err.message);
       }
     } else {
       panel.classList.add('empty');
@@ -68,8 +180,14 @@ async function init() {
   panelsEl.style.gridTemplateRows = `repeat(${gridN}, 1fr)`;
 }
 
-// Clean up storage entry when the viewer is closed
+// Clean up HLS instances and storage entry when the viewer is closed
 window.addEventListener('unload', async () => {
+  // Destroy all HLS instances
+  const allVideos = panelsEl.querySelectorAll('video');
+  for (const video of allVideos) {
+    destroyHls(video);
+  }
+
   if (id) {
     await chrome.storage.local.remove([id]);
   }