codeplay-common 4.5.2 → 4.5.4

package/files/take-screen-image.js

@@ -1,2269 +1,2269 @@
-const fs = require('node:fs');
-const path = require('node:path');
-const readline = require('node:readline/promises');
-const { spawn, spawnSync } = require('node:child_process');
-
-const screenshotDirectory = path.join(__dirname, 'Auto-Screenshot', 'Store-image-Screenshot');
-const inFrameDirectory = path.join(__dirname, 'Auto-Screenshot', 'Store-image-Frame');
-const aiAssetsDirectory = path.join(__dirname, 'AI-Assets');
-const amazonAssetsDirectory = path.join(aiAssetsDirectory, 'Amazon-Assets');
-const samsungAssetsDirectory = path.join(aiAssetsDirectory, 'Samsung-Assets');
-const playstoreAssetsDirectory = path.join(aiAssetsDirectory, 'Playstore-Assets');
-const capacitorConfigPath = path.join(__dirname, 'capacitor.config.json');
-const amazonIconPath = path.join(__dirname, 'resources', 'icon-only.png');
-const temporaryDirectory = path.join(__dirname, 'agent-temp');
-const amazonAssetDefinitions = [
-  { fileName: 'icon-1280x720.png', type: 'icon', width: 1280, height: 720 },
-  { fileName: 'background-image-1920x1080.png', type: 'background-image', width: 1920, height: 1080 },
-  { fileName: 'featured-content-logo-640x260.png', type: 'featured-logo', width: 640, height: 260, transparent: true },
-  { fileName: 'featured-content-background-1920x720.png', type: 'featured-background', width: 1920, height: 720 },
-];
-const samsungAssetDefinitions = [
-  { fileName: 'edge-screen-160x2560.png', type: 'edge-screen', width: 160, height: 2560 },
-  { fileName: 'edge-screen-single-550x2560.png', type: 'edge-screen-single-plus', width: 550, height: 2560 },
-];
-const playstoreAssetDefinitions = [
-  { fileName: 'feature-graphic-1024x500.png', width: 1024, height: 500 },
-];
-const browserExecutablePaths = [
-  'C:\\Program Files\\Google\\Chrome\\Application\\chrome.exe',
-  'C:\\Program Files (x86)\\Google\\Chrome\\Application\\chrome.exe',
-  'C:\\Program Files\\Microsoft\\Edge\\Application\\msedge.exe',
-  'C:\\Program Files (x86)\\Microsoft\\Edge\\Application\\msedge.exe',
-];
-
-const deviceProfiles = [
-  {
-    name: 'android-phone',
-    label: 'Android phone',
-    outputDirectory: 'Android',
-    frameType: 'android-phone',
-    width: 360,
-    height: 800,
-    deviceScaleFactor: 3,
-    orientationSensitive: true,
-    mobile: true,
-  },
-  {
-    name: 'android-tablet-7-inch',
-    aliases: ['android-tablet'],
-    label: 'Android 7-inch Play Store tablet',
-    outputDirectory: 'Android-Tab-7inch',
-    frameType: 'tablet',
-    width: 675,
-    height: 1200,
-    deviceScaleFactor: 2,
-    framedWidth: 1350,
-    framedHeight: 2400,
-    orientationSensitive: true,
-    mobile: true,
-  },
-  {
-    name: 'android-tablet-10-inch',
-    label: 'Android 10-inch Play Store tablet',
-    outputDirectory: 'Android-Tab-10inch',
-    frameType: 'tablet',
-    width: 900,
-    height: 1600,
-    deviceScaleFactor: 2,
-    framedWidth: 1800,
-    framedHeight: 3200,
-    orientationSensitive: true,
-    mobile: true,
-  },
-  {
-    name: 'iphone',
-    label: 'iPhone 6.9-inch App Store viewport',
-    outputDirectory: 'iPhone',
-    frameType: 'iphone',
-    width: 440,
-    height: 956,
-    deviceScaleFactor: 3,
-    framedWidth: 1284,
-    framedHeight: 2778,
-    orientationSensitive: true,
-    mobile: true,
-  },
-  {
-    name: 'ipad',
-    label: 'iPad 13-inch App Store viewport',
-    outputDirectory: 'iPad',
-    frameType: 'tablet',
-    width: 1032,
-    height: 1376,
-    deviceScaleFactor: 2,
-    framedWidth: 2048,
-    framedHeight: 2732,
-    orientationSensitive: true,
-    mobile: true,
-  },
-  {
-    name: 'apple-vision-pro',
-    label: 'Apple Vision Pro',
-    outputDirectory: 'Apple-Vision-Pro',
-    frameType: 'apple-vision-pro',
-    width: 3840,
-    height: 2160,
-    deviceScaleFactor: 1,
-    framedWidth: 3840,
-    framedHeight: 2160,
-    mobile: false,
-  },
-  {
-    name: 'apple-tv',
-    label: 'Apple TV',
-    outputDirectory: 'Apple-TV',
-    frameType: 'apple-tv',
-    width: 1920,
-    height: 1080,
-    deviceScaleFactor: 1,
-    framedWidth: 1920,
-    framedHeight: 1080,
-    mobile: false,
-  },
-  {
-    name: 'apple-watch',
-    label: 'Apple Watch Ultra 3',
-    outputDirectory: 'Apple-Watch',
-    frameType: 'apple-watch',
-    width: 422,
-    height: 514,
-    deviceScaleFactor: 1,
-    framedWidth: 422,
-    framedHeight: 514,
-    mobile: true,
-  },
-  {
-    name: 'amazon-mobile',
-    label: 'Amazon mobile store viewport',
-    outputDirectory: 'Amazon-Phone',
-    frameType: 'android-phone',
-    width: 360,
-    height: 640,
-    deviceScaleFactor: 3,
-    orientationSensitive: true,
-    mobile: true,
-  },
-  {
-    name: 'amazon-fire-tablet',
-    label: 'Amazon Fire tablet store viewport',
-    outputDirectory: 'Amazon-Tab',
-    frameType: 'tablet',
-    width: 800,
-    height: 1280,
-    deviceScaleFactor: 2,
-    orientationSensitive: true,
-    mobile: true,
-  },
-  {
-    name: 'amazon-fire-tv',
-    label: 'Amazon Fire TV store viewport',
-    outputDirectory: 'Amazon-TV',
-    frameType: 'tv',
-    width: 1920,
-    height: 1080,
-    deviceScaleFactor: 1,
-    mobile: false,
-  },
-  {
-    name: 'android-tv',
-    label: 'Android TV',
-    outputDirectory: 'Android-TV',
-    frameType: 'tv',
-    width: 1920,
-    height: 1080,
-    deviceScaleFactor: 1,
-    mobile: false,
-  },
-  {
-    name: 'chromebook',
-    label: 'Chromebook 4K Play Store viewport',
-    outputDirectory: 'Chromebook',
-    frameType: 'laptop',
-    width: 1920,
-    height: 1080,
-    deviceScaleFactor: 2,
-    framedWidth: 3840,
-    framedHeight: 2160,
-    mobile: false,
-  },
-  {
-    name: 'android-xr',
-    label: 'Android XR 2D panel approximation',
-    outputDirectory: 'Android-XR',
-    frameType: 'xr',
-    width: 1920,
-    height: 1080,
-    deviceScaleFactor: 1,
-    mobile: false,
-  },
-  {
-    name: 'mac',
-    label: 'Mac-sized viewport',
-    outputDirectory: 'Mac',
-    frameType: 'laptop',
-    width: 1440,
-    height: 900,
-    deviceScaleFactor: 2,
-    mobile: false,
-  },
-];
-
-function getConfiguredOrientation() {
-  const config = JSON.parse(fs.readFileSync(capacitorConfigPath, 'utf8'));
-  return String(config.android?.ORIENTATION || 'portrait').toLowerCase() === 'landscape'
-    ? 'landscape'
-    : 'portrait';
-}
-
-function orientProfile(profile, orientation) {
-  if (orientation !== 'landscape' || !profile.orientationSensitive) {
-    return profile;
-  }
-
-  return {
-    ...profile,
-    width: profile.height,
-    height: profile.width,
-    framedWidth: profile.framedHeight,
-    framedHeight: profile.framedWidth,
-  };
-}
-
-function runAdb(args, options = {}) {
-  const result = spawnSync('adb', args, {
-    encoding: 'utf8',
-    timeout: 30000,
-    windowsHide: true,
-    ...options,
-  });
-
-  if (result.error) {
-    if (result.error.code === 'ENOENT') {
-      throw new Error('ADB was not found. Add Android platform-tools to your PATH.');
-    }
-
-    if (result.error.code === 'ETIMEDOUT') {
-      throw new Error('ADB did not respond within 30 seconds. Check the device connection.');
-    }
-
-    throw result.error;
-  }
-
-  if (result.status !== 0) {
-    throw new Error(result.stderr.trim() || `ADB exited with code ${result.status}.`);
-  }
-
-  return result.stdout.trim();
-}
-
-function getConnectedDevice() {
-  const devices = runAdb(['devices'])
-    .split(/\r?\n/)
-    .map((line) => line.match(/^(\S+)\s+device$/))
-    .filter(Boolean)
-    .map((match) => match[1]);
-
-  if (!devices.length) {
-    throw new Error('no_connected_device');
-  }
-
-  return devices[0];
-}
-
-function getAppId() {
-  const config = JSON.parse(fs.readFileSync(capacitorConfigPath, 'utf8'));
-
-  if (!config.appId) {
-    throw new Error('capacitor.config.json does not contain an appId.');
-  }
-
-  return config.appId;
-}
-
-function getWebViewSocket(deviceId, appId) {
-  const processIds = runAdb(['-s', deviceId, 'shell', 'pidof', appId])
-    .split(/\s+/)
-    .filter(Boolean);
-
-  if (!processIds.length) {
-    throw new Error(`The app process is not running: ${appId}`);
-  }
-
-  const sockets = runAdb(['-s', deviceId, 'shell', 'cat', '/proc/net/unix']);
-
-  for (const processId of processIds) {
-    const socketName = `webview_devtools_remote_${processId}`;
-
-    if (sockets.includes(`@${socketName}`)) {
-      return socketName;
-    }
-  }
-
-  throw new Error(
-    'The running app does not expose a debuggable WebView. Use a debug/live-reload build with WebView debugging enabled.',
-  );
-}
-
-function sanitizeName(input, fallback) {
-  const sanitized = input
-    .trim()
-    .replace(/[<>:"/\\|?*\u0000-\u001F]/g, '_')
-    .replace(/[. ]+$/g, '');
-
-  return sanitized || fallback;
-}
-
-function getSelectedOutputDirectories(selectedProfiles) {
-  return [...new Set(selectedProfiles.flatMap((profile) => ([
-    path.join(screenshotDirectory, profile.outputDirectory),
-    path.join(inFrameDirectory, profile.outputDirectory),
-  ])))];
-}
-
-function getNextNumberedFileName(selectedProfiles) {
-  const highestNumber = getSelectedOutputDirectories(selectedProfiles)
-    .filter((directory) => fs.existsSync(directory))
-    .reduce((highestAcrossDirectories, directory) => {
-      const highestInDirectory = fs.readdirSync(directory, { withFileTypes: true })
-        .filter((entry) => entry.isFile())
-        .reduce((highest, entry) => {
-          const match = entry.name.match(/^(\d+)\.png$/i);
-          return match ? Math.max(highest, Number(match[1])) : highest;
-        }, 0);
-
-      return Math.max(highestAcrossDirectories, highestInDirectory);
-    }, 0);
-
-  return `${highestNumber + 1}.png`;
-}
-
-function getUniqueFileName(prefix, selectedProfiles) {
-  const outputDirectories = getSelectedOutputDirectories(selectedProfiles);
-  let fileName = `${prefix}.png`;
-  let duplicateNumber = 2;
-
-  while (outputDirectories.some((directory) => (
-    fs.existsSync(path.join(directory, fileName))
-  ))) {
-    fileName = `${prefix}-${duplicateNumber}.png`;
-    duplicateNumber += 1;
-  }
-
-  return fileName;
-}
-
-function getScreenshotFileName(fileNameInput, selectedProfiles) {
-  const inputWithoutExtension = fileNameInput.trim().replace(/\.png$/i, '');
-
-  if (!inputWithoutExtension) {
-    return getNextNumberedFileName(selectedProfiles);
-  }
-
-  let prefix = sanitizeName(inputWithoutExtension, '');
-
-  if (!prefix) {
-    return getNextNumberedFileName(selectedProfiles);
-  }
-
-  if (/^(con|prn|aux|nul|com[1-9]|lpt[1-9])$/i.test(prefix)) {
-    prefix = `${prefix}_`;
-  }
-
-  return getUniqueFileName(prefix, selectedProfiles);
-}
-
-function parseArguments() {
-  const args = process.argv.slice(2);
-  const options = {
-    amazonAssets: false,
-    samsungAssets: false,
-    dryRun: false,
-    frameExisting: false,
-    help: false,
-    list: false,
-    prefix: '',
-    profiles: '',
-  };
-
-  for (let index = 0; index < args.length; index += 1) {
-    const argument = args[index];
-
-    if (argument === '--amazon-assets') {
-      options.amazonAssets = true;
-    } else if (argument === '--samsung-assets') {
-      options.samsungAssets = true;
-    } else if (argument === '--dry-run') {
-      options.dryRun = true;
-    } else if (argument === '--frame-existing') {
-      options.frameExisting = true;
-    } else if (argument === '--help' || argument === '-h') {
-      options.help = true;
-    } else if (argument === '--list') {
-      options.list = true;
-    } else if (argument === '--prefix') {
-      options.prefix = args[index + 1] || '';
-      index += 1;
-    } else if (argument === '--profiles') {
-      options.profiles = args[index + 1] || '';
-      index += 1;
-    } else {
-      throw new Error(`Unknown argument: ${argument}`);
-    }
-  }
-
-  return options;
-}
-
-function printProfiles() {
-  const orientation = getConfiguredOrientation();
-
-  for (const baseProfile of deviceProfiles) {
-    const profile = orientProfile(baseProfile, orientation);
-    const outputWidth = profile.width * profile.deviceScaleFactor;
-    const outputHeight = profile.height * profile.deviceScaleFactor;
-    const framedSize = profile.framedWidth
-      ? `, framed PNG ${profile.framedWidth}x${profile.framedHeight}`
-      : '';
-    console.log(
-      `${profile.name.padEnd(15)} ${profile.label} `
-      + `(folder ${profile.outputDirectory}, viewport ${profile.width}x${profile.height}, `
-      + `PNG ${outputWidth}x${outputHeight}${framedSize})`,
-    );
-  }
-}
-
-function printHelp() {
-  console.log('Capture the current live Android WebView at multiple responsive viewport sizes.');
-  console.log('');
-  console.log('Usage:');
-  console.log('  node take-screen-image.js');
-  console.log('  node take-screen-image.js --profiles iphone,ipad');
-  console.log('  node take-screen-image.js --prefix home --profiles android-phone,ipad');
-  console.log('  node take-screen-image.js --frame-existing');
-  console.log('  node take-screen-image.js --amazon-assets');
-  console.log('  node take-screen-image.js --samsung-assets');
-  console.log('  node take-screen-image.js --dry-run');
-  console.log('  node take-screen-image.js --list');
-  console.log('');
-  console.log('A normal capture automatically creates any missing Amazon, Samsung, and Play Store assets.');
-}
-
-function selectProfiles(input) {
-  const orientation = getConfiguredOrientation();
-  const names = input
-    .split(',')
-    .map((name) => name.trim().toLowerCase())
-    .filter(Boolean);
-
-  if (!names.length || names.includes('all')) {
-    return deviceProfiles.map((profile) => orientProfile(profile, orientation));
-  }
-
-  const selectedProfiles = names.map((name) => {
-    const profile = deviceProfiles.find((candidate) => (
-      candidate.name === name || candidate.aliases?.includes(name)
-    ));
-
-    if (!profile) {
-      throw new Error(`Unknown profile: ${name}. Run with --list to see valid profiles.`);
-    }
-
-    return profile;
-  });
-
-  return [...new Map(selectedProfiles.map((profile) => [profile.name, profile])).values()]
-    .map((profile) => orientProfile(profile, orientation));
-}
-
-class CdpClient {
-  constructor(webSocketUrl) {
-    this.nextId = 1;
-    this.pendingCommands = new Map();
-    this.socket = new WebSocket(webSocketUrl);
-  }
-
-  connect() {
-    return new Promise((resolve, reject) => {
-      const timeout = setTimeout(() => {
-        reject(new Error('Timed out while connecting to the app WebView.'));
-      }, 10000);
-
-      this.socket.addEventListener('open', () => {
-        clearTimeout(timeout);
-        resolve();
-      }, { once: true });
-
-      this.socket.addEventListener('error', () => {
-        clearTimeout(timeout);
-        reject(new Error('Could not connect to the app WebView debugging socket.'));
-      }, { once: true });
-
-      this.socket.addEventListener('message', (event) => {
-        const message = JSON.parse(event.data);
-
-        if (!message.id || !this.pendingCommands.has(message.id)) {
-          return;
-        }
-
-        const pendingCommand = this.pendingCommands.get(message.id);
-        this.pendingCommands.delete(message.id);
-
-        if (message.error) {
-          pendingCommand.reject(new Error(message.error.message));
-        } else {
-          pendingCommand.resolve(message.result);
-        }
-      });
-
-      this.socket.addEventListener('close', () => {
-        for (const pendingCommand of this.pendingCommands.values()) {
-          pendingCommand.reject(new Error('The app WebView debugging connection closed.'));
-        }
-
-        this.pendingCommands.clear();
-      });
-    });
-  }
-
-  send(method, params = {}) {
-    return new Promise((resolve, reject) => {
-      const id = this.nextId;
-      this.nextId += 1;
-      this.pendingCommands.set(id, { resolve, reject });
-      this.socket.send(JSON.stringify({ id, method, params }));
-    });
-  }
-
-  close() {
-    this.socket.close();
-  }
-}
-
-async function getWebViewTarget(localPort) {
-  const response = await fetch(`http://127.0.0.1:${localPort}/json/list`);
-
-  if (!response.ok) {
-    throw new Error(`WebView target discovery failed with HTTP ${response.status}.`);
-  }
-
-  const targets = await response.json();
-  const pageTargets = targets.filter((target) => (
-    target.type === 'page'
-    && target.webSocketDebuggerUrl
-    && target.url !== 'about:blank'
-  ));
-
-  const visibleTarget = pageTargets.find((target) => {
-    try {
-      return JSON.parse(target.description || '{}').visible !== false;
-    } catch {
-      return true;
-    }
-  });
-
-  const target = visibleTarget || pageTargets[0];
-
-  if (!target) {
-    throw new Error('No rendered page was found in the app WebView.');
-  }
-
-  return target;
-}
-
-async function getPageDetails(client) {
-  const evaluation = await client.send('Runtime.evaluate', {
-    expression: `JSON.stringify({
-      title: document.title,
-      url: location.href,
-      width: innerWidth,
-      height: innerHeight,
-      devicePixelRatio: devicePixelRatio,
-      readyState: document.readyState
-    })`,
-    returnByValue: true,
-  });
-
-  return JSON.parse(evaluation.result.value);
-}
-
-async function capturePageSnapshot(client) {
-  const evaluation = await client.send('Runtime.evaluate', {
-    expression: `(async () => {
-      const clonedRoot = document.documentElement.cloneNode(true);
-      const originalElements = [
-        document.documentElement,
-        ...document.documentElement.querySelectorAll('*'),
-      ];
-      const clonedElements = [clonedRoot, ...clonedRoot.querySelectorAll('*')];
-
-      const blobToDataUrl = (blob) => new Promise((resolve, reject) => {
-        const reader = new FileReader();
-        reader.onload = () => resolve(reader.result);
-        reader.onerror = () => reject(reader.error);
-        reader.readAsDataURL(blob);
-      });
-
-      const imageToDataUrl = (element) => {
-        const width = element.naturalWidth || element.clientWidth;
-        const height = element.naturalHeight || element.clientHeight;
-
-        if (!width || !height) return '';
-
-        const canvas = document.createElement('canvas');
-        canvas.width = width;
-        canvas.height = height;
-        canvas.getContext('2d').drawImage(element, 0, 0, width, height);
-        return canvas.toDataURL('image/png');
-      };
-
-      for (let index = 0; index < originalElements.length; index += 1) {
-        const original = originalElements[index];
-        const clone = clonedElements[index];
-
-        if (!clone) continue;
-
-        if (original.scrollTop || original.scrollLeft) {
-          clone.setAttribute('data-responsive-scroll-top', String(original.scrollTop));
-          clone.setAttribute('data-responsive-scroll-left', String(original.scrollLeft));
-        }
-
-        if (original.classList.contains('swiper-initialized')) {
-          clone.setAttribute('data-responsive-swiper-width', String(original.clientWidth));
-          clone.setAttribute('data-responsive-swiper-height', String(original.clientHeight));
-        }
-
-        if (original instanceof HTMLInputElement) {
-          clone.setAttribute('value', original.value);
-          clone.toggleAttribute('checked', original.checked);
-        } else if (original instanceof HTMLTextAreaElement) {
-          clone.textContent = original.value;
-        } else if (original instanceof HTMLSelectElement) {
-          for (let optionIndex = 0; optionIndex < original.options.length; optionIndex += 1) {
-            clone.options[optionIndex].selected = original.options[optionIndex].selected;
-          }
-        } else if (original instanceof HTMLCanvasElement) {
-          try {
-            clone.style.setProperty(
-              'background-image',
-              'url("' + original.toDataURL('image/png') + '")',
-              'important',
-            );
-            clone.style.setProperty('background-position', 'center', 'important');
-            clone.style.setProperty('background-repeat', 'no-repeat', 'important');
-            clone.style.setProperty('background-size', '100% 100%', 'important');
-          } catch {
-            // Keep the canvas element when its pixels cannot be exported.
-          }
-        } else if (original instanceof HTMLVideoElement && original.readyState >= 2) {
-          try {
-            const replacement = document.createElement('img');
-            replacement.src = imageToDataUrl(original);
-            replacement.alt = original.getAttribute('aria-label') || '';
-            replacement.setAttribute('style', original.getAttribute('style') || '');
-            clone.replaceWith(replacement);
-          } catch {
-            clone.setAttribute('poster', original.poster || '');
-          }
-        } else if (original instanceof HTMLImageElement && original.complete) {
-          try {
-            clone.setAttribute('src', imageToDataUrl(original) || original.currentSrc || original.src);
-            clone.removeAttribute('srcset');
-          } catch {
-            clone.setAttribute('src', original.currentSrc || original.src);
-          }
-        }
-      }
-
-      const stylesheetLinks = [...document.querySelectorAll('link[rel="stylesheet"]')];
-      const clonedStylesheetLinks = [...clonedRoot.querySelectorAll('link[rel="stylesheet"]')];
-
-      await Promise.all(stylesheetLinks.map(async (link, index) => {
-        try {
-          const response = await fetch(link.href);
-          if (!response.ok) return;
-
-          const cssText = (await response.text()).replace(
-            /url\\(\\s*(['"]?)(?!data:|blob:|#)([^'"\\)]+)\\1\\s*\\)/gi,
-            (match, quote, resourceUrl) => {
-              try {
-                return 'url("' + new URL(resourceUrl.trim(), link.href).href + '")';
-              } catch {
-                return match;
-              }
-            },
-          );
-          const style = document.createElement('style');
-          style.textContent = cssText;
-          clonedStylesheetLinks[index].replaceWith(style);
-        } catch {
-          clonedStylesheetLinks[index].href = link.href;
-        }
-      }));
-
-      clonedRoot.querySelectorAll('script, link[rel="modulepreload"]').forEach((element) => element.remove());
-      clonedRoot.querySelectorAll('meta[http-equiv="Content-Security-Policy"]').forEach(
-        (element) => element.remove(),
-      );
-
-      const base = document.createElement('base');
-      base.href = location.href;
-      clonedRoot.querySelector('head').prepend(base);
-
-      const replayStyle = document.createElement('style');
-      replayStyle.textContent = [
-        '*,*::before,*::after{animation-play-state:paused!important;}',
-        '*{scrollbar-width:none!important;}',
-        '*::-webkit-scrollbar{width:0!important;height:0!important;display:none!important;}',
-      ].join('');
-      clonedRoot.querySelector('head').append(replayStyle);
-
-      return {
-        html: '<!doctype html>' + clonedRoot.outerHTML,
-        scrollY,
-      };
-    })()`,
-    awaitPromise: true,
-    returnByValue: true,
-  });
-
-  if (evaluation.exceptionDetails) {
-    throw new Error('The current WebView page could not be serialized.');
-  }
-
-  return evaluation.result.value;
-}
-
-function findBrowserExecutable() {
-  const executablePath = browserExecutablePaths.find((candidate) => (
-    fs.existsSync(candidate)
-  ));
-
-  if (!executablePath) {
-    throw new Error('Google Chrome or Microsoft Edge was not found on this computer.');
-  }
-
-  return executablePath;
-}
-
-function delay(milliseconds) {
-  return new Promise((resolve) => setTimeout(resolve, milliseconds));
-}
-
-async function launchReplayBrowser() {
-  fs.mkdirSync(temporaryDirectory, { recursive: true });
-
-  const profileDirectory = path.join(
-    temporaryDirectory,
-    `responsive-screenshot-chrome-${process.pid}-${Date.now()}`,
-  );
-  fs.mkdirSync(profileDirectory, { recursive: true });
-
-  const browserProcess = spawn(findBrowserExecutable(), [
-    '--headless=new',
-    '--remote-debugging-port=0',
-    `--user-data-dir=${profileDirectory}`,
-    '--no-first-run',
-    '--no-default-browser-check',
-    '--disable-background-networking',
-    '--remote-allow-origins=*',
-    'about:blank',
-  ], {
-    stdio: 'ignore',
-    windowsHide: true,
-  });
-
-  const activePortPath = path.join(profileDirectory, 'DevToolsActivePort');
-  const deadline = Date.now() + 15000;
-
-  while (!fs.existsSync(activePortPath)) {
-    if (browserProcess.exitCode !== null) {
-      throw new Error('The local replay browser closed before it was ready.');
-    }
-
-    if (Date.now() >= deadline) {
-      browserProcess.kill();
-      throw new Error('Timed out while starting the local replay browser.');
-    }
-
-    await delay(100);
-  }
-
-  const [port] = fs.readFileSync(activePortPath, 'utf8').trim().split(/\r?\n/);
-  const versionResponse = await fetch(`http://127.0.0.1:${port}/json/version`);
-  const version = await versionResponse.json();
-  const client = new CdpClient(version.webSocketDebuggerUrl);
-  await client.connect();
-
-  return {
-    browserProcess,
-    client,
-    port,
-    profileDirectory,
-  };
-}
-
-async function createReplayPage(browser) {
-  const createdTarget = await browser.client.send('Target.createTarget', {
-    url: 'about:blank',
-  });
-  const deadline = Date.now() + 10000;
-
-  while (Date.now() < deadline) {
-    const response = await fetch(`http://127.0.0.1:${browser.port}/json/list`);
-    const targets = await response.json();
-    const target = targets.find((candidate) => candidate.id === createdTarget.targetId);
-
-    if (target && target.webSocketDebuggerUrl) {
-      const client = new CdpClient(target.webSocketDebuggerUrl);
-      await client.connect();
-      await client.send('Page.enable');
-      await client.send('Runtime.enable');
-      return client;
-    }
-
-    await delay(100);
-  }
-
-  throw new Error('The local replay page did not become available.');
-}
-
-function removeTemporaryBrowserProfile(profileDirectory) {
-  const resolvedTemporaryRoot = path.resolve(temporaryDirectory);
-  const resolvedProfileDirectory = path.resolve(profileDirectory);
-
-  if (!resolvedProfileDirectory.startsWith(`${resolvedTemporaryRoot}${path.sep}`)) {
-    throw new Error('Refusing to remove a browser profile outside agent-temp.');
-  }
-
-  fs.rmSync(resolvedProfileDirectory, { recursive: true, force: true });
-}
-
-async function closeReplayBrowser(browser) {
-  try {
-    await browser.client.send('Browser.close');
-  } catch {
-    // Closing the browser can close the protocol connection before it acknowledges.
-  }
-
-  const deadline = Date.now() + 3000;
-
-  while (browser.browserProcess.exitCode === null && Date.now() < deadline) {
-    await delay(100);
-  }
-
-  if (browser.browserProcess.exitCode === null) {
-    browser.browserProcess.kill();
-    await delay(200);
-  }
-
-  browser.client.close();
-
-  for (let attempt = 1; attempt <= 5; attempt += 1) {
-    try {
-      removeTemporaryBrowserProfile(browser.profileDirectory);
-      return;
-    } catch (error) {
-      if (attempt === 5) {
-        throw error;
-      }
-
-      await delay(200);
-    }
-  }
-}
-
-async function waitForReplayLayout(client, snapshot) {
-  const evaluation = await client.send('Runtime.evaluate', {
-    expression: `(async () => {
-      const assetWait = Promise.all([...document.images].map((image) => {
-        if (image.complete) return Promise.resolve();
-        return new Promise((resolve) => {
-          image.addEventListener('load', resolve, { once: true });
-          image.addEventListener('error', resolve, { once: true });
-        });
-      }));
-
-      await Promise.race([
-        Promise.all([document.fonts.ready, assetWait]),
-        new Promise((resolve) => setTimeout(resolve, 5000)),
-      ]);
-
-      document.querySelectorAll('[data-responsive-swiper-width]').forEach((swiper) => {
-        const wrapper = [...swiper.children].find((element) => (
-          element.classList.contains('swiper-wrapper')
-        ));
-
-        if (!wrapper) return;
-
-        const slides = [...wrapper.children].filter((element) => (
-          element.classList.contains('swiper-slide')
-        ));
-        const sourceWidth = Number(swiper.dataset.responsiveSwiperWidth);
-        const sourceHeight = Number(swiper.dataset.responsiveSwiperHeight);
-        const widthScale = sourceWidth > 0 ? swiper.clientWidth / sourceWidth : 1;
-        const heightScale = sourceHeight > 0 ? swiper.clientHeight / sourceHeight : 1;
-        const isVertical = swiper.classList.contains('swiper-vertical');
-
-        slides.forEach((slide) => {
-          if (!slide.dataset.responsiveSwiperWidth && slide.style.width) {
-            slide.dataset.responsiveSwiperWidth = String(parseFloat(slide.style.width));
-          }
-
-          if (!slide.dataset.responsiveSwiperHeight && slide.style.height) {
-            slide.dataset.responsiveSwiperHeight = String(parseFloat(slide.style.height));
-          }
-
-          const slideWidth = Number(slide.dataset.responsiveSwiperWidth);
-          const slideHeight = Number(slide.dataset.responsiveSwiperHeight);
-
-          if (Number.isFinite(slideWidth) && slideWidth > 0) {
-            slide.style.width = (slideWidth * widthScale) + 'px';
-          }
-
-          if (isVertical && Number.isFinite(slideHeight) && slideHeight > 0) {
-            slide.style.height = (slideHeight * heightScale) + 'px';
-          }
-        });
-
-        const activeSlide = slides.find((slide) => (
-          slide.classList.contains('swiper-slide-active')
-        )) || slides[0];
-
-        if (!activeSlide) return;
-
-        const offset = isVertical ? activeSlide.offsetTop : activeSlide.offsetLeft;
-        const direction = getComputedStyle(swiper).direction;
-        const horizontalOffset = direction === 'rtl' ? offset : -offset;
-        const verticalOffset = isVertical ? -offset : 0;
-
-        wrapper.style.transitionDuration = '0ms';
-        wrapper.style.transform = 'translate3d('
-          + (isVertical ? 0 : horizontalOffset) + 'px, '
-          + verticalOffset + 'px, 0px)';
-
-        if (swiper.classList.contains('swiper-autoheight')) {
-          wrapper.style.height = activeSlide.scrollHeight + 'px';
-        }
-      });
-
-      document.querySelectorAll('[data-responsive-scroll-top]').forEach((element) => {
-        element.scrollTop = Number(element.dataset.responsiveScrollTop);
-        element.scrollLeft = Number(element.dataset.responsiveScrollLeft);
-      });
-      scrollTo(0, ${Number(snapshot.scrollY) || 0});
-
-      await new Promise((resolve) => requestAnimationFrame(() => requestAnimationFrame(resolve)));
-
-      return {
-        documentWidth: Math.max(document.documentElement.scrollWidth, document.body.scrollWidth),
-        viewportWidth: innerWidth,
-      };
-    })()`,
-    awaitPromise: true,
-    returnByValue: true,
-  });
-
-  return evaluation.result.value;
-}
-
-function getFrameAdornment(frameType) {
-  if (frameType === 'iphone') {
-    return '<div class="dynamic-island"></div>';
-  }
-
-  if (frameType === 'android-phone') {
-    return '<div class="camera-dot"></div>';
-  }
-
-  if (frameType === 'tablet') {
-    return '<div class="tablet-camera"></div>';
-  }
-
-  if (frameType === 'tv' || frameType === 'apple-tv') {
-    return '<div class="tv-stand"></div>';
-  }
-
-  if (frameType === 'apple-watch') {
-    return '<div class="watch-crown"></div><div class="watch-button"></div>';
-  }
-
-  if (frameType === 'apple-vision-pro') {
-    return '<div class="vision-sensor vision-sensor-left"></div><div class="vision-sensor vision-sensor-right"></div>';
-  }
-
-  if (frameType === 'laptop') {
-    return '<div class="laptop-camera"></div><div class="laptop-base"></div>';
-  }
-
-  return '<div class="xr-status"></div>';
-}
-
-function createDeviceFrameHtml(profile, screenshotBuffer) {
-  const screenshotDataUrl = `data:image/png;base64,${screenshotBuffer.toString('base64')}`;
-  const aspectRatio = `${profile.width} / ${profile.height}`;
-
-  return `<!doctype html>
-<html>
-<head>
-  <meta charset="utf-8" />
-  <style>
-    * { box-sizing: border-box; }
-    html, body { width: 100%; height: 100%; margin: 0; overflow: hidden; }
-    body {
-      display: grid;
-      place-items: center;
-      position: relative;
-      background:
-        radial-gradient(circle at 14% 18%, rgba(45, 213, 255, 0.24), transparent 30%),
-        radial-gradient(circle at 86% 82%, rgba(196, 255, 61, 0.16), transparent 28%),
-        linear-gradient(145deg, #111827 0%, #070b12 52%, #020409 100%);
-      font-family: Arial, sans-serif;
-    }
-    body::before {
-      content: '';
-      position: absolute;
-      inset: 0;
-      opacity: 0.18;
-      background-image:
-        linear-gradient(rgba(255,255,255,0.045) 1px, transparent 1px),
-        linear-gradient(90deg, rgba(255,255,255,0.045) 1px, transparent 1px);
-      background-size: 7vw 7vw;
-      mask-image: linear-gradient(to bottom, transparent, black 28%, black 72%, transparent);
-    }
-    .device {
-      position: relative;
-      z-index: 1;
-      aspect-ratio: ${aspectRatio};
-      background: linear-gradient(145deg, #566171 0%, #171c25 18%, #05070b 55%, #384252 100%);
-      border: clamp(2px, 0.45vw, 9px) solid #727d8d;
-      box-shadow:
-        0 4vh 9vh rgba(0, 0, 0, 0.68),
-        0 0 0 1px rgba(255, 255, 255, 0.18) inset,
-        0 0 5vh rgba(45, 213, 255, 0.12);
-    }
-    .screen {
-      position: relative;
-      width: 100%;
-      height: 100%;
-      overflow: hidden;
-      background: #05070b;
-      box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.95) inset;
-    }
-    .screen img {
-      display: block;
-      width: 100%;
-      height: 100%;
-      object-fit: cover;
-    }
-    .device.android-phone,
-    .device.iphone {
-      height: 87%;
-      padding: 1.25%;
-      border-radius: clamp(24px, 8vw, 70px);
-    }
-    .device.android-phone .screen,
-    .device.iphone .screen {
-      border-radius: clamp(19px, 6.7vw, 60px);
-    }
-    .camera-dot {
-      position: absolute;
-      z-index: 3;
-      top: 2.1%;
-      left: 50%;
-      width: clamp(5px, 1.8vw, 16px);
-      aspect-ratio: 1;
-      transform: translateX(-50%);
-      border-radius: 50%;
-      background: radial-gradient(circle at 36% 34%, #406891, #080b10 46%, #000 72%);
-      box-shadow: 0 0 0 2px #111827;
-    }
-    .dynamic-island {
-      position: absolute;
-      z-index: 3;
-      top: 2.2%;
-      left: 50%;
-      width: 29%;
-      height: 3.3%;
-      transform: translateX(-50%);
-      border-radius: 999px;
-      background: #000;
-      box-shadow: 0 0 0 1px rgba(255,255,255,0.05);
-    }
-    .device.tablet {
-      height: 86%;
-      padding: 1.05%;
-      border-radius: clamp(18px, 3.2vw, 48px);
-    }
-    .device.tablet .screen {
-      border-radius: clamp(13px, 2.5vw, 38px);
-    }
-    .device.apple-watch {
-      height: 82%;
-      padding: 2.2%;
-      border: clamp(3px, 1.4vw, 7px) solid #8b929b;
-      border-radius: 24% / 20%;
-      background: linear-gradient(145deg, #d5d8dc, #363b43 28%, #11151b 72%, #9299a2);
-    }
-    .device.apple-watch .screen {
-      border-radius: 20% / 17%;
-    }
-    .watch-crown {
-      position: absolute;
-      top: 24%;
-      right: -5.5%;
-      width: 5.5%;
-      height: 15%;
-      border-radius: 0 45% 45% 0;
-      background: linear-gradient(90deg, #303640, #a8afb7 55%, #424851);
-      box-shadow: 0 0.8vh 1.5vh rgba(0,0,0,0.45);
-    }
-    .watch-button {
-      position: absolute;
-      top: 43%;
-      right: -3.5%;
-      width: 3.5%;
-      height: 11%;
-      border-radius: 0 35% 35% 0;
-      background: #626a74;
-    }
-    .device.apple-vision-pro {
-      width: 82%;
-      padding: 0.72%;
-      border: clamp(4px, 0.45vw, 18px) solid rgba(201, 214, 224, 0.92);
-      border-radius: 14% / 32%;
-      background: linear-gradient(145deg, #dce5eb, #55616d 25%, #151b22 72%, #aebac3);
-      box-shadow:
-        0 5vh 11vh rgba(0,0,0,0.68),
-        0 0 5vh rgba(180,225,255,0.2),
-        0 0 0 1px rgba(255,255,255,0.4) inset;
-    }
-    .device.apple-vision-pro .screen {
-      border-radius: 13% / 29%;
-    }
-    .vision-sensor {
-      position: absolute;
-      z-index: 3;
-      top: 48%;
-      width: clamp(8px, 0.8vw, 30px);
-      aspect-ratio: 1;
-      border-radius: 50%;
-      background: radial-gradient(circle at 38% 35%, #567793, #05080c 55%, #000 75%);
-      box-shadow: 0 0 0 2px rgba(147,166,181,0.55);
-    }
-    .vision-sensor-left { left: 3.2%; }
-    .vision-sensor-right { right: 3.2%; }
-    .tablet-camera,
-    .laptop-camera {
-      position: absolute;
-      z-index: 3;
-      top: 0.48%;
-      left: 50%;
-      width: clamp(3px, 0.55vw, 10px);
-      aspect-ratio: 1;
-      transform: translateX(-50%);
-      border-radius: 50%;
-      background: #080b10;
-      box-shadow: 0 0 0 1px #526071;
-    }
-    .device.tv,
-    .device.apple-tv {
-      width: 82%;
-      padding: 0.62%;
-      border-radius: clamp(8px, 1.1vw, 24px);
-      transform: translateY(-4%);
-    }
-    .device.tv .screen,
-    .device.apple-tv .screen { border-radius: clamp(4px, 0.55vw, 12px); }
-    .tv-stand {
-      position: absolute;
-      z-index: -1;
-      left: 50%;
-      bottom: -13%;
-      width: 24%;
-      height: 13%;
-      transform: translateX(-50%);
-      background: linear-gradient(90deg, #11161f, #697383 50%, #11161f);
-      clip-path: polygon(42% 0, 58% 0, 67% 76%, 94% 86%, 100% 100%, 0 100%, 6% 86%, 33% 76%);
-      filter: drop-shadow(0 1.5vh 1.5vh rgba(0,0,0,0.55));
-    }
-    .device.laptop {
-      width: 82%;
-      padding: 0.75% 0.75% 1.15%;
-      border-radius: clamp(8px, 1.2vw, 24px);
-      transform: translateY(-3%);
-    }
-    .device.laptop .screen { border-radius: clamp(4px, 0.55vw, 12px); }
-    .laptop-base {
-      position: absolute;
-      z-index: -1;
-      left: 50%;
-      bottom: -7.5%;
-      width: 112%;
-      height: 8%;
-      transform: translateX(-50%);
-      border-radius: 0 0 50% 50% / 0 0 70% 70%;
-      background: linear-gradient(#697383, #202631 45%, #090c11);
-      box-shadow: 0 1.5vh 2vh rgba(0,0,0,0.48);
-    }
-    .device.xr {
-      width: 82%;
-      padding: 0.58%;
-      border: clamp(2px, 0.32vw, 7px) solid rgba(128, 230, 255, 0.9);
-      border-radius: clamp(18px, 2.5vw, 48px);
-      background: rgba(13, 22, 34, 0.82);
-      box-shadow:
-        0 4vh 10vh rgba(0,0,0,0.65),
-        0 0 7vh rgba(45,213,255,0.34),
-        0 0 0 1px rgba(255,255,255,0.22) inset;
-    }
-    .device.xr .screen { border-radius: clamp(13px, 2vw, 38px); }
-    .xr-status {
-      position: absolute;
-      top: -2.4%;
-      left: 50%;
-      width: 13%;
-      height: 1.1%;
-      transform: translateX(-50%);
-      border-radius: 999px;
-      background: #6fe8ff;
-      box-shadow: 0 0 1.8vh #2dd5ff;
-    }
-  </style>
-</head>
-<body>
-  <main class="device ${profile.frameType}">
-    <div class="screen"><img src="${screenshotDataUrl}" /></div>
-    ${getFrameAdornment(profile.frameType)}
-  </main>
-</body>
-</html>`;
-}
-
-function escapeHtml(value) {
-  return String(value)
-    .replace(/&/g, '&amp;')
-    .replace(/</g, '&lt;')
-    .replace(/>/g, '&gt;')
-    .replace(/"/g, '&quot;')
-    .replace(/'/g, '&#39;');
-}
-
-function cleanAssetCopy(value, maximumLength, fallback = '') {
-  const cleaned = String(value || '')
-    .replace(/<script\b[^>]*>[\s\S]*?<\/script>/gi, ' ')
-    .replace(/<style\b[^>]*>[\s\S]*?<\/style>/gi, ' ')
-    .replace(/<[^>]+>/g, ' ')
-    .replace(/&[a-zA-Z#0-9]+;/g, ' ')
-    .replace(/[_|]+/g, ' ')
-    .replace(/\s+/g, ' ')
-    .trim();
-  if (!cleaned) return fallback;
-  if (cleaned.length <= maximumLength) return cleaned;
-  const shortened = cleaned.slice(0, maximumLength + 1);
-  const lastSpace = shortened.lastIndexOf(' ');
-  return shortened.slice(0, lastSpace > maximumLength * 0.55 ? lastSpace : maximumLength).trim();
-}
-
-function readJsonAssetSource(filePath) {
-  try {
-    return JSON.parse(fs.readFileSync(filePath, 'utf8'));
-  } catch {
-    return {};
-  }
-}
-
-function collectProjectUiPhrases() {
-  const phrases = [];
-  const pageDirectory = path.join(__dirname, 'src', 'pages');
-  if (fs.existsSync(pageDirectory)) {
-    const pageFiles = fs.readdirSync(pageDirectory)
-      .filter((fileName) => /\.(?:f7|html)$/i.test(fileName))
-      .sort()
-      .slice(0, 40);
-    const visibleElementPattern = /<(?:h[1-4]|button|label|option|a|li)\b[^>]*>([\s\S]*?)<\/(?:h[1-4]|button|label|option|a|li)>/gi;
-    for (const fileName of pageFiles) {
-      const source = fs.readFileSync(path.join(pageDirectory, fileName), 'utf8');
-      let match;
-      while ((match = visibleElementPattern.exec(source)) && phrases.length < 120) {
-        const phrase = cleanAssetCopy(match[1], 52);
-        if (phrase) phrases.push(phrase);
-      }
-    }
-  }
-  return phrases;
-}
-
-function getStoreAssetCopy(config) {
-  const configuredAppName = cleanAssetCopy(config.appName, 40, 'App');
-  const appUniqueId = String(config.android?.APP_UNIQUE_ID ?? '').trim();
-  const promoCopyPath = appUniqueId
-    ? path.join(
-      __dirname,
-      'Auto-AI-Video',
-      `${appUniqueId}. ${sanitizeName(configuredAppName, 'App')}-promo-copy.json`,
-    )
-    : '';
-  const promoCopy = promoCopyPath && fs.existsSync(promoCopyPath)
-    ? readJsonAssetSource(promoCopyPath).copy || {}
-    : {};
-  const scenes = Array.isArray(promoCopy.scenes) ? promoCopy.scenes : [];
-  const footerKeywords = Array.isArray(promoCopy.footer_keywords)
-    ? promoCopy.footer_keywords
-    : [];
-  const manifestCandidates = [
-    path.join(__dirname, 'src', 'manifest.webmanifest'),
-    path.join(__dirname, 'public', 'manifest.webmanifest'),
-    path.join(__dirname, 'manifest.webmanifest'),
-  ];
-  const manifestPath = manifestCandidates.find((candidate) => fs.existsSync(candidate));
-  const manifest = manifestPath ? readJsonAssetSource(manifestPath) : {};
-  const candidates = [
-    ...footerKeywords,
-    ...scenes.flatMap((scene) => [
-      `${scene.title_line_1 || ''} ${scene.title_line_2 || ''}`,
-      scene.kicker,
-      scene.body,
-    ]),
-    ...(Array.isArray(manifest.categories) ? manifest.categories : []),
-    manifest.description,
-    ...collectProjectUiPhrases(),
-  ];
-  const uniquePhrases = [];
-  const seen = new Set([configuredAppName.toLowerCase()]);
-  for (const candidate of candidates) {
-    const phrase = cleanAssetCopy(candidate, 52);
-    const key = phrase.toLowerCase();
-    if (phrase.length < 3 || seen.has(key)) continue;
-    seen.add(key);
-    uniquePhrases.push(phrase);
-  }
-
-  const featureLabels = uniquePhrases
-    .map((phrase) => cleanAssetCopy(phrase, 18))
-    .filter((phrase, index, values) => (
-      phrase.length >= 3
-      && values.findIndex((value) => value.toLowerCase() === phrase.toLowerCase()) === index
-    ))
-    .slice(0, 9);
-  while (featureLabels.length < 9) {
-    featureLabels.push(`Feature ${String(featureLabels.length + 1).padStart(2, '0')}`);
-  }
-
-  const firstScene = scenes[0] || {};
-  const firstSceneTitle = cleanAssetCopy(
-    `${firstScene.title_line_1 || ''} ${firstScene.title_line_2 || ''}`,
-    34,
-  );
-  const primaryPhrase = footerKeywords[0] || featureLabels[0];
-  return {
-    amazonEyebrow: cleanAssetCopy(primaryPhrase, 32, `Explore ${configuredAppName}`),
-    amazonCallout: cleanAssetCopy(
-      firstScene.body || manifest.description || uniquePhrases[0],
-      52,
-      `Explore ${configuredAppName}`,
-    ),
-    featureLabels,
-    samsungKicker: cleanAssetCopy(firstScene.kicker || primaryPhrase, 28, 'App features'),
-    samsungAction: firstSceneTitle || cleanAssetCopy(primaryPhrase, 34, `Open ${configuredAppName}`),
-    samsungBody: cleanAssetCopy(
-      firstScene.body || manifest.description || uniquePhrases[1],
-      52,
-      'Explore the available features',
-    ),
-  };
-}
-
-function createAmazonAssetHtml(asset, appName, iconBuffer, storeCopy) {
-  const iconDataUrl = `data:image/png;base64,${iconBuffer.toString('base64')}`;
-  const safeAppName = escapeHtml(appName);
-  const safeEyebrow = escapeHtml(storeCopy.amazonEyebrow);
-  const safeCallout = escapeHtml(storeCopy.amazonCallout);
-  const featureMarkup = storeCopy.featureLabels.slice(0, 6)
-    .map((label) => `<span>${escapeHtml(label)}</span>`)
-    .join('');
-  const logoMarkup = asset.type === 'featured-logo'
-    ? `<main class="featured-logo"><img src="${iconDataUrl}" /><div><small>${safeEyebrow}</small><strong>${safeAppName}</strong></div></main>`
-    : '';
-  const iconMarkup = asset.type === 'icon'
-    ? `<main class="icon-card"><img src="${iconDataUrl}" /><div><small>${safeCallout}</small><strong>${safeAppName}</strong></div></main>`
-    : '';
-  const backgroundMarkup = asset.type.includes('background')
-    ? `<main class="background-art"><div class="pulse pulse-one"></div><div class="pulse pulse-two"></div><div class="feature-grid">${featureMarkup}</div></main>`
-    : '';
-
-  return `<!doctype html>
-<html>
-<head>
-  <meta charset="utf-8" />
-  <style>
-    * { box-sizing: border-box; }
-    html, body { width: 100%; height: 100%; margin: 0; overflow: hidden; }
-    body {
-      position: relative;
-      font-family: Arial, Helvetica, sans-serif;
-      color: #f8fbff;
-      background: transparent;
-    }
-    body.icon,
-    body.background-image,
-    body.featured-background {
-      background:
-        radial-gradient(circle at 16% 18%, rgba(52, 211, 235, 0.32), transparent 28%),
-        radial-gradient(circle at 82% 82%, rgba(201, 255, 65, 0.24), transparent 30%),
-        linear-gradient(135deg, #24113c 0%, #15152d 48%, #071725 100%);
-    }
-    body.icon::before,
-    body.background-image::before,
-    body.featured-background::before {
-      content: '';
-      position: absolute;
-      inset: 0;
-      opacity: 0.22;
-      background-image:
-        linear-gradient(rgba(255,255,255,0.07) 1px, transparent 1px),
-        linear-gradient(90deg, rgba(255,255,255,0.07) 1px, transparent 1px);
-      background-size: 72px 72px;
-    }
-    .icon-card {
-      position: relative;
-      z-index: 2;
-      width: 100%;
-      height: 100%;
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      gap: 72px;
-      padding: 72px 110px;
-    }
-    .icon-card img {
-      width: 500px;
-      height: 500px;
-      object-fit: contain;
-      border-radius: 104px;
-      box-shadow: 0 38px 80px rgba(0,0,0,0.48), 0 0 70px rgba(52,211,235,0.2);
-    }
-    .icon-card div { display: flex; flex-direction: column; gap: 18px; }
-    .icon-card small,
-    .featured-logo small {
-      color: #35d4eb;
-      font-size: 24px;
-      font-weight: 700;
-      letter-spacing: 7px;
-    }
-    .icon-card strong { font-size: 86px; line-height: 0.96; max-width: 500px; }
-    .featured-logo {
-      width: 100%;
-      height: 100%;
-      display: flex;
-      align-items: center;
-      gap: 24px;
-      padding: 20px 26px;
-      color: #111827;
-    }
-    .featured-logo img {
-      width: 210px;
-      height: 210px;
-      object-fit: contain;
-      border-radius: 44px;
-    }
-    .featured-logo div { display: flex; min-width: 0; flex-direction: column; gap: 8px; }
-    .featured-logo small { font-size: 14px; letter-spacing: 3px; }
-    .featured-logo strong {
-      max-width: 360px;
-      overflow: hidden;
-      color: #ffffff;
-      font-size: 56px;
-      line-height: 1;
-      text-overflow: ellipsis;
-      white-space: nowrap;
-      text-shadow: 0 3px 12px rgba(0,0,0,0.75);
-    }
-    .background-art { position: absolute; inset: 0; }
-    .pulse {
-      position: absolute;
-      border: 3px solid rgba(53,212,235,0.28);
-      border-radius: 50%;
-      box-shadow: 0 0 80px rgba(53,212,235,0.15);
-    }
-    .pulse-one { width: 520px; height: 520px; top: -180px; left: -110px; }
-    .pulse-two { width: 620px; height: 620px; right: -180px; bottom: -310px; border-color: rgba(201,255,65,0.22); }
-    .feature-grid {
-      position: absolute;
-      left: 8%;
-      right: 8%;
-      top: 50%;
-      display: grid;
-      grid-template-columns: repeat(2, minmax(0, 1fr));
-      gap: 24px;
-      transform: translateY(-50%);
-    }
-    .feature-grid span {
-      display: flex;
-      min-height: 108px;
-      align-items: center;
-      justify-content: center;
-      padding: 20px;
-      color: #f8fbff;
-      border: 2px solid rgba(255,255,255,0.17);
-      border-radius: 22px;
-      background: linear-gradient(145deg, rgba(42,55,75,0.96), rgba(11,18,29,0.96));
-      box-shadow: 0 20px 28px rgba(0,0,0,0.28);
-      font-size: clamp(20px, 2vw, 34px);
-      font-weight: 700;
-      text-align: center;
-    }
-    .feature-grid span:nth-child(3n+1) { border-top: 7px solid #35d4eb; }
-    .feature-grid span:nth-child(3n+2) { border-top: 7px solid #ff9f43; }
-    .feature-grid span:nth-child(3n) { border-top: 7px solid #c9ff41; }
-    body.featured-background .feature-grid { left: 5%; right: 5%; gap: 18px; }
-  </style>
-</head>
-<body class="${asset.type}">
-  ${iconMarkup}
-  ${logoMarkup}
-  ${backgroundMarkup}
-</body>
-</html>`;
-}
-
-function createPlaystoreFeatureHtml(appName, iconBuffer, storeCopy) {
-  const iconDataUrl = `data:image/png;base64,${iconBuffer.toString('base64')}`;
-  const safeAppName = escapeHtml(appName);
-  const safeCallout = escapeHtml(storeCopy.amazonCallout);
-  const featureMarkup = storeCopy.featureLabels.slice(0, 5)
-    .map((label, index) => `<span><i>0${index + 1}</i>${escapeHtml(label)}</span>`)
-    .join('');
-
-  return `<!doctype html>
-<html>
-<head>
-  <meta charset="utf-8" />
-  <style>
-    * { box-sizing: border-box; }
-    html, body { width: 100%; height: 100%; margin: 0; overflow: hidden; }
-    body {
-      display: flex;
-      align-items: center;
-      padding: 42px 64px;
-      color: #f7fbff;
-      background: radial-gradient(circle at 84% 18%, rgba(53,212,235,0.3), transparent 31%), linear-gradient(120deg, #111729, #231039 58%, #071522);
-      font-family: Arial, Helvetica, sans-serif;
-    }
-    main { display: flex; width: 100%; height: 100%; align-items: center; justify-content: space-between; gap: 48px; }
-    .copy { max-width: 570px; }
-    img { width: 128px; height: 128px; border-radius: 30px; object-fit: contain; }
-    small { display: block; margin-top: 24px; color: #35d4eb; font-size: 18px; font-weight: 700; letter-spacing: 4px; text-transform: uppercase; }
-    h1 { margin: 12px 0 18px; font-size: 64px; line-height: 0.98; }
-    p { margin: 0; color: #b8c5d4; font-size: 23px; line-height: 1.35; }
-    .features { display: grid; width: 340px; gap: 12px; }
-    .features span { display: flex; align-items: center; gap: 16px; padding: 17px 20px; border: 1px solid rgba(255,255,255,0.16); border-radius: 15px; background: rgba(8,16,28,0.6); font-size: 18px; font-weight: 700; }
-    .features i { color: #c9ff41; font-size: 13px; font-style: normal; }
-  </style>
-</head>
-<body><main><section class="copy"><img src="${iconDataUrl}" /><small>Explore ${safeAppName}</small><h1>${safeAppName}</h1><p>${safeCallout}</p></section><section class="features">${featureMarkup}</section></main></body>
-</html>`;
-}
-
-async function createPlaystoreAssets(client, skipExisting = false) {
-  if (!fs.existsSync(amazonIconPath)) {
-    throw new Error(`Play Store asset source icon was not found: ${amazonIconPath}`);
-  }
-
-  const config = JSON.parse(fs.readFileSync(capacitorConfigPath, 'utf8'));
-  const appName = config.appName || 'App';
-  const storeCopy = getStoreAssetCopy(config);
-  const iconBuffer = fs.readFileSync(amazonIconPath);
-  fs.mkdirSync(playstoreAssetsDirectory, { recursive: true });
-
-  for (const asset of playstoreAssetDefinitions) {
-    const outputPath = path.join(playstoreAssetsDirectory, asset.fileName);
-    if (skipExisting && fs.existsSync(outputPath)) continue;
-
-    await client.send('Emulation.setDeviceMetricsOverride', {
-      width: asset.width, height: asset.height, deviceScaleFactor: 1, mobile: false,
-      screenWidth: asset.width, screenHeight: asset.height, positionX: 0, positionY: 0,
-    });
-    const frameTree = await client.send('Page.getFrameTree');
-    await client.send('Page.setDocumentContent', {
-      frameId: frameTree.frameTree.frame.id,
-      html: createPlaystoreFeatureHtml(appName, iconBuffer, storeCopy),
-    });
-    await client.send('Runtime.evaluate', {
-      expression: `Promise.all([...document.images].map((image) => image.complete ? Promise.resolve() : new Promise((resolve) => image.addEventListener('load', resolve, { once: true })))).then(() => new Promise((resolve) => requestAnimationFrame(() => requestAnimationFrame(resolve))))`,
-      awaitPromise: true,
-      returnByValue: true,
-    });
-    const screenshot = await client.send('Page.captureScreenshot', {
-      format: 'png', fromSurface: true, captureBeyondViewport: false,
-    });
-    fs.writeFileSync(outputPath, Buffer.from(screenshot.data, 'base64'));
-    console.log(`Saved Play Store feature ${asset.width}x${asset.height}: ${outputPath}`);
-  }
-}
-
-async function createAmazonAssets(client, skipExisting = false) {
-  if (!fs.existsSync(amazonIconPath)) {
-    throw new Error(`Amazon asset source icon was not found: ${amazonIconPath}`);
-  }
-
-  const config = JSON.parse(fs.readFileSync(capacitorConfigPath, 'utf8'));
-  const appName = config.appName || 'App';
-  const storeCopy = getStoreAssetCopy(config);
-  const iconBuffer = fs.readFileSync(amazonIconPath);
-  fs.mkdirSync(amazonAssetsDirectory, { recursive: true });
-
-  for (const asset of amazonAssetDefinitions) {
-    const outputPath = path.join(amazonAssetsDirectory, asset.fileName);
-
-    if (skipExisting && fs.existsSync(outputPath)) {
-      continue;
-    }
-
-    await client.send('Emulation.setDeviceMetricsOverride', {
-      width: asset.width,
-      height: asset.height,
-      deviceScaleFactor: 1,
-      mobile: false,
-      screenWidth: asset.width,
-      screenHeight: asset.height,
-      positionX: 0,
-      positionY: 0,
-    });
-
-    const frameTree = await client.send('Page.getFrameTree');
-    await client.send('Page.setDocumentContent', {
-      frameId: frameTree.frameTree.frame.id,
-      html: createAmazonAssetHtml(asset, appName, iconBuffer, storeCopy),
-    });
-    await client.send('Runtime.evaluate', {
-      expression: `Promise.all([...document.images].map((image) => image.complete
-        ? Promise.resolve()
-        : new Promise((resolve) => {
-          image.addEventListener('load', resolve, { once: true });
-          image.addEventListener('error', resolve, { once: true });
-        }))).then(() => new Promise((resolve) => requestAnimationFrame(() => requestAnimationFrame(resolve))))`,
-      awaitPromise: true,
-      returnByValue: true,
-    });
-
-    const screenshot = await client.send('Page.captureScreenshot', {
-      format: 'png',
-      fromSurface: true,
-      captureBeyondViewport: false,
-      omitBackground: Boolean(asset.transparent),
-    });
-    fs.writeFileSync(outputPath, Buffer.from(screenshot.data, 'base64'));
-    console.log(`Saved Amazon asset ${asset.width}x${asset.height}: ${outputPath}`);
-  }
-}
-
-function createSamsungAssetHtml(asset, appName, iconBuffer, storeCopy) {
-  const iconDataUrl = `data:image/png;base64,${iconBuffer.toString('base64')}`;
-  const safeAppName = escapeHtml(appName);
-  const featureButtons = storeCopy.featureLabels.map((label, index) => (
-    `<button><i>0${index + 1}</i><span>${escapeHtml(label.toUpperCase())}</span></button>`
-  )).join('');
-  const safeKicker = escapeHtml(storeCopy.samsungKicker.toUpperCase());
-  const safeAction = escapeHtml(storeCopy.samsungAction.toUpperCase());
-  const safeBody = escapeHtml(storeCopy.samsungBody);
-  const content = asset.type === 'edge-screen'
-    ? `<main class="edge-panel"><header><img src="${iconDataUrl}" /><strong>${safeAppName}</strong></header><section>${featureButtons}</section></main>`
-    : `<main class="single-panel"><header><img src="${iconDataUrl}" /><div><small>${safeKicker}</small><strong>${safeAppName}</strong></div></header><div class="single-action"><span>+</span><strong>${safeAction}</strong><small>${safeBody}</small></div><div class="accent-bars"><i></i><i></i><i></i><i></i><i></i></div></main>`;
-
-  return `<!doctype html>
-<html>
-<head>
-  <meta charset="utf-8" />
-  <style>
-    * { box-sizing: border-box; }
-    html, body { width: 100%; height: 100%; margin: 0; overflow: hidden; }
-    body {
-      position: relative;
-      color: #f7fbff;
-      background:
-        radial-gradient(circle at 50% 8%, rgba(53,212,235,0.26), transparent 24%),
-        radial-gradient(circle at 50% 88%, rgba(201,255,65,0.16), transparent 25%),
-        linear-gradient(180deg, #231039, #111729 48%, #071522);
-      font-family: Arial, Helvetica, sans-serif;
-    }
-    body::before {
-      content: '';
-      position: absolute;
-      inset: 0;
-      opacity: 0.18;
-      background: repeating-linear-gradient(0deg, transparent 0 79px, rgba(255,255,255,0.08) 80px);
-    }
-    main { position: relative; z-index: 1; width: 100%; height: 100%; }
-    .edge-panel { display: flex; flex-direction: column; padding: 28px 12px; }
-    .edge-panel header { display: flex; flex-direction: column; align-items: center; gap: 12px; min-height: 230px; }
-    .edge-panel header img { width: 112px; height: 112px; border-radius: 25px; object-fit: contain; }
-    .edge-panel header strong { max-width: 136px; overflow: hidden; font-size: 18px; text-overflow: ellipsis; white-space: nowrap; }
-    .edge-panel section { display: grid; flex: 1; grid-template-rows: repeat(9, 1fr); gap: 13px; }
-    .edge-panel button {
-      display: flex;
-      width: 100%;
-      min-height: 0;
-      flex-direction: column;
-      align-items: center;
-      justify-content: center;
-      gap: 8px;
-      color: #f7fbff;
-      border: 1px solid rgba(255,255,255,0.16);
-      border-top: 5px solid #35d4eb;
-      border-radius: 18px;
-      background: linear-gradient(145deg, rgba(41,55,76,0.98), rgba(10,17,29,0.98));
-      box-shadow: 0 10px 18px rgba(0,0,0,0.3);
-    }
-    .edge-panel button:nth-child(3n+2) { border-top-color: #ff9f43; }
-    .edge-panel button:nth-child(3n) { border-top-color: #c9ff41; }
-    .edge-panel button i { color: #35d4eb; font-size: 14px; font-style: normal; font-weight: 700; }
-    .edge-panel button span { font-size: 12px; font-weight: 700; letter-spacing: 1px; }
-    .single-panel { display: flex; flex-direction: column; align-items: center; padding: 100px 44px; }
-    .single-panel header { display: flex; width: 100%; align-items: center; gap: 24px; }
-    .single-panel header img { width: 160px; height: 160px; border-radius: 36px; object-fit: contain; }
-    .single-panel header div { display: flex; min-width: 0; flex-direction: column; gap: 9px; }
-    .single-panel header small { color: #35d4eb; font-size: 17px; font-weight: 700; letter-spacing: 3px; }
-    .single-panel header strong { overflow: hidden; font-size: 48px; text-overflow: ellipsis; white-space: nowrap; }
-    .single-action {
-      display: flex;
-      width: 100%;
-      height: 880px;
-      margin-top: 380px;
-      flex-direction: column;
-      align-items: center;
-      justify-content: center;
-      border: 3px solid rgba(53,212,235,0.5);
-      border-radius: 90px;
-      background: linear-gradient(145deg, rgba(39,53,75,0.96), rgba(8,16,28,0.98));
-      box-shadow: 0 50px 90px rgba(0,0,0,0.42), 0 0 75px rgba(53,212,235,0.16);
-    }
-    .single-action span {
-      display: grid;
-      width: 260px;
-      height: 260px;
-      place-items: center;
-      color: #0d1721;
-      border-radius: 50%;
-      background: linear-gradient(145deg, #35d4eb, #c9ff41);
-      box-shadow: 0 25px 55px rgba(53,212,235,0.3);
-      font-size: 170px;
-      font-weight: 200;
-      line-height: 1;
-    }
-    .single-action strong { margin-top: 65px; font-size: 42px; letter-spacing: 5px; }
-    .single-action small { margin-top: 18px; color: #a9b7c9; font-size: 24px; }
-    .accent-bars { display: flex; align-items: center; gap: 18px; height: 300px; margin-top: auto; }
-    .accent-bars i { width: 14px; height: 70px; border-radius: 999px; background: #35d4eb; }
-    .accent-bars i:nth-child(2), .accent-bars i:nth-child(4) { height: 140px; background: #ff5964; }
-    .accent-bars i:nth-child(3) { height: 210px; background: #c9ff41; }
-  </style>
-</head>
-<body>${content}</body>
-</html>`;
-}
-
-async function createSamsungAssets(client, skipExisting = false) {
-  if (!fs.existsSync(amazonIconPath)) {
-    throw new Error(`Samsung asset source icon was not found: ${amazonIconPath}`);
-  }
-
-  const config = JSON.parse(fs.readFileSync(capacitorConfigPath, 'utf8'));
-  const appName = config.appName || 'App';
-  const storeCopy = getStoreAssetCopy(config);
-  const iconBuffer = fs.readFileSync(amazonIconPath);
-  const maximumFileSize = 1024 * 1024;
-
-  fs.mkdirSync(samsungAssetsDirectory, { recursive: true });
-
-  for (const asset of samsungAssetDefinitions) {
-    const outputPath = path.join(samsungAssetsDirectory, asset.fileName);
-
-    if (skipExisting && fs.existsSync(outputPath)) {
-      continue;
-    }
-
-    await client.send('Emulation.setDeviceMetricsOverride', {
-      width: asset.width,
-      height: asset.height,
-      deviceScaleFactor: 1,
-      mobile: false,
-      screenWidth: asset.width,
-      screenHeight: asset.height,
-      positionX: 0,
-      positionY: 0,
-    });
-    const frameTree = await client.send('Page.getFrameTree');
-    await client.send('Page.setDocumentContent', {
-      frameId: frameTree.frameTree.frame.id,
-      html: createSamsungAssetHtml(asset, appName, iconBuffer, storeCopy),
-    });
-    await client.send('Runtime.evaluate', {
-      expression: `Promise.all([...document.images].map((image) => image.complete
-        ? Promise.resolve()
-        : new Promise((resolve) => image.addEventListener('load', resolve, { once: true }))))
-        .then(() => new Promise((resolve) => requestAnimationFrame(() => requestAnimationFrame(resolve))))`,
-      awaitPromise: true,
-      returnByValue: true,
-    });
-    const screenshot = await client.send('Page.captureScreenshot', {
-      format: 'png',
-      fromSurface: true,
-      captureBeyondViewport: false,
-    });
-    const outputBuffer = Buffer.from(screenshot.data, 'base64');
-
-    if (outputBuffer.length >= maximumFileSize) {
-      throw new Error(
-        `Samsung asset exceeds 1024 KB (${Math.ceil(outputBuffer.length / 1024)} KB): ${asset.fileName}`,
-      );
-    }
-
-    fs.writeFileSync(outputPath, outputBuffer);
-    console.log(
-      `Saved Samsung asset ${asset.width}x${asset.height} `
-      + `(${Math.ceil(outputBuffer.length / 1024)} KB): ${outputPath}`,
-    );
-  }
-}
-
-async function createMissingStoreAssets() {
-  const hasMissingAmazonAssets = amazonAssetDefinitions.some((asset) => (
-    !fs.existsSync(path.join(amazonAssetsDirectory, asset.fileName))
-  ));
-  const hasMissingSamsungAssets = samsungAssetDefinitions.some((asset) => (
-    !fs.existsSync(path.join(samsungAssetsDirectory, asset.fileName))
-  ));
-  const hasMissingPlaystoreAssets = playstoreAssetDefinitions.some((asset) => (
-    !fs.existsSync(path.join(playstoreAssetsDirectory, asset.fileName))
-  ));
-
-  if (!hasMissingAmazonAssets && !hasMissingSamsungAssets && !hasMissingPlaystoreAssets) {
-    console.log('Amazon, Samsung, and Play Store assets already exist.');
-    return;
-  }
-
-  let browser;
-  let client;
-
-  try {
-    browser = await launchReplayBrowser();
-    client = await createReplayPage(browser);
-
-    if (hasMissingAmazonAssets) {
-      await createAmazonAssets(client, true);
-    }
-
-    if (hasMissingSamsungAssets) {
-      await createSamsungAssets(client, true);
-    }
-    if (hasMissingPlaystoreAssets) {
-      await createPlaystoreAssets(client, true);
-    }
-  } finally {
-    if (client) client.close();
-    if (browser) await closeReplayBrowser(browser);
-  }
-
-  console.log('Missing Amazon, Samsung, and Play Store assets created.');
-}
-
-async function captureFramedScreenshot(
-  client,
-  screenshotBuffer,
-  profile,
-  screenshotFileName,
-  skipExisting = false,
-) {
-  const framedProfileDirectory = path.join(inFrameDirectory, profile.outputDirectory);
-  const framedScreenshotPath = path.join(framedProfileDirectory, screenshotFileName);
-
-  if (skipExisting && fs.existsSync(framedScreenshotPath)) {
-    console.log(`Skipped existing framed screenshot: ${framedScreenshotPath}`);
-    return false;
-  }
-
-  const hasCustomFrameSize = Boolean(profile.framedWidth && profile.framedHeight);
-  const frameWidth = profile.framedWidth || profile.width;
-  const frameHeight = profile.framedHeight || profile.height;
-  const frameScaleFactor = hasCustomFrameSize ? 1 : profile.deviceScaleFactor;
-
-  await client.send('Emulation.setDeviceMetricsOverride', {
-    width: frameWidth,
-    height: frameHeight,
-    deviceScaleFactor: frameScaleFactor,
-    mobile: false,
-    screenWidth: frameWidth,
-    screenHeight: frameHeight,
-    positionX: 0,
-    positionY: 0,
-  });
-
-  const frameTree = await client.send('Page.getFrameTree');
-  await client.send('Page.setDocumentContent', {
-    frameId: frameTree.frameTree.frame.id,
-    html: createDeviceFrameHtml(profile, screenshotBuffer),
-  });
-  await client.send('Runtime.evaluate', {
-    expression: `new Promise((resolve) => {
-      const image = document.querySelector('img');
-      const ready = () => requestAnimationFrame(() => requestAnimationFrame(resolve));
-      if (image.complete) ready();
-      else {
-        image.addEventListener('load', ready, { once: true });
-        image.addEventListener('error', ready, { once: true });
-      }
-    })`,
-    awaitPromise: true,
-    returnByValue: true,
-  });
-
-  const framedScreenshot = await client.send('Page.captureScreenshot', {
-    format: 'png',
-    fromSurface: true,
-    captureBeyondViewport: false,
-  });
-
-  fs.mkdirSync(framedProfileDirectory, { recursive: true });
-  fs.writeFileSync(
-    framedScreenshotPath,
-    Buffer.from(framedScreenshot.data, 'base64'),
-    { flag: 'wx' },
-  );
-  console.log(`Saved framed ${profile.label}: ${framedScreenshotPath}`);
-  return true;
-}
-
-async function captureProfile(client, snapshot, profile, screenshotFileName) {
-  await client.send('Emulation.setDeviceMetricsOverride', {
-    width: profile.width,
-    height: profile.height,
-    deviceScaleFactor: profile.deviceScaleFactor,
-    mobile: profile.mobile,
-    screenWidth: profile.width,
-    screenHeight: profile.height,
-    positionX: 0,
-    positionY: 0,
-  });
-
-  const frameTree = await client.send('Page.getFrameTree');
-  await client.send('Page.setDocumentContent', {
-    frameId: frameTree.frameTree.frame.id,
-    html: snapshot.html,
-  });
-  const replayLayout = await waitForReplayLayout(client, snapshot);
-
-  if (replayLayout.documentWidth > replayLayout.viewportWidth + 1) {
-    console.warn(
-      `Warning: ${profile.label} replay is ${replayLayout.documentWidth}px wide `
-      + `inside a ${replayLayout.viewportWidth}px viewport.`,
-    );
-  }
-
-  const screenshot = await client.send('Page.captureScreenshot', {
-    format: 'png',
-    fromSurface: true,
-    captureBeyondViewport: false,
-  });
-
-  const profileDirectory = path.join(screenshotDirectory, profile.outputDirectory);
-  const screenshotPath = path.join(profileDirectory, screenshotFileName);
-  const screenshotBuffer = Buffer.from(screenshot.data, 'base64');
-
-  fs.mkdirSync(profileDirectory, { recursive: true });
-  fs.writeFileSync(screenshotPath, screenshotBuffer, { flag: 'wx' });
-  console.log(`Saved ${profile.label}: ${screenshotPath}`);
-  await captureFramedScreenshot(
-    client,
-    screenshotBuffer,
-    profile,
-    screenshotFileName,
-  );
-}
-
-async function captureScreenshotSet(
-  deviceClient,
-  replayClient,
-  selectedProfiles,
-  fileNameInput,
-) {
-  console.log('Capturing the current rendered page and resolved native data...');
-  const snapshot = await capturePageSnapshot(deviceClient);
-  const screenshotFileName = getScreenshotFileName(fileNameInput, selectedProfiles);
-
-  for (const profile of selectedProfiles) {
-    await captureProfile(replayClient, snapshot, profile, screenshotFileName);
-  }
-
-  console.log(`Responsive screenshot set completed: ${screenshotFileName}`);
-}
-
-async function frameExistingScreenshots(selectedProfiles) {
-  let replayBrowser;
-  let replayClient;
-  let framedCount = 0;
-  let failedCount = 0;
-
-  try {
-    replayBrowser = await launchReplayBrowser();
-    replayClient = await createReplayPage(replayBrowser);
-
-    for (const profile of selectedProfiles) {
-      const profileDirectory = path.join(screenshotDirectory, profile.outputDirectory);
-
-      if (!fs.existsSync(profileDirectory)) {
-        continue;
-      }
-
-      const screenshotFiles = fs.readdirSync(profileDirectory, { withFileTypes: true })
-        .filter((entry) => entry.isFile() && /\.png$/i.test(entry.name))
-        .map((entry) => entry.name)
-        .sort((first, second) => first.localeCompare(second, undefined, { numeric: true }));
-
-      for (const screenshotFileName of screenshotFiles) {
-        const screenshotPath = path.join(profileDirectory, screenshotFileName);
-
-        try {
-          const wasCreated = await captureFramedScreenshot(
-            replayClient,
-            fs.readFileSync(screenshotPath),
-            profile,
-            screenshotFileName,
-            true,
-          );
-          if (wasCreated) framedCount += 1;
-        } catch (error) {
-          failedCount += 1;
-          console.error(`Failed to frame ${screenshotPath}: ${error.message}`);
-        }
-      }
-    }
-  } finally {
-    if (replayClient) {
-      replayClient.close();
-    }
-
-    if (replayBrowser) {
-      await closeReplayBrowser(replayBrowser);
-    }
-  }
-
-  console.log(`Existing screenshot framing completed: ${framedCount} created.`);
-
-  if (failedCount) {
-    throw new Error(`${failedCount} existing screenshot(s) could not be framed.`);
-  }
-}
-
-async function runInteractiveCaptureLoop(
-  deviceClient,
-  replayClient,
-  selectedProfiles,
-) {
-  const terminal = readline.createInterface({
-    input: process.stdin,
-    output: process.stdout,
-    prompt: 'Enter a filename, or press Enter for the next number: ',
-  });
-
-  terminal.on('SIGINT', () => terminal.close());
-
-  console.log(`Screenshots will be saved in: ${screenshotDirectory}`);
-  console.log('Press Ctrl+C to exit.');
-  terminal.prompt();
-
-  for await (const fileNameInput of terminal) {
-    try {
-      await captureScreenshotSet(
-        deviceClient,
-        replayClient,
-        selectedProfiles,
-        fileNameInput,
-      );
-    } catch (error) {
-      console.error(`Responsive screenshot failed: ${error.message}`);
-    }
-
-    terminal.prompt();
-  }
-
-  console.log('\nResponsive screenshot tool closed.');
-}
-
-async function getInteractiveOptions(options) {
-  if (
-    !process.stdin.isTTY
-    || options.dryRun
-    || options.amazonAssets
-    || options.samsungAssets
-  ) {
-    return options;
-  }
-
-  const terminal = readline.createInterface({
-    input: process.stdin,
-    output: process.stdout,
-  });
-
-  try {
-    if (!options.profiles) {
-      console.log('Available profiles:');
-      printProfiles();
-      options.profiles = await terminal.question(
-        'Profiles separated by commas, or press Enter for all: ',
-      );
-    }
-  } finally {
-    terminal.close();
-  }
-
-  return options;
-}
-
-async function main() {
-  let options = parseArguments();
-
-  if (options.help) {
-    printHelp();
-    return;
-  }
-
-  if (options.list) {
-    printProfiles();
-    return;
-  }
-
-  options = await getInteractiveOptions(options);
-
-  if (options.amazonAssets) {
-    let amazonBrowser;
-    let amazonClient;
-
-    try {
-      amazonBrowser = await launchReplayBrowser();
-      amazonClient = await createReplayPage(amazonBrowser);
-      await createAmazonAssets(amazonClient);
-    } finally {
-      if (amazonClient) amazonClient.close();
-      if (amazonBrowser) await closeReplayBrowser(amazonBrowser);
-    }
-
-    console.log(`Amazon asset creation completed: ${amazonAssetsDirectory}`);
-    return;
-  }
-
-  if (options.samsungAssets) {
-    let samsungBrowser;
-    let samsungClient;
-
-    try {
-      samsungBrowser = await launchReplayBrowser();
-      samsungClient = await createReplayPage(samsungBrowser);
-      await createSamsungAssets(samsungClient);
-    } finally {
-      if (samsungClient) samsungClient.close();
-      if (samsungBrowser) await closeReplayBrowser(samsungBrowser);
-    }
-
-    console.log(`Samsung asset creation completed: ${samsungAssetsDirectory}`);
-    return;
-  }
-
-  if (!options.dryRun) {
-    await createMissingStoreAssets();
-  }
-
-  const selectedProfiles = selectProfiles(options.profiles);
-
-  if (options.frameExisting) {
-    await frameExistingScreenshots(selectedProfiles);
-    return;
-  }
-
-  const interactiveMode = process.stdin.isTTY && !options.prefix && !options.dryRun;
-  const deviceId = getConnectedDevice();
-  const appId = getAppId();
-  const socketName = getWebViewSocket(deviceId, appId);
-  const localPort = runAdb([
-    '-s',
-    deviceId,
-    'forward',
-    'tcp:0',
-    `localabstract:${socketName}`,
-  ]);
-
-  let deviceClient;
-  let replayBrowser;
-  let replayClient;
-
-  try {
-    const target = await getWebViewTarget(localPort);
-    deviceClient = new CdpClient(target.webSocketDebuggerUrl);
-    await deviceClient.connect();
-    await deviceClient.send('Page.enable');
-    await deviceClient.send('Runtime.enable');
-
-    const pageDetails = await getPageDetails(deviceClient);
-    console.log(`Connected device: ${deviceId}`);
-    console.log(`App: ${appId}`);
-    console.log(`Current page: ${pageDetails.title || '(untitled)'}`);
-    console.log(`Current URL: ${pageDetails.url}`);
-    console.log(
-      `Current viewport: ${pageDetails.width}x${pageDetails.height} `
-      + `at ${pageDetails.devicePixelRatio}x (${pageDetails.readyState})`,
-    );
-
-    if (options.dryRun) {
-      console.log('Dry run completed. No screenshots were created.');
-      return;
-    }
-
-    fs.mkdirSync(screenshotDirectory, { recursive: true });
-    replayBrowser = await launchReplayBrowser();
-    replayClient = await createReplayPage(replayBrowser);
-
-    console.log(
-      'Apple, TV, Chromebook, Mac, and XR profiles are viewport approximations of the live Android WebView.',
-    );
-
-    if (interactiveMode) {
-      await runInteractiveCaptureLoop(
-        deviceClient,
-        replayClient,
-        selectedProfiles,
-      );
-    } else {
-      await captureScreenshotSet(
-        deviceClient,
-        replayClient,
-        selectedProfiles,
-        options.prefix,
-      );
-    }
-  } finally {
-    if (replayClient) {
-      replayClient.close();
-    }
-
-    if (replayBrowser) {
-      await closeReplayBrowser(replayBrowser);
-    }
-
-    if (deviceClient) {
-      deviceClient.close();
-    }
-
-    if (localPort) {
-      try {
-        runAdb(['-s', deviceId, 'forward', '--remove', `tcp:${localPort}`]);
-      } catch {
-        // ADB may already have removed the temporary forwarding rule.
-      }
-    }
-  }
-}
-
-main().catch((error) => {
-  console.error(`Responsive screenshot failed: ${error.message}`);
-  process.exitCode = 1;
-});
+const fs = require('node:fs');
+const path = require('node:path');
+const readline = require('node:readline/promises');
+const { spawn, spawnSync } = require('node:child_process');
+
+const screenshotDirectory = path.join(__dirname, 'Auto-Screenshot', 'Store-image-Screenshot');
+const inFrameDirectory = path.join(__dirname, 'Auto-Screenshot', 'Store-image-Frame');
+const aiAssetsDirectory = path.join(__dirname, 'AI-Assets');
+const amazonAssetsDirectory = path.join(aiAssetsDirectory, 'Amazon-Assets');
+const samsungAssetsDirectory = path.join(aiAssetsDirectory, 'Samsung-Assets');
+const playstoreAssetsDirectory = path.join(aiAssetsDirectory, 'Playstore-Assets');
+const capacitorConfigPath = path.join(__dirname, 'capacitor.config.json');
+const amazonIconPath = path.join(__dirname, 'resources', 'icon-only.png');
+const temporaryDirectory = path.join(__dirname, 'agent-temp');
+const amazonAssetDefinitions = [
+  { fileName: 'icon-1280x720.png', type: 'icon', width: 1280, height: 720 },
+  { fileName: 'background-image-1920x1080.png', type: 'background-image', width: 1920, height: 1080 },
+  { fileName: 'featured-content-logo-640x260.png', type: 'featured-logo', width: 640, height: 260, transparent: true },
+  { fileName: 'featured-content-background-1920x720.png', type: 'featured-background', width: 1920, height: 720 },
+];
+const samsungAssetDefinitions = [
+  { fileName: 'edge-screen-160x2560.png', type: 'edge-screen', width: 160, height: 2560 },
+  { fileName: 'edge-screen-single-550x2560.png', type: 'edge-screen-single-plus', width: 550, height: 2560 },
+];
+const playstoreAssetDefinitions = [
+  { fileName: 'feature-graphic-1024x500.png', width: 1024, height: 500 },
+];
+const browserExecutablePaths = [
+  'C:\\Program Files\\Google\\Chrome\\Application\\chrome.exe',
+  'C:\\Program Files (x86)\\Google\\Chrome\\Application\\chrome.exe',
+  'C:\\Program Files\\Microsoft\\Edge\\Application\\msedge.exe',
+  'C:\\Program Files (x86)\\Microsoft\\Edge\\Application\\msedge.exe',
+];
+
+const deviceProfiles = [
+  {
+    name: 'android-phone',
+    label: 'Android phone',
+    outputDirectory: 'Android',
+    frameType: 'android-phone',
+    width: 360,
+    height: 800,
+    deviceScaleFactor: 3,
+    orientationSensitive: true,
+    mobile: true,
+  },
+  {
+    name: 'android-tablet-7-inch',
+    aliases: ['android-tablet'],
+    label: 'Android 7-inch Play Store tablet',
+    outputDirectory: 'Android-Tab-7inch',
+    frameType: 'tablet',
+    width: 675,
+    height: 1200,
+    deviceScaleFactor: 2,
+    framedWidth: 1350,
+    framedHeight: 2400,
+    orientationSensitive: true,
+    mobile: true,
+  },
+  {
+    name: 'android-tablet-10-inch',
+    label: 'Android 10-inch Play Store tablet',
+    outputDirectory: 'Android-Tab-10inch',
+    frameType: 'tablet',
+    width: 900,
+    height: 1600,
+    deviceScaleFactor: 2,
+    framedWidth: 1800,
+    framedHeight: 3200,
+    orientationSensitive: true,
+    mobile: true,
+  },
+  {
+    name: 'iphone',
+    label: 'iPhone 6.9-inch App Store viewport',
+    outputDirectory: 'iPhone',
+    frameType: 'iphone',
+    width: 440,
+    height: 956,
+    deviceScaleFactor: 3,
+    framedWidth: 1284,
+    framedHeight: 2778,
+    orientationSensitive: true,
+    mobile: true,
+  },
+  {
+    name: 'ipad',
+    label: 'iPad 13-inch App Store viewport',
+    outputDirectory: 'iPad',
+    frameType: 'tablet',
+    width: 1032,
+    height: 1376,
+    deviceScaleFactor: 2,
+    framedWidth: 2048,
+    framedHeight: 2732,
+    orientationSensitive: true,
+    mobile: true,
+  },
+  {
+    name: 'apple-vision-pro',
+    label: 'Apple Vision Pro',
+    outputDirectory: 'Apple-Vision-Pro',
+    frameType: 'apple-vision-pro',
+    width: 3840,
+    height: 2160,
+    deviceScaleFactor: 1,
+    framedWidth: 3840,
+    framedHeight: 2160,
+    mobile: false,
+  },
+  {
+    name: 'apple-tv',
+    label: 'Apple TV',
+    outputDirectory: 'Apple-TV',
+    frameType: 'apple-tv',
+    width: 1920,
+    height: 1080,
+    deviceScaleFactor: 1,
+    framedWidth: 1920,
+    framedHeight: 1080,
+    mobile: false,
+  },
+  {
+    name: 'apple-watch',
+    label: 'Apple Watch Ultra 3',
+    outputDirectory: 'Apple-Watch',
+    frameType: 'apple-watch',
+    width: 422,
+    height: 514,
+    deviceScaleFactor: 1,
+    framedWidth: 422,
+    framedHeight: 514,
+    mobile: true,
+  },
+  {
+    name: 'amazon-mobile',
+    label: 'Amazon mobile store viewport',
+    outputDirectory: 'Amazon-Phone',
+    frameType: 'android-phone',
+    width: 360,
+    height: 640,
+    deviceScaleFactor: 3,
+    orientationSensitive: true,
+    mobile: true,
+  },
+  {
+    name: 'amazon-fire-tablet',
+    label: 'Amazon Fire tablet store viewport',
+    outputDirectory: 'Amazon-Tab',
+    frameType: 'tablet',
+    width: 800,
+    height: 1280,
+    deviceScaleFactor: 2,
+    orientationSensitive: true,
+    mobile: true,
+  },
+  {
+    name: 'amazon-fire-tv',
+    label: 'Amazon Fire TV store viewport',
+    outputDirectory: 'Amazon-TV',
+    frameType: 'tv',
+    width: 1920,
+    height: 1080,
+    deviceScaleFactor: 1,
+    mobile: false,
+  },
+  {
+    name: 'android-tv',
+    label: 'Android TV',
+    outputDirectory: 'Android-TV',
+    frameType: 'tv',
+    width: 1920,
+    height: 1080,
+    deviceScaleFactor: 1,
+    mobile: false,
+  },
+  {
+    name: 'chromebook',
+    label: 'Chromebook 4K Play Store viewport',
+    outputDirectory: 'Chromebook',
+    frameType: 'laptop',
+    width: 1920,
+    height: 1080,
+    deviceScaleFactor: 2,
+    framedWidth: 3840,
+    framedHeight: 2160,
+    mobile: false,
+  },
+  {
+    name: 'android-xr',
+    label: 'Android XR 2D panel approximation',
+    outputDirectory: 'Android-XR',
+    frameType: 'xr',
+    width: 1920,
+    height: 1080,
+    deviceScaleFactor: 1,
+    mobile: false,
+  },
+  {
+    name: 'mac',
+    label: 'Mac-sized viewport',
+    outputDirectory: 'Mac',
+    frameType: 'laptop',
+    width: 1440,
+    height: 900,
+    deviceScaleFactor: 2,
+    mobile: false,
+  },
+];
+
+function getConfiguredOrientation() {
+  const config = JSON.parse(fs.readFileSync(capacitorConfigPath, 'utf8'));
+  return String(config.android?.ORIENTATION || 'portrait').toLowerCase() === 'landscape'
+    ? 'landscape'
+    : 'portrait';
+}
+
+function orientProfile(profile, orientation) {
+  if (orientation !== 'landscape' || !profile.orientationSensitive) {
+    return profile;
+  }
+
+  return {
+    ...profile,
+    width: profile.height,
+    height: profile.width,
+    framedWidth: profile.framedHeight,
+    framedHeight: profile.framedWidth,
+  };
+}
+
+function runAdb(args, options = {}) {
+  const result = spawnSync('adb', args, {
+    encoding: 'utf8',
+    timeout: 30000,
+    windowsHide: true,
+    ...options,
+  });
+
+  if (result.error) {
+    if (result.error.code === 'ENOENT') {
+      throw new Error('ADB was not found. Add Android platform-tools to your PATH.');
+    }
+
+    if (result.error.code === 'ETIMEDOUT') {
+      throw new Error('ADB did not respond within 30 seconds. Check the device connection.');
+    }
+
+    throw result.error;
+  }
+
+  if (result.status !== 0) {
+    throw new Error(result.stderr.trim() || `ADB exited with code ${result.status}.`);
+  }
+
+  return result.stdout.trim();
+}
+
+function getConnectedDevice() {
+  const devices = runAdb(['devices'])
+    .split(/\r?\n/)
+    .map((line) => line.match(/^(\S+)\s+device$/))
+    .filter(Boolean)
+    .map((match) => match[1]);
+
+  if (!devices.length) {
+    throw new Error('no_connected_device');
+  }
+
+  return devices[0];
+}
+
+function getAppId() {
+  const config = JSON.parse(fs.readFileSync(capacitorConfigPath, 'utf8'));
+
+  if (!config.appId) {
+    throw new Error('capacitor.config.json does not contain an appId.');
+  }
+
+  return config.appId;
+}
+
+function getWebViewSocket(deviceId, appId) {
+  const processIds = runAdb(['-s', deviceId, 'shell', 'pidof', appId])
+    .split(/\s+/)
+    .filter(Boolean);
+
+  if (!processIds.length) {
+    throw new Error(`The app process is not running: ${appId}`);
+  }
+
+  const sockets = runAdb(['-s', deviceId, 'shell', 'cat', '/proc/net/unix']);
+
+  for (const processId of processIds) {
+    const socketName = `webview_devtools_remote_${processId}`;
+
+    if (sockets.includes(`@${socketName}`)) {
+      return socketName;
+    }
+  }
+
+  throw new Error(
+    'The running app does not expose a debuggable WebView. Use a debug/live-reload build with WebView debugging enabled.',
+  );
+}
+
+function sanitizeName(input, fallback) {
+  const sanitized = input
+    .trim()
+    .replace(/[<>:"/\\|?*\u0000-\u001F]/g, '_')
+    .replace(/[. ]+$/g, '');
+
+  return sanitized || fallback;
+}
+
+function getSelectedOutputDirectories(selectedProfiles) {
+  return [...new Set(selectedProfiles.flatMap((profile) => ([
+    path.join(screenshotDirectory, profile.outputDirectory),
+    path.join(inFrameDirectory, profile.outputDirectory),
+  ])))];
+}
+
+function getNextNumberedFileName(selectedProfiles) {
+  const highestNumber = getSelectedOutputDirectories(selectedProfiles)
+    .filter((directory) => fs.existsSync(directory))
+    .reduce((highestAcrossDirectories, directory) => {
+      const highestInDirectory = fs.readdirSync(directory, { withFileTypes: true })
+        .filter((entry) => entry.isFile())
+        .reduce((highest, entry) => {
+          const match = entry.name.match(/^(\d+)\.png$/i);
+          return match ? Math.max(highest, Number(match[1])) : highest;
+        }, 0);
+
+      return Math.max(highestAcrossDirectories, highestInDirectory);
+    }, 0);
+
+  return `${highestNumber + 1}.png`;
+}
+
+function getUniqueFileName(prefix, selectedProfiles) {
+  const outputDirectories = getSelectedOutputDirectories(selectedProfiles);
+  let fileName = `${prefix}.png`;
+  let duplicateNumber = 2;
+
+  while (outputDirectories.some((directory) => (
+    fs.existsSync(path.join(directory, fileName))
+  ))) {
+    fileName = `${prefix}-${duplicateNumber}.png`;
+    duplicateNumber += 1;
+  }
+
+  return fileName;
+}
+
+function getScreenshotFileName(fileNameInput, selectedProfiles) {
+  const inputWithoutExtension = fileNameInput.trim().replace(/\.png$/i, '');
+
+  if (!inputWithoutExtension) {
+    return getNextNumberedFileName(selectedProfiles);
+  }
+
+  let prefix = sanitizeName(inputWithoutExtension, '');
+
+  if (!prefix) {
+    return getNextNumberedFileName(selectedProfiles);
+  }
+
+  if (/^(con|prn|aux|nul|com[1-9]|lpt[1-9])$/i.test(prefix)) {
+    prefix = `${prefix}_`;
+  }
+
+  return getUniqueFileName(prefix, selectedProfiles);
+}
+
+function parseArguments() {
+  const args = process.argv.slice(2);
+  const options = {
+    amazonAssets: false,
+    samsungAssets: false,
+    dryRun: false,
+    frameExisting: false,
+    help: false,
+    list: false,
+    prefix: '',
+    profiles: '',
+  };
+
+  for (let index = 0; index < args.length; index += 1) {
+    const argument = args[index];
+
+    if (argument === '--amazon-assets') {
+      options.amazonAssets = true;
+    } else if (argument === '--samsung-assets') {
+      options.samsungAssets = true;
+    } else if (argument === '--dry-run') {
+      options.dryRun = true;
+    } else if (argument === '--frame-existing') {
+      options.frameExisting = true;
+    } else if (argument === '--help' || argument === '-h') {
+      options.help = true;
+    } else if (argument === '--list') {
+      options.list = true;
+    } else if (argument === '--prefix') {
+      options.prefix = args[index + 1] || '';
+      index += 1;
+    } else if (argument === '--profiles') {
+      options.profiles = args[index + 1] || '';
+      index += 1;
+    } else {
+      throw new Error(`Unknown argument: ${argument}`);
+    }
+  }
+
+  return options;
+}
+
+function printProfiles() {
+  const orientation = getConfiguredOrientation();
+
+  for (const baseProfile of deviceProfiles) {
+    const profile = orientProfile(baseProfile, orientation);
+    const outputWidth = profile.width * profile.deviceScaleFactor;
+    const outputHeight = profile.height * profile.deviceScaleFactor;
+    const framedSize = profile.framedWidth
+      ? `, framed PNG ${profile.framedWidth}x${profile.framedHeight}`
+      : '';
+    console.log(
+      `${profile.name.padEnd(15)} ${profile.label} `
+      + `(folder ${profile.outputDirectory}, viewport ${profile.width}x${profile.height}, `
+      + `PNG ${outputWidth}x${outputHeight}${framedSize})`,
+    );
+  }
+}
+
+function printHelp() {
+  console.log('Capture the current live Android WebView at multiple responsive viewport sizes.');
+  console.log('');
+  console.log('Usage:');
+  console.log('  node take-screen-image.js');
+  console.log('  node take-screen-image.js --profiles iphone,ipad');
+  console.log('  node take-screen-image.js --prefix home --profiles android-phone,ipad');
+  console.log('  node take-screen-image.js --frame-existing');
+  console.log('  node take-screen-image.js --amazon-assets');
+  console.log('  node take-screen-image.js --samsung-assets');
+  console.log('  node take-screen-image.js --dry-run');
+  console.log('  node take-screen-image.js --list');
+  console.log('');
+  console.log('A normal capture automatically creates any missing Amazon, Samsung, and Play Store assets.');
+}
+
+function selectProfiles(input) {
+  const orientation = getConfiguredOrientation();
+  const names = input
+    .split(',')
+    .map((name) => name.trim().toLowerCase())
+    .filter(Boolean);
+
+  if (!names.length || names.includes('all')) {
+    return deviceProfiles.map((profile) => orientProfile(profile, orientation));
+  }
+
+  const selectedProfiles = names.map((name) => {
+    const profile = deviceProfiles.find((candidate) => (
+      candidate.name === name || candidate.aliases?.includes(name)
+    ));
+
+    if (!profile) {
+      throw new Error(`Unknown profile: ${name}. Run with --list to see valid profiles.`);
+    }
+
+    return profile;
+  });
+
+  return [...new Map(selectedProfiles.map((profile) => [profile.name, profile])).values()]
+    .map((profile) => orientProfile(profile, orientation));
+}
+
+class CdpClient {
+  constructor(webSocketUrl) {
+    this.nextId = 1;
+    this.pendingCommands = new Map();
+    this.socket = new WebSocket(webSocketUrl);
+  }
+
+  connect() {
+    return new Promise((resolve, reject) => {
+      const timeout = setTimeout(() => {
+        reject(new Error('Timed out while connecting to the app WebView.'));
+      }, 10000);
+
+      this.socket.addEventListener('open', () => {
+        clearTimeout(timeout);
+        resolve();
+      }, { once: true });
+
+      this.socket.addEventListener('error', () => {
+        clearTimeout(timeout);
+        reject(new Error('Could not connect to the app WebView debugging socket.'));
+      }, { once: true });
+
+      this.socket.addEventListener('message', (event) => {
+        const message = JSON.parse(event.data);
+
+        if (!message.id || !this.pendingCommands.has(message.id)) {
+          return;
+        }
+
+        const pendingCommand = this.pendingCommands.get(message.id);
+        this.pendingCommands.delete(message.id);
+
+        if (message.error) {
+          pendingCommand.reject(new Error(message.error.message));
+        } else {
+          pendingCommand.resolve(message.result);
+        }
+      });
+
+      this.socket.addEventListener('close', () => {
+        for (const pendingCommand of this.pendingCommands.values()) {
+          pendingCommand.reject(new Error('The app WebView debugging connection closed.'));
+        }
+
+        this.pendingCommands.clear();
+      });
+    });
+  }
+
+  send(method, params = {}) {
+    return new Promise((resolve, reject) => {
+      const id = this.nextId;
+      this.nextId += 1;
+      this.pendingCommands.set(id, { resolve, reject });
+      this.socket.send(JSON.stringify({ id, method, params }));
+    });
+  }
+
+  close() {
+    this.socket.close();
+  }
+}
+
+async function getWebViewTarget(localPort) {
+  const response = await fetch(`http://127.0.0.1:${localPort}/json/list`);
+
+  if (!response.ok) {
+    throw new Error(`WebView target discovery failed with HTTP ${response.status}.`);
+  }
+
+  const targets = await response.json();
+  const pageTargets = targets.filter((target) => (
+    target.type === 'page'
+    && target.webSocketDebuggerUrl
+    && target.url !== 'about:blank'
+  ));
+
+  const visibleTarget = pageTargets.find((target) => {
+    try {
+      return JSON.parse(target.description || '{}').visible !== false;
+    } catch {
+      return true;
+    }
+  });
+
+  const target = visibleTarget || pageTargets[0];
+
+  if (!target) {
+    throw new Error('No rendered page was found in the app WebView.');
+  }
+
+  return target;
+}
+
+async function getPageDetails(client) {
+  const evaluation = await client.send('Runtime.evaluate', {
+    expression: `JSON.stringify({
+      title: document.title,
+      url: location.href,
+      width: innerWidth,
+      height: innerHeight,
+      devicePixelRatio: devicePixelRatio,
+      readyState: document.readyState
+    })`,
+    returnByValue: true,
+  });
+
+  return JSON.parse(evaluation.result.value);
+}
+
+async function capturePageSnapshot(client) {
+  const evaluation = await client.send('Runtime.evaluate', {
+    expression: `(async () => {
+      const clonedRoot = document.documentElement.cloneNode(true);
+      const originalElements = [
+        document.documentElement,
+        ...document.documentElement.querySelectorAll('*'),
+      ];
+      const clonedElements = [clonedRoot, ...clonedRoot.querySelectorAll('*')];
+
+      const blobToDataUrl = (blob) => new Promise((resolve, reject) => {
+        const reader = new FileReader();
+        reader.onload = () => resolve(reader.result);
+        reader.onerror = () => reject(reader.error);
+        reader.readAsDataURL(blob);
+      });
+
+      const imageToDataUrl = (element) => {
+        const width = element.naturalWidth || element.clientWidth;
+        const height = element.naturalHeight || element.clientHeight;
+
+        if (!width || !height) return '';
+
+        const canvas = document.createElement('canvas');
+        canvas.width = width;
+        canvas.height = height;
+        canvas.getContext('2d').drawImage(element, 0, 0, width, height);
+        return canvas.toDataURL('image/png');
+      };
+
+      for (let index = 0; index < originalElements.length; index += 1) {
+        const original = originalElements[index];
+        const clone = clonedElements[index];
+
+        if (!clone) continue;
+
+        if (original.scrollTop || original.scrollLeft) {
+          clone.setAttribute('data-responsive-scroll-top', String(original.scrollTop));
+          clone.setAttribute('data-responsive-scroll-left', String(original.scrollLeft));
+        }
+
+        if (original.classList.contains('swiper-initialized')) {
+          clone.setAttribute('data-responsive-swiper-width', String(original.clientWidth));
+          clone.setAttribute('data-responsive-swiper-height', String(original.clientHeight));
+        }
+
+        if (original instanceof HTMLInputElement) {
+          clone.setAttribute('value', original.value);
+          clone.toggleAttribute('checked', original.checked);
+        } else if (original instanceof HTMLTextAreaElement) {
+          clone.textContent = original.value;
+        } else if (original instanceof HTMLSelectElement) {
+          for (let optionIndex = 0; optionIndex < original.options.length; optionIndex += 1) {
+            clone.options[optionIndex].selected = original.options[optionIndex].selected;
+          }
+        } else if (original instanceof HTMLCanvasElement) {
+          try {
+            clone.style.setProperty(
+              'background-image',
+              'url("' + original.toDataURL('image/png') + '")',
+              'important',
+            );
+            clone.style.setProperty('background-position', 'center', 'important');
+            clone.style.setProperty('background-repeat', 'no-repeat', 'important');
+            clone.style.setProperty('background-size', '100% 100%', 'important');
+          } catch {
+            // Keep the canvas element when its pixels cannot be exported.
+          }
+        } else if (original instanceof HTMLVideoElement && original.readyState >= 2) {
+          try {
+            const replacement = document.createElement('img');
+            replacement.src = imageToDataUrl(original);
+            replacement.alt = original.getAttribute('aria-label') || '';
+            replacement.setAttribute('style', original.getAttribute('style') || '');
+            clone.replaceWith(replacement);
+          } catch {
+            clone.setAttribute('poster', original.poster || '');
+          }
+        } else if (original instanceof HTMLImageElement && original.complete) {
+          try {
+            clone.setAttribute('src', imageToDataUrl(original) || original.currentSrc || original.src);
+            clone.removeAttribute('srcset');
+          } catch {
+            clone.setAttribute('src', original.currentSrc || original.src);
+          }
+        }
+      }
+
+      const stylesheetLinks = [...document.querySelectorAll('link[rel="stylesheet"]')];
+      const clonedStylesheetLinks = [...clonedRoot.querySelectorAll('link[rel="stylesheet"]')];
+
+      await Promise.all(stylesheetLinks.map(async (link, index) => {
+        try {
+          const response = await fetch(link.href);
+          if (!response.ok) return;
+
+          const cssText = (await response.text()).replace(
+            /url\\(\\s*(['"]?)(?!data:|blob:|#)([^'"\\)]+)\\1\\s*\\)/gi,
+            (match, quote, resourceUrl) => {
+              try {
+                return 'url("' + new URL(resourceUrl.trim(), link.href).href + '")';
+              } catch {
+                return match;
+              }
+            },
+          );
+          const style = document.createElement('style');
+          style.textContent = cssText;
+          clonedStylesheetLinks[index].replaceWith(style);
+        } catch {
+          clonedStylesheetLinks[index].href = link.href;
+        }
+      }));
+
+      clonedRoot.querySelectorAll('script, link[rel="modulepreload"]').forEach((element) => element.remove());
+      clonedRoot.querySelectorAll('meta[http-equiv="Content-Security-Policy"]').forEach(
+        (element) => element.remove(),
+      );
+
+      const base = document.createElement('base');
+      base.href = location.href;
+      clonedRoot.querySelector('head').prepend(base);
+
+      const replayStyle = document.createElement('style');
+      replayStyle.textContent = [
+        '*,*::before,*::after{animation-play-state:paused!important;}',
+        '*{scrollbar-width:none!important;}',
+        '*::-webkit-scrollbar{width:0!important;height:0!important;display:none!important;}',
+      ].join('');
+      clonedRoot.querySelector('head').append(replayStyle);
+
+      return {
+        html: '<!doctype html>' + clonedRoot.outerHTML,
+        scrollY,
+      };
+    })()`,
+    awaitPromise: true,
+    returnByValue: true,
+  });
+
+  if (evaluation.exceptionDetails) {
+    throw new Error('The current WebView page could not be serialized.');
+  }
+
+  return evaluation.result.value;
+}
+
+function findBrowserExecutable() {
+  const executablePath = browserExecutablePaths.find((candidate) => (
+    fs.existsSync(candidate)
+  ));
+
+  if (!executablePath) {
+    throw new Error('Google Chrome or Microsoft Edge was not found on this computer.');
+  }
+
+  return executablePath;
+}
+
+function delay(milliseconds) {
+  return new Promise((resolve) => setTimeout(resolve, milliseconds));
+}
+
+async function launchReplayBrowser() {
+  fs.mkdirSync(temporaryDirectory, { recursive: true });
+
+  const profileDirectory = path.join(
+    temporaryDirectory,
+    `responsive-screenshot-chrome-${process.pid}-${Date.now()}`,
+  );
+  fs.mkdirSync(profileDirectory, { recursive: true });
+
+  const browserProcess = spawn(findBrowserExecutable(), [
+    '--headless=new',
+    '--remote-debugging-port=0',
+    `--user-data-dir=${profileDirectory}`,
+    '--no-first-run',
+    '--no-default-browser-check',
+    '--disable-background-networking',
+    '--remote-allow-origins=*',
+    'about:blank',
+  ], {
+    stdio: 'ignore',
+    windowsHide: true,
+  });
+
+  const activePortPath = path.join(profileDirectory, 'DevToolsActivePort');
+  const deadline = Date.now() + 15000;
+
+  while (!fs.existsSync(activePortPath)) {
+    if (browserProcess.exitCode !== null) {
+      throw new Error('The local replay browser closed before it was ready.');
+    }
+
+    if (Date.now() >= deadline) {
+      browserProcess.kill();
+      throw new Error('Timed out while starting the local replay browser.');
+    }
+
+    await delay(100);
+  }
+
+  const [port] = fs.readFileSync(activePortPath, 'utf8').trim().split(/\r?\n/);
+  const versionResponse = await fetch(`http://127.0.0.1:${port}/json/version`);
+  const version = await versionResponse.json();
+  const client = new CdpClient(version.webSocketDebuggerUrl);
+  await client.connect();
+
+  return {
+    browserProcess,
+    client,
+    port,
+    profileDirectory,
+  };
+}
+
+async function createReplayPage(browser) {
+  const createdTarget = await browser.client.send('Target.createTarget', {
+    url: 'about:blank',
+  });
+  const deadline = Date.now() + 10000;
+
+  while (Date.now() < deadline) {
+    const response = await fetch(`http://127.0.0.1:${browser.port}/json/list`);
+    const targets = await response.json();
+    const target = targets.find((candidate) => candidate.id === createdTarget.targetId);
+
+    if (target && target.webSocketDebuggerUrl) {
+      const client = new CdpClient(target.webSocketDebuggerUrl);
+      await client.connect();
+      await client.send('Page.enable');
+      await client.send('Runtime.enable');
+      return client;
+    }
+
+    await delay(100);
+  }
+
+  throw new Error('The local replay page did not become available.');
+}
+
+function removeTemporaryBrowserProfile(profileDirectory) {
+  const resolvedTemporaryRoot = path.resolve(temporaryDirectory);
+  const resolvedProfileDirectory = path.resolve(profileDirectory);
+
+  if (!resolvedProfileDirectory.startsWith(`${resolvedTemporaryRoot}${path.sep}`)) {
+    throw new Error('Refusing to remove a browser profile outside agent-temp.');
+  }
+
+  fs.rmSync(resolvedProfileDirectory, { recursive: true, force: true });
+}
+
+async function closeReplayBrowser(browser) {
+  try {
+    await browser.client.send('Browser.close');
+  } catch {
+    // Closing the browser can close the protocol connection before it acknowledges.
+  }
+
+  const deadline = Date.now() + 3000;
+
+  while (browser.browserProcess.exitCode === null && Date.now() < deadline) {
+    await delay(100);
+  }
+
+  if (browser.browserProcess.exitCode === null) {
+    browser.browserProcess.kill();
+    await delay(200);
+  }
+
+  browser.client.close();
+
+  for (let attempt = 1; attempt <= 5; attempt += 1) {
+    try {
+      removeTemporaryBrowserProfile(browser.profileDirectory);
+      return;
+    } catch (error) {
+      if (attempt === 5) {
+        throw error;
+      }
+
+      await delay(200);
+    }
+  }
+}
+
+async function waitForReplayLayout(client, snapshot) {
+  const evaluation = await client.send('Runtime.evaluate', {
+    expression: `(async () => {
+      const assetWait = Promise.all([...document.images].map((image) => {
+        if (image.complete) return Promise.resolve();
+        return new Promise((resolve) => {
+          image.addEventListener('load', resolve, { once: true });
+          image.addEventListener('error', resolve, { once: true });
+        });
+      }));
+
+      await Promise.race([
+        Promise.all([document.fonts.ready, assetWait]),
+        new Promise((resolve) => setTimeout(resolve, 5000)),
+      ]);
+
+      document.querySelectorAll('[data-responsive-swiper-width]').forEach((swiper) => {
+        const wrapper = [...swiper.children].find((element) => (
+          element.classList.contains('swiper-wrapper')
+        ));
+
+        if (!wrapper) return;
+
+        const slides = [...wrapper.children].filter((element) => (
+          element.classList.contains('swiper-slide')
+        ));
+        const sourceWidth = Number(swiper.dataset.responsiveSwiperWidth);
+        const sourceHeight = Number(swiper.dataset.responsiveSwiperHeight);
+        const widthScale = sourceWidth > 0 ? swiper.clientWidth / sourceWidth : 1;
+        const heightScale = sourceHeight > 0 ? swiper.clientHeight / sourceHeight : 1;
+        const isVertical = swiper.classList.contains('swiper-vertical');
+
+        slides.forEach((slide) => {
+          if (!slide.dataset.responsiveSwiperWidth && slide.style.width) {
+            slide.dataset.responsiveSwiperWidth = String(parseFloat(slide.style.width));
+          }
+
+          if (!slide.dataset.responsiveSwiperHeight && slide.style.height) {
+            slide.dataset.responsiveSwiperHeight = String(parseFloat(slide.style.height));
+          }
+
+          const slideWidth = Number(slide.dataset.responsiveSwiperWidth);
+          const slideHeight = Number(slide.dataset.responsiveSwiperHeight);
+
+          if (Number.isFinite(slideWidth) && slideWidth > 0) {
+            slide.style.width = (slideWidth * widthScale) + 'px';
+          }
+
+          if (isVertical && Number.isFinite(slideHeight) && slideHeight > 0) {
+            slide.style.height = (slideHeight * heightScale) + 'px';
+          }
+        });
+
+        const activeSlide = slides.find((slide) => (
+          slide.classList.contains('swiper-slide-active')
+        )) || slides[0];
+
+        if (!activeSlide) return;
+
+        const offset = isVertical ? activeSlide.offsetTop : activeSlide.offsetLeft;
+        const direction = getComputedStyle(swiper).direction;
+        const horizontalOffset = direction === 'rtl' ? offset : -offset;
+        const verticalOffset = isVertical ? -offset : 0;
+
+        wrapper.style.transitionDuration = '0ms';
+        wrapper.style.transform = 'translate3d('
+          + (isVertical ? 0 : horizontalOffset) + 'px, '
+          + verticalOffset + 'px, 0px)';
+
+        if (swiper.classList.contains('swiper-autoheight')) {
+          wrapper.style.height = activeSlide.scrollHeight + 'px';
+        }
+      });
+
+      document.querySelectorAll('[data-responsive-scroll-top]').forEach((element) => {
+        element.scrollTop = Number(element.dataset.responsiveScrollTop);
+        element.scrollLeft = Number(element.dataset.responsiveScrollLeft);
+      });
+      scrollTo(0, ${Number(snapshot.scrollY) || 0});
+
+      await new Promise((resolve) => requestAnimationFrame(() => requestAnimationFrame(resolve)));
+
+      return {
+        documentWidth: Math.max(document.documentElement.scrollWidth, document.body.scrollWidth),
+        viewportWidth: innerWidth,
+      };
+    })()`,
+    awaitPromise: true,
+    returnByValue: true,
+  });
+
+  return evaluation.result.value;
+}
+
+function getFrameAdornment(frameType) {
+  if (frameType === 'iphone') {
+    return '<div class="dynamic-island"></div>';
+  }
+
+  if (frameType === 'android-phone') {
+    return '<div class="camera-dot"></div>';
+  }
+
+  if (frameType === 'tablet') {
+    return '<div class="tablet-camera"></div>';
+  }
+
+  if (frameType === 'tv' || frameType === 'apple-tv') {
+    return '<div class="tv-stand"></div>';
+  }
+
+  if (frameType === 'apple-watch') {
+    return '<div class="watch-crown"></div><div class="watch-button"></div>';
+  }
+
+  if (frameType === 'apple-vision-pro') {
+    return '<div class="vision-sensor vision-sensor-left"></div><div class="vision-sensor vision-sensor-right"></div>';
+  }
+
+  if (frameType === 'laptop') {
+    return '<div class="laptop-camera"></div><div class="laptop-base"></div>';
+  }
+
+  return '<div class="xr-status"></div>';
+}
+
+function createDeviceFrameHtml(profile, screenshotBuffer) {
+  const screenshotDataUrl = `data:image/png;base64,${screenshotBuffer.toString('base64')}`;
+  const aspectRatio = `${profile.width} / ${profile.height}`;
+
+  return `<!doctype html>
+<html>
+<head>
+  <meta charset="utf-8" />
+  <style>
+    * { box-sizing: border-box; }
+    html, body { width: 100%; height: 100%; margin: 0; overflow: hidden; }
+    body {
+      display: grid;
+      place-items: center;
+      position: relative;
+      background:
+        radial-gradient(circle at 14% 18%, rgba(45, 213, 255, 0.24), transparent 30%),
+        radial-gradient(circle at 86% 82%, rgba(196, 255, 61, 0.16), transparent 28%),
+        linear-gradient(145deg, #111827 0%, #070b12 52%, #020409 100%);
+      font-family: Arial, sans-serif;
+    }
+    body::before {
+      content: '';
+      position: absolute;
+      inset: 0;
+      opacity: 0.18;
+      background-image:
+        linear-gradient(rgba(255,255,255,0.045) 1px, transparent 1px),
+        linear-gradient(90deg, rgba(255,255,255,0.045) 1px, transparent 1px);
+      background-size: 7vw 7vw;
+      mask-image: linear-gradient(to bottom, transparent, black 28%, black 72%, transparent);
+    }
+    .device {
+      position: relative;
+      z-index: 1;
+      aspect-ratio: ${aspectRatio};
+      background: linear-gradient(145deg, #566171 0%, #171c25 18%, #05070b 55%, #384252 100%);
+      border: clamp(2px, 0.45vw, 9px) solid #727d8d;
+      box-shadow:
+        0 4vh 9vh rgba(0, 0, 0, 0.68),
+        0 0 0 1px rgba(255, 255, 255, 0.18) inset,
+        0 0 5vh rgba(45, 213, 255, 0.12);
+    }
+    .screen {
+      position: relative;
+      width: 100%;
+      height: 100%;
+      overflow: hidden;
+      background: #05070b;
+      box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.95) inset;
+    }
+    .screen img {
+      display: block;
+      width: 100%;
+      height: 100%;
+      object-fit: cover;
+    }
+    .device.android-phone,
+    .device.iphone {
+      height: 87%;
+      padding: 1.25%;
+      border-radius: clamp(24px, 8vw, 70px);
+    }
+    .device.android-phone .screen,
+    .device.iphone .screen {
+      border-radius: clamp(19px, 6.7vw, 60px);
+    }
+    .camera-dot {
+      position: absolute;
+      z-index: 3;
+      top: 2.1%;
+      left: 50%;
+      width: clamp(5px, 1.8vw, 16px);
+      aspect-ratio: 1;
+      transform: translateX(-50%);
+      border-radius: 50%;
+      background: radial-gradient(circle at 36% 34%, #406891, #080b10 46%, #000 72%);
+      box-shadow: 0 0 0 2px #111827;
+    }
+    .dynamic-island {
+      position: absolute;
+      z-index: 3;
+      top: 2.2%;
+      left: 50%;
+      width: 29%;
+      height: 3.3%;
+      transform: translateX(-50%);
+      border-radius: 999px;
+      background: #000;
+      box-shadow: 0 0 0 1px rgba(255,255,255,0.05);
+    }
+    .device.tablet {
+      height: 86%;
+      padding: 1.05%;
+      border-radius: clamp(18px, 3.2vw, 48px);
+    }
+    .device.tablet .screen {
+      border-radius: clamp(13px, 2.5vw, 38px);
+    }
+    .device.apple-watch {
+      height: 82%;
+      padding: 2.2%;
+      border: clamp(3px, 1.4vw, 7px) solid #8b929b;
+      border-radius: 24% / 20%;
+      background: linear-gradient(145deg, #d5d8dc, #363b43 28%, #11151b 72%, #9299a2);
+    }
+    .device.apple-watch .screen {
+      border-radius: 20% / 17%;
+    }
+    .watch-crown {
+      position: absolute;
+      top: 24%;
+      right: -5.5%;
+      width: 5.5%;
+      height: 15%;
+      border-radius: 0 45% 45% 0;
+      background: linear-gradient(90deg, #303640, #a8afb7 55%, #424851);
+      box-shadow: 0 0.8vh 1.5vh rgba(0,0,0,0.45);
+    }
+    .watch-button {
+      position: absolute;
+      top: 43%;
+      right: -3.5%;
+      width: 3.5%;
+      height: 11%;
+      border-radius: 0 35% 35% 0;
+      background: #626a74;
+    }
+    .device.apple-vision-pro {
+      width: 82%;
+      padding: 0.72%;
+      border: clamp(4px, 0.45vw, 18px) solid rgba(201, 214, 224, 0.92);
+      border-radius: 14% / 32%;
+      background: linear-gradient(145deg, #dce5eb, #55616d 25%, #151b22 72%, #aebac3);
+      box-shadow:
+        0 5vh 11vh rgba(0,0,0,0.68),
+        0 0 5vh rgba(180,225,255,0.2),
+        0 0 0 1px rgba(255,255,255,0.4) inset;
+    }
+    .device.apple-vision-pro .screen {
+      border-radius: 13% / 29%;
+    }
+    .vision-sensor {
+      position: absolute;
+      z-index: 3;
+      top: 48%;
+      width: clamp(8px, 0.8vw, 30px);
+      aspect-ratio: 1;
+      border-radius: 50%;
+      background: radial-gradient(circle at 38% 35%, #567793, #05080c 55%, #000 75%);
+      box-shadow: 0 0 0 2px rgba(147,166,181,0.55);
+    }
+    .vision-sensor-left { left: 3.2%; }
+    .vision-sensor-right { right: 3.2%; }
+    .tablet-camera,
+    .laptop-camera {
+      position: absolute;
+      z-index: 3;
+      top: 0.48%;
+      left: 50%;
+      width: clamp(3px, 0.55vw, 10px);
+      aspect-ratio: 1;
+      transform: translateX(-50%);
+      border-radius: 50%;
+      background: #080b10;
+      box-shadow: 0 0 0 1px #526071;
+    }
+    .device.tv,
+    .device.apple-tv {
+      width: 82%;
+      padding: 0.62%;
+      border-radius: clamp(8px, 1.1vw, 24px);
+      transform: translateY(-4%);
+    }
+    .device.tv .screen,
+    .device.apple-tv .screen { border-radius: clamp(4px, 0.55vw, 12px); }
+    .tv-stand {
+      position: absolute;
+      z-index: -1;
+      left: 50%;
+      bottom: -13%;
+      width: 24%;
+      height: 13%;
+      transform: translateX(-50%);
+      background: linear-gradient(90deg, #11161f, #697383 50%, #11161f);
+      clip-path: polygon(42% 0, 58% 0, 67% 76%, 94% 86%, 100% 100%, 0 100%, 6% 86%, 33% 76%);
+      filter: drop-shadow(0 1.5vh 1.5vh rgba(0,0,0,0.55));
+    }
+    .device.laptop {
+      width: 82%;
+      padding: 0.75% 0.75% 1.15%;
+      border-radius: clamp(8px, 1.2vw, 24px);
+      transform: translateY(-3%);
+    }
+    .device.laptop .screen { border-radius: clamp(4px, 0.55vw, 12px); }
+    .laptop-base {
+      position: absolute;
+      z-index: -1;
+      left: 50%;
+      bottom: -7.5%;
+      width: 112%;
+      height: 8%;
+      transform: translateX(-50%);
+      border-radius: 0 0 50% 50% / 0 0 70% 70%;
+      background: linear-gradient(#697383, #202631 45%, #090c11);
+      box-shadow: 0 1.5vh 2vh rgba(0,0,0,0.48);
+    }
+    .device.xr {
+      width: 82%;
+      padding: 0.58%;
+      border: clamp(2px, 0.32vw, 7px) solid rgba(128, 230, 255, 0.9);
+      border-radius: clamp(18px, 2.5vw, 48px);
+      background: rgba(13, 22, 34, 0.82);
+      box-shadow:
+        0 4vh 10vh rgba(0,0,0,0.65),
+        0 0 7vh rgba(45,213,255,0.34),
+        0 0 0 1px rgba(255,255,255,0.22) inset;
+    }
+    .device.xr .screen { border-radius: clamp(13px, 2vw, 38px); }
+    .xr-status {
+      position: absolute;
+      top: -2.4%;
+      left: 50%;
+      width: 13%;
+      height: 1.1%;
+      transform: translateX(-50%);
+      border-radius: 999px;
+      background: #6fe8ff;
+      box-shadow: 0 0 1.8vh #2dd5ff;
+    }
+  </style>
+</head>
+<body>
+  <main class="device ${profile.frameType}">
+    <div class="screen"><img src="${screenshotDataUrl}" /></div>
+    ${getFrameAdornment(profile.frameType)}
+  </main>
+</body>
+</html>`;
+}
+
+function escapeHtml(value) {
+  return String(value)
+    .replace(/&/g, '&amp;')
+    .replace(/</g, '&lt;')
+    .replace(/>/g, '&gt;')
+    .replace(/"/g, '&quot;')
+    .replace(/'/g, '&#39;');
+}
+
+function cleanAssetCopy(value, maximumLength, fallback = '') {
+  const cleaned = String(value || '')
+    .replace(/<script\b[^>]*>[\s\S]*?<\/script>/gi, ' ')
+    .replace(/<style\b[^>]*>[\s\S]*?<\/style>/gi, ' ')
+    .replace(/<[^>]+>/g, ' ')
+    .replace(/&[a-zA-Z#0-9]+;/g, ' ')
+    .replace(/[_|]+/g, ' ')
+    .replace(/\s+/g, ' ')
+    .trim();
+  if (!cleaned) return fallback;
+  if (cleaned.length <= maximumLength) return cleaned;
+  const shortened = cleaned.slice(0, maximumLength + 1);
+  const lastSpace = shortened.lastIndexOf(' ');
+  return shortened.slice(0, lastSpace > maximumLength * 0.55 ? lastSpace : maximumLength).trim();
+}
+
+function readJsonAssetSource(filePath) {
+  try {
+    return JSON.parse(fs.readFileSync(filePath, 'utf8'));
+  } catch {
+    return {};
+  }
+}
+
+function collectProjectUiPhrases() {
+  const phrases = [];
+  const pageDirectory = path.join(__dirname, 'src', 'pages');
+  if (fs.existsSync(pageDirectory)) {
+    const pageFiles = fs.readdirSync(pageDirectory)
+      .filter((fileName) => /\.(?:f7|html)$/i.test(fileName))
+      .sort()
+      .slice(0, 40);
+    const visibleElementPattern = /<(?:h[1-4]|button|label|option|a|li)\b[^>]*>([\s\S]*?)<\/(?:h[1-4]|button|label|option|a|li)>/gi;
+    for (const fileName of pageFiles) {
+      const source = fs.readFileSync(path.join(pageDirectory, fileName), 'utf8');
+      let match;
+      while ((match = visibleElementPattern.exec(source)) && phrases.length < 120) {
+        const phrase = cleanAssetCopy(match[1], 52);
+        if (phrase) phrases.push(phrase);
+      }
+    }
+  }
+  return phrases;
+}
+
+function getStoreAssetCopy(config) {
+  const configuredAppName = cleanAssetCopy(config.appName, 40, 'App');
+  const appUniqueId = String(config.android?.APP_UNIQUE_ID ?? '').trim();
+  const promoCopyPath = appUniqueId
+    ? path.join(
+      __dirname,
+      'Auto-AI-Video',
+      `${appUniqueId}. ${sanitizeName(configuredAppName, 'App')}-promo-copy.json`,
+    )
+    : '';
+  const promoCopy = promoCopyPath && fs.existsSync(promoCopyPath)
+    ? readJsonAssetSource(promoCopyPath).copy || {}
+    : {};
+  const scenes = Array.isArray(promoCopy.scenes) ? promoCopy.scenes : [];
+  const footerKeywords = Array.isArray(promoCopy.footer_keywords)
+    ? promoCopy.footer_keywords
+    : [];
+  const manifestCandidates = [
+    path.join(__dirname, 'src', 'manifest.webmanifest'),
+    path.join(__dirname, 'public', 'manifest.webmanifest'),
+    path.join(__dirname, 'manifest.webmanifest'),
+  ];
+  const manifestPath = manifestCandidates.find((candidate) => fs.existsSync(candidate));
+  const manifest = manifestPath ? readJsonAssetSource(manifestPath) : {};
+  const candidates = [
+    ...footerKeywords,
+    ...scenes.flatMap((scene) => [
+      `${scene.title_line_1 || ''} ${scene.title_line_2 || ''}`,
+      scene.kicker,
+      scene.body,
+    ]),
+    ...(Array.isArray(manifest.categories) ? manifest.categories : []),
+    manifest.description,
+    ...collectProjectUiPhrases(),
+  ];
+  const uniquePhrases = [];
+  const seen = new Set([configuredAppName.toLowerCase()]);
+  for (const candidate of candidates) {
+    const phrase = cleanAssetCopy(candidate, 52);
+    const key = phrase.toLowerCase();
+    if (phrase.length < 3 || seen.has(key)) continue;
+    seen.add(key);
+    uniquePhrases.push(phrase);
+  }
+
+  const featureLabels = uniquePhrases
+    .map((phrase) => cleanAssetCopy(phrase, 18))
+    .filter((phrase, index, values) => (
+      phrase.length >= 3
+      && values.findIndex((value) => value.toLowerCase() === phrase.toLowerCase()) === index
+    ))
+    .slice(0, 9);
+  while (featureLabels.length < 9) {
+    featureLabels.push(`Feature ${String(featureLabels.length + 1).padStart(2, '0')}`);
+  }
+
+  const firstScene = scenes[0] || {};
+  const firstSceneTitle = cleanAssetCopy(
+    `${firstScene.title_line_1 || ''} ${firstScene.title_line_2 || ''}`,
+    34,
+  );
+  const primaryPhrase = footerKeywords[0] || featureLabels[0];
+  return {
+    amazonEyebrow: cleanAssetCopy(primaryPhrase, 32, `Explore ${configuredAppName}`),
+    amazonCallout: cleanAssetCopy(
+      firstScene.body || manifest.description || uniquePhrases[0],
+      52,
+      `Explore ${configuredAppName}`,
+    ),
+    featureLabels,
+    samsungKicker: cleanAssetCopy(firstScene.kicker || primaryPhrase, 28, 'App features'),
+    samsungAction: firstSceneTitle || cleanAssetCopy(primaryPhrase, 34, `Open ${configuredAppName}`),
+    samsungBody: cleanAssetCopy(
+      firstScene.body || manifest.description || uniquePhrases[1],
+      52,
+      'Explore the available features',
+    ),
+  };
+}
+
+function createAmazonAssetHtml(asset, appName, iconBuffer, storeCopy) {
+  const iconDataUrl = `data:image/png;base64,${iconBuffer.toString('base64')}`;
+  const safeAppName = escapeHtml(appName);
+  const safeEyebrow = escapeHtml(storeCopy.amazonEyebrow);
+  const safeCallout = escapeHtml(storeCopy.amazonCallout);
+  const featureMarkup = storeCopy.featureLabels.slice(0, 6)
+    .map((label) => `<span>${escapeHtml(label)}</span>`)
+    .join('');
+  const logoMarkup = asset.type === 'featured-logo'
+    ? `<main class="featured-logo"><img src="${iconDataUrl}" /><div><small>${safeEyebrow}</small><strong>${safeAppName}</strong></div></main>`
+    : '';
+  const iconMarkup = asset.type === 'icon'
+    ? `<main class="icon-card"><img src="${iconDataUrl}" /><div><small>${safeCallout}</small><strong>${safeAppName}</strong></div></main>`
+    : '';
+  const backgroundMarkup = asset.type.includes('background')
+    ? `<main class="background-art"><div class="pulse pulse-one"></div><div class="pulse pulse-two"></div><div class="feature-grid">${featureMarkup}</div></main>`
+    : '';
+
+  return `<!doctype html>
+<html>
+<head>
+  <meta charset="utf-8" />
+  <style>
+    * { box-sizing: border-box; }
+    html, body { width: 100%; height: 100%; margin: 0; overflow: hidden; }
+    body {
+      position: relative;
+      font-family: Arial, Helvetica, sans-serif;
+      color: #f8fbff;
+      background: transparent;
+    }
+    body.icon,
+    body.background-image,
+    body.featured-background {
+      background:
+        radial-gradient(circle at 16% 18%, rgba(52, 211, 235, 0.32), transparent 28%),
+        radial-gradient(circle at 82% 82%, rgba(201, 255, 65, 0.24), transparent 30%),
+        linear-gradient(135deg, #24113c 0%, #15152d 48%, #071725 100%);
+    }
+    body.icon::before,
+    body.background-image::before,
+    body.featured-background::before {
+      content: '';
+      position: absolute;
+      inset: 0;
+      opacity: 0.22;
+      background-image:
+        linear-gradient(rgba(255,255,255,0.07) 1px, transparent 1px),
+        linear-gradient(90deg, rgba(255,255,255,0.07) 1px, transparent 1px);
+      background-size: 72px 72px;
+    }
+    .icon-card {
+      position: relative;
+      z-index: 2;
+      width: 100%;
+      height: 100%;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      gap: 72px;
+      padding: 72px 110px;
+    }
+    .icon-card img {
+      width: 500px;
+      height: 500px;
+      object-fit: contain;
+      border-radius: 104px;
+      box-shadow: 0 38px 80px rgba(0,0,0,0.48), 0 0 70px rgba(52,211,235,0.2);
+    }
+    .icon-card div { display: flex; flex-direction: column; gap: 18px; }
+    .icon-card small,
+    .featured-logo small {
+      color: #35d4eb;
+      font-size: 24px;
+      font-weight: 700;
+      letter-spacing: 7px;
+    }
+    .icon-card strong { font-size: 86px; line-height: 0.96; max-width: 500px; }
+    .featured-logo {
+      width: 100%;
+      height: 100%;
+      display: flex;
+      align-items: center;
+      gap: 24px;
+      padding: 20px 26px;
+      color: #111827;
+    }
+    .featured-logo img {
+      width: 210px;
+      height: 210px;
+      object-fit: contain;
+      border-radius: 44px;
+    }
+    .featured-logo div { display: flex; min-width: 0; flex-direction: column; gap: 8px; }
+    .featured-logo small { font-size: 14px; letter-spacing: 3px; }
+    .featured-logo strong {
+      max-width: 360px;
+      overflow: hidden;
+      color: #ffffff;
+      font-size: 56px;
+      line-height: 1;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+      text-shadow: 0 3px 12px rgba(0,0,0,0.75);
+    }
+    .background-art { position: absolute; inset: 0; }
+    .pulse {
+      position: absolute;
+      border: 3px solid rgba(53,212,235,0.28);
+      border-radius: 50%;
+      box-shadow: 0 0 80px rgba(53,212,235,0.15);
+    }
+    .pulse-one { width: 520px; height: 520px; top: -180px; left: -110px; }
+    .pulse-two { width: 620px; height: 620px; right: -180px; bottom: -310px; border-color: rgba(201,255,65,0.22); }
+    .feature-grid {
+      position: absolute;
+      left: 8%;
+      right: 8%;
+      top: 50%;
+      display: grid;
+      grid-template-columns: repeat(2, minmax(0, 1fr));
+      gap: 24px;
+      transform: translateY(-50%);
+    }
+    .feature-grid span {
+      display: flex;
+      min-height: 108px;
+      align-items: center;
+      justify-content: center;
+      padding: 20px;
+      color: #f8fbff;
+      border: 2px solid rgba(255,255,255,0.17);
+      border-radius: 22px;
+      background: linear-gradient(145deg, rgba(42,55,75,0.96), rgba(11,18,29,0.96));
+      box-shadow: 0 20px 28px rgba(0,0,0,0.28);
+      font-size: clamp(20px, 2vw, 34px);
+      font-weight: 700;
+      text-align: center;
+    }
+    .feature-grid span:nth-child(3n+1) { border-top: 7px solid #35d4eb; }
+    .feature-grid span:nth-child(3n+2) { border-top: 7px solid #ff9f43; }
+    .feature-grid span:nth-child(3n) { border-top: 7px solid #c9ff41; }
+    body.featured-background .feature-grid { left: 5%; right: 5%; gap: 18px; }
+  </style>
+</head>
+<body class="${asset.type}">
+  ${iconMarkup}
+  ${logoMarkup}
+  ${backgroundMarkup}
+</body>
+</html>`;
+}
+
+function createPlaystoreFeatureHtml(appName, iconBuffer, storeCopy) {
+  const iconDataUrl = `data:image/png;base64,${iconBuffer.toString('base64')}`;
+  const safeAppName = escapeHtml(appName);
+  const safeCallout = escapeHtml(storeCopy.amazonCallout);
+  const featureMarkup = storeCopy.featureLabels.slice(0, 5)
+    .map((label, index) => `<span><i>0${index + 1}</i>${escapeHtml(label)}</span>`)
+    .join('');
+
+  return `<!doctype html>
+<html>
+<head>
+  <meta charset="utf-8" />
+  <style>
+    * { box-sizing: border-box; }
+    html, body { width: 100%; height: 100%; margin: 0; overflow: hidden; }
+    body {
+      display: flex;
+      align-items: center;
+      padding: 42px 64px;
+      color: #f7fbff;
+      background: radial-gradient(circle at 84% 18%, rgba(53,212,235,0.3), transparent 31%), linear-gradient(120deg, #111729, #231039 58%, #071522);
+      font-family: Arial, Helvetica, sans-serif;
+    }
+    main { display: flex; width: 100%; height: 100%; align-items: center; justify-content: space-between; gap: 48px; }
+    .copy { max-width: 570px; }
+    img { width: 128px; height: 128px; border-radius: 30px; object-fit: contain; }
+    small { display: block; margin-top: 24px; color: #35d4eb; font-size: 18px; font-weight: 700; letter-spacing: 4px; text-transform: uppercase; }
+    h1 { margin: 12px 0 18px; font-size: 64px; line-height: 0.98; }
+    p { margin: 0; color: #b8c5d4; font-size: 23px; line-height: 1.35; }
+    .features { display: grid; width: 340px; gap: 12px; }
+    .features span { display: flex; align-items: center; gap: 16px; padding: 17px 20px; border: 1px solid rgba(255,255,255,0.16); border-radius: 15px; background: rgba(8,16,28,0.6); font-size: 18px; font-weight: 700; }
+    .features i { color: #c9ff41; font-size: 13px; font-style: normal; }
+  </style>
+</head>
+<body><main><section class="copy"><img src="${iconDataUrl}" /><small>Explore ${safeAppName}</small><h1>${safeAppName}</h1><p>${safeCallout}</p></section><section class="features">${featureMarkup}</section></main></body>
+</html>`;
+}
+
+async function createPlaystoreAssets(client, skipExisting = false) {
+  if (!fs.existsSync(amazonIconPath)) {
+    throw new Error(`Play Store asset source icon was not found: ${amazonIconPath}`);
+  }
+
+  const config = JSON.parse(fs.readFileSync(capacitorConfigPath, 'utf8'));
+  const appName = config.appName || 'App';
+  const storeCopy = getStoreAssetCopy(config);
+  const iconBuffer = fs.readFileSync(amazonIconPath);
+  fs.mkdirSync(playstoreAssetsDirectory, { recursive: true });
+
+  for (const asset of playstoreAssetDefinitions) {
+    const outputPath = path.join(playstoreAssetsDirectory, asset.fileName);
+    if (skipExisting && fs.existsSync(outputPath)) continue;
+
+    await client.send('Emulation.setDeviceMetricsOverride', {
+      width: asset.width, height: asset.height, deviceScaleFactor: 1, mobile: false,
+      screenWidth: asset.width, screenHeight: asset.height, positionX: 0, positionY: 0,
+    });
+    const frameTree = await client.send('Page.getFrameTree');
+    await client.send('Page.setDocumentContent', {
+      frameId: frameTree.frameTree.frame.id,
+      html: createPlaystoreFeatureHtml(appName, iconBuffer, storeCopy),
+    });
+    await client.send('Runtime.evaluate', {
+      expression: `Promise.all([...document.images].map((image) => image.complete ? Promise.resolve() : new Promise((resolve) => image.addEventListener('load', resolve, { once: true })))).then(() => new Promise((resolve) => requestAnimationFrame(() => requestAnimationFrame(resolve))))`,
+      awaitPromise: true,
+      returnByValue: true,
+    });
+    const screenshot = await client.send('Page.captureScreenshot', {
+      format: 'png', fromSurface: true, captureBeyondViewport: false,
+    });
+    fs.writeFileSync(outputPath, Buffer.from(screenshot.data, 'base64'));
+    console.log(`Saved Play Store feature ${asset.width}x${asset.height}: ${outputPath}`);
+  }
+}
+
+async function createAmazonAssets(client, skipExisting = false) {
+  if (!fs.existsSync(amazonIconPath)) {
+    throw new Error(`Amazon asset source icon was not found: ${amazonIconPath}`);
+  }
+
+  const config = JSON.parse(fs.readFileSync(capacitorConfigPath, 'utf8'));
+  const appName = config.appName || 'App';
+  const storeCopy = getStoreAssetCopy(config);
+  const iconBuffer = fs.readFileSync(amazonIconPath);
+  fs.mkdirSync(amazonAssetsDirectory, { recursive: true });
+
+  for (const asset of amazonAssetDefinitions) {
+    const outputPath = path.join(amazonAssetsDirectory, asset.fileName);
+
+    if (skipExisting && fs.existsSync(outputPath)) {
+      continue;
+    }
+
+    await client.send('Emulation.setDeviceMetricsOverride', {
+      width: asset.width,
+      height: asset.height,
+      deviceScaleFactor: 1,
+      mobile: false,
+      screenWidth: asset.width,
+      screenHeight: asset.height,
+      positionX: 0,
+      positionY: 0,
+    });
+
+    const frameTree = await client.send('Page.getFrameTree');
+    await client.send('Page.setDocumentContent', {
+      frameId: frameTree.frameTree.frame.id,
+      html: createAmazonAssetHtml(asset, appName, iconBuffer, storeCopy),
+    });
+    await client.send('Runtime.evaluate', {
+      expression: `Promise.all([...document.images].map((image) => image.complete
+        ? Promise.resolve()
+        : new Promise((resolve) => {
+          image.addEventListener('load', resolve, { once: true });
+          image.addEventListener('error', resolve, { once: true });
+        }))).then(() => new Promise((resolve) => requestAnimationFrame(() => requestAnimationFrame(resolve))))`,
+      awaitPromise: true,
+      returnByValue: true,
+    });
+
+    const screenshot = await client.send('Page.captureScreenshot', {
+      format: 'png',
+      fromSurface: true,
+      captureBeyondViewport: false,
+      omitBackground: Boolean(asset.transparent),
+    });
+    fs.writeFileSync(outputPath, Buffer.from(screenshot.data, 'base64'));
+    console.log(`Saved Amazon asset ${asset.width}x${asset.height}: ${outputPath}`);
+  }
+}
+
+function createSamsungAssetHtml(asset, appName, iconBuffer, storeCopy) {
+  const iconDataUrl = `data:image/png;base64,${iconBuffer.toString('base64')}`;
+  const safeAppName = escapeHtml(appName);
+  const featureButtons = storeCopy.featureLabels.map((label, index) => (
+    `<button><i>0${index + 1}</i><span>${escapeHtml(label.toUpperCase())}</span></button>`
+  )).join('');
+  const safeKicker = escapeHtml(storeCopy.samsungKicker.toUpperCase());
+  const safeAction = escapeHtml(storeCopy.samsungAction.toUpperCase());
+  const safeBody = escapeHtml(storeCopy.samsungBody);
+  const content = asset.type === 'edge-screen'
+    ? `<main class="edge-panel"><header><img src="${iconDataUrl}" /><strong>${safeAppName}</strong></header><section>${featureButtons}</section></main>`
+    : `<main class="single-panel"><header><img src="${iconDataUrl}" /><div><small>${safeKicker}</small><strong>${safeAppName}</strong></div></header><div class="single-action"><span>+</span><strong>${safeAction}</strong><small>${safeBody}</small></div><div class="accent-bars"><i></i><i></i><i></i><i></i><i></i></div></main>`;
+
+  return `<!doctype html>
+<html>
+<head>
+  <meta charset="utf-8" />
+  <style>
+    * { box-sizing: border-box; }
+    html, body { width: 100%; height: 100%; margin: 0; overflow: hidden; }
+    body {
+      position: relative;
+      color: #f7fbff;
+      background:
+        radial-gradient(circle at 50% 8%, rgba(53,212,235,0.26), transparent 24%),
+        radial-gradient(circle at 50% 88%, rgba(201,255,65,0.16), transparent 25%),
+        linear-gradient(180deg, #231039, #111729 48%, #071522);
+      font-family: Arial, Helvetica, sans-serif;
+    }
+    body::before {
+      content: '';
+      position: absolute;
+      inset: 0;
+      opacity: 0.18;
+      background: repeating-linear-gradient(0deg, transparent 0 79px, rgba(255,255,255,0.08) 80px);
+    }
+    main { position: relative; z-index: 1; width: 100%; height: 100%; }
+    .edge-panel { display: flex; flex-direction: column; padding: 28px 12px; }
+    .edge-panel header { display: flex; flex-direction: column; align-items: center; gap: 12px; min-height: 230px; }
+    .edge-panel header img { width: 112px; height: 112px; border-radius: 25px; object-fit: contain; }
+    .edge-panel header strong { max-width: 136px; overflow: hidden; font-size: 18px; text-overflow: ellipsis; white-space: nowrap; }
+    .edge-panel section { display: grid; flex: 1; grid-template-rows: repeat(9, 1fr); gap: 13px; }
+    .edge-panel button {
+      display: flex;
+      width: 100%;
+      min-height: 0;
+      flex-direction: column;
+      align-items: center;
+      justify-content: center;
+      gap: 8px;
+      color: #f7fbff;
+      border: 1px solid rgba(255,255,255,0.16);
+      border-top: 5px solid #35d4eb;
+      border-radius: 18px;
+      background: linear-gradient(145deg, rgba(41,55,76,0.98), rgba(10,17,29,0.98));
+      box-shadow: 0 10px 18px rgba(0,0,0,0.3);
+    }
+    .edge-panel button:nth-child(3n+2) { border-top-color: #ff9f43; }
+    .edge-panel button:nth-child(3n) { border-top-color: #c9ff41; }
+    .edge-panel button i { color: #35d4eb; font-size: 14px; font-style: normal; font-weight: 700; }
+    .edge-panel button span { font-size: 12px; font-weight: 700; letter-spacing: 1px; }
+    .single-panel { display: flex; flex-direction: column; align-items: center; padding: 100px 44px; }
+    .single-panel header { display: flex; width: 100%; align-items: center; gap: 24px; }
+    .single-panel header img { width: 160px; height: 160px; border-radius: 36px; object-fit: contain; }
+    .single-panel header div { display: flex; min-width: 0; flex-direction: column; gap: 9px; }
+    .single-panel header small { color: #35d4eb; font-size: 17px; font-weight: 700; letter-spacing: 3px; }
+    .single-panel header strong { overflow: hidden; font-size: 48px; text-overflow: ellipsis; white-space: nowrap; }
+    .single-action {
+      display: flex;
+      width: 100%;
+      height: 880px;
+      margin-top: 380px;
+      flex-direction: column;
+      align-items: center;
+      justify-content: center;
+      border: 3px solid rgba(53,212,235,0.5);
+      border-radius: 90px;
+      background: linear-gradient(145deg, rgba(39,53,75,0.96), rgba(8,16,28,0.98));
+      box-shadow: 0 50px 90px rgba(0,0,0,0.42), 0 0 75px rgba(53,212,235,0.16);
+    }
+    .single-action span {
+      display: grid;
+      width: 260px;
+      height: 260px;
+      place-items: center;
+      color: #0d1721;
+      border-radius: 50%;
+      background: linear-gradient(145deg, #35d4eb, #c9ff41);
+      box-shadow: 0 25px 55px rgba(53,212,235,0.3);
+      font-size: 170px;
+      font-weight: 200;
+      line-height: 1;
+    }
+    .single-action strong { margin-top: 65px; font-size: 42px; letter-spacing: 5px; }
+    .single-action small { margin-top: 18px; color: #a9b7c9; font-size: 24px; }
+    .accent-bars { display: flex; align-items: center; gap: 18px; height: 300px; margin-top: auto; }
+    .accent-bars i { width: 14px; height: 70px; border-radius: 999px; background: #35d4eb; }
+    .accent-bars i:nth-child(2), .accent-bars i:nth-child(4) { height: 140px; background: #ff5964; }
+    .accent-bars i:nth-child(3) { height: 210px; background: #c9ff41; }
+  </style>
+</head>
+<body>${content}</body>
+</html>`;
+}
+
+async function createSamsungAssets(client, skipExisting = false) {
+  if (!fs.existsSync(amazonIconPath)) {
+    throw new Error(`Samsung asset source icon was not found: ${amazonIconPath}`);
+  }
+
+  const config = JSON.parse(fs.readFileSync(capacitorConfigPath, 'utf8'));
+  const appName = config.appName || 'App';
+  const storeCopy = getStoreAssetCopy(config);
+  const iconBuffer = fs.readFileSync(amazonIconPath);
+  const maximumFileSize = 1024 * 1024;
+
+  fs.mkdirSync(samsungAssetsDirectory, { recursive: true });
+
+  for (const asset of samsungAssetDefinitions) {
+    const outputPath = path.join(samsungAssetsDirectory, asset.fileName);
+
+    if (skipExisting && fs.existsSync(outputPath)) {
+      continue;
+    }
+
+    await client.send('Emulation.setDeviceMetricsOverride', {
+      width: asset.width,
+      height: asset.height,
+      deviceScaleFactor: 1,
+      mobile: false,
+      screenWidth: asset.width,
+      screenHeight: asset.height,
+      positionX: 0,
+      positionY: 0,
+    });
+    const frameTree = await client.send('Page.getFrameTree');
+    await client.send('Page.setDocumentContent', {
+      frameId: frameTree.frameTree.frame.id,
+      html: createSamsungAssetHtml(asset, appName, iconBuffer, storeCopy),
+    });
+    await client.send('Runtime.evaluate', {
+      expression: `Promise.all([...document.images].map((image) => image.complete
+        ? Promise.resolve()
+        : new Promise((resolve) => image.addEventListener('load', resolve, { once: true }))))
+        .then(() => new Promise((resolve) => requestAnimationFrame(() => requestAnimationFrame(resolve))))`,
+      awaitPromise: true,
+      returnByValue: true,
+    });
+    const screenshot = await client.send('Page.captureScreenshot', {
+      format: 'png',
+      fromSurface: true,
+      captureBeyondViewport: false,
+    });
+    const outputBuffer = Buffer.from(screenshot.data, 'base64');
+
+    if (outputBuffer.length >= maximumFileSize) {
+      throw new Error(
+        `Samsung asset exceeds 1024 KB (${Math.ceil(outputBuffer.length / 1024)} KB): ${asset.fileName}`,
+      );
+    }
+
+    fs.writeFileSync(outputPath, outputBuffer);
+    console.log(
+      `Saved Samsung asset ${asset.width}x${asset.height} `
+      + `(${Math.ceil(outputBuffer.length / 1024)} KB): ${outputPath}`,
+    );
+  }
+}
+
+async function createMissingStoreAssets() {
+  const hasMissingAmazonAssets = amazonAssetDefinitions.some((asset) => (
+    !fs.existsSync(path.join(amazonAssetsDirectory, asset.fileName))
+  ));
+  const hasMissingSamsungAssets = samsungAssetDefinitions.some((asset) => (
+    !fs.existsSync(path.join(samsungAssetsDirectory, asset.fileName))
+  ));
+  const hasMissingPlaystoreAssets = playstoreAssetDefinitions.some((asset) => (
+    !fs.existsSync(path.join(playstoreAssetsDirectory, asset.fileName))
+  ));
+
+  if (!hasMissingAmazonAssets && !hasMissingSamsungAssets && !hasMissingPlaystoreAssets) {
+    console.log('Amazon, Samsung, and Play Store assets already exist.');
+    return;
+  }
+
+  let browser;
+  let client;
+
+  try {
+    browser = await launchReplayBrowser();
+    client = await createReplayPage(browser);
+
+    if (hasMissingAmazonAssets) {
+      await createAmazonAssets(client, true);
+    }
+
+    if (hasMissingSamsungAssets) {
+      await createSamsungAssets(client, true);
+    }
+    if (hasMissingPlaystoreAssets) {
+      await createPlaystoreAssets(client, true);
+    }
+  } finally {
+    if (client) client.close();
+    if (browser) await closeReplayBrowser(browser);
+  }
+
+  console.log('Missing Amazon, Samsung, and Play Store assets created.');
+}
+
+async function captureFramedScreenshot(
+  client,
+  screenshotBuffer,
+  profile,
+  screenshotFileName,
+  skipExisting = false,
+) {
+  const framedProfileDirectory = path.join(inFrameDirectory, profile.outputDirectory);
+  const framedScreenshotPath = path.join(framedProfileDirectory, screenshotFileName);
+
+  if (skipExisting && fs.existsSync(framedScreenshotPath)) {
+    console.log(`Skipped existing framed screenshot: ${framedScreenshotPath}`);
+    return false;
+  }
+
+  const hasCustomFrameSize = Boolean(profile.framedWidth && profile.framedHeight);
+  const frameWidth = profile.framedWidth || profile.width;
+  const frameHeight = profile.framedHeight || profile.height;
+  const frameScaleFactor = hasCustomFrameSize ? 1 : profile.deviceScaleFactor;
+
+  await client.send('Emulation.setDeviceMetricsOverride', {
+    width: frameWidth,
+    height: frameHeight,
+    deviceScaleFactor: frameScaleFactor,
+    mobile: false,
+    screenWidth: frameWidth,
+    screenHeight: frameHeight,
+    positionX: 0,
+    positionY: 0,
+  });
+
+  const frameTree = await client.send('Page.getFrameTree');
+  await client.send('Page.setDocumentContent', {
+    frameId: frameTree.frameTree.frame.id,
+    html: createDeviceFrameHtml(profile, screenshotBuffer),
+  });
+  await client.send('Runtime.evaluate', {
+    expression: `new Promise((resolve) => {
+      const image = document.querySelector('img');
+      const ready = () => requestAnimationFrame(() => requestAnimationFrame(resolve));
+      if (image.complete) ready();
+      else {
+        image.addEventListener('load', ready, { once: true });
+        image.addEventListener('error', ready, { once: true });
+      }
+    })`,
+    awaitPromise: true,
+    returnByValue: true,
+  });
+
+  const framedScreenshot = await client.send('Page.captureScreenshot', {
+    format: 'png',
+    fromSurface: true,
+    captureBeyondViewport: false,
+  });
+
+  fs.mkdirSync(framedProfileDirectory, { recursive: true });
+  fs.writeFileSync(
+    framedScreenshotPath,
+    Buffer.from(framedScreenshot.data, 'base64'),
+    { flag: 'wx' },
+  );
+  console.log(`Saved framed ${profile.label}: ${framedScreenshotPath}`);
+  return true;
+}
+
+async function captureProfile(client, snapshot, profile, screenshotFileName) {
+  await client.send('Emulation.setDeviceMetricsOverride', {
+    width: profile.width,
+    height: profile.height,
+    deviceScaleFactor: profile.deviceScaleFactor,
+    mobile: profile.mobile,
+    screenWidth: profile.width,
+    screenHeight: profile.height,
+    positionX: 0,
+    positionY: 0,
+  });
+
+  const frameTree = await client.send('Page.getFrameTree');
+  await client.send('Page.setDocumentContent', {
+    frameId: frameTree.frameTree.frame.id,
+    html: snapshot.html,
+  });
+  const replayLayout = await waitForReplayLayout(client, snapshot);
+
+  if (replayLayout.documentWidth > replayLayout.viewportWidth + 1) {
+    console.warn(
+      `Warning: ${profile.label} replay is ${replayLayout.documentWidth}px wide `
+      + `inside a ${replayLayout.viewportWidth}px viewport.`,
+    );
+  }
+
+  const screenshot = await client.send('Page.captureScreenshot', {
+    format: 'png',
+    fromSurface: true,
+    captureBeyondViewport: false,
+  });
+
+  const profileDirectory = path.join(screenshotDirectory, profile.outputDirectory);
+  const screenshotPath = path.join(profileDirectory, screenshotFileName);
+  const screenshotBuffer = Buffer.from(screenshot.data, 'base64');
+
+  fs.mkdirSync(profileDirectory, { recursive: true });
+  fs.writeFileSync(screenshotPath, screenshotBuffer, { flag: 'wx' });
+  console.log(`Saved ${profile.label}: ${screenshotPath}`);
+  await captureFramedScreenshot(
+    client,
+    screenshotBuffer,
+    profile,
+    screenshotFileName,
+  );
+}
+
+async function captureScreenshotSet(
+  deviceClient,
+  replayClient,
+  selectedProfiles,
+  fileNameInput,
+) {
+  console.log('Capturing the current rendered page and resolved native data...');
+  const snapshot = await capturePageSnapshot(deviceClient);
+  const screenshotFileName = getScreenshotFileName(fileNameInput, selectedProfiles);
+
+  for (const profile of selectedProfiles) {
+    await captureProfile(replayClient, snapshot, profile, screenshotFileName);
+  }
+
+  console.log(`Responsive screenshot set completed: ${screenshotFileName}`);
+}
+
+async function frameExistingScreenshots(selectedProfiles) {
+  let replayBrowser;
+  let replayClient;
+  let framedCount = 0;
+  let failedCount = 0;
+
+  try {
+    replayBrowser = await launchReplayBrowser();
+    replayClient = await createReplayPage(replayBrowser);
+
+    for (const profile of selectedProfiles) {
+      const profileDirectory = path.join(screenshotDirectory, profile.outputDirectory);
+
+      if (!fs.existsSync(profileDirectory)) {
+        continue;
+      }
+
+      const screenshotFiles = fs.readdirSync(profileDirectory, { withFileTypes: true })
+        .filter((entry) => entry.isFile() && /\.png$/i.test(entry.name))
+        .map((entry) => entry.name)
+        .sort((first, second) => first.localeCompare(second, undefined, { numeric: true }));
+
+      for (const screenshotFileName of screenshotFiles) {
+        const screenshotPath = path.join(profileDirectory, screenshotFileName);
+
+        try {
+          const wasCreated = await captureFramedScreenshot(
+            replayClient,
+            fs.readFileSync(screenshotPath),
+            profile,
+            screenshotFileName,
+            true,
+          );
+          if (wasCreated) framedCount += 1;
+        } catch (error) {
+          failedCount += 1;
+          console.error(`Failed to frame ${screenshotPath}: ${error.message}`);
+        }
+      }
+    }
+  } finally {
+    if (replayClient) {
+      replayClient.close();
+    }
+
+    if (replayBrowser) {
+      await closeReplayBrowser(replayBrowser);
+    }
+  }
+
+  console.log(`Existing screenshot framing completed: ${framedCount} created.`);
+
+  if (failedCount) {
+    throw new Error(`${failedCount} existing screenshot(s) could not be framed.`);
+  }
+}
+
+async function runInteractiveCaptureLoop(
+  deviceClient,
+  replayClient,
+  selectedProfiles,
+) {
+  const terminal = readline.createInterface({
+    input: process.stdin,
+    output: process.stdout,
+    prompt: 'Enter a filename, or press Enter for the next number: ',
+  });
+
+  terminal.on('SIGINT', () => terminal.close());
+
+  console.log(`Screenshots will be saved in: ${screenshotDirectory}`);
+  console.log('Press Ctrl+C to exit.');
+  terminal.prompt();
+
+  for await (const fileNameInput of terminal) {
+    try {
+      await captureScreenshotSet(
+        deviceClient,
+        replayClient,
+        selectedProfiles,
+        fileNameInput,
+      );
+    } catch (error) {
+      console.error(`Responsive screenshot failed: ${error.message}`);
+    }
+
+    terminal.prompt();
+  }
+
+  console.log('\nResponsive screenshot tool closed.');
+}
+
+async function getInteractiveOptions(options) {
+  if (
+    !process.stdin.isTTY
+    || options.dryRun
+    || options.amazonAssets
+    || options.samsungAssets
+  ) {
+    return options;
+  }
+
+  const terminal = readline.createInterface({
+    input: process.stdin,
+    output: process.stdout,
+  });
+
+  try {
+    if (!options.profiles) {
+      console.log('Available profiles:');
+      printProfiles();
+      options.profiles = await terminal.question(
+        'Profiles separated by commas, or press Enter for all: ',
+      );
+    }
+  } finally {
+    terminal.close();
+  }
+
+  return options;
+}
+
+async function main() {
+  let options = parseArguments();
+
+  if (options.help) {
+    printHelp();
+    return;
+  }
+
+  if (options.list) {
+    printProfiles();
+    return;
+  }
+
+  options = await getInteractiveOptions(options);
+
+  if (options.amazonAssets) {
+    let amazonBrowser;
+    let amazonClient;
+
+    try {
+      amazonBrowser = await launchReplayBrowser();
+      amazonClient = await createReplayPage(amazonBrowser);
+      await createAmazonAssets(amazonClient);
+    } finally {
+      if (amazonClient) amazonClient.close();
+      if (amazonBrowser) await closeReplayBrowser(amazonBrowser);
+    }
+
+    console.log(`Amazon asset creation completed: ${amazonAssetsDirectory}`);
+    return;
+  }
+
+  if (options.samsungAssets) {
+    let samsungBrowser;
+    let samsungClient;
+
+    try {
+      samsungBrowser = await launchReplayBrowser();
+      samsungClient = await createReplayPage(samsungBrowser);
+      await createSamsungAssets(samsungClient);
+    } finally {
+      if (samsungClient) samsungClient.close();
+      if (samsungBrowser) await closeReplayBrowser(samsungBrowser);
+    }
+
+    console.log(`Samsung asset creation completed: ${samsungAssetsDirectory}`);
+    return;
+  }
+
+  if (!options.dryRun) {
+    await createMissingStoreAssets();
+  }
+
+  const selectedProfiles = selectProfiles(options.profiles);
+
+  if (options.frameExisting) {
+    await frameExistingScreenshots(selectedProfiles);
+    return;
+  }
+
+  const interactiveMode = process.stdin.isTTY && !options.prefix && !options.dryRun;
+  const deviceId = getConnectedDevice();
+  const appId = getAppId();
+  const socketName = getWebViewSocket(deviceId, appId);
+  const localPort = runAdb([
+    '-s',
+    deviceId,
+    'forward',
+    'tcp:0',
+    `localabstract:${socketName}`,
+  ]);
+
+  let deviceClient;
+  let replayBrowser;
+  let replayClient;
+
+  try {
+    const target = await getWebViewTarget(localPort);
+    deviceClient = new CdpClient(target.webSocketDebuggerUrl);
+    await deviceClient.connect();
+    await deviceClient.send('Page.enable');
+    await deviceClient.send('Runtime.enable');
+
+    const pageDetails = await getPageDetails(deviceClient);
+    console.log(`Connected device: ${deviceId}`);
+    console.log(`App: ${appId}`);
+    console.log(`Current page: ${pageDetails.title || '(untitled)'}`);
+    console.log(`Current URL: ${pageDetails.url}`);
+    console.log(
+      `Current viewport: ${pageDetails.width}x${pageDetails.height} `
+      + `at ${pageDetails.devicePixelRatio}x (${pageDetails.readyState})`,
+    );
+
+    if (options.dryRun) {
+      console.log('Dry run completed. No screenshots were created.');
+      return;
+    }
+
+    fs.mkdirSync(screenshotDirectory, { recursive: true });
+    replayBrowser = await launchReplayBrowser();
+    replayClient = await createReplayPage(replayBrowser);
+
+    console.log(
+      'Apple, TV, Chromebook, Mac, and XR profiles are viewport approximations of the live Android WebView.',
+    );
+
+    if (interactiveMode) {
+      await runInteractiveCaptureLoop(
+        deviceClient,
+        replayClient,
+        selectedProfiles,
+      );
+    } else {
+      await captureScreenshotSet(
+        deviceClient,
+        replayClient,
+        selectedProfiles,
+        options.prefix,
+      );
+    }
+  } finally {
+    if (replayClient) {
+      replayClient.close();
+    }
+
+    if (replayBrowser) {
+      await closeReplayBrowser(replayBrowser);
+    }
+
+    if (deviceClient) {
+      deviceClient.close();
+    }
+
+    if (localPort) {
+      try {
+        runAdb(['-s', deviceId, 'forward', '--remove', `tcp:${localPort}`]);
+      } catch {
+        // ADB may already have removed the temporary forwarding rule.
+      }
+    }
+  }
+}
+
+main().catch((error) => {
+  console.error(`Responsive screenshot failed: ${error.message}`);
+  process.exitCode = 1;
+});