Merge remote-tracking branch 'upstream/main' into fix/houston-cctv-pack

# Conflicts:
#	.env.example
#	README.md
#	docs/CURRENT-STATE.md
#	server/providers/cctv/catalog.js
#	server/providers/cctv/normalize.js
#	server/providers/cctv/sources.js
#	src/data/dataCredits.js

scripts/build-bright-stars.mjs

@@ -0,0 +1,158 @@
+#!/usr/bin/env node
+/**
+ * Build src/data/local_data/sky/bright_stars.json from the Yale Bright Star
+ * Catalogue, 5th Revised Edition (Hoffleit & Warren 1991).
+ *
+ * Source:   CDS VizieR catalogue V/50, https://cdsarc.cds.unistra.fr/viz-bin/cat/V/50
+ * Fetched:  https://cdsarc.cds.unistra.fr/ftp/V/50/catalog.gz
+ * Format:   fixed-width ASCII, 197 bytes per record, byte layout in
+ *           https://cdsarc.cds.unistra.fr/ftp/V/50/ReadMe
+ * License:  public domain (Yale University Observatory / NASA ADC); CDS asks
+ *           for an acknowledgement, which the Data attribution popover carries.
+ *
+ * Transform (deterministic):
+ *   1. J2000 RA/Dec (bytes 76-90), V magnitude (103-107) and B−V (110-114).
+ *   2. The 14 records without a J2000 position (novae and other objects later
+ *      found not to be stars) are dropped.
+ *   3. RA/Dec rounded to 3 decimals of a degree (3.6″ — a fraction of a pixel
+ *      at any field of view the globe uses), magnitudes to 2.
+ *   4. Missing B−V is stored as null; the renderer gives it a neutral colour.
+ *   5. Records keep catalogue (HR) order for a stable diff.
+ *
+ * Usage:
+ *   node scripts/build-bright-stars.mjs [catalog | catalog.gz]
+ * With no argument it downloads the catalogue from CDS.
+ */
+
+import fs from 'node:fs';
+import path from 'node:path';
+import zlib from 'node:zlib';
+import { fileURLToPath } from 'node:url';
+
+const SOURCE_URL = 'https://cdsarc.cds.unistra.fr/ftp/V/50/catalog.gz';
+const OUT = path.join(
+  path.dirname(fileURLToPath(import.meta.url)),
+  '..',
+  'src',
+  'data',
+  'local_data',
+  'sky',
+  'bright_stars.json',
+);
+
+/** Slice 1-based inclusive byte columns the way the CDS ReadMe numbers them. */
+function columns(line, from, to) {
+  return line.slice(from - 1, to).trim();
+}
+
+/** Parse a fixed-width float; blank fields are null. */
+function parseField(text) {
+  if (text === '') return null;
+  const value = Number(text);
+  return Number.isFinite(value) ? value : null;
+}
+
+/**
+ * Parse one BSC5 record. Returns null for records without a J2000 position
+ * or V magnitude.
+ */
+export function parseBscRecord(line) {
+  const hr = parseField(columns(line, 1, 4));
+  const raH = parseField(columns(line, 76, 77));
+  const raM = parseField(columns(line, 78, 79));
+  const raS = parseField(columns(line, 80, 83));
+  const sign = columns(line, 84, 84);
+  const deD = parseField(columns(line, 85, 86));
+  const deM = parseField(columns(line, 87, 88));
+  const deS = parseField(columns(line, 89, 90));
+  const vmag = parseField(columns(line, 103, 107));
+  const bv = parseField(columns(line, 110, 114));
+  if (
+    hr === null ||
+    raH === null ||
+    raM === null ||
+    raS === null ||
+    deD === null ||
+    deM === null ||
+    deS === null ||
+    vmag === null ||
+    (sign !== '+' && sign !== '-')
+  )
+    return null;
+  const raDeg = (raH + raM / 60 + raS / 3600) * 15;
+  const decDeg = (sign === '-' ? -1 : 1) * (deD + deM / 60 + deS / 3600);
+  return { hr, raDeg, decDeg, vmag, bv };
+}
+
+const round = (value, decimals) => {
+  const scale = 10 ** decimals;
+  return Math.round(value * scale) / scale;
+};
+
+/** Build the committed pack from the raw catalogue text. */
+export function buildStarPack(text, { fetched = null } = {}) {
+  const stars = [];
+  let dropped = 0;
+  for (const line of text.split('\n')) {
+    if (line.trim() === '') continue;
+    const record = parseBscRecord(line);
+    if (!record) {
+      dropped += 1;
+      continue;
+    }
+    stars.push(
+      round(record.raDeg, 3),
+      round(record.decDeg, 3),
+      round(record.vmag, 2),
+      record.bv === null ? null : round(record.bv, 2),
+    );
+  }
+  return {
+    meta: {
+      source:
+        'Yale Bright Star Catalogue, 5th Revised Ed. (Hoffleit & Warren 1991), CDS V/50',
+      url: SOURCE_URL,
+      license: 'public domain',
+      fetched,
+      frame: 'ICRF/J2000, epoch 2000.0',
+      columns: ['raDeg', 'decDeg', 'vmag', 'bv'],
+      count: stars.length / 4,
+      dropped,
+    },
+    stars,
+  };
+}
+
+async function readCatalogue(file) {
+  if (!file) {
+    const response = await fetch(SOURCE_URL);
+    if (!response.ok) throw new Error(`${SOURCE_URL}: HTTP ${response.status}`);
+    return zlib
+      .gunzipSync(Buffer.from(await response.arrayBuffer()))
+      .toString('latin1');
+  }
+  const bytes = fs.readFileSync(file);
+  return (file.endsWith('.gz') ? zlib.gunzipSync(bytes) : bytes).toString(
+    'latin1',
+  );
+}
+
+async function main() {
+  const [file] = process.argv.slice(2);
+  const text = await readCatalogue(file);
+  const pack = buildStarPack(text, {
+    fetched: new Date().toISOString().slice(0, 10),
+  });
+  // One star per line keeps the JSON compact and the diff readable.
+  const rows = [];
+  for (let i = 0; i < pack.stars.length; i += 4)
+    rows.push(JSON.stringify(pack.stars.slice(i, i + 4)).slice(1, -1));
+  const body = `{"meta":${JSON.stringify(pack.meta)},\n"stars":[\n${rows.join(',\n')}\n]}\n`;
+  fs.mkdirSync(path.dirname(OUT), { recursive: true });
+  fs.writeFileSync(OUT, body);
+  console.log(
+    `wrote ${pack.meta.count} stars (${pack.meta.dropped} dropped) → ${path.relative(process.cwd(), OUT)} (${body.length} bytes)`,
+  );
+}
+
+if (process.argv[1] === fileURLToPath(import.meta.url)) await main();

scripts/build-milky-way.mjs

@@ -0,0 +1,415 @@
+#!/usr/bin/env node
+/**
+ * Build the soft Milky Way cube map in src/data/local_data/sky/ from the ESO
+ * all-sky Milky Way panorama.
+ *
+ * Source page: https://www.eso.org/public/images/eso0932a/
+ * Fetched:     https://cdn.eso.org/images/original/eso0932a.tif
+ *              (6000×3000 8-bit sRGB TIFF, 27.7 MB; sha256 in README.md)
+ * Credit:      ESO/S. Brunier
+ * License:     CC BY 4.0 (https://www.eso.org/public/outreach/copyright/).
+ *              Modified: stars removed, blurred, reprojected to ICRF cube
+ *              faces and tone-mapped, as below.
+ * Frame:       plate carrée in galactic coordinates, centred on the Galactic
+ *              Centre, galactic longitude increasing to the left.
+ *
+ * Transform (deterministic):
+ *   1. Resample to WORK_WIDTH×WORK_WIDTH/2, sRGB to linear light.
+ *   2. Remove stars with a morphological opening: the renderer draws
+ *      catalogue stars itself, sharp and in the right place.
+ *   3. Paint out the planets the 2008–2010 exposures caught (PLANETS).
+ *   4. Blur, round on the sphere: σ = BLUR_DEG, widening to FAINT_BLUR_DEG
+ *      in the faint glow so unresolved stars leave no clumps.
+ *   5. Resample into six WebGL cube faces (uploaded without flipY) with the
+ *      ICRF axes: +X to the March equinox, +Z to the north celestial pole.
+ *   6. Median sky to black with a soft knee, brightest 0.01 % to ~97 %
+ *      white, on luminance to keep the hue; gamma 1/2.2, dither, WebP.
+ *
+ * Usage:
+ *   node scripts/build-milky-way.mjs <eso0932a.tif>
+ * Needs the sharp dev dependency.
+ */
+
+import path from 'node:path';
+import { fileURLToPath } from 'node:url';
+
+export const FACE_SIZE = 1024;
+export const BLUR_DEG = 0.4;
+// Faint glow is grain of unresolved stars and needs the wide blur; bright
+// parts keep the fine one and their dust lanes. FAINT_RANGE (fraction of
+// black-to-white) is where the two blend.
+export const FAINT_BLUR_DEG = 2;
+const FAINT_RANGE = [0.005, 0.08];
+const WORK_WIDTH = 4096;
+const OPEN_RADIUS = 3;
+const WEBP_QUALITY = 96;
+// The median sky is black: above it the glow away from the plane reads as
+// grey blotches. SOFT_KNEE eases the cut in so it draws no edges.
+const BLACK_PERCENTILE = 0.5;
+const SOFT_KNEE = 0.03;
+const WHITE_PERCENTILE = 0.9999;
+const OUT_DIR = path.join(
+  path.dirname(fileURLToPath(import.meta.url)),
+  '..',
+  'src',
+  'data',
+  'local_data',
+  'sky',
+);
+
+/**
+ * Bright planets in the panorama, galactic longitude/latitude in degrees and
+ * the radius painted over with the surrounding sky. By position both are
+ * Jupiter, in Sagittarius (2008) and Aquarius (2010); no catalogue star lies
+ * under either.
+ */
+export const PLANETS = Object.freeze([
+  { l: 13.4, b: -16.6, radiusDeg: 2.5 },
+  { l: 69.0, b: -58.4, radiusDeg: 2.5 },
+]);
+
+/** Cube faces in WebGL upload order. */
+export const CUBE_FACES = Object.freeze([
+  'positiveX',
+  'negativeX',
+  'positiveY',
+  'negativeY',
+  'positiveZ',
+  'negativeZ',
+]);
+export const FACE_FILE_SUFFIX = Object.freeze({
+  positiveX: 'px',
+  negativeX: 'nx',
+  positiveY: 'py',
+  negativeY: 'ny',
+  positiveZ: 'pz',
+  negativeZ: 'nz',
+});
+
+/**
+ * ICRF (J2000 equatorial) → galactic rotation, rows = galactic axes
+ * (Hipparcos catalogue, ESA SP-1200 vol. 1 §1.5.3).
+ */
+export const ICRF_TO_GALACTIC = Object.freeze([
+  [-0.0548755604162154, -0.873437090234885, -0.4838350155487132],
+  [0.4941094278755837, -0.4448296299600112, 0.7469822444972189],
+  [-0.867666149019004, -0.1980763734312015, 0.4559837761750669],
+]);
+
+/**
+ * Direction (not normalized) that the WebGL cube-map lookup sends to texel
+ * coordinate (s, t) ∈ [0, 1]² of `face`, t = 0 being the first image row.
+ * Inverse of the OpenGL ES 3.0 §3.8.10 major-axis table.
+ */
+export function cubeFaceDirection(face, s, t) {
+  const sc = 2 * s - 1;
+  const tc = 2 * t - 1;
+  switch (face) {
+    case 'positiveX':
+      return [1, -tc, -sc];
+    case 'negativeX':
+      return [-1, -tc, sc];
+    case 'positiveY':
+      return [sc, 1, tc];
+    case 'negativeY':
+      return [sc, -1, -tc];
+    case 'positiveZ':
+      return [sc, -tc, 1];
+    case 'negativeZ':
+      return [-sc, -tc, -1];
+    default:
+      throw new RangeError(`Unknown cube face ${face}`);
+  }
+}
+
+/** Rotate an ICRF direction into galactic coordinates. */
+export function icrfToGalactic([x, y, z]) {
+  return ICRF_TO_GALACTIC.map((row) => row[0] * x + row[1] * y + row[2] * z);
+}
+
+/**
+ * Map a direction to (u, v) ∈ [0, 1)² of a plate carrée centred on
+ * longitude 0 with longitude increasing to the left and v = 0 at +90°.
+ */
+export function directionToPlateCarree(x, y, z) {
+  const longitude = Math.atan2(y, x);
+  const latitude = Math.atan2(z, Math.hypot(x, y));
+  let u = 0.5 - longitude / (2 * Math.PI);
+  u -= Math.floor(u);
+  return [u, 0.5 - latitude / Math.PI];
+}
+
+/** Box widths whose three passes approximate a Gaussian of `sigma` (Kovesi). */
+function boxRadii(sigma) {
+  const ideal = Math.sqrt((12 * sigma * sigma) / 3 + 1);
+  let lower = Math.floor(ideal);
+  if (lower % 2 === 0) lower -= 1;
+  const upper = lower + 2;
+  const m = Math.round(
+    (12 * sigma * sigma - 3 * lower * lower - 12 * lower - 9) /
+      (-4 * lower - 4),
+  );
+  return [0, 1, 2].map((i) => ((i < m ? lower : upper) - 1) / 2);
+}
+
+/** Index along a line, wrapped or clamped at the ends. */
+function lineIndex(i, length, wrap) {
+  if (wrap) return ((i % length) + length) % length;
+  return i < 0 ? 0 : i >= length ? length - 1 : i;
+}
+
+/** Running-sum box blur of one strided line. */
+function boxLine(src, dst, offset, stride, length, radius, wrap) {
+  if (radius < 1) {
+    for (let i = 0; i < length; i++)
+      dst[offset + i * stride] = src[offset + i * stride];
+    return;
+  }
+  const r = wrap ? Math.min(radius, Math.floor((length - 1) / 2)) : radius;
+  const at = (i) => src[offset + lineIndex(i, length, wrap) * stride];
+  let sum = 0;
+  for (let i = -r; i <= r; i++) sum += at(i);
+  const scale = 1 / (2 * r + 1);
+  for (let i = 0; i < length; i++) {
+    dst[offset + i * stride] = sum * scale;
+    sum += at(i + r + 1) - at(i - r);
+  }
+}
+
+/** Minimum or maximum over a (2r+1) window of one strided line. */
+function extremumLine(src, dst, offset, stride, length, radius, wrap, pick) {
+  for (let i = 0; i < length; i++) {
+    let value = src[offset + lineIndex(i - radius, length, wrap) * stride];
+    for (let k = -radius + 1; k <= radius; k++)
+      value = pick(
+        value,
+        src[offset + lineIndex(i + k, length, wrap) * stride],
+      );
+    dst[offset + i * stride] = value;
+  }
+}
+
+/** Separable minimum or maximum filter over a plate-carrée plane, in place. */
+function extremumPlane(plane, width, height, radius, pick) {
+  const scratch = new Float32Array(plane.length);
+  for (let y = 0; y < height; y++)
+    extremumLine(plane, scratch, y * width, 1, width, radius, true, pick);
+  for (let x = 0; x < width; x++)
+    extremumLine(scratch, plane, x, width, height, radius, false, pick);
+}
+
+/** Blur one plate-carrée channel in place, round on the sphere. */
+function blurPlane(plane, width, height, sigmaPx) {
+  const scratch = new Float32Array(plane.length);
+  for (let y = 0; y < height; y++) {
+    const latitude = (0.5 - (y + 0.5) / height) * Math.PI;
+    const sigmaX = Math.min(
+      width / 4,
+      sigmaPx / Math.max(Math.cos(latitude), 1e-3),
+    );
+    for (const radius of boxRadii(sigmaX)) {
+      boxLine(plane, scratch, y * width, 1, width, Math.round(radius), true);
+      plane.set(scratch.subarray(y * width, (y + 1) * width), y * width);
+    }
+  }
+  for (const radius of boxRadii(sigmaPx)) {
+    for (let x = 0; x < width; x++)
+      boxLine(plane, scratch, x, width, height, Math.round(radius), false);
+    plane.set(scratch);
+  }
+}
+
+/** Unit vector for galactic longitude and latitude in degrees. */
+function galacticVector(l, b) {
+  const lr = (l * Math.PI) / 180;
+  const br = (b * Math.PI) / 180;
+  return [
+    Math.cos(br) * Math.cos(lr),
+    Math.cos(br) * Math.sin(lr),
+    Math.sin(br),
+  ];
+}
+
+/**
+ * Replace a disc of the sky with the median of the ring just outside it, per
+ * channel. A median, not a mean: the planet's diffraction spikes reach far
+ * past the disc and would lift a mean well above the sky. The blur that
+ * follows hides the seam.
+ */
+function paintOut(planes, width, height, { l, b, radiusDeg }) {
+  const centre = galacticVector(l, b);
+  const inner = Math.cos((radiusDeg * Math.PI) / 180);
+  const outer = Math.cos(((radiusDeg + 1) * Math.PI) / 180);
+  const disc = [];
+  const ring = [];
+  const span = Math.ceil(((radiusDeg + 1) / 180) * height);
+  const row = Math.round((0.5 - b / 180) * height);
+  for (let y = Math.max(0, row - span); y < Math.min(height, row + span); y++) {
+    const latitude = 90 - ((y + 0.5) * 180) / height;
+    for (let x = 0; x < width; x++) {
+      const longitude = (0.5 - (x + 0.5) / width) * 360;
+      const p = galacticVector(longitude, latitude);
+      const cos = p[0] * centre[0] + p[1] * centre[1] + p[2] * centre[2];
+      if (cos >= inner) disc.push(y * width + x);
+      else if (cos >= outer) ring.push(y * width + x);
+    }
+  }
+  for (const plane of planes) {
+    const values = Float32Array.from(ring, (index) => plane[index]).sort();
+    const median = values[values.length >> 1];
+    for (const index of disc) plane[index] = median;
+  }
+}
+
+/** Bilinear sample with longitude wrap and latitude clamp. */
+function samplePlane(plane, width, height, u, v) {
+  const fx = u * width - 0.5;
+  const fy = Math.min(Math.max(v * height - 0.5, 0), height - 1);
+  const x0 = Math.floor(fx);
+  const y0 = Math.floor(fy);
+  const ax = fx - x0;
+  const ay = fy - y0;
+  const xa = ((x0 % width) + width) % width;
+  const xb = (xa + 1) % width;
+  const yb = Math.min(y0 + 1, height - 1);
+  const top = plane[y0 * width + xa] * (1 - ax) + plane[y0 * width + xb] * ax;
+  const bottom =
+    plane[yb * width + xa] * (1 - ax) + plane[yb * width + xb] * ax;
+  return top * (1 - ay) + bottom * ay;
+}
+
+/** Deterministic hash noise in [-0.5, 0.5) for dithering. */
+function dither(index, channel) {
+  let h = (index * 374761393 + channel * 668265263) | 0;
+  h = Math.imul(h ^ (h >>> 13), 1274126177);
+  h ^= h >>> 16;
+  return (h >>> 0) / 4294967296 - 0.5;
+}
+
+/**
+ * Black level with a soft knee: 0 at and below the level, then a quadratic
+ * ease that joins the straight line, so faint sky fades out instead of
+ * ending in a contour.
+ */
+export function softBlack(x, knee = SOFT_KNEE) {
+  return x <= 0 ? 0 : (x * x) / (x + knee);
+}
+
+export function smoothstep(edge0, edge1, x) {
+  const t = Math.min(Math.max((x - edge0) / (edge1 - edge0), 0), 1);
+  return t * t * (3 - 2 * t);
+}
+
+/**
+ * Per pixel, keep `fine` where `weight(luminance of coarse)` is 1 and take
+ * `coarse` where it is 0, blending in between. The weight follows the coarse
+ * copy, so it is smooth itself and draws no seams along dark lanes. Writes
+ * into `fine`.
+ */
+function blendByBrightness(fine, coarse, weight) {
+  const [r] = fine;
+  for (let i = 0; i < r.length; i++) {
+    const w = weight((coarse[0][i] + coarse[1][i] + coarse[2][i]) / 3);
+    for (let c = 0; c < 3; c++)
+      fine[c][i] = coarse[c][i] + (fine[c][i] - coarse[c][i]) * w;
+  }
+}
+
+/** Value at `fraction` of the sorted luminance. */
+function luminancePercentile(planes, fraction) {
+  const [r, g, b] = planes;
+  const lum = new Float32Array(r.length);
+  for (let i = 0; i < lum.length; i++) lum[i] = (r[i] + g[i] + b[i]) / 3;
+  lum.sort();
+  return lum[Math.min(lum.length - 1, Math.floor(fraction * lum.length))];
+}
+
+const srgbToLinear = (value) =>
+  value <= 0.04045 ? value / 12.92 : ((value + 0.055) / 1.055) ** 2.4;
+
+async function decodePanorama(sharp, file) {
+  const width = WORK_WIDTH;
+  const height = WORK_WIDTH / 2;
+  const raw = await sharp(file)
+    .resize(width, height, { fit: 'fill', kernel: 'lanczos3' })
+    .removeAlpha()
+    .raw()
+    .toBuffer();
+  const lut = Float32Array.from({ length: 256 }, (_, i) =>
+    srgbToLinear(i / 255),
+  );
+  const planes = [0, 1, 2].map(() => new Float32Array(width * height));
+  for (let i = 0; i < width * height; i++)
+    for (let c = 0; c < 3; c++) planes[c][i] = lut[raw[i * 3 + c]];
+  return { width, height, planes };
+}
+
+async function main() {
+  const [file] = process.argv.slice(2);
+  if (!file) throw new Error('usage: build-milky-way.mjs <eso0932a.tif>');
+  const { default: sharp } = await import('sharp');
+  const { width, height, planes } = await decodePanorama(sharp, file);
+  const sigmaPx = (BLUR_DEG / 180) * height;
+  for (const plane of planes) {
+    extremumPlane(plane, width, height, OPEN_RADIUS, Math.min);
+    extremumPlane(plane, width, height, OPEN_RADIUS, Math.max);
+  }
+  // After the opening: it sinks the starry sky to the dark gaps between
+  // stars, and a fill taken before it would stay brighter than the sky.
+  for (const planet of PLANETS) paintOut(planes, width, height, planet);
+  const wide = planes.map((plane) => Float32Array.from(plane));
+  for (const plane of planes) blurPlane(plane, width, height, sigmaPx);
+  for (const plane of wide)
+    blurPlane(plane, width, height, (FAINT_BLUR_DEG / 180) * height);
+  // Levels from the fine blur, so the blend weight and the output share
+  // them; the blend moves the median only in the faint sky it smooths.
+  const black = luminancePercentile(planes, BLACK_PERCENTILE);
+  const white = luminancePercentile(planes, WHITE_PERCENTILE);
+  blendByBrightness(planes, wide, (luminance) =>
+    smoothstep(
+      FAINT_RANGE[0],
+      FAINT_RANGE[1],
+      (luminance - black) / (white - black),
+    ),
+  );
+  let total = 0;
+  for (const face of CUBE_FACES) {
+    const pixels = Buffer.alloc(FACE_SIZE * FACE_SIZE * 3);
+    for (let j = 0; j < FACE_SIZE; j++) {
+      for (let i = 0; i < FACE_SIZE; i++) {
+        const direction = cubeFaceDirection(
+          face,
+          (i + 0.5) / FACE_SIZE,
+          (j + 0.5) / FACE_SIZE,
+        );
+        const [u, v] = directionToPlateCarree(...icrfToGalactic(direction));
+        const index = j * FACE_SIZE + i;
+        const rgb = [0, 1, 2].map((c) =>
+          samplePlane(planes[c], width, height, u, v),
+        );
+        const luminance = (rgb[0] + rgb[1] + rgb[2]) / 3;
+        const level = softBlack((luminance - black) / (white - black));
+        for (let c = 0; c < 3; c++) {
+          // Scale every channel by the luminance curve to keep the hue.
+          const linear = luminance > 0 ? (rgb[c] / luminance) * level : 0;
+          const encoded = Math.min(linear, 1) ** (1 / 2.2) * 255;
+          pixels[index * 3 + c] = Math.min(
+            255,
+            Math.max(0, Math.round(encoded + dither(index, c))),
+          );
+        }
+      }
+    }
+    const out = path.join(OUT_DIR, `milkyway_${FACE_FILE_SUFFIX[face]}.webp`);
+    const info = await sharp(pixels, {
+      raw: { width: FACE_SIZE, height: FACE_SIZE, channels: 3 },
+    })
+      .webp({ quality: WEBP_QUALITY, smartSubsample: true, effort: 6 })
+      .toFile(out);
+    total += info.size;
+    console.log(`${path.relative(process.cwd(), out)}: ${info.size} bytes`);
+  }
+  console.log(`total ${total} bytes`);
+}
+
+if (process.argv[1] === fileURLToPath(import.meta.url)) await main();

scripts/check-import-directions.mjs

@@ -24,11 +24,10 @@ const renderer = (file) =>
   /^src\/layers\/[^/]+\/(?:index|rendering|snapshotRenderer|overlay|presentation|cards|controls)\.js$/.test(
     file,
   );
-// Two compatibility composition entries intentionally select standalone defaults.
+// One compatibility composition entry intentionally selects standalone defaults.
 const compatibilityEdge = (from, to) =>
-  (from === 'server/providers/local.js' &&
-    to === 'server/standalone/key-setup.js') ||
-  (from === 'src/ui.js' && to === 'src/standalone/catalog.js');
+  from === 'server/providers/local.js' &&
+  to === 'server/standalone/key-setup.js';
 const portableExport = (key) =>
   key.startsWith('./sources/') ||
   /\/source$/.test(key) ||
@@ -154,14 +153,6 @@ export function checkImportDirections(root) {
           file,
           'Actions must consume feed state without the manager facade',
         );
-      if (
-        file === 'src/app/constructCatalog.js' &&
-        to === 'src/data/localGeojson.js'
-      )
-        report(
-          file,
-          'Catalog must use the services owner without compatibility layer construction',
-        );
     }
     return record;
   }

scripts/docker-start.mjs

@@ -48,7 +48,8 @@ export function defaultGatewayFromRouteTable(text) {
 
 /**
  * Decide this launch's trusted-peer list. An operator value always wins, so a
- * compose override stays authoritative; otherwise the gateway alone is
+ * compose override stays authoritative; `none` trusts no additional peers.
+ * An unset or blank value means the gateway alone is
  * trusted. No gateway trusts nothing and Provider Settings stays loopback-only,
  * exactly as under `npm run dev`.
  * @param {{env?: NodeJS.ProcessEnv, routeTable?: string}} input
@@ -56,6 +57,7 @@ export function defaultGatewayFromRouteTable(text) {
  */
 export function resolveTrustedPeers({ env = process.env, routeTable = '' } = {}) {
   const explicit = String(env.GEV_KEY_SETUP_TRUSTED_PEERS ?? '').trim();
+  if (explicit.toLowerCase() === 'none') return '';
   if (explicit) return explicit;
   return defaultGatewayFromRouteTable(routeTable) ?? '';
 }
@@ -109,15 +111,17 @@ async function start() {
     String(process.env.GEV_KEY_SETUP_TRUSTED_PEERS ?? '').trim(),
   );
   const trustedPeers = resolveTrustedPeers({ routeTable: readRouteTable() });
+  // Set even an empty list before Vite loads .env: the resolved launcher policy
+  // must remain authoritative when there is no trusted gateway.
+  process.env.GEV_KEY_SETUP_TRUSTED_PEERS = trustedPeers;
   if (trustedPeers) {
-    // Set before Vite is imported: the dev server snapshots process.env during
-    // configuration, and the admission gate reads it per request.
-    process.env.GEV_KEY_SETUP_TRUSTED_PEERS = trustedPeers;
     console.log(
       fromOperator
         ? `[Docker] Provider Settings trusted peers: ${trustedPeers} (GEV_KEY_SETUP_TRUSTED_PEERS).`
         : `[Docker] Provider Settings trusts the container gateway (${trustedPeers}).`,
     );
+  } else if (fromOperator) {
+    console.log('[Docker] Provider Settings trusts no additional peers (GEV_KEY_SETUP_TRUSTED_PEERS=none).');
   } else {
     console.log('[Docker] No default gateway; Provider Settings stays loopback-only.');
   }

scripts/fixtures/street-level/kartaView.mjs

@@ -49,11 +49,6 @@ export function resetKartaViewFixture() {
   nearestLookups = 0;
 }
 
-/** Nearest lookups answered since the last reset (the first got a 429). */
-export function kartaViewLookups() {
-  return nearestLookups;
-}
-
 /** The drive's photos, south to north; every tenth is 360°, every odd one archived. */
 export function kartaViewPhotos() {
   const step = KV_SPACING_M / METRES_PER_DEG_LAT;

scripts/fixtures/street-level/mapillaryGraph.mjs

@@ -2,8 +2,8 @@ import { readFileSync } from 'node:fs';
 
 /**
  * Mapillary Graph API and image CDN answered from fixtures, covering every
- * request the provider and MapillaryJS make while opening, stepping and
- * closing a photo, so the gate needs no network and no real token.
+ * request the provider and MapillaryJS make while opening and closing a
+ * photo, so the gate needs no network and no real token.
  *
  * No `merge_cc` or `sfm_cluster` means MapillaryJS never asks for a mesh or
  * cluster, and empty S2 cells mean no spatial edges, which the gate does not
@@ -21,7 +21,7 @@ export const PHOTO_LINE = Object.freeze({
   north: 38.591,
 });
 /** Metres between consecutive photos on the line (≥ the 3 m cone thinning). */
-export const PHOTO_SPACING_M = 30;
+const PHOTO_SPACING_M = 30;
 /** Fixture thumbnail host (answered, never reached). */
 export const THUMB_HOST = 'qa-fixture.mapillary.com';
 
@@ -181,18 +181,6 @@ export function answerMapillaryRequest({ method, url, images }) {
         : [];
       return { ...json(200, { data }), known: true };
     }
-    if (q.has('lat') && q.has('lng')) {
-      const at = { lat: Number(q.get('lat')), lon: Number(q.get('lng')) };
-      const radius = Math.min(50, Number(q.get('radius')) || 50);
-      const limit = Number(q.get('limit')) || 10;
-      // In no particular order, as the real API answers.
-      const data = photos
-        .filter((image) => metresApart(at, image) <= radius)
-        .reverse()
-        .slice(0, limit)
-        .map((image) => withFields(imageRecord(image), fields));
-      return { ...json(200, { data }), known: true };
-    }
     if (q.has('s2')) return { ...json(200, { data: [] }), known: true };
     return {
       ...json(400, { error: 'unsupported images query' }),

scripts/fixtures/street-level/panoramax.mjs

@@ -28,7 +28,7 @@ export const PNX_PARK = Object.freeze({
   height: 700,
   pitch: -1.4,
 });
-export const PNX_CREATOR = 'Fixture Mapper';
+const PNX_CREATOR = 'Fixture Mapper';
 const PNX_SPACING_M = 10;
 const METRES_PER_DEG_LON = 111_320 * Math.cos((PNX_LINE.lat * Math.PI) / 180);
 const API = 'https://api.panoramax.xyz/api';

scripts/format-scope.json

@@ -2,8 +2,11 @@
   ".prettierrc.json",
   "package.json",
   "scripts/format-scope.json",
+  "src/ui/styles/form-field.css",
+  "scripts/qa-form-fields.mjs",
   "scripts/package-boundaries.json",
   "scripts/format.mjs",
+  "scripts/qa-layer-visibility.mjs",
   "scripts/next-layer-state-token.mjs",
   "scripts/check-layer-state-tokens.mjs",
   "scripts/qa-layer-token-twochar.mjs",
@@ -46,9 +49,6 @@
   "scripts/qa-voice-auth-focus.mjs",
   "src/codexOauthRealtime.test.mjs",
   "src/voice/cloudVoiceAuth.test.mjs",
-  "scripts/qa-panel-resize.mjs",
-  "scripts/qa-panelDrag.mjs",
-  "src/tooling/panelResizeQa.test.mjs",
   "scripts/qa-terrain-429.mjs",
   "src/app/application.js",
   "src/app/application.test.mjs",
@@ -96,6 +96,7 @@
   "server/providers/space/launch-library.js",
   "src/data/spaceProviderRequests.js",
   "src/tooling/spaceProviders.test.mjs",
+  "src/tooling/ll2Integration.test.mjs",
   "server/providers/terrain.js",
   "server/providers/traffic.js",
   "server/providers/firms.js",
@@ -114,11 +115,14 @@
   "server/providers/cctv/catalog.js",
   "server/providers/cctv/lithuania.js",
   "src/data/cctvLithuania.test.mjs",
+  "server/providers/cctv/taiwan.js",
+  "src/data/cctvTaiwan.test.mjs",
   "server/providers/cctv/constants.js",
   "server/providers/cctv/media.js",
   "server/providers/cctv/normalize.js",
   "src/data/cctvMissingNumbers.test.mjs",
   "server/providers/cctv/sources.js",
+  "src/data/cctvSourcePins.test.mjs",
   "server/providers/radio.js",
   "server/providers/radio/catalog.js",
   "server/providers/radio/constants.js",
@@ -181,7 +185,6 @@
   "src/ui/panelRails.js",
   "src/ui/leftPanelRail.js",
   "src/ui/rightPanelRail.js",
-  "src/ui/panelResize.test.mjs",
   "src/ui/panelMeasurement.js",
   "src/ui/panelRailGeometry.js",
   "src/ui/panelRails.test.mjs",
@@ -191,7 +194,11 @@
   "src/ui/visualInput.js",
   "src/ui/visualInput.test.mjs",
   "scripts/qa-visual-input.mjs",
+  "scripts/qa-scope-hud.mjs",
+  "scripts/qa-segmented-controls.mjs",
   "src/ui/displayControls.js",
+  "src/ui/segmentedControl.test.mjs",
+  "src/ui/styles/segmented-control.css",
   "src/ui/displayControls.test.mjs",
   "src/ui/cameraOrientationControls.js",
   "src/ui/cameraOrientationControls.test.mjs",
@@ -279,11 +286,11 @@
   "src/ui/scenePresentation.js",
   "src/ui/sceneControls.test.mjs",
   "scripts/qa-scene-controls.mjs",
-  "src/ui.js",
-  "src/standalone/ui.js",
+  "scripts/qa-action-buttons.mjs",
   "src/ui/applicationShell.js",
   "src/ui/panelLayoutController.js",
   "src/ui/panelPositionControls.js",
+  "src/ui/panelPositionControls.test.mjs",
   "src/ui/recordingControls.js",
   "src/ui/shellElements.js",
   "src/ui/shellFeedback.js",
@@ -301,6 +308,8 @@
   "src/ui/styles/status.css",
   "src/ui/styles/layers.css",
   "src/ui/styles/controls.css",
+  "src/ui/styles/slider.css",
+  "src/ui/styles/action-button.css",
   "src/ui/styles/cctv.css",
   "src/ui/styles/foundation.css",
   "src/ui/styles/first-run.css",
@@ -445,7 +454,9 @@
   "src/data/satellites.js",
   "src/data/rocketLaunches.js",
   "src/layers/satellites/source.test.mjs",
+  "src/layers/satellites/stale.test.mjs",
   "src/layers/launches/source.test.mjs",
+  "src/layers/launches/ingestion.test.mjs",
   "src/layers/installations/lifecycle.js",
   "src/layers/installations/viewport.js",
   "src/layers/installations/controls.js",
@@ -508,7 +519,6 @@
   "src/layers/bikeshare/selection.js",
   "src/data/traffic.js",
   "src/data/bikeshare.js",
-  "src/data/flowTiles.js",
   "src/layers/traffic/source.test.mjs",
   "src/layers/bikeshare/source.test.mjs",
   "src/layers/bikeshare/proxyRoute.test.mjs",
@@ -550,12 +560,15 @@
   "src/data/cctvWarendorf.test.mjs",
   "src/data/cctvCalgary.test.mjs",
   "src/data/cctvCataloniaSource.test.mjs",
+  "src/data/cctvHk.test.mjs",
   "src/data/cctvVegvesen.test.mjs",
   "src/data/cctvNyc.test.mjs",
   "src/data/cctvHouston.test.mjs",
   "src/data/cctvNswSource.test.mjs",
   "src/data/cctvTxdotSource.test.mjs",
   "src/layers/cctv/source.test.mjs",
+  "src/layers/cctv/frames.test.mjs",
+  "src/layers/cctv/rendering.test.mjs",
   "src/data/alprCameras.js",
   "src/data/alprCameras.test.mjs",
   "src/data/dataCredits.test.mjs",
@@ -636,9 +649,9 @@
   "src/voice/control.js",
   "src/voice/realtimeBackend.js",
   "src/voice/realtimeBackend.test.mjs",
+  "src/agent/worldPacket.test.mjs",
   "src/voice/layerSummary.js",
   "build/application-html.js",
-  "src/app/sourceSlot.js",
   "src/app/sources.js",
   "src/ui/composition.js",
   "src/services/application.js",
@@ -691,6 +704,7 @@
   "src/ui/shareRestoration.js",
   "src/ui/visualSettings.js",
   "src/ui/panelChrome.js",
+  "src/ui/panelChrome.radioOwnership.test.mjs",
   "src/testSupport/readShellSource.mjs",
   "src/ui/stateOwners.test.mjs",
   "src/layers/flights/records.js",
@@ -733,6 +747,7 @@
   "src/voice/session.test.mjs",
   "src/layers/alpr/records.js",
   "src/layers/earthquakes/records.js",
+  "src/layers/earthquakes/records.test.mjs",
   "src/sources/sourceSlot.js",
   "src/data/feedState.js",
   "src/app/localGeojsonServices.js",
@@ -858,6 +873,18 @@
   "src/layers/gnss/source.test.mjs",
   "src/layers/gnss/ownership.test.mjs",
   "scripts/qa-gnss.mjs",
+  "server/providers/ghostMaps.js",
+  "server/providers/ghostMaps.test.mjs",
+  "src/app/layers/ghostMaps.js",
+  "src/layers/ghostMaps/index.js",
+  "src/layers/ghostMaps/catalog.js",
+  "src/layers/ghostMaps/kml.js",
+  "src/layers/ghostMaps/records.js",
+  "src/layers/ghostMaps/source.js",
+  "src/layers/ghostMaps/catalog.test.mjs",
+  "src/layers/ghostMaps/records.test.mjs",
+  "src/layers/ghostMaps/lifecycle.test.mjs",
+  "scripts/qa-ghostmaps.mjs",
   "src/layers/cyclones/index.js",
   "src/layers/cyclones/rendering.js",
   "src/layers/cyclones/labels.js",
@@ -906,27 +933,32 @@
   "src/ui/streetLevelPresentation.test.mjs",
   "src/app/layers/streetLevel.js",
   "src/tooling/mapillaryProvider.test.mjs",
+  "src/app/layers/streetLevel.test.mjs",
+  "src/data/idSwitches.js",
+  "src/layers/streetLevel/credits.js",
+  "src/layers/streetLevel/providers/mapillary/index.js",
+  "src/layers/streetLevel/providers/mapillary/provider.test.mjs",
+  "src/layers/streetLevel/params.js",
+  "src/layers/streetLevel/params.test.mjs",
+  "src/layers/streetLevel/pickRouter.js",
+  "src/layers/streetLevel/pickRouter.test.mjs",
+  "src/layers/streetLevel/providerSwitches.test.mjs",
+  "src/layers/streetLevel/registry.js",
+  "src/layers/streetLevel/registry.test.mjs",
+  "src/layers/streetLevel/uiState.js",
+  "src/layers/streetLevel/uiState.test.mjs",
   "src/layers/streetLevel/providers/mapillary/source.test.mjs",
   "src/streetLevelMarkup.test.mjs",
   "src/layers/streetLevel/index.js",
   "src/layers/streetLevel/policy.js",
   "src/layers/streetLevel/filter.js",
-  "src/layers/streetLevel/registry.js",
-  "src/layers/streetLevel/params.js",
-  "src/layers/streetLevel/pickRouter.js",
-  "src/layers/streetLevel/uiState.js",
-  "src/layers/streetLevel/groundCast.js",
-  "src/layers/streetLevel/meshSampler.js",
   "src/layers/streetLevel/view.js",
   "src/layers/streetLevel/marker.js",
-  "src/layers/streetLevel/cameraFollow.js",
-  "src/layers/streetLevel/credits.js",
+  "src/layers/streetLevel/cameraFraming.js",
   "src/layers/streetLevel/viewerHost.js",
-  "src/layers/streetLevel/providers/mapillary/index.js",
   "src/layers/streetLevel/state.js",
-  "src/layers/streetLevel/providers/mapillary/policy.js",
-  "src/layers/streetLevel/providers/mapillary/coverage.js",
-  "src/layers/streetLevel/providers/mapillary/sequences.js",
+  "src/layers/streetLevel/lineCoverage.js",
+  "src/layers/streetLevel/sequenceCones.js",
   "src/layers/streetLevel/glyphs.js",
   "src/layers/streetLevel/providers/mapillary/decode.js",
   "src/layers/streetLevel/tileMath.js",
@@ -939,7 +971,6 @@
   "src/layers/streetLevel/providers/google/viewer.js",
   "src/layers/streetLevel/providers/google/mapsLoader.js",
   "src/layers/streetLevel/groundClick.test.mjs",
-  "src/app/layers/streetLevel.test.mjs",
   "src/layers/streetLevel/providers/google/provider.test.mjs",
   "src/layers/streetLevel/providers/google/viewer.test.mjs",
   "src/layers/streetLevel/providers/google/mapsLoader.test.mjs",
@@ -949,8 +980,6 @@
   "src/layers/streetLevel/providers/kartaview/decode.js",
   "src/layers/streetLevel/providers/kartaview/viewer.js",
   "src/layers/streetLevel/panorama.js",
-  "src/layers/streetLevel/lineCoverage.js",
-  "src/layers/streetLevel/sequenceCones.js",
   "src/layers/streetLevel/providers/kartaview/policy.test.mjs",
   "src/layers/streetLevel/providers/kartaview/decode.test.mjs",
   "src/layers/streetLevel/providers/kartaview/source.test.mjs",
@@ -979,8 +1008,6 @@
   "src/testSupport/kartaViewFakes.mjs",
   "src/testSupport/googleStreetViewFakes.mjs",
   "server/providers/mapillary.js",
-  "server/providers/mapillary/routes.js",
-  "server/providers/mapillary/constants.js",
   "server/providers/mapillary/tiles.js",
   "server/providers/mapillary/trim.js",
   "src/layers/streetLevel/tileMath.test.mjs",
@@ -993,23 +1020,15 @@
   "scripts/fixtures/street-level/kartaView.mjs",
   "scripts/fixtures/street-level/panoramax.mjs",
   "src/layers/streetLevel/filter.test.mjs",
-  "src/layers/streetLevel/registry.test.mjs",
-  "src/layers/streetLevel/params.test.mjs",
-  "src/layers/streetLevel/pickRouter.test.mjs",
-  "src/layers/streetLevel/uiState.test.mjs",
-  "src/layers/streetLevel/groundCast.test.mjs",
-  "src/layers/streetLevel/meshSampler.test.mjs",
   "src/layers/streetLevel/view.test.mjs",
-  "src/layers/streetLevel/providers/mapillary/provider.test.mjs",
+  "src/layers/streetLevel/providers/mapillary/mapillary.test.mjs",
   "src/layers/streetLevel/providers/mapillary/decode.test.mjs",
-  "src/layers/streetLevel/providers/mapillary/coverage.test.mjs",
   "src/layers/streetLevel/providers/mapillary/coverageFixture.mjs",
-  "src/layers/streetLevel/cameraFollow.test.mjs",
+  "src/layers/streetLevel/cameraFraming.test.mjs",
   "src/ui/streetLevelControls.test.mjs",
-  "src/ui/panelDock.test.mjs",
   "src/layers/streetLevel/marker.test.mjs",
   "src/layers/streetLevel/viewerHost.test.mjs",
-  "src/layers/streetLevel/providers/mapillary/sequences.test.mjs",
+  "src/layers/streetLevel/sequenceCones.test.mjs",
   "src/layers/streetLevel/selection.test.mjs",
   "src/layers/streetLevel/index.test.mjs",
   "scripts/qa-overpass-offload.mjs",
@@ -1026,6 +1045,7 @@
   "scripts/qa-context-arrivals.mjs",
   "src/tools/catalog.test.mjs",
   "src/tools/area.test.mjs",
+  "src/tools/results.test.mjs",
   "src/tools/queries/queries.test.mjs",
   "src/tools/mcp/mcp.test.mjs",
   "src/tools/localServer.test.mjs",
@@ -1062,5 +1082,41 @@
   "src/ui/flyToDataSource.test.mjs",
   "scripts/assemble-changelog.mjs",
   "src/tooling/changelogFragments.test.mjs",
-  "src/data/gbfsProxyRateLimit.test.mjs"
+  "src/data/gbfsProxyRateLimit.test.mjs",
+  "src/data/routeSegment.test.mjs",
+  "src/terrainHeightsBounds.test.mjs",
+  "scripts/build-bright-stars.mjs",
+  "scripts/build-milky-way.mjs",
+  "src/sky/stars.test.mjs",
+  "src/sky/starrySky.test.mjs",
+  "src/tooling/skyAssets.test.mjs",
+  "src/tooling/skyAssets.paintOut.test.mjs",
+  "scripts/qa-anime-sky.mjs",
+  "scripts/qa-sky-model-lighting.mjs",
+  "server/providers/overpass/requestAdmission.test.mjs",
+  "src/tooling/trackArrivalObservation.test.mjs",
+  "src/ui/styles/status-badge.css",
+  "src/ui/statusBadge.test.mjs",
+  "src/ui/cctvBadges.test.mjs",
+  "scripts/qa-status-badges.mjs",
+  "src/dockerTrustedPeers.test.mjs",
+  "src/cameraGlobeRotation.test.mjs",
+  "src/voice/globeResetConfirmation.test.mjs",
+  "src/hudDms.test.mjs",
+  "src/voice/panel/preferences.test.mjs",
+  "src/voice/panel/host.test.mjs",
+  "src/voice/panel/manualPanel.test.mjs",
+  "src/voice/panel/nativeActivity.test.mjs",
+  "src/voice/panel/inactivity.test.mjs",
+  "src/voice/panel/actionObserver.test.mjs",
+  "src/voice/panel/testDom.mjs",
+  "src/voice/realtimeCostPanel.test.mjs",
+  "docs/SHARE-LINK-FORMAT.md",
+  "src/share/wire.test.mjs",
+  "src/share/viewCodec.test.mjs",
+  "src/share/legacyShareState.test.mjs",
+  "src/testSupport/shareViewFixtures.mjs",
+  "src/ui/shareLinks.test.mjs",
+  "src/ui/shareButton.test.mjs",
+  "src/share/shareLinkPath.test.mjs"
 ]

scripts/precompute-cctv-heights.mjs

@@ -326,8 +326,10 @@ async function main() {
       'src/data/local_data/cctv_ground_heights/cctv_ground_heights.json',
   );
   let sidecar = await loadSidecar(output);
+  // A cold catalog waits for its slowest pack (Tarktee gets 30 s), so allow
+  // more than that.
   const response = await fetch(`${base}/api/cctv/sources`, {
-    signal: AbortSignal.timeout(30_000),
+    signal: AbortSignal.timeout(60_000),
   });
   if (!response.ok) throw new Error(`Catalog HTTP ${response.status}`);
   const catalog = await response.json();

scripts/qa-action-buttons.mjs

@@ -0,0 +1,335 @@
+#!/usr/bin/env node
+/**
+ * Scenes/CCTV action-button acceptance against dev or production preview:
+ * QA_BASE_URL=http://127.0.0.1:4179 node scripts/qa-action-buttons.mjs
+ * Uses the installed CCTV controller with fixture camera/action ports to prove
+ * native dispatch/disabled/teardown without providers or world calibration writes.
+ * Real Scene authoring/playback remains covered by qa-scene-controls.mjs.
+ */
+import fs from 'node:fs';
+import puppeteer from 'puppeteer';
+
+const browser = await puppeteer.launch({
+  headless: true,
+  args: ['--use-gl=angle', '--use-angle=swiftshader'],
+});
+const page = await browser.newPage();
+const errors = [];
+page.on('pageerror', (error) => errors.push(error.message));
+let failures = 0;
+const check = (name, passed, detail) => {
+  console.log(`[${passed ? 'PASS' : 'FAIL'}] ${name}`);
+  if (!passed) {
+    failures++;
+    console.log(JSON.stringify(detail));
+  }
+};
+const shots = 'qa-shots/action-buttons';
+fs.mkdirSync(shots, { recursive: true });
+
+try {
+  await page.setViewport({ width: 1440, height: 900 });
+  await page.goto(
+    `${process.env.QA_BASE_URL || 'http://127.0.0.1:4179'}/?welcome=0`,
+    { waitUntil: 'domcontentloaded' },
+  );
+  await page.waitForFunction(
+    () =>
+      window.__godsEyeView?.styleManager?._cctvControls &&
+      document.getElementById('loading-screen')?.classList.contains('hidden'),
+    { timeout: 60000 },
+  );
+  const inventory = await page.evaluate(() => {
+    const ids = [
+      'scene-new-btn',
+      'scene-delete-btn',
+      'scene-capture-btn',
+      'scene-update-shot-btn',
+      'scene-start-btn',
+      'scene-stop-btn',
+      'scene-next-btn',
+      'scene-export-btn',
+      'scene-import-btn',
+      'scene-download-btn',
+      'cctv-nearest-btn',
+      'cctv-prev-btn',
+      'cctv-next-btn',
+      'cctv-focus-btn',
+      'cctv-calib-save-btn',
+      'cctv-calib-reset-btn',
+    ];
+    const ordinary = ids.map((id) => document.getElementById(id));
+    const generated = [
+      ...document.querySelectorAll(
+        '.scene-shot-btn, [data-director-authoring] button',
+      ),
+    ];
+    const toggles = [
+      'cctv-enable-btn',
+      'cctv-coverage-btn',
+      'cctv-auto-hop-btn',
+      'cctv-projection-btn',
+      'cctv-adjust-btn',
+    ].map((id) => document.getElementById(id));
+    return {
+      shared: [...ordinary, ...generated].every(
+        (node) =>
+          node?.type === 'button' &&
+          node.classList.contains('gev-action-button'),
+      ),
+      generated: generated.length,
+      layout: ordinary.every((node) => {
+        const style = getComputedStyle(node);
+        return style.minWidth === '72px' && style.flexGrow === '1';
+      }),
+      togglesSeparate: toggles.every(
+        (node) => node && !node.classList.contains('gev-action-button'),
+      ),
+      compactDanger: !!document.querySelector(
+        '.scene-shot-danger.gev-action-button--compact.gev-action-button--danger',
+      ),
+    };
+  });
+  check(
+    'static and generated actions share the native component',
+    inventory.shared && inventory.generated >= 4 && inventory.compactDanger,
+    inventory,
+  );
+  check(
+    'persistent CCTV toggles retain their existing controls',
+    inventory.togglesSeparate,
+  );
+  check('ordinary actions retain their panel sizing', inventory.layout);
+
+  await page.evaluate(() => {
+    const manager = window.__godsEyeView.styleManager;
+    const owner = manager._cctvControls;
+    owner._cctvUnsubscribe?.();
+    owner._cctvUnsubscribe = null;
+    window.__qaButtonCalls = [];
+    const record = (...args) => window.__qaButtonCalls.push(args);
+    owner.actions = {
+      ...owner.actions,
+      isEnabled: () => true,
+      toggleEnabled: async () => {
+        record('enable');
+        return true;
+      },
+      runExplicitFocus: (select, focus) => focus(select()),
+      setParams: (params, options) => record('params', params, options),
+      showToast: () => {},
+    };
+    owner.cctv = {
+      focusNearest: () => {
+        record('nearest');
+        return 'a';
+      },
+      cycleCamera: (direction) => {
+        record('cycle', direction);
+        return 'b';
+      },
+      focusCamera: (id, seconds) => record('focus', id, seconds),
+    };
+    window.__qaCameraState = {
+      enabled: true,
+      activeCameraId: 'a',
+      cameras: [
+        { id: 'a', city: 'Fixture', name: 'A' },
+        { id: 'b', city: 'Fixture', name: 'B' },
+      ],
+      activeCamera: { id: 'a', name: 'A', basePose: {} },
+    };
+    owner._renderCctvState(window.__qaCameraState);
+    manager.setPanelCollapsed('cctv-panel', false, {
+      persist: false,
+      syncShare: false,
+    });
+  });
+  await page.focus('#cctv-next-btn');
+  await page.keyboard.press('Space');
+  await page.waitForFunction(() => window.__qaButtonCalls.length === 3);
+  check(
+    'native Space dispatches Next and its focus once',
+    await page.evaluate(
+      () =>
+        JSON.stringify(window.__qaButtonCalls) ===
+        JSON.stringify([['enable'], ['cycle', 1], ['focus', 'b', 1.4]]),
+    ),
+  );
+  check(
+    'native keyboard activation keeps a visible focus ring',
+    await page.$eval(
+      '#cctv-next-btn',
+      (node) =>
+        document.activeElement === node &&
+        getComputedStyle(node).outlineStyle === 'solid',
+    ),
+  );
+  await page.evaluate(() => {
+    window.__qaButtonCalls = [];
+  });
+  await page.focus('#cctv-prev-btn');
+  await page.keyboard.press('Enter');
+  await page.waitForFunction(() => window.__qaButtonCalls.length === 3);
+  check(
+    'native Enter dispatches Previous once',
+    await page.evaluate(
+      () =>
+        JSON.stringify(window.__qaButtonCalls) ===
+        JSON.stringify([['enable'], ['cycle', -1], ['focus', 'b', 1.4]]),
+    ),
+  );
+
+  for (const [id, expected] of [
+    ['cctv-nearest-btn', [['enable'], ['nearest'], ['focus', 'a', 1.8]]],
+    [
+      'cctv-focus-btn',
+      [
+        ['enable'],
+        ['focus', 'a', 1.9],
+        ['params', { selectedCameraId: 'a' }, { origin: 'user' }],
+      ],
+    ],
+  ]) {
+    await page.evaluate(() => {
+      window.__qaButtonCalls = [];
+    });
+    await page.click(`#${id}`);
+    await page.waitForFunction(() => window.__qaButtonCalls.length === 3);
+    const calls = await page.evaluate(() => window.__qaButtonCalls);
+    check(
+      `${id} retains its existing action and focus timing`,
+      JSON.stringify(calls) === JSON.stringify(expected),
+      calls,
+    );
+  }
+
+  await page.evaluate(() => {
+    window.__qaButtonCalls = [];
+  });
+  await page.click('#cctv-calib-save-btn');
+  await page.click('#cctv-calib-reset-btn');
+  const calibration = await page.evaluate(() => window.__qaButtonCalls);
+  check(
+    'Save and Reset retain camera identity and user-origin dispatch',
+    JSON.stringify(calibration) ===
+      JSON.stringify([
+        [
+          'params',
+          { selectedCameraId: 'a', calibration: { cameraId: 'a', save: true } },
+          { origin: 'user' },
+        ],
+        [
+          'params',
+          {
+            selectedCameraId: 'a',
+            calibration: { cameraId: 'a', reset: true },
+          },
+          { origin: 'user' },
+        ],
+      ]),
+    calibration,
+  );
+  await page.evaluate(() => {
+    window.__qaButtonCalls = [];
+    window.__godsEyeView.styleManager._cctvControls._renderCctvState({
+      enabled: false,
+    });
+  });
+  await page.click('#cctv-next-btn');
+  await page.waitForFunction(
+    () => {
+      const node = document.getElementById('cctv-next-btn');
+      return node.disabled && Number(getComputedStyle(node).opacity) === 0.45;
+    },
+    { timeout: 3000 },
+  );
+  check(
+    'disabled actions stay inert and keep disabled presentation',
+    await page.$eval(
+      '#cctv-next-btn',
+      (node) =>
+        node.disabled &&
+        getComputedStyle(node).opacity === '0.45' &&
+        window.__qaButtonCalls.length === 0,
+    ),
+  );
+
+  for (const width of [1440, 620, 390]) {
+    await page.setViewport({ width, height: 900 });
+    for (const panel of ['scene-panel', 'cctv-panel']) {
+      await page.evaluate((panel) => {
+        window.__godsEyeView.styleManager.setPanelCollapsed(panel, false, {
+          persist: false,
+          syncShare: false,
+        });
+      }, panel);
+      const fit = await page.$eval(`#${panel}`, (root) => {
+        const buttons = [...root.querySelectorAll('.gev-action-button')];
+        const rect = root.getBoundingClientRect();
+        return {
+          count: buttons.length,
+          fits:
+            buttons.length > 0 &&
+            buttons.every((button) => {
+              const box = button.getBoundingClientRect();
+              return (
+                box.width > 0 &&
+                box.left >= rect.left &&
+                box.right <= rect.right + 1 &&
+                box.left >= 0 &&
+                box.right <= innerWidth + 1 &&
+                button.scrollWidth <= button.clientWidth
+              );
+            }),
+        };
+      });
+      check(`${panel} actions fit at ${width}px`, fit.fits, fit);
+      if (width !== 620)
+        await page.screenshot({ path: `${shots}/${panel}-${width}.png` });
+    }
+  }
+  await page.evaluate(() => {
+    const owner = window.__godsEyeView.styleManager._cctvControls;
+    owner.destroy();
+    document.getElementById('cctv-next-btn').disabled = false;
+    window.__qaButtonCalls = [];
+  });
+  await page.click('#cctv-next-btn');
+  check(
+    'destroyed controllers revoke action listeners',
+    await page.evaluate(() => window.__qaButtonCalls.length === 0),
+  );
+  const localized = new URL(page.url());
+  localized.searchParams.set('lang', 'ru');
+  await page.goto(localized.href, { waitUntil: 'domcontentloaded' });
+  await page.waitForFunction(
+    () =>
+      window.__godsEyeView?.styleManager?._cctvControls &&
+      document.getElementById('loading-screen')?.classList.contains('hidden'),
+    { timeout: 60000 },
+  );
+  for (const panel of ['scene-panel', 'cctv-panel']) {
+    await page.evaluate((panel) => {
+      window.__godsEyeView.styleManager.setPanelCollapsed(panel, false, {
+        persist: false,
+        syncShare: false,
+      });
+    }, panel);
+    const translated = await page.$eval(`#${panel}`, (root) => {
+      const buttons = [...root.querySelectorAll('.gev-action-button')];
+      return (
+        document.documentElement.lang === 'ru' &&
+        buttons.length > 0 &&
+        buttons.every((node) => node.scrollWidth <= node.clientWidth)
+      );
+    });
+    check(`Russian ${panel} action labels fit at 390px`, translated);
+    await page.screenshot({ path: `${shots}/${panel}-ru-390.png` });
+  }
+  check('no uncaught browser errors', errors.length === 0, errors);
+} finally {
+  await browser.close();
+}
+console.log(`RESULT: ${failures} failures`);
+process.exitCode = failures ? 1 : 0;

scripts/qa-anime-sky.mjs

@@ -0,0 +1,160 @@
+#!/usr/bin/env node
+/**
+ * qa-anime-sky — the anime style must leave the sky without bands.
+ *
+ * Anime's luminance bands turn the faint Milky Way into blotches, so
+ * src/ui/visualEffects.js fades the glow out with the style. Headless against
+ * a Vite dev server, both sky assets must be ready. Normal must show the
+ * Galactic Centre glow (at least 2 % of pixels at luma >= 10/255), then
+ * Anime must retain stars while at most 0.5 % reaches the first cel band.
+ * The Normal baseline measured 43 % in headless Chromium at 1000×700;
+ * the 2 % floor leaves room for GPU differences while rejecting a black sky.
+ *
+ * Usage: node scripts/qa-anime-sky.mjs [--url http://localhost:4333/]
+ * Exit: 0 pass, 1 fail, 2 the anime style was not reached.
+ */
+import puppeteer from 'puppeteer';
+
+const i = process.argv.indexOf('--url');
+const URL_ =
+  i > 0 && process.argv[i + 1] ? process.argv[i + 1] : 'http://localhost:4333/';
+
+const browser = await puppeteer.launch({
+  headless: 'new',
+  args: ['--no-sandbox', '--ignore-gpu-blocklist'],
+});
+try {
+  const page = await browser.newPage();
+  await page.setRequestInterception(true);
+  page.on('request', (request) => {
+    const host = new URL(request.url()).hostname;
+    if (host.endsWith('halfpixel.ai') || host.includes('worldfx'))
+      request.abort();
+    else request.continue();
+  });
+  page.on('pageerror', (e) => console.log('PAGEERR', String(e).slice(0, 300)));
+  await page.setViewport({ width: 1000, height: 700 });
+  await page.evaluateOnNewDocument(() =>
+    localStorage.setItem('gev:first-run-mission:v1', 'suppressed'),
+  );
+  await page.goto(URL_, { waitUntil: 'domcontentloaded' });
+  await page.waitForFunction(() => window.__godsEyeView?.viewer?.scene, {
+    timeout: 120000,
+  });
+  await page.waitForFunction(
+    () => {
+      const sky = window.__godsEyeView.viewer.scene.skyBox;
+      return (
+        sky?._milkyWayCubeMap &&
+        sky?._starCommand &&
+        document.getElementById('loading-screen')?.classList.contains('hidden')
+      );
+    },
+    { timeout: 60000 },
+  );
+  const r = await page.evaluate(async () => {
+    const entry = performance
+      .getEntriesByType('resource')
+      .map((e) => e.name)
+      .find((n) => /\.vite\/deps\/cesium\.js/.test(n));
+    if (!entry)
+      throw new Error(
+        'run against the Vite dev server (needs .vite/deps/cesium.js)',
+      );
+    const C = await import(entry),
+      g = window.__godsEyeView,
+      v = g.viewer,
+      s = v.scene;
+    g.styleManager.setStyle('normal', { userInitiated: true });
+    const t = v.clock.currentTime;
+    await C.Transforms.preloadIcrfFixed(
+      new C.TimeInterval({
+        start: C.JulianDate.addDays(t, -1, new C.JulianDate()),
+        stop: C.JulianDate.addDays(t, 1, new C.JulianDate()),
+      }),
+    );
+    const m = C.Transforms.computeIcrfToFixedMatrix(t);
+    const ra = C.Math.toRadians(266.4),
+      dec = C.Math.toRadians(-29);
+    const look = C.Matrix3.multiplyByVector(
+      m,
+      new C.Cartesian3(
+        Math.cos(dec) * Math.cos(ra),
+        Math.cos(dec) * Math.sin(ra),
+        Math.sin(dec),
+      ),
+      new C.Cartesian3(),
+    );
+    const north = C.Matrix3.multiplyByVector(
+      m,
+      C.Cartesian3.UNIT_Z,
+      new C.Cartesian3(),
+    );
+    const right = C.Cartesian3.normalize(
+      C.Cartesian3.cross(look, north, new C.Cartesian3()),
+      new C.Cartesian3(),
+    );
+    s.camera.cancelFlight();
+    s.tweens.removeAll();
+    s.camera.setView({
+      destination: C.Cartesian3.multiplyByScalar(look, 3e7, new C.Cartesian3()),
+      orientation: {
+        direction: look,
+        up: C.Cartesian3.cross(right, look, new C.Cartesian3()),
+      },
+    });
+    const gl = s.context._gl,
+      w = gl.drawingBufferWidth,
+      h = gl.drawingBufferHeight,
+      px = new Uint8Array(w * h * 4);
+    const measure = async () => {
+      await new Promise((res) => setTimeout(res, 2500));
+      s.requestRender();
+      s.render();
+      gl.readPixels(0, 0, w, h, gl.RGBA, gl.UNSIGNED_BYTE, px);
+      let banded = 0;
+      let visible = 0;
+      for (let i = 0; i < px.length; i += 4) {
+        const luma = 0.299 * px[i] + 0.587 * px[i + 1] + 0.114 * px[i + 2];
+        if (luma >= 51) banded++;
+        if (luma >= 10) visible++;
+      }
+      return { banded, visible };
+    };
+    const normal = await measure();
+    g.styleManager.setStyle('anime', { userInitiated: true });
+    const anime = await measure();
+    let animeOn = false;
+    for (let i = 0; i < s.postProcessStages.length; i++) {
+      const stage = s.postProcessStages.get(i);
+      if (stage.name === 'godsEyeView_anime')
+        animeOn = stage.enabled && stage.uniforms.intensity > 0.99;
+    }
+    return {
+      total: px.length / 4,
+      normal,
+      ...anime,
+      assetsReady: Boolean(s.skyBox._milkyWayCubeMap && s.skyBox._starCommand),
+      visibility: s.skyBox.milkyWayVisibility,
+      animeOn,
+    };
+  });
+  const tag =
+    !r.animeOn || !r.assetsReady
+      ? 'UNREACHED'
+      : r.normal.visible >= 0.02 * r.total &&
+          r.banded > 0 &&
+          r.banded <= 0.005 * r.total &&
+          r.visibility === 0
+        ? 'PASS'
+        : 'FAIL';
+  console.log(
+    `${tag}: ${r.banded} of ${r.total} sky pixels at or above the first cel band (luma >= 0.2)\n     ${JSON.stringify(r)}`,
+  );
+  process.exitCode = tag === 'PASS' ? 0 : tag === 'FAIL' ? 1 : 2;
+} catch (error) {
+  console.error(`UNREACHED: ${error.message}`);
+  process.exitCode = 2;
+} finally {
+  await browser.close();
+}

scripts/qa-browserEvidence.mjs

@@ -7,10 +7,10 @@ import fs from 'node:fs/promises';
 import path from 'node:path';
 
 /** Console messages and failed requests kept per page. */
-export const EVIDENCE_LIMIT = 200;
+const EVIDENCE_LIMIT = 200;
 
 /** Cesium's console line when the render loop throws (CesiumWidget). */
-export const RENDER_ERROR_PATTERN = /An error occurred while rendering/i;
+const RENDER_ERROR_PATTERN = /An error occurred while rendering/i;
 
 /** Mask tokens in a URL or message before it is printed or saved. */
 export function redact(text) {

scripts/qa-camera-controls.mjs

@@ -370,6 +370,9 @@ try {
   await page.screenshot({ path: 'qa-shots/camera-controls/angle.png' });
   await page.setViewport({ width: 390, height: 844 });
   await new Promise((resolve) => setTimeout(resolve, 700));
+  // Phones present CCTV in the Cameras tab's sheet.
+  await page.click('#mobile-tab-bar [data-mobile-sheet="cameras"]');
+  await new Promise((resolve) => setTimeout(resolve, 400));
   await page.screenshot({ path: 'qa-shots/camera-controls/narrow.png' });
   check(
     'narrow camera panel remains within the viewport',

scripts/qa-cctv-v2.mjs

@@ -11,8 +11,10 @@
  *      exactly once per camera ACTIVATION (the §9.1 obstruction probe) and
  *      never again in steady state; shared mesh-floor sampling fires at most
  *      once per coarse cell during the staggered geometry-load drain, and
- *      actually COMPLETES once tiles load (>=1 real sample — the
- *      ceiling alone would pass trivially at Δ=0 if the snap never finished),
+ *      actually COMPLETES once tiles load in photoreal mode (>=1 real sample
+ *      — the ceiling alone would pass trivially at Δ=0 if the snap never
+ *      finished). Globe mode instead proves the rendered mount uses a real
+ *      terrain height with zero mesh samples. Sampling
  *      stays flat while idle, and stays flat for non-positional pose edits.
  *   2. Geometry contract: the 5-polyline frustum wireframe + far-cap plane
  *      exist for the active camera, the plane's corners coincide with the
@@ -139,6 +141,56 @@ function record(name, ok, detail) {
 
 const sleep = (ms) => new Promise((r) => setTimeout(r, ms));
 
+// Each page.evaluate is bounded by puppeteer's `protocolTimeout` (default
+// 180s). Waits never come close: they poll from Node (below). The headroom is
+// for the few long evaluates, such as enabling the full ~3,700-camera catalog
+// on a real GPU, and matches the other qa-*.mjs harnesses.
+const PROTOCOL_TIMEOUT_MS = 300_000;
+
+/**
+ * Polls an in-page predicate from Node, one short page.evaluate per tick,
+ * until it holds or the budget runs out. Used instead of page.waitForFunction
+ * for two reasons: its default rAF polling stops in a minimised or hidden
+ * headful window (timers keep running, rAF does not), and its result is one
+ * CDP call that protocolTimeout cuts off, while the headful drain budget
+ * reaches ~50 minutes. A predicate that throws fails the run instead of
+ * silently spending the budget.
+ * @param {import('puppeteer').Page} page
+ * @param {Function} predicate - In-page predicate.
+ * @param {object} opts
+ * @param {number} opts.timeoutMs - Overall budget.
+ * @param {number} [opts.intervalMs=250] - Delay between checks.
+ * @param {unknown[]} [opts.args=[]] - Arguments passed to the predicate.
+ *   The predicate must return a boolean: its result crosses CDP by value.
+ * @returns {Promise<boolean>} True if the predicate held within the budget.
+ */
+async function waitForPredicate(
+  page,
+  predicate,
+  { timeoutMs, intervalMs = 250, args = [] },
+) {
+  // performance.now() is monotonic and doesn't advance while the machine
+  // sleeps, so neither a clock change nor a laptop sleep eats the budget.
+  const deadline = performance.now() + timeoutMs;
+  for (;;) {
+    try {
+      if (await page.evaluate(predicate, ...args)) return true;
+    } catch (err) {
+      // A navigation or Vite reload replaces the execution context: poll again.
+      if (
+        !/Execution context was destroyed|Cannot find context/.test(
+          err?.message ?? '',
+        )
+      ) {
+        throw err;
+      }
+    }
+    const remaining = deadline - performance.now();
+    if (remaining <= 0) return false;
+    await sleep(Math.min(intervalMs, remaining));
+  }
+}
+
 // SwiftShader can spend tens of seconds servicing the hover drillPick emitted
 // by page.mouse.move(), before the LEFT_DOWN under test even runs. Position the
 // pointer while ADJUST is disabled, then re-enable it and explicitly render a
@@ -155,29 +207,58 @@ async function positionPointerForGizmoDrag(page, point, frameCount = 3) {
     gev.dataManager.layers
       .get('cctv')
       .module.setParams({ calibrationMode: true });
-    const scene = gev.viewer.scene;
-    let rendered = 0;
-    return new Promise((resolve) => {
-      let settled = false;
-      const finish = (complete) => {
-        if (settled) return;
-        settled = true;
-        clearTimeout(timer);
-        remove();
-        resolve(complete);
-      };
-      const remove = scene.postRender.addEventListener(() => {
-        rendered += 1;
-        if (rendered >= count) {
-          finish(true);
-          return;
-        }
+    return (await window.__qaRenderFrames(count, 5000)) >= count;
+  }, frameCount);
+}
+
+/**
+ * Saves a screenshot for human review. These are never a gate, so a capture
+ * that fails (for example when the renderer stalls in a hidden headful window)
+ * is logged instead of ending the run.
+ * @param {import('puppeteer').Page} page
+ * @param {string} file
+ * @param {string} label
+ */
+async function saveReviewShot(page, file, label) {
+  try {
+    await page.screenshot({ path: file });
+    console.log(`  screenshot (${label}) → ${path.relative(REPO_ROOT, file)}`);
+  } catch (err) {
+    console.warn(
+      `  screenshot skipped (${label}): ${path.relative(REPO_ROOT, file)}: ${err?.message ?? err}`,
+    );
+  }
+}
+
+/**
+ * Installs window.__qaRenderFrames(count, capMs) in the page: requests renders
+ * until `count` frames have passed scene.postRender or capMs runs out, and
+ * resolves with the number of frames rendered. The cap keeps a stalled
+ * renderer (headful window asleep or hidden) from hanging the CDP call.
+ * @param {import('puppeteer').Page} page
+ */
+function installRenderFramesHelper(page) {
+  return page.evaluate(() => {
+    window.__qaRenderFrames = (count, capMs) =>
+      new Promise((resolve) => {
+        const scene = window.__godsEyeView.viewer.scene;
+        let frames = 0;
+        const finish = () => {
+          clearTimeout(timer);
+          remove();
+          resolve(frames);
+        };
+        const remove = scene.postRender.addEventListener(() => {
+          if (++frames >= count) {
+            finish();
+            return;
+          }
+          scene.requestRender();
+        });
+        const timer = setTimeout(finish, capMs);
         scene.requestRender();
       });
-      const timer = setTimeout(() => finish(false), 5000);
-      scene.requestRender();
-    });
-  }, frameCount);
+  });
 }
 
 // In-page helper (stringified and re-defined inside each evaluate that needs
@@ -280,23 +361,21 @@ const BEARING_SHIFT_SRC = `
  * @returns {Promise<boolean>} True if tilesLoaded was observed within the timeout.
  */
 function waitForTilesLoaded(page, timeoutMs = 15000) {
-  return page
-    .waitForFunction(
-      () => {
-        const scene = window.__godsEyeView.viewer.scene;
-        const prims = scene.primitives;
-        for (let i = 0; i < prims.length; i++) {
-          const p = prims.get(i);
-          if (p && p.constructor && p.constructor.name === 'Cesium3DTileset') {
-            return p.tilesLoaded === true;
-          }
+  return waitForPredicate(
+    page,
+    () => {
+      const scene = window.__godsEyeView.viewer.scene;
+      const prims = scene.primitives;
+      for (let i = 0; i < prims.length; i++) {
+        const p = prims.get(i);
+        if (p && p.constructor && p.constructor.name === 'Cesium3DTileset') {
+          return p.tilesLoaded === true;
         }
-        return true; // no tileset in the scene — nothing to wait for
-      },
-      { timeout: timeoutMs },
-    )
-    .then(() => true)
-    .catch(() => false);
+      }
+      return true; // no tileset in the scene — nothing to wait for
+    },
+    { timeoutMs },
+  );
 }
 
 /**
@@ -364,6 +443,10 @@ async function main() {
   const chromeExecutable = findChromeExecutable();
   const browser = await puppeteer.launch({
     headless: HEADFUL ? false : 'new',
+    protocolTimeout: PROTOCOL_TIMEOUT_MS,
+    // Talk CDP over a pipe, so no debugging port stays open on localhost for
+    // the length of a headful run.
+    pipe: true,
     ...(chromeExecutable ? { executablePath: chromeExecutable } : {}),
     args: [
       '--no-sandbox',
@@ -397,13 +480,18 @@ async function main() {
     });
     console.log('Loading app...');
     await page.goto(APP_URL, { waitUntil: 'domcontentloaded', timeout: 60000 });
-    await page.waitForFunction(
+    const appReady = await waitForPredicate(
+      page,
       () =>
-        window.__godsEyeView &&
-        window.__godsEyeView.viewer &&
-        window.__godsEyeView.dataManager,
-      { timeout: 60000 },
+        Boolean(
+          window.__godsEyeView &&
+          window.__godsEyeView.viewer &&
+          window.__godsEyeView.dataManager,
+        ),
+      { timeoutMs: 60000 },
     );
+    if (!appReady) throw new Error('app did not initialise within 60s');
+    await installRenderFramesHelper(page);
     // Let the initial fly-to Austin and first tiles settle.
     await sleep(4000);
 
@@ -475,18 +563,15 @@ async function main() {
     console.log(
       `Waiting for geometry-load queue to drain (N=${camCount}, budget ${Math.round(drainBudgetMs / 1000)}s)...`,
     );
-    const drained = await page
-      .waitForFunction(
-        () => {
-          const mod =
-            window.__godsEyeView.dataManager.layers.get('cctv').module;
-          const ui = mod.getUIState();
-          return ui.loading && ui.loading.active === false;
-        },
-        { timeout: drainBudgetMs },
-      )
-      .then(() => true)
-      .catch(() => false);
+    const drained = await waitForPredicate(
+      page,
+      () => {
+        const mod = window.__godsEyeView.dataManager.layers.get('cctv').module;
+        const ui = mod.getUIState();
+        return Boolean(ui.loading) && ui.loading.active === false;
+      },
+      { timeoutMs: drainBudgetMs, intervalMs: 1000 },
+    );
     record(
       `geometry-load queue drains within ${Math.round(drainBudgetMs / 1000)}s (N=${camCount})`,
       drained ? true : HEADFUL ? false : null,
@@ -575,27 +660,87 @@ async function main() {
     // (existence, not just ceiling). The wait below tolerates the update-tick
     // latency of the completion pass (update interval is 10s).
     // -----------------------------------------------------------------------
-    console.log('Waiting for tiles + the one-shot completion pass...');
-    const tilesSeenLoaded = await waitForTilesLoaded(page, 45000);
-    let sampleFloorOk = false;
-    if (tilesSeenLoaded) {
-      sampleFloorOk = await page
-        .waitForFunction(
-          (base) => window.__qaCounters.sampleHeight - base >= 1,
-          { timeout: 30000 },
-          c0.sampleHeight,
-        )
-        .then(() => true)
-        .catch(() => false);
-    }
-    const cFloor = await readCounters();
-    record(
-      '>=1 real ground sample once tilesLoaded observed (one-shot snap completed)',
-      tilesSeenLoaded ? sampleFloorOk : null,
-      tilesSeenLoaded
-        ? `total real samples since enable=${cFloor.sampleHeight - c0.sampleHeight}`
-        : 'tilesLoaded never observed within 45s — floor not assessable this run',
+    const globeMode = await page.evaluate(
+      () => window.__godsEyeView.viewer.scene.globe?.show !== false,
     );
+    if (globeMode) {
+      // Globe stacks intentionally perform no scene.sampleHeight query.
+      // Require independently fetched DEM heights and the actual rendered
+      // mount, so a catalog/geoid fallback cannot turn zero samples into a pass.
+      console.log(
+        'Checking terrain-globe completion against live DEM heights...',
+      );
+      const terrain = await page.evaluate(async () => {
+        const camera = window.__godsEyeView.dataManager.layers
+          .get('cctv')
+          .module.getUIState().activeCamera;
+        const exact = `${camera.lon.toFixed(5)},${camera.lat.toFixed(5)}`;
+        const cell = `${camera.lon.toFixed(3)},${camera.lat.toFixed(3)}`;
+        const response = await fetch(
+          `/api/terrain/heights?points=${encodeURIComponent(`${exact};${cell}`)}`,
+          { signal: AbortSignal.timeout(30000) },
+        );
+        const body = await response.json();
+        return { ok: response.ok, results: body.results };
+      });
+      const heights = terrain.results?.map((result) => result?.ellipsoid);
+      const terrainReady =
+        terrain.ok && heights?.length === 2 && heights.every(Number.isFinite);
+      const mountResolved =
+        terrainReady &&
+        (await waitForPredicate(
+          page,
+          (expected, base) => {
+            const { viewer, dataManager } = window.__godsEyeView;
+            const camera = dataManager.layers
+              .get('cctv')
+              .module.getUIState().activeCamera;
+            const ray = viewer.entities.getById(`cctv-${camera.id}-ray-tl`);
+            const mount = ray?.polyline?.positions.getValue(
+              viewer.clock.currentTime,
+            )?.[0];
+            const height =
+              mount &&
+              viewer.scene.globe.ellipsoid.cartesianToCartographic(mount)
+                .height;
+            return (
+              Number.isFinite(camera.groundPriorM) &&
+              Math.abs(camera.groundPriorM - expected[0]) < 0.01 &&
+              Number.isFinite(height) &&
+              expected.some(
+                (ground) =>
+                  Math.abs(height - ground - camera.mountHeightM) < 0.05,
+              ) &&
+              window.__qaCounters.sampleHeight === base
+            );
+          },
+          { timeoutMs: 30000, args: [heights, c0.sampleHeight] },
+        ));
+      record(
+        'terrain-globe completion uses a real DEM height at the rendered mount without mesh samples',
+        Boolean(mountResolved),
+        `terrain=${JSON.stringify(heights)}, mesh sample Δ=${(await readCounters()).sampleHeight - c0.sampleHeight}`,
+      );
+    } else {
+      console.log('Waiting for tiles + the one-shot completion pass...');
+      const tilesSeenLoaded = await waitForTilesLoaded(page, 45000);
+      let sampleFloorOk = false;
+      if (tilesSeenLoaded) {
+        sampleFloorOk = await waitForPredicate(
+          page,
+          (base) => window.__qaCounters.sampleHeight - base >= 1,
+          { timeoutMs: 30000, args: [c0.sampleHeight] },
+        );
+      }
+      const cFloor = await readCounters();
+      record(
+        '>=1 real ground sample once tilesLoaded observed (one-shot snap completed)',
+        tilesSeenLoaded ? sampleFloorOk : null,
+        tilesSeenLoaded
+          ? `total real samples since enable=${cFloor.sampleHeight - c0.sampleHeight}`
+          : 'tilesLoaded never observed within 45s — floor not assessable this run',
+      );
+    }
 
     // Let the completion pass finish before the steady-state window: require
     // the sampleHeight counter quiet for 12s (> the 10s update interval, so
@@ -1358,18 +1503,7 @@ async function main() {
         },
       });
       window.__qaCctvSiblingOwner = owner;
-      await new Promise((resolve) => {
-        let frames = 0;
-        const remove = scene.postRender.addEventListener(() => {
-          if (++frames < 3) {
-            scene.requestRender();
-            return;
-          }
-          remove();
-          resolve();
-        });
-        scene.requestRender();
-      });
+      const framesRendered = await window.__qaRenderFrames(3, 10000);
       const rect = scene.canvas.getBoundingClientRect();
       const picked = scene.pick(canvasPoint);
       const pickedId = picked?.id?.id ?? picked?.id ?? null;
@@ -1382,26 +1516,33 @@ async function main() {
           typeof pickedId === 'string' ? pickedId : (pickedId?.id ?? null),
         ownerId: owner.id,
         ownsExactObject: picked?.id === owner,
+        framesRendered,
         projectionDelta: Math.hypot(
           projected.x - canvasPoint.x,
           projected.y - canvasPoint.y,
         ),
       };
     }, emptyClickPoint);
+    const siblingOwnsPick =
+      siblingTarget?.pickedId === 'qa-cctv-sibling-owner' &&
+      siblingTarget.ownsExactObject;
+    // No frame at all within the 10s cap points at a stalled renderer rather
+    // than at picking, though the harness can't rule out both. Fail it on the
+    // real-GPU sign-off path; leave it inconclusive under headless GL. A slow
+    // SwiftShader frame (1-2 of 3) still counts as a real miss.
+    const siblingRendererStalled =
+      siblingTarget && !siblingOwnsPick && siblingTarget.framesRendered === 0;
     record(
       'sibling test object owns its canvas pick',
+      !siblingTarget
+        ? null
+        : siblingOwnsPick ||
+            (siblingRendererStalled && !HEADFUL ? null : false),
       siblingTarget
-        ? siblingTarget.pickedId === 'qa-cctv-sibling-owner' &&
-            siblingTarget.ownsExactObject
-        : null,
-      siblingTarget
-        ? `picked=${siblingTarget.pickedId} exactOwner=${siblingTarget.ownsExactObject} projectionΔ=${siblingTarget.projectionDelta}`
+        ? `${siblingRendererStalled ? 'renderer stalled: ' : ''}frames=${siblingTarget.framesRendered}/3 picked=${siblingTarget.pickedId} exactOwner=${siblingTarget.ownsExactObject} projectionΔ=${siblingTarget.projectionDelta}`
         : 'no previously verified empty canvas ray was available',
     );
-    if (
-      siblingTarget?.pickedId === 'qa-cctv-sibling-owner' &&
-      siblingTarget.ownsExactObject
-    ) {
+    if (siblingOwnsPick) {
       await page.mouse.click(siblingTarget.x, siblingTarget.y);
       await sleep(250);
     }
@@ -1426,8 +1567,7 @@ async function main() {
     });
     record(
       'sibling canvas click passes through without CCTV selection or deselection',
-      siblingTarget?.pickedId === 'qa-cctv-sibling-owner' &&
-        siblingTarget.ownsExactObject
+      siblingOwnsPick
         ? siblingClick.activeId === clickEvidenceSetup.activeId &&
             siblingClick.transitions === siblingClick.baselineTransitions &&
             siblingClick.focusEvents === 0 &&
@@ -1626,10 +1766,7 @@ async function main() {
     );
 
     const viewshedShot = path.join(SHOTS_DIR, 'cctv-v3-viewshed.png');
-    await page.screenshot({ path: viewshedShot });
-    console.log(
-      `  screenshot (visual review only) → ${path.relative(REPO_ROOT, viewshedShot)}`,
-    );
+    await saveReviewShot(page, viewshedShot, 'visual review only');
 
     // =========================================================================
     // Group 7: calibration gizmo (v3 design §3c — ADJUST mode + drag)
@@ -1963,10 +2100,7 @@ async function main() {
     // -----------------------------------------------------------------------
     await sleep(1000);
     const shot = path.join(SHOTS_DIR, 'cctv-v2-active.png');
-    await page.screenshot({ path: shot });
-    console.log(
-      `  screenshot (visual review only, not a gate) → ${path.relative(REPO_ROOT, shot)}`,
-    );
+    await saveReviewShot(page, shot, 'visual review only, not a gate');
 
     // No console errors during the whole exercise.
     record(

scripts/qa-chrome.mjs

@@ -18,3 +18,30 @@ export function chromeExecutablePath({
   if (env.PUPPETEER_EXECUTABLE_PATH) return env.PUPPETEER_EXECUTABLE_PATH;
   return exists(MACOS_CHROME) ? MACOS_CHROME : undefined;
 }
+
+/** Restore an owned test window before capture: focus emulation alone does not
+ * unminimize the native compositor, so CDP screenshots can otherwise stall. */
+export async function captureQaScreenshot(
+  page,
+  options,
+  { headful = true } = {},
+) {
+  if (headful) {
+    const session = await page.createCDPSession();
+    try {
+      const { windowId, bounds } = await session.send(
+        'Browser.getWindowForTarget',
+      );
+      if (bounds.windowState === 'minimized') {
+        await session.send('Browser.setWindowBounds', {
+          windowId,
+          bounds: { windowState: 'normal' },
+        });
+      }
+      await page.bringToFront();
+    } finally {
+      await session.detach();
+    }
+  }
+  return page.screenshot(options);
+}

scripts/qa-cockpit-plates.mjs

@@ -12,7 +12,7 @@
  * passed with the painter stubbed out — the number was right and nothing was
  * drawn. Every assertion here now comes from the RENDERED path instead:
  *
- *   ids/counts — `styleManager.getDetectionDiagnostics()` (src/ui.js), the
+ *   ids/counts — `styleManager.getDetectionDiagnostics()` (src/ui/shellFacade.js), the
  *     overlay's own published `visibleCount` / `labeledKeys`, so a contact only
  *     counts once the sweep, the arbiter and the placement solve have all run.
  *   plate scale — tapped off `CanvasRenderingContext2D` while the frame paints.

scripts/qa-failstate-b10.mjs

@@ -34,10 +34,6 @@
 import puppeteer from 'puppeteer';
 import fs from 'node:fs';
 import path from 'node:path';
-import { fileURLToPath } from 'node:url';
-
-const __dirname = path.dirname(fileURLToPath(import.meta.url));
-const REPO_ROOT = path.resolve(__dirname, '..');
 
 const argv = process.argv.slice(2);
 const getOpt = (name, dflt) => {

scripts/qa-final-polish-credits.mjs

@@ -52,7 +52,6 @@ try {
       id,
       value,
     );
-  const text = () => page.$eval('#cesium-credits', (e) => e.innerText);
   const shot = async (name, osm, tiles) => {
     await sleep(300);
     const state = await page.$eval('#cesium-credits', (e) => {

scripts/qa-form-fields.mjs

@@ -0,0 +1,465 @@
+#!/usr/bin/env node
+/** Native form-field regression gate. CCTV ports are fixtures, never live writes. */
+import fs from 'node:fs';
+import puppeteer from 'puppeteer';
+
+const browser = await puppeteer.launch({
+  headless: true,
+  args: ['--use-gl=angle', '--use-angle=swiftshader'],
+});
+const page = await browser.newPage();
+page.setDefaultNavigationTimeout(60000);
+let failures = 0;
+const errors = [];
+page.on('pageerror', (error) => errors.push(error.message));
+const check = (name, passed, detail) => {
+  console.log(`[${passed ? 'PASS' : 'FAIL'}] ${name}`);
+  if (!passed) {
+    failures++;
+    console.log(JSON.stringify(detail));
+  }
+};
+fs.mkdirSync('qa-shots/form-fields', { recursive: true });
+try {
+  await page.setViewport({ width: 1440, height: 900 });
+  await page.goto(
+    `${process.env.QA_BASE_URL || 'http://127.0.0.1:4183'}/?welcome=0`,
+    {
+      waitUntil: 'domcontentloaded',
+    },
+  );
+  await page.waitForFunction(
+    () =>
+      window.__godsEyeView?.styleManager?._cctvControls &&
+      document.getElementById('loading-screen')?.classList.contains('hidden'),
+    { timeout: 60000 },
+  );
+  const inventory = await page.evaluate(() => {
+    const selects = [
+      'scene-select',
+      'cctv-camera-select',
+      'hud-layout-select',
+      'draw-color-select',
+      'radio-filter',
+      'sdr-gain-select',
+    ].map((id) => document.getElementById(id));
+    return {
+      ids: selects.map((node) => node.id),
+      shared:
+        selects.length === 6 &&
+        selects.every((node) => node.classList.contains('gev-field')),
+      native: selects.every(
+        (node) =>
+          node instanceof HTMLSelectElement && !node.hasAttribute('role'),
+      ),
+      dark: selects.every(
+        (node) => getComputedStyle(node).colorScheme === 'dark',
+      ),
+    };
+  });
+  check(
+    'all six panel dropdowns retain native select semantics and shared surface',
+    inventory.shared && inventory.native,
+    inventory,
+  );
+  check('native option menus keep the dark scheme', inventory.dark);
+  await page.evaluate(() => {
+    const manager = window.__godsEyeView.styleManager;
+    manager.setPanelCollapsed('pp-toggles', false, {
+      persist: false,
+      syncShare: false,
+    });
+    manager.setPanelCollapsed('scene-panel', false, {
+      persist: false,
+      syncShare: false,
+    });
+    manager.setPanelCollapsed('cctv-panel', false, {
+      persist: false,
+      syncShare: false,
+    });
+    window.__qaFormChanges = [];
+    document
+      .getElementById('scene-select')
+      .addEventListener('change', (event) =>
+        window.__qaFormChanges.push(event.target.value),
+      );
+  });
+  const ownerSetup = await page.evaluate(() => {
+    const owner = window.__godsEyeView.styleManager._cctvControls;
+    owner._cctvUnsubscribe?.();
+    owner._cctvUnsubscribe = null;
+    window.__qaFormCalls = [];
+    owner.actions = {
+      ...owner.actions,
+      isEnabled: () => true,
+      toggleEnabled: async () => true,
+      setParams: (...args) => window.__qaFormCalls.push(args),
+      runExplicitFocus: (select, focus) => focus(select()),
+      showToast: () => {},
+    };
+    owner.cctv = {
+      setParams() {},
+      focusCamera: (id) => window.__qaFormCalls.push(['focus', id]),
+      selectCamera: (id) => id,
+    };
+    owner._cctvState = {
+      enabled: true,
+      activeCameraId: 'a',
+      cameras: [
+        { id: 'a', name: 'A' },
+        { id: 'b', name: 'B' },
+      ],
+      activeCamera: {
+        id: 'a',
+        headingDeg: 30,
+        pitchDeg: -10,
+        fovDeg: 45,
+        rangeM: 120,
+        mountHeightM: 8,
+        calibration: {},
+        basePose: {
+          headingDeg: 20,
+          pitchDeg: -10,
+          fovDeg: 45,
+          rangeM: 120,
+          mountHeightM: 8,
+        },
+      },
+    };
+    owner._renderCctvState(owner._cctvState);
+    const input = document.getElementById('sdr-frequency-input');
+    return {
+      min: input.min,
+      max: input.max,
+      step: input.step,
+      type: input.type,
+      shared: input.classList.contains('gev-field'),
+    };
+  });
+  check(
+    'FM frequency retains native bounds, precision and shared surface',
+    ownerSetup.min === '87.5' &&
+      ownerSetup.max === '108' &&
+      ownerSetup.step === '0.1' &&
+      ownerSetup.type === 'number' &&
+      ownerSetup.shared,
+    ownerSetup,
+  );
+  const validity = await page.$eval('#sdr-frequency-input', (input) => {
+    const original = input.value;
+    input.value = '87.4';
+    const below = input.validity.rangeUnderflow;
+    input.value = '108.1';
+    const above = input.validity.rangeOverflow;
+    input.value = '98.55';
+    const step = input.validity.stepMismatch;
+    input.value = '';
+    const empty = input.validity.valid;
+    input.value = original;
+    return below && above && step && empty;
+  });
+  check(
+    'native numeric validity preserves underflow, overflow, steps and empty drafts',
+    validity,
+  );
+  await page.select('#cctv-camera-select', 'b');
+  await page.waitForFunction(() => window.__qaFormCalls.length === 2);
+  const cameraSelection = await page.evaluate(() => window.__qaFormCalls);
+  check(
+    'camera dropdown retains selection, focus and user-origin dispatch',
+    cameraSelection[0][0] === 'focus' &&
+      cameraSelection[0][1] === 'b' &&
+      cameraSelection[1][0].selectedCameraId === 'b' &&
+      cameraSelection[1][1].origin === 'user',
+    cameraSelection,
+  );
+  await page.evaluate(() => {
+    window.__qaFormCalls = [];
+    document.getElementById('cctv-camera-select').disabled = true;
+  });
+  await page.focus('#scene-select');
+  await page.focus('#cctv-camera-select');
+  check(
+    'disabled native selects cannot receive keyboard focus',
+    await page.evaluate(
+      () => document.activeElement.id !== 'cctv-camera-select',
+    ),
+  );
+  await page.evaluate(() => {
+    document.getElementById('cctv-camera-select').disabled = false;
+  });
+  const begin = async (field) => {
+    await page.evaluate((field) => {
+      const owner = window.__godsEyeView.styleManager._cctvControls;
+      owner._beginCctvCalValueEdit(
+        document.querySelector(`[data-cal-field="${field}"]`),
+      );
+    }, field);
+  };
+  for (const [field, step, value] of [
+    ['heading', '0.1', '30.0'],
+    ['pitch', '0.1', '-10.0'],
+    ['fov', '1', '45'],
+    ['range', '1', '120'],
+    ['height', '1', '8'],
+    ['north', '0.1', '0.0'],
+    ['east', '0.1', '0.0'],
+  ]) {
+    await begin(field);
+    const result = await page.$eval('.cctv-cal-input', (input) => ({
+      step: input.step,
+      value: input.value,
+      native: input.type === 'number',
+      shared: input.classList.contains('gev-field'),
+      label: input.getAttribute('aria-label'),
+      focus: document.activeElement === input,
+    }));
+    check(
+      `${field} editor retains precision, initial value and focus`,
+      result.step === step &&
+        result.value === value &&
+        result.native &&
+        result.shared &&
+        !!result.label &&
+        result.focus,
+      result,
+    );
+    await page.keyboard.press('Escape');
+  }
+  check(
+    'Escape cancels each field without a calibration write',
+    await page.evaluate(() => window.__qaFormCalls.length === 0),
+  );
+  await begin('heading');
+  await page.keyboard.press('Backspace');
+  await page.type('.cctv-cal-input', '100');
+  await page.evaluate(() => {
+    window.__godsEyeView.styleManager._cctvControls._cctvState.activeCamera.basePose.headingDeg = 60;
+  });
+  await page.keyboard.press('Enter');
+  const commit = await page.evaluate(() => window.__qaFormCalls);
+  check(
+    'Enter commits once against the frozen camera base',
+    commit.length === 1 &&
+      commit[0][0].calibration.patch.headingDeg === 80 &&
+      commit[0][0].calibration.cameraId === 'a' &&
+      commit[0][1].origin === 'user',
+    commit,
+  );
+  await begin('north');
+  await page.keyboard.press('Backspace');
+  await page.type('.cctv-cal-input', '12.5');
+  await page.$eval('.cctv-cal-input', (input) => input.blur());
+  const blur = await page.evaluate(() => window.__qaFormCalls);
+  check(
+    'blur commits a decimal offset exactly once',
+    blur.length === 2 && blur[1][0].calibration.patch.offsetNorthM === 12.5,
+    blur,
+  );
+  await begin('east');
+  await page.keyboard.press('Backspace');
+  await page.keyboard.press('Enter');
+  check(
+    'an empty numeric draft does not write calibration',
+    await page.evaluate(() => window.__qaFormCalls.length === 2),
+  );
+  await begin('heading');
+  await page.type('.cctv-cal-input', '90');
+  await page.evaluate(() => {
+    window.__godsEyeView.styleManager._cctvControls._cctvState.activeCameraId =
+      'b';
+  });
+  await page.keyboard.press('Enter');
+  check(
+    'a stale camera editor cannot commit to the next camera',
+    await page.evaluate(() => window.__qaFormCalls.length === 2),
+  );
+
+  await page.evaluate(() => {
+    for (const panel of ['pp-toggles', 'scene-panel', 'cctv-panel'])
+      window.__godsEyeView.styleManager.setPanelCollapsed(panel, false, {
+        persist: false,
+        syncShare: false,
+      });
+  });
+  if (
+    await page.$eval(
+      '#draw-toggle',
+      (node) => node.getAttribute('aria-pressed') !== 'true',
+    )
+  )
+    await page.click('#draw-toggle');
+  for (const lang of ['en']) {
+    await page.evaluate((lang) => {
+      document.documentElement.lang = lang;
+    }, lang);
+    for (const width of [1440, 620, 390]) {
+      await page.setViewport({ width, height: 900 });
+      const layout = await page.evaluate(() => {
+        const ids = [
+          'scene-select',
+          'cctv-camera-select',
+          'hud-layout-select',
+          'draw-color-select',
+        ];
+        return ids.map((id) => {
+          const node = document.getElementById(id),
+            rect = node.getBoundingClientRect(),
+            panel = node.closest('.panel-collapsible')?.getBoundingClientRect();
+          return {
+            id,
+            width: rect.width,
+            fits: rect.width > 0 && rect.width <= (panel?.width || innerWidth),
+            radius: getComputedStyle(node).borderRadius,
+          };
+        });
+      });
+      check(
+        `${lang} fields fit their panels at ${width}px`,
+        layout.every((item) => item.fits),
+        layout,
+      );
+      if (width === 390)
+        await page.screenshot({
+          path: `qa-shots/form-fields/${lang}-${width}.png`,
+        });
+    }
+  }
+  await page.evaluate(() => {
+    document.documentElement.lang = 'en';
+    document.documentElement.dataset.uiTheme = 'cyber';
+  });
+  const cyber = await page.$eval(
+    '#scene-select',
+    (node) => getComputedStyle(node).backgroundColor,
+  );
+  check(
+    'Cyber keeps its native field theme',
+    cyber === 'rgba(26, 35, 39, 0.96)',
+    cyber,
+  );
+  await begin('heading');
+  await page.evaluate(() => {
+    const owner = window.__godsEyeView.styleManager._cctvControls;
+    window.__qaDetachedInput = document.querySelector('.cctv-cal-input');
+    owner.destroy();
+    window.__qaDetachedInput.dispatchEvent(new Event('blur'));
+  });
+  check(
+    'disposal removes the editor and prevents late commits',
+    await page.evaluate(
+      () =>
+        !document.querySelector('.cctv-cal-input') &&
+        window.__qaFormCalls.length === 2,
+    ),
+  );
+  // Scene selection can restore application settings. Exercise it after the
+  // fixture-owned CCTV phase so those asynchronous effects cannot replace ports.
+  page.once('dialog', (dialog) => dialog.accept('Baseline selection fixture'));
+  await page.click('#scene-new-btn');
+  await page.waitForFunction(() =>
+    [...document.querySelectorAll('#scene-select option')].some(
+      (option) => option.textContent === 'Baseline selection fixture',
+    ),
+  );
+  page.once('dialog', (dialog) => dialog.accept('QA selection fixture'));
+  await page.click('#scene-new-btn');
+  await page.waitForFunction(
+    () => document.querySelectorAll('#scene-select option').length > 1,
+  );
+  const targetSceneId = await page.$eval(
+    '#scene-select',
+    (node) =>
+      [...node.options].find(
+        (option) => option.textContent === 'QA selection fixture',
+      ).value,
+  );
+  const baselineSceneId = await page.$eval(
+    '#scene-select',
+    (node) =>
+      [...node.options].find(
+        (option) => option.textContent === 'Baseline selection fixture',
+      ).value,
+  );
+  await page.select('#scene-select', baselineSceneId);
+  await page.waitForFunction(
+    (id) => window.__godsEyeView.sceneDirector._getSelectedScene().id !== id,
+    {},
+    targetSceneId,
+  );
+  await page.evaluate(() => {
+    window.__qaFormChanges = [];
+  });
+  await page.focus('#scene-select');
+  // Typeahead is native even when headless Chrome does not drive OS popups.
+  await page.keyboard.press('q');
+  const sceneSelection = await page.evaluate(() => ({
+    id: document.getElementById('scene-select').value,
+    selected: window.__godsEyeView.sceneDirector._getSelectedScene().id,
+    changes: window.__qaFormChanges,
+    focus: document.activeElement.id,
+    outline: getComputedStyle(document.activeElement).outlineStyle,
+  }));
+  check(
+    'native typeahead reaches the Scene owner and keeps focus',
+    sceneSelection.id === targetSceneId &&
+      sceneSelection.selected === targetSceneId &&
+      sceneSelection.changes.at(-1) === targetSceneId &&
+      sceneSelection.focus === 'scene-select',
+    sceneSelection,
+  );
+  check('keyboard focus remains visible', sceneSelection.outline === 'solid');
+  const localized = new URL(page.url());
+  localized.searchParams.set('lang', 'ru');
+  await page.goto(localized.href, { waitUntil: 'domcontentloaded' });
+  await page.waitForFunction(
+    () =>
+      window.__godsEyeView?.styleManager?._cctvControls &&
+      document.getElementById('loading-screen')?.classList.contains('hidden'),
+    { timeout: 60000 },
+  );
+  await page.evaluate(() => {
+    for (const panel of ['pp-toggles', 'scene-panel', 'cctv-panel'])
+      window.__godsEyeView.styleManager.setPanelCollapsed(panel, false, {
+        persist: false,
+        syncShare: false,
+      });
+  });
+  await page.evaluate(() => {
+    for (const panel of ['pp-toggles', 'scene-panel', 'cctv-panel'])
+      window.__godsEyeView.styleManager.setPanelCollapsed(panel, false, {
+        persist: false,
+        syncShare: false,
+      });
+  });
+  if (
+    await page.$eval(
+      '#draw-toggle',
+      (node) => node.getAttribute('aria-pressed') !== 'true',
+    )
+  )
+    await page.click('#draw-toggle');
+  const translated = await page.evaluate(() => {
+    const nodes = [
+      'scene-select',
+      'cctv-camera-select',
+      'hud-layout-select',
+      'draw-color-select',
+    ].map((id) => document.getElementById(id));
+    return (
+      document.documentElement.lang === 'ru' &&
+      nodes.every(
+        (node) =>
+          node.clientWidth > 0 &&
+          node.getBoundingClientRect().width <=
+            node.closest('.panel-collapsible').getBoundingClientRect().width,
+      )
+    );
+  });
+  check('real Russian labels and fields fit at 390px', translated);
+  await page.screenshot({ path: 'qa-shots/form-fields/ru-390.png' });
+  check('no uncaught browser errors', errors.length === 0, errors);
+} finally {
+  await browser.close();
+}
+process.exitCode = failures ? 1 : 0;

scripts/qa-ghostmaps.mjs

@@ -0,0 +1,645 @@
+#!/usr/bin/env node
+/**
+ * qa-ghostmaps.mjs — headless proof for the S2 Underground GhostMaps layer
+ * (id `s2-ghostmaps`): S2's public KMZ intel products, kept current from
+ * github.com/s2underground/GhostMaps.
+ *
+ * Drives the REAL app in headless Chromium against a dev server (keyless).
+ *
+ *   (i)   LIVE — enabling the layer loads the default products (Common
+ *         Intelligence Picture and the 30-day kinetic pull) from the live
+ *         repository through /api/ghostmaps, one data source per product,
+ *         matching the proxy's catalog commit; the row shows one chip per
+ *         catalog product with the defaults active, and the page holds an
+ *         open event stream to /api/ghostmaps/events.
+ *   (ii)  PICK — a Common Intelligence Picture marker at the screen centre
+ *         picks as this layer's entity; clicking it paints its report card
+ *         and clicking empty ground clears it.
+ *   (iii) PUSH (synthetic) — the event stream is replaced in the page and a
+ *         catalog naming a new edition of one product is pushed: only that
+ *         product reloads (a new data source replaces the old one, no
+ *         duplicates), the other keeps its data source. A catalog without a
+ *         product removes it.
+ *   (iv)  CHIPS — clicking an active product chip removes that product,
+ *         clicking it again restores it; the choice survives a reload.
+ *   (v)   DISABLE — every GhostMaps data source leaves the viewer.
+ *   (vi)  VIEWPORT — at a 390x844 phone viewport the open row and its chips
+ *         fit the panel width with no horizontal overflow.
+ *   (vii) FAR SIDE — pins skip the depth test, so they are horizon-culled:
+ *         seen from over the Indian Ocean no pin clearly behind the planet is
+ *         shown; back over North America the near-side pins show again.
+ *
+ * Screenshots go to qa-shots/ghostmaps-*.png (gitignored).
+ *
+ * Run:  node scripts/qa-ghostmaps.mjs --url http://localhost:4173
+ * Optional: --timeout-ms 180000 for a slow boot, --shots <dir>.
+ * Exits non-zero on any FAIL. Does not commit anything.
+ */
+
+import puppeteer from 'puppeteer';
+import fs from 'node:fs';
+import path from 'node:path';
+import { fileURLToPath } from 'node:url';
+
+const __dirname = path.dirname(fileURLToPath(import.meta.url));
+const argv = process.argv.slice(2);
+const getOpt = (name, dflt) => {
+  const i = argv.indexOf(name);
+  return i >= 0 && argv[i + 1] ? argv[i + 1] : dflt;
+};
+const APP_URL = getOpt('--url', 'http://localhost:4173');
+const HEADFUL = argv.includes('--headful');
+const TIMEOUT_MS = Number(getOpt('--timeout-ms', '90000'));
+const SHOTS_DIR = path.resolve(
+  getOpt('--shots', path.join(__dirname, '..', 'qa-shots')),
+);
+const LAYER_ID = 's2-ghostmaps';
+
+const results = [];
+function record(name, ok, detail) {
+  results.push({ name, ok, detail });
+  const tag = ok ? '\x1b[32mPASS\x1b[0m' : '\x1b[31mFAIL\x1b[0m';
+  console.log(`  [${tag}] ${name}${detail ? `  — ${detail}` : ''}`);
+}
+const sleep = (ms) => new Promise((r) => setTimeout(r, ms));
+
+async function boot(page) {
+  await page.goto(`${APP_URL}/?welcome=0`, {
+    waitUntil: 'domcontentloaded',
+    timeout: TIMEOUT_MS,
+  });
+  await page.waitForFunction(
+    () => window.__godsEyeView?.viewer && window.__godsEyeView?.dataManager,
+    { timeout: TIMEOUT_MS },
+  );
+  await sleep(5000);
+  await page.keyboard.press('Escape');
+}
+
+/** GhostMaps data sources on the viewer: name → entity count. */
+function ghostSources(prefix) {
+  const { dataSources } = window.__godsEyeView.viewer;
+  const out = [];
+  for (let i = 0; i < dataSources.length; i++) {
+    const ds = dataSources.get(i);
+    if (ds.name?.startsWith(prefix))
+      out.push({ name: ds.name, count: ds.entities.values.length });
+  }
+  return out;
+}
+
+function paintedOverlayPixels() {
+  const canvas = document.getElementById('world-overlay-canvas');
+  if (!canvas) return -1;
+  const pixels = canvas
+    .getContext('2d')
+    .getImageData(0, 0, canvas.width, canvas.height).data;
+  let count = 0;
+  for (let i = 3; i < pixels.length; i += 4) if (pixels[i] > 0) count++;
+  return count;
+}
+
+async function enableAndSettle(page) {
+  await page.evaluate((id) => {
+    const panel = document.getElementById('data-panel');
+    if (panel?.classList.contains('collapsed'))
+      panel.querySelector('[data-collapse-target="data-panel"]')?.click();
+    return window.__godsEyeView.dataManager.setEnabled(id, true);
+  }, LAYER_ID);
+  await page.waitForFunction(
+    (id) => {
+      const stats = window.__godsEyeView.dataManager.layers
+        .get(id)
+        .module.getStats();
+      return !stats.loading && stats.count > 0;
+    },
+    { timeout: TIMEOUT_MS, polling: 500 },
+    LAYER_ID,
+  );
+}
+
+const stats = (page) =>
+  page.evaluate(
+    (id) => window.__godsEyeView.dataManager.layers.get(id).module.getStats(),
+    LAYER_ID,
+  );
+const sources = (page) =>
+  page.evaluate(`(${ghostSources})(${JSON.stringify(`${LAYER_ID}:`)})`);
+
+async function showRow(page) {
+  await page.evaluate((id) => {
+    document
+      .querySelector(`[data-layer-id="${id}"]`)
+      ?.scrollIntoView({ block: 'center' });
+  }, LAYER_ID);
+  await sleep(400);
+}
+
+async function main() {
+  fs.mkdirSync(SHOTS_DIR, { recursive: true });
+  const browser = await puppeteer.launch({
+    headless: !HEADFUL,
+    args: ['--use-angle=swiftshader', '--enable-unsafe-swiftshader'],
+    defaultViewport: { width: 1440, height: 900 },
+  });
+  try {
+    // ---- (i) LIVE ---------------------------------------------------------
+    const page = await browser.newPage();
+    // Start clean once; a reload must keep what the page stored.
+    await page.evaluateOnNewDocument(() => {
+      try {
+        if (sessionStorage.getItem('qa-ghostmaps-clean')) return;
+        localStorage.clear();
+        sessionStorage.setItem('qa-ghostmaps-clean', '1');
+      } catch {
+        /* sandboxed frames have no storage */
+      }
+    });
+    page.on('pageerror', (error) =>
+      console.log(`  [page error] ${error.message}`),
+    );
+    await boot(page);
+    const catalog = await page.evaluate(() =>
+      fetch('/api/ghostmaps/catalog').then((r) => r.json()),
+    );
+    record(
+      'LIVE: proxy catalog names a commit and the default products',
+      /^[0-9a-f]{40}$/.test(catalog.commit || '') &&
+        ['cip', 'kinetic-30d'].every((id) =>
+          catalog.products.some((p) => p.id === id && p.defaultOn),
+        ),
+      `${catalog.commit?.slice(0, 7)} "${catalog.message}", ${catalog.products.length} products`,
+    );
+    const t0 = Date.now();
+    await enableAndSettle(page);
+    const live = await stats(page);
+    const liveSources = await sources(page);
+    record(
+      'LIVE: default products load as one data source each',
+      liveSources.length === 2 &&
+        liveSources.every((s) => s.count > 0) &&
+        live.products.sort().join() === 'cip,kinetic-30d',
+      `${liveSources.map((s) => `${s.name}=${s.count}`).join(', ')} in ${Date.now() - t0} ms`,
+    );
+    record(
+      'LIVE: layer reports the proxy commit and no error',
+      live.commit === catalog.commit && !live.error,
+      `commit ${live.commit?.slice(0, 7)}, error ${live.error}`,
+    );
+    await showRow(page);
+    const chips = await page.evaluate(
+      (id) =>
+        [
+          ...document.querySelectorAll(
+            `[data-layer-id="${id}"] .data-toggle-chip`,
+          ),
+        ].map((chip) => ({
+          id: chip.dataset.chipId,
+          active: chip.getAttribute('aria-pressed') === 'true',
+        })),
+      LAYER_ID,
+    );
+    record(
+      'LIVE: one chip per product, defaults pressed',
+      chips.length === catalog.products.length &&
+        chips.every(
+          (chip) =>
+            chip.active ===
+            catalog.products.find((p) => p.id === chip.id)?.defaultOn,
+        ),
+      chips.map((c) => `${c.id}${c.active ? '*' : ''}`).join(' '),
+    );
+    const stream = await page
+      .waitForFunction(
+        (id) =>
+          window.__godsEyeView.dataManager.layers.get(id).module.getStats()
+            .stream === 'open',
+        { timeout: 15000, polling: 250 },
+        LAYER_ID,
+      )
+      .then(
+        () => true,
+        () => false,
+      );
+    record('LIVE: the /api/ghostmaps/events stream is open', stream);
+    await page.screenshot({ path: path.join(SHOTS_DIR, 'ghostmaps-live.png') });
+
+    // ---- (ii) PICK ----------------------------------------------------------
+    const target = await page.evaluate((id) => {
+      const gev = window.__godsEyeView;
+      const ds = [...Array(gev.viewer.dataSources.length).keys()]
+        .map((i) => gev.viewer.dataSources.get(i))
+        .find((item) => item.name === `${id}:cip`);
+      const entity = ds.entities.values.find((e) => e.billboard);
+      const carto = gev.viewer.scene.globe.ellipsoid.cartesianToCartographic(
+        entity.position.getValue(gev.viewer.clock.currentTime),
+      );
+      try {
+        gev.viewer.camera.cancelFlight();
+      } catch {
+        /* no flight */
+      }
+      gev.viewer.camera.setView({
+        destination: gev.viewer.scene.globe.ellipsoid.cartographicToCartesian({
+          longitude: carto.longitude,
+          latitude: carto.latitude,
+          height: 40000,
+        }),
+        orientation: { heading: 0, pitch: -Math.PI / 2, roll: 0 },
+      });
+      gev.viewer.scene.requestRender?.();
+      return entity.id;
+    }, LAYER_ID);
+    await page
+      .waitForFunction(
+        () => window.__godsEyeView.viewer.scene.globe.tilesLoaded,
+        { timeout: 30000 },
+      )
+      .catch(() => {});
+    // The horizon cull reveals the pin on the frame after the camera moves.
+    await page
+      .waitForFunction(
+        () => {
+          const v = window.__godsEyeView.viewer;
+          v.scene.requestRender?.();
+          const c = v.scene.canvas;
+          return v.scene
+            .drillPick({ x: c.clientWidth / 2, y: c.clientHeight / 2 }, 8)
+            .some((p) =>
+              String(p?.id?.id ?? p?.id ?? '').startsWith('ghostmaps:cip:'),
+            );
+        },
+        { timeout: 15000, polling: 500 },
+      )
+      .catch(() => {});
+    const probe = await page.evaluate(() => {
+      const v = window.__godsEyeView.viewer;
+      const c = v.scene.canvas;
+      const box = c.getBoundingClientRect();
+      const centre = { x: c.clientWidth / 2, y: c.clientHeight / 2 };
+      const picked = v.scene.drillPick(centre, 8);
+      // Empty ground: the first point below the marker (the card is drawn
+      // above it) that picks nothing at all; markers can be dense in a city.
+      let empty = null;
+      for (let r = 120; r < 420 && !empty; r += 60)
+        for (const a of [2, 1, 3, 0, 4]) {
+          const p = {
+            x: centre.x + r * Math.cos((a * Math.PI) / 4),
+            y: centre.y + r * Math.sin((a * Math.PI) / 4),
+          };
+          if (!v.scene.pick(p)) {
+            empty = p;
+            break;
+          }
+        }
+      empty ||= { x: centre.x + 400, y: centre.y + 300 };
+      return {
+        ids: picked.map((p) => String(p?.id?.id ?? p?.id ?? '')),
+        centre: { x: centre.x + box.left, y: centre.y + box.top },
+        empty: { x: empty.x + box.left, y: empty.y + box.top },
+      };
+    });
+    record(
+      'PICK: the centred marker picks as a GhostMaps entity',
+      probe.ids.some((id) => id.startsWith('ghostmaps:cip:')),
+      `${target} → [${probe.ids.slice(0, 3).join(', ')}]`,
+    );
+    const before = await page.evaluate(paintedOverlayPixels);
+    await page.mouse.click(probe.centre.x, probe.centre.y);
+    const painted = await page
+      .waitForFunction(`(${paintedOverlayPixels})() > ${before + 100}`, {
+        timeout: 10000,
+        polling: 250,
+      })
+      .then(
+        () => true,
+        () => false,
+      );
+    const after = await page.evaluate(paintedOverlayPixels);
+    record(
+      'PICK: clicking the marker paints its report card',
+      painted,
+      `${before} → ${after} pixels`,
+    );
+    await page.screenshot({ path: path.join(SHOTS_DIR, 'ghostmaps-card.png') });
+    const cardState = () =>
+      page.evaluate((id) => {
+        const d = window.__gevWorldOverlay?.getDiagnostics?.();
+        return {
+          entries: d?.entriesBySource?.[id] ?? null,
+          painted: d?.paintedBySource?.[id] ?? null,
+        };
+      }, LAYER_ID);
+    const selectedState = await cardState();
+    record(
+      'PICK: the overlay host holds and paints exactly one card',
+      selectedState.entries === 1 && selectedState.painted === 1,
+      JSON.stringify(selectedState),
+    );
+    await page.mouse.click(probe.empty.x, probe.empty.y);
+    // The overlay canvas is `desynchronized`, so headless read-back can
+    // return a stale buffer; the host's own model is the authority here.
+    const cleared = await page
+      .waitForFunction(
+        (id) => {
+          const d = window.__gevWorldOverlay.getDiagnostics();
+          return (
+            d.entriesBySource?.[id] === 0 && !(d.paintedBySource?.[id] > 0)
+          );
+        },
+        { timeout: 10000, polling: 250 },
+        LAYER_ID,
+      )
+      .then(
+        () => true,
+        () => false,
+      );
+    record(
+      'PICK: clicking empty ground clears the card',
+      cleared,
+      JSON.stringify(await cardState()),
+    );
+
+    // ---- (vii) FAR SIDE ---------------------------------------------------
+    // Pins skip the depth test; with Google 3D tiles nothing else hides the
+    // far side. A pin clearly behind the planet (sphere test with margin) must
+    // be hidden, and pins facing the camera must still show.
+    const horizonCounts = (lon, lat) =>
+      page.evaluate(
+        async (id, lo, la) => {
+          const gev = window.__godsEyeView;
+          const d2r = Math.PI / 180;
+          try {
+            gev.viewer.camera.cancelFlight();
+          } catch {
+            /* no flight */
+          }
+          gev.viewer.camera.setView({
+            destination:
+              gev.viewer.scene.globe.ellipsoid.cartographicToCartesian({
+                longitude: lo * d2r,
+                latitude: la * d2r,
+                height: 18_000_000,
+              }),
+            orientation: { heading: 0, pitch: -Math.PI / 2, roll: 0 },
+          });
+          gev.viewer.scene.requestRender?.();
+          await new Promise((r) => setTimeout(r, 1200));
+          const c = gev.viewer.camera.positionWC;
+          const norm = (v) => Math.hypot(v.x, v.y, v.z);
+          let far = 0;
+          let nearShown = 0;
+          for (let i = 0; i < gev.viewer.dataSources.length; i++) {
+            const ds = gev.viewer.dataSources.get(i);
+            if (!ds.name?.startsWith(`${id}:`)) continue;
+            for (const e of ds.entities.values) {
+              if (!e.billboard) continue;
+              const p = e.position.getValue(gev.viewer.clock.currentTime);
+              // Angle from the camera's nadir to the pin, against the
+              // geometric horizon angle; the cull's 1 km margin shows pins up
+              // to about 1° past it, so "clearly behind" is beyond 2°.
+              const angle = Math.acos(
+                (p.x * c.x + p.y * c.y + p.z * c.z) / (norm(p) * norm(c)),
+              );
+              const horizon = Math.acos(norm(p) / norm(c));
+              const margin = (2 * Math.PI) / 180;
+              if (e.show && angle > horizon + margin) far++;
+              if (e.show && angle < horizon - margin) nearShown++;
+            }
+          }
+          return { far, nearShown };
+        },
+        LAYER_ID,
+        lon,
+        lat,
+      );
+    const fromIndianOcean = await horizonCounts(80, -30);
+    record(
+      'FAR SIDE: pins behind the planet are hidden',
+      fromIndianOcean.far === 0,
+      JSON.stringify(fromIndianOcean),
+    );
+    await page.screenshot({
+      path: path.join(SHOTS_DIR, 'ghostmaps-far-side.png'),
+    });
+    const fromAmerica = await horizonCounts(-98, 39);
+    record(
+      'FAR SIDE: pins facing the camera show again',
+      fromAmerica.far === 0 && fromAmerica.nearShown > 100,
+      JSON.stringify(fromAmerica),
+    );
+
+    // ---- (iv) CHIPS -------------------------------------------------------
+    const clickChip = async (id) => {
+      // Row controls render on the next frame after the layer settles.
+      await page.waitForSelector(
+        `[data-layer-id="${LAYER_ID}"] .data-toggle-chip[data-chip-id="${id}"]`,
+        { timeout: 15000 },
+      );
+      return page.evaluate(
+        (layer, chip) =>
+          document
+            .querySelector(
+              `[data-layer-id="${layer}"] .data-toggle-chip[data-chip-id="${chip}"]`,
+            )
+            ?.click(),
+        LAYER_ID,
+        id,
+      );
+    };
+    await clickChip('kinetic-30d');
+    await page.waitForFunction(
+      (id) =>
+        !window.__godsEyeView.dataManager.layers
+          .get(id)
+          .module.getStats()
+          .products.includes('kinetic-30d'),
+      { timeout: 15000 },
+      LAYER_ID,
+    );
+    const without = await sources(page);
+    record(
+      'CHIPS: turning a product off removes only its data source',
+      without.length === 1 && without[0].name === `${LAYER_ID}:cip`,
+      without.map((s) => s.name).join(', '),
+    );
+    await page.reload({ waitUntil: 'domcontentloaded' });
+    await page.waitForFunction(() => window.__godsEyeView?.dataManager, {
+      timeout: TIMEOUT_MS,
+    });
+    await sleep(3000);
+    await enableAndSettle(page);
+    const kept = await stats(page);
+    record(
+      'CHIPS: the product choice survives a reload',
+      kept.products.join() === 'cip',
+      kept.products.join(', '),
+    );
+    await showRow(page);
+    await clickChip('kinetic-30d');
+    await page.waitForFunction(
+      (id) =>
+        window.__godsEyeView.dataManager.layers
+          .get(id)
+          .module.getStats()
+          .products.includes('kinetic-30d'),
+      { timeout: 30000 },
+      LAYER_ID,
+    );
+    record(
+      'CHIPS: turning it back on restores it',
+      (await sources(page)).length === 2,
+    );
+
+    // ---- (v) DISABLE ------------------------------------------------------
+    await page.evaluate(
+      (id) => window.__godsEyeView.dataManager.setEnabled(id, false),
+      LAYER_ID,
+    );
+    await sleep(500);
+    record(
+      'DISABLE: every GhostMaps data source leaves the viewer',
+      (await sources(page)).length === 0,
+    );
+    await page.close();
+
+    // ---- (iii) PUSH (synthetic) ----------------------------------------------
+    const push = await browser.newPage();
+    await push.evaluateOnNewDocument(() => {
+      localStorage.clear();
+      // A controllable stand-in for the real stream.
+      class QaEventSource {
+        constructor(url) {
+          this.url = url;
+          this.listeners = new Set();
+          (window.__qaStreams ||= []).push(this);
+        }
+        addEventListener(type, listener) {
+          if (type === 'catalog') this.listeners.add(listener);
+        }
+        removeEventListener(type, listener) {
+          this.listeners.delete(listener);
+        }
+        close() {
+          this.closed = true;
+        }
+        emit(catalog) {
+          for (const listener of this.listeners)
+            listener({ data: JSON.stringify(catalog) });
+        }
+      }
+      window.EventSource = QaEventSource;
+    });
+    await boot(push);
+    await enableAndSettle(push);
+    const identity = () =>
+      push.evaluate((id) => {
+        const { dataSources } = window.__godsEyeView.viewer;
+        window.__qaIds ||= new WeakMap();
+        window.__qaNext ||= 1;
+        const out = {};
+        for (let i = 0; i < dataSources.length; i++) {
+          const ds = dataSources.get(i);
+          if (!ds.name?.startsWith(`${id}:`)) continue;
+          if (!window.__qaIds.has(ds))
+            window.__qaIds.set(ds, window.__qaNext++);
+          out[ds.name] = window.__qaIds.get(ds);
+        }
+        return out;
+      }, LAYER_ID);
+    const first = await identity();
+    const pushed = Date.now();
+    await push.evaluate(async (id) => {
+      const catalog = await fetch('/api/ghostmaps/catalog').then((r) =>
+        r.json(),
+      );
+      const kinetic = catalog.products.find((p) => p.id === 'kinetic-30d');
+      kinetic.version = 'f'.repeat(40);
+      catalog.message = 'QA push';
+      window.__qaStreams
+        .filter((s) => !s.closed)
+        .forEach((s) => s.emit(catalog));
+    }, LAYER_ID);
+    await push.waitForFunction(
+      (id) => {
+        const layer = window.__godsEyeView.dataManager.layers.get(id).module;
+        return (
+          !layer.getStats().loading &&
+          layer.getRowControls().info.includes('QA push')
+        );
+      },
+      { timeout: 20000, polling: 100 },
+      LAYER_ID,
+    );
+    await sleep(500);
+    const second = await identity();
+    record(
+      'PUSH: a new edition reloads only that product',
+      Object.keys(second).length === 2 &&
+        second[`${LAYER_ID}:kinetic-30d`] !==
+          first[`${LAYER_ID}:kinetic-30d`] &&
+        second[`${LAYER_ID}:cip`] === first[`${LAYER_ID}:cip`],
+      `${JSON.stringify(first)} → ${JSON.stringify(second)} in ${Date.now() - pushed} ms`,
+    );
+    await push.evaluate(async () => {
+      const catalog = await fetch('/api/ghostmaps/catalog').then((r) =>
+        r.json(),
+      );
+      catalog.products = catalog.products.filter((p) => p.id !== 'kinetic-30d');
+      window.__qaStreams
+        .filter((s) => !s.closed)
+        .forEach((s) => s.emit(catalog));
+    });
+    await sleep(1000);
+    const third = await identity();
+    record(
+      'PUSH: a product leaving the catalog leaves the globe',
+      Object.keys(third).join() === `${LAYER_ID}:cip`,
+      Object.keys(third).join(', '),
+    );
+    await push.close();
+
+    // ---- (vi) VIEWPORT ----------------------------------------------------
+    const phone = await browser.newPage();
+    await phone.setViewport({ width: 390, height: 844, isMobile: true });
+    await phone.evaluateOnNewDocument(() => localStorage.clear());
+    await boot(phone);
+    await enableAndSettle(phone);
+    await showRow(phone);
+    const fit = await phone.evaluate((id) => {
+      const row = document.querySelector(`[data-layer-id="${id}"]`);
+      const panel = document.getElementById('data-panel');
+      const controls = row?.querySelector('.data-toggle-controls');
+      return {
+        row: Boolean(row),
+        overflow: controls ? controls.scrollWidth - controls.clientWidth : -1,
+        pageOverflow:
+          document.documentElement.scrollWidth -
+          document.documentElement.clientWidth,
+        panelRight: panel?.getBoundingClientRect().right,
+        width: window.innerWidth,
+      };
+    }, LAYER_ID);
+    record(
+      'VIEWPORT: chips fit the phone-width panel',
+      fit.row && fit.overflow <= 1 && fit.pageOverflow <= 0,
+      JSON.stringify(fit),
+    );
+    await phone.screenshot({
+      path: path.join(SHOTS_DIR, 'ghostmaps-phone.png'),
+    });
+    await phone.close();
+  } finally {
+    await browser.close();
+  }
+  const failed = results.filter((r) => !r.ok);
+  console.log(
+    `\n${results.length - failed.length}/${results.length} passed. Screenshots: ${SHOTS_DIR}`,
+  );
+  process.exit(failed.length ? 1 : 0);
+}
+
+main().catch((error) => {
+  console.error(error);
+  process.exit(1);
+});

scripts/qa-l9-matrix.mjs

@@ -1884,7 +1884,7 @@ async function runBrowserGroup(record) {
 
   await step('C15', async () => {
     // CRT/NVG/FLIR are DISPLAY LABELS; the real style ids are retro /
-    // surveillance / thermal (src/ui.js STYLE_STATUS_LABELS). Passing the
+    // surveillance / thermal (src/ui/visualPresets.js STYLE_STATUS_LABELS). Passing the
     // labels made every call a silent no-op that still "passed" — so assert
     // the returned visual state actually changed to the requested style.
     const wanted = [['retro', 'CRT'], ['surveillance', 'NVG'], ['thermal', 'FLIR'], ['normal', 'Normal']];

scripts/qa-labels.mjs

@@ -86,14 +86,6 @@ function percentile(values, pct) {
   return sorted[Math.min(sorted.length - 1, Math.ceil(sorted.length * pct) - 1)];
 }
 
-function parseJson(value, fallback) {
-  try {
-    return JSON.parse(value);
-  } catch {
-    return fallback;
-  }
-}
-
 function analyzeMembership(samples) {
   let replacements = 0;
   let exposure = 0;

scripts/qa-layer-visibility.mjs

@@ -0,0 +1,124 @@
+#!/usr/bin/env node
+/**
+ * Real-browser proof for manager-owned periodic work and document visibility.
+ * Uses the app's development-only layer registration seam; no provider keys.
+ * Run: node scripts/qa-layer-visibility.mjs --url http://localhost:4173
+ * Hiding uses a real background tab, never a patched document.hidden getter.
+ */
+import assert from 'node:assert/strict';
+import puppeteer from 'puppeteer';
+import { chromeExecutablePath } from './qa-chrome.mjs';
+
+const args = process.argv.slice(2);
+const urlIndex = args.indexOf('--url');
+const url = new URL(
+  (urlIndex >= 0 ? args[urlIndex + 1] : undefined) ||
+    process.env.QA_BASE_URL ||
+    'http://localhost:4173',
+);
+url.searchParams.set('welcome', '0');
+const browser = await puppeteer.launch({
+  executablePath: chromeExecutablePath(),
+  headless: true,
+  args: [
+    '--no-sandbox',
+    '--disable-background-timer-throttling',
+    '--disable-renderer-backgrounding',
+  ],
+});
+const pause = (ms) => new Promise((resolve) => setTimeout(resolve, ms));
+const check = (name, actual, expected) => {
+  assert.equal(actual, expected, name);
+  console.log(`PASS ${name}: ${actual}`);
+};
+try {
+  const page = await browser.newPage();
+  const focus = await page.createCDPSession();
+  await focus.send('Emulation.setFocusEmulationEnabled', { enabled: true });
+  await page.goto(url.href, { waitUntil: 'domcontentloaded' });
+  await page.waitForFunction(
+    () => window.__gevQaRegisterLayer && window.__godsEyeView?.dataManager,
+  );
+  await page.evaluate(async () => {
+    const manager = window.__godsEyeView.dataManager;
+    window.__qaVisibilityUpdates = 0;
+    window.__gevQaRegisterLayer(manager, {
+      id: 'qa-document-visibility',
+      name: 'Visibility QA',
+      updateInterval: 750,
+      init() {},
+      enable() {},
+      disable() {},
+      destroy() {},
+      async update() {
+        window.__qaVisibilityUpdates++;
+        return true;
+      },
+      getStats() {
+        return { count: window.__qaVisibilityUpdates };
+      },
+    });
+    await manager.setEnabled('qa-document-visibility', true, { origin: 'qa' });
+  });
+  const count = () => page.evaluate(() => window.__qaVisibilityUpdates);
+  await page.waitForFunction(() => window.__qaVisibilityUpdates >= 3);
+  check('periodic updates run while visible', (await count()) >= 3, true);
+  await focus.send('Emulation.setFocusEmulationEnabled', { enabled: false });
+  const cover = await browser.newPage();
+  await cover.bringToFront();
+  await page.waitForFunction(() => document.visibilityState === 'hidden');
+  const hiddenCount = await count();
+  await pause(2200);
+  check('hidden tab makes no periodic updates', await count(), hiddenCount);
+  check(
+    'explicit refresh remains available while hidden',
+    await page.evaluate(() =>
+      window.__godsEyeView.dataManager.refreshLayer('qa-document-visibility'),
+    ),
+    true,
+  );
+  check('explicit hidden refresh runs once', await count(), hiddenCount + 1);
+  await focus.send('Emulation.setFocusEmulationEnabled', { enabled: true });
+  await page.waitForFunction(
+    () =>
+      document.visibilityState === 'visible' &&
+      window.__qaVisibilityUpdates > 0,
+  );
+  await pause(200);
+  check(
+    'resume performs one overdue refresh without a catch-up burst',
+    await count(),
+    hiddenCount + 2,
+  );
+  await page.evaluate(() =>
+    window.__godsEyeView.dataManager.setEnabled(
+      'qa-document-visibility',
+      false,
+      { origin: 'qa' },
+    ),
+  );
+  const stopped = await count();
+  await focus.send('Emulation.setFocusEmulationEnabled', { enabled: false });
+  await cover.bringToFront();
+  await page.waitForFunction(() => document.visibilityState === 'hidden');
+  await focus.send('Emulation.setFocusEmulationEnabled', { enabled: true });
+  await pause(1100);
+  check(
+    'disabled layer does not resume on visibility change',
+    await count(),
+    stopped,
+  );
+  check(
+    'QA layer destroys cleanly',
+    await page.evaluate(() =>
+      window.__gevQaUnregisterLayer(
+        window.__godsEyeView.dataManager,
+        'qa-document-visibility',
+      ),
+    ),
+    true,
+  );
+  console.log('RESULT: 7 passed');
+} finally {
+  await browser.close();
+}

scripts/qa-map-source-tray.mjs

@@ -156,14 +156,50 @@ const pressTabs = async (count, backwards = false) => {
   // The row scrolls smoothly when native Tab brings an edge button into view.
   await new Promise((resolve) => setTimeout(resolve, 250));
 };
+// Phones (≤720px) present the dock's Presets inline in the More tab's sheet.
+// It opens from the keyboard, as a keyboard user would, so the focus it moves
+// into the sheet shows a ring.
+const openPhoneMoreSheet = async () => {
+  const tab = '#mobile-tab-bar [data-mobile-sheet="more"]';
+  if (await page.evaluate(() => document.body.dataset.mobileSheet === 'more')) {
+    await page.focus(tab);
+    await page.keyboard.press('Enter');
+  }
+  await page.focus(tab);
+  await page.keyboard.press('Enter');
+  await page.evaluate(() => new Promise((resolve) => {
+    requestAnimationFrame(() => requestAnimationFrame(resolve));
+  }));
+};
+
+// Media-query changes reach the page on a rendering step; wait until the
+// phone shell agrees with the viewport before measuring.
+const waitForShellSettled = () => page.waitForFunction(() => (
+  document.body.classList.contains('mobile-shell')
+    === matchMedia('(max-width: 720px)').matches
+), { timeout: 10_000, polling: 100 });
+
+// The dock slides back into place when the layout leaves the phone shell.
+const waitForDockSettled = () => page.waitForFunction(() => (
+  !document.getElementById('command-dock').getAnimations({ subtree: true })
+    .some((animation) => animation.playState === 'running')
+), { timeout: 5_000 });
+
 const checkResponsiveStyleFocus = async (width) => {
   // The disclosure is only the starting boundary. Every style target below is
   // reached by actual Tab events, never by focusing the style under test.
   const selectedMapBefore = await page.evaluate(() => (
     window.__godsEyeView.styleManager.mapStackController.getActiveId()
   ));
-  await page.focus('#control-panel-toggle');
-  await pressTabs(2); // disclosure -> pin -> Normal
+  if (width <= 720) {
+    // Phones show Presets in the More tab's sheet, which focuses its first
+    // visible control (Normal) when it opens; the tray toggle and pin are
+    // desktop chrome there.
+    await openPhoneMoreSheet();
+  } else {
+    await page.focus('#control-panel-toggle');
+    await pressTabs(2); // disclosure -> pin -> Normal
+  }
   for (const [index, style] of ['normal', 'thermal', 'snow'].entries()) {
     if (index) await pressTabs(3);
     const state = await styleFocusMetrics();
@@ -215,7 +251,16 @@ const layerFocusState = async (id) => ({
   ...await page.evaluate((layerId) => {
     const manager = window.__godsEyeView.dataManager;
     const button = document.querySelector(`[data-layer-id="${layerId}"] .data-toggle-btn`);
-    const list = document.getElementById('data-toggles');
+    // The list scrolls on its own on desktop; in a phone sheet the sheet
+    // scrolls instead. Measure whichever container actually scrolls.
+    let list = document.getElementById('data-toggles');
+    for (let node = list; node; node = node.parentElement) {
+      const overflow = getComputedStyle(node).overflowY;
+      if ((overflow === 'auto' || overflow === 'scroll') && node.scrollHeight > node.clientHeight) {
+        list = node;
+        break;
+      }
+    }
     return {
       lifecycle: manager.getLayerLifecycleState(layerId),
       feedState: button?.dataset.feedState, label: button?.textContent.trim(),
@@ -1146,6 +1191,8 @@ try {
 
   await page.setViewport({ width: 620, height: 900, deviceScaleFactor: 1 });
   await new Promise((resolve) => setTimeout(resolve, 180));
+  await waitForShellSettled();
+  await openPhoneMoreSheet();
   const at620 = await trayMetrics();
   check(
     '620 px tray uses two rows without clipping',
@@ -1179,7 +1226,13 @@ try {
   await page.screenshot({ path: path.join(shotsDir, '480-open.png') });
   await checkResponsiveStyleFocus(480);
 
+  // Pinning and the compact wing are the narrow desktop dock (721–900 px);
+  // phones use the tab bar instead.
+  await page.setViewport({ width: 800, height: 900, deviceScaleFactor: 1 });
+  await waitForShellSettled();
+  await waitForDockSettled();
   await page.click('.dock-pin-btn[data-pin-target="control-panel"]');
+  await waitForDockSettled();
   await page.click('#control-panel-toggle');
   const cdp = await page.createCDPSession();
   await cdp.send('Emulation.setTouchEmulationEnabled', { enabled: true, maxTouchPoints: 1 });
@@ -1374,6 +1427,27 @@ try {
 
     for (const width of [1000, 620, 480]) {
       await page.setViewport({ width, height: 900, deviceScaleFactor: 1 });
+      await waitForShellSettled();
+      if (width <= 720) {
+        // Phones present Location as the Search tab's sheet: the keyboard opens
+        // it onto the field, and Escape returns focus to the tab.
+        const searchTab = '#mobile-tab-bar [data-mobile-sheet="search"]';
+        await page.focus(searchTab);
+        await page.keyboard.press('Enter');
+        await new Promise((resolve) => setTimeout(resolve, 250));
+        const field = await focusMetrics('#location-search');
+        check(`Search: ${width} px keyboard opens the sheet on the location field`,
+          field.focusedId === 'location-search' && field.visible && field.insideViewport,
+          JSON.stringify(field));
+        await page.screenshot({ path: path.join(shotsDir, `${width}-search-open.png`) });
+        await page.keyboard.press('Escape');
+        await new Promise((resolve) => setTimeout(resolve, 250));
+        const tab = await focusMetrics(searchTab);
+        const closedSheet = await page.evaluate(() => !document.body.dataset.mobileSheet);
+        check(`Search: ${width} px Escape closes the sheet with a visible ring on its tab`,
+          closedSheet && hasVisibleControlFocus(tab), JSON.stringify({ closedSheet, tab }));
+        continue;
+      }
       await page.evaluate(() => {
         const manager = window.__godsEyeView.styleManager;
         manager.setPanelCollapsed('control-panel', true, { persist: false, syncShare: false });
@@ -1489,6 +1563,12 @@ try {
     if (dataSetup.ready) {
       for (const width of [1000, 620, 480]) {
         await page.setViewport({ width, height: 900, deviceScaleFactor: 1 });
+        await waitForShellSettled();
+        if (width <= 720 && !(await page.evaluate(() => document.body.dataset.mobileSheet === 'layers'))) {
+          // Phones present Data Layers in the Layers tab's sheet.
+          await page.focus('#mobile-tab-bar [data-mobile-sheet="layers"]');
+          await page.keyboard.press('Enter');
+        }
         await page.evaluate(() => window.__godsEyeView.styleManager.setPanelCollapsed('data-panel', false, { persist: false, syncShare: false }));
         // Resizing schedules rail placement on animation frames. Wait for that
         // pass and its CSS transitions before comparing a focus rectangle with
@@ -1549,6 +1629,7 @@ try {
       )));
 
       await page.setViewport({ width: 1000, height: 900, deviceScaleFactor: 1 });
+      await waitForShellSettled();
       await page.evaluate(() => window.__godsEyeView.styleManager.setPanelCollapsed('data-panel', false, { persist: false, syncShare: false }));
       await page.focus('#data-panel .panel-collapse-btn');
       const transitionTab = await tabTo(`[data-layer-id="${dataSetup.transitionId}"] .data-toggle-btn`);

scripts/qa-overpass-offload.mjs

@@ -306,7 +306,16 @@ try {
   await observeNetwork(page);
   page.on('pageerror', (error) => result.errors.push(error.message));
   page.on('console', (message) => {
-    if (message.type() === 'error' && result.consoleErrors.length < 30)
+    if (message.type() !== 'error') return;
+    // A keyless server does not offer optional Google tokens. Keep every other
+    // HTTP or JavaScript error visible, including failures of this route other
+    // than its expected capability-miss 404.
+    const optionalTokenMiss =
+      message.location().url === new URL('/api/google/tiles-token', url).href &&
+      /^Failed to load resource: the server responded with a status of 404\b/.test(
+        message.text(),
+      );
+    if (!optionalTokenMiss && result.consoleErrors.length < 30)
       result.consoleErrors.push(message.text());
   });
   page.on('requestfailed', (request) => {

scripts/qa-panel-resize.mjs

@@ -1,481 +0,0 @@
-#!/usr/bin/env node
-/**
- * Browser QA for the floating CCTV panel: lift, resize from every handle,
- * minimum size, reload, and dock again. `--fail-on-retry` (or
- * QA_FAIL_ON_RETRY=1) fails on any header-press retry.
- */
-import assert from 'node:assert/strict';
-import { pathToFileURL } from 'node:url';
-import { RESIZE_DIRECTIONS, resizeBox } from '../src/ui/panelResize.js';
-import {
-  describePress,
-  dockPanelByDoubleClick,
-  dragPointer,
-  liftPanelByHeader,
-  nextFrames,
-} from './qa-panelDrag.mjs';
-import {
-  hookRenderErrors,
-  readRenderErrors,
-  saveFailureArtifacts,
-  watchPage,
-} from './qa-browserEvidence.mjs';
-
-export const PANEL_ID = 'cctv-panel';
-export const STORAGE_KEY = `godsEyeView.v8.panelPos.${PANEL_ID}`;
-export const MIN_SIZE = { width: 300, height: 160 };
-export const ARTIFACT_DIR = 'qa-artifacts/panel-resize';
-const VIEWPORT = { width: 1400, height: 900 };
-const EDGE_BY_SIDE = { n: 'top', s: 'bottom', e: 'right', w: 'left' };
-
-/** Box edges a resize in `dir` must leave exactly where they were. */
-export function pinnedEdges(dir) {
-  return Object.entries(EDGE_BY_SIDE)
-    .filter(([side]) => !dir.includes(side))
-    .map(([, edge]) => edge);
-}
-
-/** Pointer travel that grows a panel by `amount` on every edge named in `dir`. */
-export function growthDelta(dir, amount) {
-  return {
-    dx: dir.includes('e') ? amount : dir.includes('w') ? -amount : 0,
-    dy: dir.includes('s') ? amount : dir.includes('n') ? -amount : 0,
-  };
-}
-
-/**
- * Viewport point inside the handle for `dir`, given the panel's client rect.
- * Edge strips straddle the border by 3px; corners and the grip sit inside.
- */
-export function handlePoint(rect, dir) {
-  const inset = dir.length === 2 ? 4 : 1;
-  const x = dir.includes('w')
-    ? rect.left + inset
-    : dir.includes('e')
-      ? rect.right - inset
-      : rect.left + rect.width / 2;
-  const y = dir.includes('n')
-    ? rect.top + inset
-    : dir.includes('s')
-      ? rect.bottom - inset
-      : rect.top + rect.height / 2;
-  return { x, y };
-}
-
-/** Pinned edges that moved during a resize in `dir`. */
-export function driftedEdges(before, after, dir, tolerance = 1.5) {
-  const edges = (box) => ({
-    left: box.left,
-    top: box.top,
-    right: box.left + box.width,
-    bottom: box.top + box.height,
-  });
-  const a = edges(before);
-  const b = edges(after);
-  return pinnedEdges(dir).filter(
-    (edge) => Math.abs(a[edge] - b[edge]) > tolerance,
-  );
-}
-
-function near(actual, expected, tolerance, label) {
-  assert.ok(
-    Math.abs(actual - expected) <= tolerance,
-    `${label}: expected ${expected} ± ${tolerance}, got ${actual}`,
-  );
-}
-
-async function main() {
-  const { default: puppeteer } = await import('puppeteer');
-  const args = process.argv.slice(2);
-  const urlIndex = args.indexOf('--url');
-  const url = urlIndex >= 0 ? args[urlIndex + 1] : 'http://localhost:4173';
-  if (args.includes('--fail-on-retry')) process.env.QA_FAIL_ON_RETRY = '1';
-  const browser = await puppeteer.launch({
-    headless: true,
-    executablePath:
-      process.env.PUPPETEER_EXECUTABLE_PATH ||
-      (await puppeteer.executablePath()),
-    args: ['--no-sandbox', '--use-gl=angle', '--use-angle=swiftshader'],
-  });
-  const monitors = [];
-  try {
-    const page = await browser.newPage();
-    await page.setViewport(VIEWPORT);
-    const errors = [];
-    monitors.push(watchPage(page, { name: 'panel', errors }));
-    await hookRenderErrors(page);
-
-    const boot = async () => {
-      await page.goto(`${url}/`, { waitUntil: 'domcontentloaded' });
-      await page.waitForFunction(() => window.__godsEyeView?.viewer, {
-        timeout: 90_000,
-      });
-      await page.waitForSelector(`#${PANEL_ID} .panel-header`);
-      await page.evaluate(() => {
-        document.querySelector('.first-run-explore')?.click();
-      });
-      await page.keyboard.press('Escape');
-      await page.evaluate(() => {
-        document.getElementById('first-run-launcher')?.remove();
-        for (const node of document.querySelectorAll('[class*=first-run]'))
-          node.remove();
-      });
-      await page.mouse.click(VIEWPORT.width / 2, VIEWPORT.height / 2);
-      await nextFrames(page);
-    };
-    const readPanel = () =>
-      page.evaluate((id) => {
-        const panel = document.getElementById(id);
-        const rect = panel.getBoundingClientRect();
-        return {
-          left: rect.left,
-          top: rect.top,
-          width: rect.width,
-          height: rect.height,
-          // handlePoint() reads the far edges for s/e handles.
-          right: rect.right,
-          bottom: rect.bottom,
-          floating: panel.classList.contains('panel-floating'),
-          collapsed: panel.classList.contains('collapsed'),
-          inRail: panel.parentElement?.id === 'right-context-rail',
-          allocated: panel.style.getPropertyValue(
-            '--right-panel-allocated-height',
-          ),
-          inlineWidth: panel.style.width,
-          inlineHeight: panel.style.height,
-          stored: localStorage.getItem(`godsEyeView.v8.panelPos.${id}`),
-        };
-      }, PANEL_ID);
-    /**
-     * Best effort: wait for the box to hold still for half a second. The lift
-     * is checked against the box at pointerdown, so a timeout only costs time.
-     */
-    const settle = async () => {
-      try {
-        await page.waitForFunction(
-          (id) => {
-            const r = document.getElementById(id).getBoundingClientRect();
-            const box = [r.left, r.top, r.width, r.height]
-              .map(Math.round)
-              .join(',');
-            const now = performance.now();
-            if (window.__qaLastBox !== box) {
-              window.__qaLastBox = box;
-              window.__qaSince = now;
-            }
-            return now - window.__qaSince >= 500;
-          },
-          { polling: 100, timeout: 20_000 },
-          PANEL_ID,
-        );
-      } catch (error) {
-        if (error?.name !== 'TimeoutError') throw error;
-        console.log('note: the CCTV panel was still moving; lifting anyway');
-      }
-    };
-    const headerPoint = async () => {
-      const rect = await page.evaluate((id) => {
-        const title = document.querySelector(
-          `#${id} .panel-header .panel-title`,
-        );
-        const r = title.getBoundingClientRect();
-        return { x: r.left + r.width / 2, y: r.top + r.height / 2 };
-      }, PANEL_ID);
-      return rect;
-    };
-    const drag = (from, dx, dy) => dragPointer(page, from, dx, dy);
-
-    await page.goto(`${url}/`, { waitUntil: 'domcontentloaded' });
-    await page.evaluate((key) => {
-      localStorage.removeItem(key);
-      localStorage.removeItem('godsEyeView.v8.panelFloatHintShown');
-    }, STORAGE_KEY);
-    await boot();
-
-    await page.evaluate((id) => {
-      const panel = document.getElementById(id);
-      if (panel.classList.contains('collapsed'))
-        document
-          .querySelector(`.panel-collapse-btn[data-collapse-target="${id}"]`)
-          .click();
-    }, PANEL_ID);
-    await page.waitForFunction(
-      (id) => !document.getElementById(id).classList.contains('collapsed'),
-      {},
-      PANEL_ID,
-    );
-    // The rail animates panel heights, and on a slow software renderer the
-    // panels above CCTV can still be moving after a fixed sleep.
-    await settle();
-    const docked = await readPanel();
-    assert.equal(docked.floating, false);
-    assert.equal(docked.inRail, true);
-
-    // Names whatever above CCTV in the rail shifted it, for a retry note.
-    const railAbove = () =>
-      page.evaluate((id) => {
-        const out = [];
-        for (const node of document.getElementById('right-context-rail')
-          ?.children || []) {
-          if (node.id === id) break;
-          out.push(
-            `${node.id || node.className}:${Math.round(node.offsetHeight)}`,
-          );
-        }
-        return out.join(' ');
-      }, PANEL_ID);
-    const aboveAtDock = await railAbove();
-    // On CI a panel above CCTV grows after load and can shift the header out
-    // from under the press; the helper retries only such a provable miss.
-    const attempt = await liftPanelByHeader(page, PANEL_ID, {
-      dx: -200,
-      dy: -100,
-      note: async () =>
-        `rail above CCTV ${aboveAtDock} -> ${await railAbove()}`,
-    });
-    const { pressed } = attempt;
-    const lifted = await readPanel();
-    assert.equal(
-      lifted.floating,
-      true,
-      `a header drag lifts the panel out (${describePress(attempt)}; panel docked at ${docked.top}, at press ${pressed?.top})`,
-    );
-    assert.equal(
-      lifted.collapsed,
-      false,
-      'the drag-ending click must not collapse',
-    );
-    const moved = `docked at ${docked.left},${docked.top}; pressed at ${pressed.left},${pressed.top}`;
-    near(
-      lifted.left,
-      Math.max(6, pressed.left - 200),
-      2,
-      `lifted left (${moved})`,
-    );
-    near(
-      lifted.top,
-      Math.max(6, pressed.top - 100),
-      2,
-      `lifted top (${moved})`,
-    );
-    near(lifted.width, pressed.width, 2, 'lifted width');
-    // The rail lets go of the lifted panel on its next layout pass.
-    await page
-      .waitForFunction(
-        (id) =>
-          document
-            .getElementById(id)
-            .style.getPropertyValue('--right-panel-allocated-height') === '',
-        { timeout: 5_000 },
-        PANEL_ID,
-      )
-      .catch(() => {});
-    const afterLayout = await readPanel();
-    assert.equal(afterLayout.allocated, '', 'the rail no longer allocates it');
-    const railExcludes = await page.evaluate((id) => {
-      const rail = document.getElementById('right-context-rail');
-      // Same rule as the rail: hidden panels take no room.
-      const counted = [...rail.children].filter((panel) =>
-        panel.matches(
-          '[data-panel-id]:not(.panel-floating):not(.collapsed):not([hidden])',
-        ),
-      );
-      return {
-        expandedCount: rail.dataset.expandedCount,
-        counted: counted.length,
-        includesPanel: counted.some((panel) => panel.id === id),
-      };
-    }, PANEL_ID);
-    assert.equal(railExcludes.includesPanel, false);
-    if (railExcludes.expandedCount !== undefined)
-      assert.equal(Number(railExcludes.expandedCount), railExcludes.counted);
-    const storedAfterLift = JSON.parse(afterLayout.stored);
-    assert.equal(storedAfterLift.floating, true);
-    assert.equal(
-      'height' in storedAfterLift,
-      false,
-      'a drag alone must not freeze the measured height',
-    );
-    console.log('PASS: header drag lifts CCTV out of the rail');
-
-    // Park near the top: the voice dock would cover the south corners once
-    // the loop below has grown the window.
-    {
-      const header = await headerPoint();
-      await drag(header, 0, 120 - header.y);
-    }
-
-    const limits = {
-      minWidth: MIN_SIZE.width,
-      minHeight: MIN_SIZE.height,
-      viewportWidth: VIEWPORT.width,
-      viewportHeight: VIEWPORT.height,
-    };
-    for (const dir of RESIZE_DIRECTIONS) {
-      const before = await readPanel();
-      const { dx, dy } = growthDelta(dir, 40);
-      const point = handlePoint(before, dir);
-      const hit = await page.evaluate(({ x, y }) => {
-        const node = document.elementFromPoint(x, y);
-        if (!node) return 'nothing';
-        const dirAttr = node.dataset?.dir
-          ? `[data-dir=${node.dataset.dir}]`
-          : '';
-        return `${node.tagName.toLowerCase()}${node.id ? `#${node.id}` : ''}.${[...node.classList].join('.')}${dirAttr}`;
-      }, point);
-      await drag(point, dx, dy);
-      const after = await readPanel();
-      const expected = resizeBox(before, dir, dx, dy, limits);
-      for (const key of ['left', 'top', 'width', 'height'])
-        near(after[key], expected[key], 2, `${dir} ${key} (pointer on ${hit})`);
-      assert.deepEqual(driftedEdges(before, after, dir, 2), [], `${dir} pins`);
-    }
-    console.log('PASS: eight resize handles keep the opposite edge pinned');
-
-    let before = await readPanel();
-    await drag(handlePoint(before, 'se'), -2000, -2000);
-    let after = await readPanel();
-    near(after.width, MIN_SIZE.width, 2, 'min width (se)');
-    near(after.height, MIN_SIZE.height, 2, 'min height (se)');
-    assert.deepEqual(driftedEdges(before, after, 'se', 2), []);
-    before = after;
-    await drag(handlePoint(before, 'nw'), 2000, 2000);
-    after = await readPanel();
-    near(after.width, MIN_SIZE.width, 2, 'min width (nw)');
-    near(after.height, MIN_SIZE.height, 2, 'min height (nw)');
-    assert.deepEqual(driftedEdges(before, after, 'nw', 2), []);
-    console.log('PASS: minimum size holds from both corners');
-
-    const saved = await readPanel();
-    const record = JSON.parse(saved.stored);
-    assert.equal(record.floating, true);
-    await boot();
-    const restored = await readPanel();
-    assert.equal(restored.floating, true, 'floating survives a reload');
-    for (const key of ['left', 'top', 'width', 'height'])
-      near(restored[key], record[key], 2, `restored ${key}`);
-    console.log('PASS: reload restores position and size');
-
-    // A collapsed window keeps the height chosen for it, through a drag of
-    // its header strip and a reload.
-    const setCollapsed = async (collapsed) => {
-      await page.evaluate(
-        (id, want) => {
-          const panel = document.getElementById(id);
-          if (panel.classList.contains('collapsed') !== want)
-            document
-              .querySelector(
-                `.panel-collapse-btn[data-collapse-target="${id}"]`,
-              )
-              .click();
-        },
-        PANEL_ID,
-        collapsed,
-      );
-      await page.waitForFunction(
-        (id, want) =>
-          document.getElementById(id).classList.contains('collapsed') === want,
-        {},
-        PANEL_ID,
-        collapsed,
-      );
-      await nextFrames(page);
-    };
-    // Grow it from the corner once the restored window holds still, with the
-    // pointer really on the handle (a press beside it selects page text).
-    let chosen = await readPanel();
-    const tried = [];
-    for (
-      let attempt = 0;
-      attempt < 3 && chosen.height <= MIN_SIZE.height + 150;
-      attempt++
-    ) {
-      await settle();
-      const box = await readPanel();
-      const corner = handlePoint(box, 'se');
-      const hit = await page.evaluate(({ x, y }) => {
-        const node = document.elementFromPoint(x, y);
-        return {
-          dir: node?.dataset?.dir || null,
-          target: node
-            ? `${node.tagName.toLowerCase()}${node.id ? `#${node.id}` : ''}.${[...node.classList].join('.')}`
-            : 'nothing',
-        };
-      }, corner);
-      tried.push(
-        `${Math.round(corner.x)},${Math.round(corner.y)} on ${hit.target} (box ${Math.round(box.left)},${Math.round(box.top)} ${Math.round(box.width)}x${Math.round(box.height)})`,
-      );
-      if (hit.dir === 'se') await drag(corner, 0, 200);
-      chosen = await readPanel();
-    }
-    assert.ok(
-      chosen.height > MIN_SIZE.height + 150,
-      `the window grew to ${chosen.height}px; tried ${tried.join('; ')}`,
-    );
-    await setCollapsed(true);
-    const strip = await readPanel();
-    assert.ok(strip.height < chosen.height - 100, 'collapsed to its header');
-    await drag(await headerPoint(), 40, 30);
-    const movedStrip = await readPanel();
-    assert.equal(movedStrip.floating, true, 'the strip stays a window');
-    near(
-      JSON.parse(movedStrip.stored).height,
-      chosen.height,
-      2,
-      'stored height while collapsed',
-    );
-    await boot();
-    await setCollapsed(false);
-    near(
-      (await readPanel()).height,
-      chosen.height,
-      2,
-      'height after expanding',
-    );
-    console.log(
-      'PASS: a collapsed window keeps its height through a drag and a reload',
-    );
-
-    const dock = await dockPanelByDoubleClick(page, PANEL_ID);
-    const snapped = await readPanel();
-    assert.equal(
-      snapped.floating,
-      false,
-      `double-click snaps back (${describePress(dock)})`,
-    );
-    assert.equal(snapped.inRail, true);
-    assert.equal(snapped.inlineWidth, '');
-    assert.equal(snapped.inlineHeight, '');
-    assert.equal(snapped.stored, null, 'the storage key is gone');
-    console.log('PASS: header double-click returns the panel to the rail');
-
-    const renderErrors = await readRenderErrors(page);
-    assert.deepEqual(
-      [...errors, ...renderErrors.map((text) => `scene.renderError: ${text}`)],
-      [],
-      'no page errors and no Cesium render-loop errors',
-    );
-    console.log('PASS: no page errors and no render-loop errors');
-  } catch (error) {
-    const dir = await saveFailureArtifacts({
-      dir: ARTIFACT_DIR,
-      browser,
-      monitors,
-      error,
-    }).catch(() => null);
-    if (dir) console.error(`failure evidence saved in ${dir}/`);
-    throw error;
-  } finally {
-    await browser.close();
-  }
-}
-
-if (
-  process.argv[1] &&
-  import.meta.url === pathToFileURL(process.argv[1]).href
-) {
-  main().catch((error) => {
-    console.error(error.stack || error.message);
-    process.exit(1);
-  });
-}

scripts/qa-panelDrag.mjs

@@ -1,319 +0,0 @@
-/**
- * Header press-and-verify for the QA gates that lift a rail panel into a
- * floating window and dock it again. The rail animates panel heights, so a
- * point read once can be under another panel by the time the pointer goes
- * down. Only a provable miss (a recorded press outside the header) is
- * retried, with a GitHub `::warning::`. With QA_FAIL_ON_RETRY=1 a miss the
- * panel's own movement cannot explain fails the run instead.
- */
-
-const delay = (ms) => new Promise((resolve) => setTimeout(resolve, ms));
-
-/** Retries after the first attempt, and the pause before each. */
-export const PRESS_RETRIES = 2;
-const RETRY_PAUSE_MS = 1000;
-
-/** Whether a retry fails the run (QA_FAIL_ON_RETRY=1 or --fail-on-retry). */
-export function failOnRetryDefault(
-  env = process.env,
-  argv = process.argv.slice(2),
-) {
-  return env.QA_FAIL_ON_RETRY === '1' || argv.includes('--fail-on-retry');
-}
-
-/**
- * A failed attempt whose press landed outside the header. No recorded press
- * is a failure, not a miss: a retry would only hide it.
- * @param {{done: boolean, pressed: {inHeader: boolean}|null}} attempt
- */
-export function pressMissed(attempt) {
-  return !attempt.done && attempt.pressed?.inHeader === false;
-}
-
-/** Whether the panel's box changed by more than 2 px between two reads. */
-export function panelMoved(before, after) {
-  if (!before || !after) return false;
-  return ['left', 'top', 'width', 'height'].some(
-    (key) => Math.abs((after[key] ?? NaN) - (before[key] ?? NaN)) > 2,
-  );
-}
-
-/** The panel's box, rounded, as `left,top widthxheight`. */
-export function formatBox(box) {
-  if (!box) return 'unknown';
-  const r = (value) => Math.round(value ?? NaN);
-  return `${r(box.left)},${r(box.top)} ${r(box.width)}x${r(box.height)}`;
-}
-
-function panelBox(page, panelId) {
-  return page.evaluate((id) => {
-    const r = document.getElementById(id).getBoundingClientRect();
-    return { left: r.left, top: r.top, width: r.width, height: r.height };
-  }, panelId);
-}
-
-export function headerPoint(page, panelId) {
-  return page.evaluate((id) => {
-    const title = document.querySelector(`#${id} .panel-header .panel-title`);
-    const r = title.getBoundingClientRect();
-    return { x: r.left + r.width / 2, y: r.top + r.height / 2 };
-  }, panelId);
-}
-
-/** Name the element at a point, and whether it is the panel's header. */
-export function hitAt(page, point, panelId) {
-  return page.evaluate(
-    ({ x, y, id }) => {
-      const node = document.elementFromPoint(x, y);
-      if (!node) return { target: 'nothing', inHeader: false };
-      return {
-        target: `${node.tagName.toLowerCase()}${node.id ? `#${node.id}` : ''}.${[...node.classList].join('.')}`,
-        inHeader: Boolean(node.closest(`#${id} .panel-header`)),
-      };
-    },
-    { ...point, id: panelId },
-  );
-}
-
-/**
- * Re-resolve the header point until it hits the header or the wait runs out
- * (the press then records the miss).
- */
-export async function headerTarget(
-  page,
-  panelId,
-  { tries = 20, intervalMs = 500 } = {},
-) {
-  let point = await headerPoint(page, panelId);
-  let hit = await hitAt(page, point, panelId);
-  for (let i = 0; i < tries && !hit.inHeader; i++) {
-    await delay(intervalMs);
-    point = await headerPoint(page, panelId);
-    hit = await hitAt(page, point, panelId);
-  }
-  const box = await panelBox(page, panelId);
-  return { point, hit, timedOut: !hit.inHeader, box };
-}
-
-/**
- * Best effort: wait until the panel's box has held still for `stillMs`, so
- * the header does not move between the hit check and the press.
- */
-export async function waitForStill(
-  page,
-  panelId,
-  { stillMs = 300, timeout = 5000 } = {},
-) {
-  try {
-    await page.waitForFunction(
-      (id, ms) => {
-        const r = document.getElementById(id).getBoundingClientRect();
-        const box = [r.left, r.top, r.width, r.height].map(Math.round).join();
-        const now = performance.now();
-        if (window.__qaStillBox !== box) {
-          window.__qaStillBox = box;
-          window.__qaStillSince = now;
-        }
-        return now - window.__qaStillSince >= ms;
-      },
-      { polling: 100, timeout },
-      panelId,
-      stillMs,
-    );
-    return true;
-  } catch (error) {
-    if (error?.name !== 'TimeoutError') throw error;
-    return false;
-  }
-}
-
-/** Record the next pointerdown's target and the panel's box at that moment. */
-export function recordNextPress(page, panelId) {
-  return page.evaluate((id) => {
-    window.__qaPressBox = null;
-    window.addEventListener(
-      'pointerdown',
-      (event) => {
-        const r = document.getElementById(id).getBoundingClientRect();
-        const target = event.target;
-        window.__qaPressBox = {
-          left: r.left,
-          top: r.top,
-          width: r.width,
-          height: r.height,
-          target: `${target.tagName?.toLowerCase()}${target.id ? `#${target.id}` : ''}.${[...(target.classList || [])].join('.')}`,
-          inHeader: Boolean(target.closest?.(`#${id} .panel-header`)),
-        };
-      },
-      { capture: true, once: true },
-    );
-  }, panelId);
-}
-
-function readPress(page) {
-  return page.evaluate(() => window.__qaPressBox ?? null);
-}
-
-export async function waitForFloating(
-  page,
-  panelId,
-  floating,
-  { timeout = 3000 } = {},
-) {
-  try {
-    await page.waitForFunction(
-      (id, want) =>
-        document.getElementById(id).classList.contains('panel-floating') ===
-        want,
-      { polling: 50, timeout },
-      panelId,
-      floating,
-    );
-    return true;
-  } catch (error) {
-    if (error?.name !== 'TimeoutError') throw error;
-    return false;
-  }
-}
-
-/** Two paints: by then every layout change an input caused is on screen. */
-export function nextFrames(page) {
-  return page.evaluate(
-    () =>
-      new Promise((resolve) =>
-        requestAnimationFrame(() => requestAnimationFrame(() => resolve())),
-      ),
-  );
-}
-
-export async function dragPointer(page, from, dx, dy, { steps = 6 } = {}) {
-  await page.mouse.move(from.x, from.y);
-  await page.mouse.down();
-  await page.mouse.move(from.x + dx / 2, from.y + dy / 2, { steps });
-  await page.mouse.move(from.x + dx, from.y + dy, { steps });
-  await page.mouse.up();
-  await nextFrames(page);
-}
-
-export function describeRetry(
-  panelId,
-  attempt,
-  { round, retries, extra = '' },
-) {
-  const { hit, pressed, timedOut, still, box } = attempt;
-  return [
-    `retry ${round + 1}/${retries}: the press missed the ${panelId} header (on ${pressed?.target ?? hit.target})`,
-    `pre-press hit check ${timedOut ? `timed out (on ${hit.target})` : 'passed'}`,
-    `stillness ${still === false ? 'timed out' : 'held'}`,
-    `panel box at hit check ${formatBox(box)} -> at press ${formatBox(pressed)}`,
-  ]
-    .concat(extra ? [extra] : [])
-    .join('; ');
-}
-
-/** Retry `press` only while it provably misses the header. */
-async function pressUntilDecided(
-  page,
-  panelId,
-  press,
-  {
-    retries,
-    log,
-    note,
-    pauseMs = RETRY_PAUSE_MS,
-    failOnRetry = failOnRetryDefault(),
-  },
-) {
-  for (let round = 0; ; round++) {
-    const still = await waitForStill(page, panelId);
-    await recordNextPress(page, panelId);
-    const { point, hit, timedOut, box } = await headerTarget(page, panelId);
-    const done = await press(point);
-    const attempt = {
-      point,
-      hit,
-      timedOut,
-      still,
-      box,
-      done,
-      pressed: await readPress(page),
-      retries: round,
-    };
-    if (round >= retries || !pressMissed(attempt)) return attempt;
-    const why = describeRetry(panelId, attempt, {
-      round,
-      retries,
-      extra: note ? await note() : '',
-    });
-    if (failOnRetry && !panelMoved(box, attempt.pressed))
-      throw new Error(
-        `QA_FAIL_ON_RETRY=1 turns this retry into a failure: ${why}`,
-      );
-    log(`note: ${why}; retrying`);
-    log(`::warning title=Panel press retried::${why}`);
-    await delay(pauseMs);
-  }
-}
-
-/**
- * Lift a docked panel into a floating window with a header drag.
- * @returns {Promise<{point: {x: number, y: number}, hit: {target: string, inHeader: boolean}, done: boolean, pressed: object|null}>}
- */
-export function liftPanelByHeader(
-  page,
-  panelId,
-  {
-    dx,
-    dy,
-    retries = PRESS_RETRIES,
-    log = console.log,
-    note,
-    pauseMs,
-    failOnRetry,
-  } = {},
-) {
-  return pressUntilDecided(
-    page,
-    panelId,
-    async (point) => {
-      await dragPointer(page, point, dx, dy);
-      return waitForFloating(page, panelId, true);
-    },
-    { retries, log, note, pauseMs, failOnRetry },
-  );
-}
-
-/** Dock a floating panel with a header double-click; same result as lifting. */
-export function dockPanelByDoubleClick(
-  page,
-  panelId,
-  {
-    retries = PRESS_RETRIES,
-    log = console.log,
-    note,
-    pauseMs,
-    failOnRetry,
-  } = {},
-) {
-  return pressUntilDecided(
-    page,
-    panelId,
-    async (point) => {
-      await page.mouse.click(point.x, point.y, { clickCount: 1 });
-      await page.mouse.click(point.x, point.y, { clickCount: 2 });
-      return waitForFloating(page, panelId, false);
-    },
-    { retries, log, note, pauseMs, failOnRetry },
-  );
-}
-
-/** Where an attempt pressed, for an assertion message. */
-export function describePress(attempt) {
-  const { point, hit, pressed } = attempt;
-  const where = `pressed ${Math.round(point.x)},${Math.round(point.y)}`;
-  if (!pressed)
-    return `${where}: no pointerdown reached the page (hit check on ${hit.target}, in header: ${hit.inHeader})`;
-  const n = attempt.retries || 0;
-  const retried = n ? `, after ${n} ${n === 1 ? 'retry' : 'retries'}` : '';
-  return `${where} on ${pressed.target}, in header: ${pressed.inHeader}${retried}`;
-}

scripts/qa-radio.mjs

@@ -1291,8 +1291,6 @@ async function main() {
     const clusterBadge = await page.evaluate(async () => {
       const viewer = window.__godsEyeView.viewer;
       const { getOverlayPaintRect, getWorldOverlayDiagnostics } = await import('/src/overlays/worldOverlay.js');
-      const { distanceFade } = await import('/src/overlays/worldOverlayDraw.js');
-      const { radioStationIdFromPick } = await import('/src/data/radio.js');
       const baselineSolveRevision = getWorldOverlayDiagnostics().solveRevision;
       const source = Array.from({ length: viewer.dataSources.length }, (_, index) => viewer.dataSources.get(index))
         .find((item) => item.name === 'Radio stations');
@@ -2761,13 +2759,16 @@ async function main() {
       const beforeSpace = radio.getUIState().audioState;
       // Simulate an already-started hold-Space session; click-started open mic
       // deliberately ignores Space takeover, and short taps never claim voice.
-      const priorPushToTalkMode = voice.pushToTalkMode;
-      voice.pushToTalkMode = true;
+      // The provider facade forwards reads, not writes. Set the mounted
+      // controller's input owner; assigning on the facade only shadows it.
+      const controller = voice.session.adapter.controller;
+      const priorPushToTalkMode = controller.pushToTalkMode;
+      controller.pushToTalkMode = true;
       document.dispatchEvent(new KeyboardEvent('keydown', { bubbles: true, cancelable: true, code: 'Space', key: ' ' }));
       await new Promise((resolve) => setTimeout(resolve, 700));
       const afterSpace = radio.getUIState().audioState;
       document.dispatchEvent(new KeyboardEvent('keyup', { bubbles: true, cancelable: true, code: 'Space', key: ' ' }));
-      voice.pushToTalkMode = priorPushToTalkMode;
+      controller.pushToTalkMode = priorPushToTalkMode;
       await radio.play();
       voice.setVoiceSpeaker('ai');
       return { beforeSpace, afterSpace, afterAi: radio.getUIState().audioState };

scripts/qa-scene-controls.mjs

@@ -66,7 +66,8 @@ try {
       );
     }),
   );
-  await page.click('#scene-capture-btn');
+  await page.focus('#scene-capture-btn');
+  await page.keyboard.press('Space');
   await page.waitForFunction(
     () => document.querySelectorAll('.scene-shot-row').length === 1,
   );
@@ -328,6 +329,9 @@ try {
   await page.keyboard.press('Escape');
   await page.screenshot({ path: path.join(shots, 'desktop.png') });
   await page.setViewport({ width: 390, height: 844 });
+  // Phones present Scenes in the Layers tab's sheet.
+  await page.click('#mobile-tab-bar [data-mobile-sheet="layers"]');
+  await new Promise((resolve) => setTimeout(resolve, 400));
   await page.screenshot({ path: path.join(shots, 'narrow.png') });
   check(
     'Scene controls stay inside the narrow viewport',

scripts/qa-scope-hud.mjs

@@ -0,0 +1,681 @@
+#!/usr/bin/env node
+/**
+ * Scope and HUD browser acceptance. Requires the development server.
+ * Run: node scripts/qa-scope-hud.mjs
+ * Optional: QA_BASE_URL, QA_SCREENSHOT_DIR (screenshots stay outside the repo).
+ * Proves a fresh boot defaults to Scope ON at 100%, native checkbox click/Space,
+ * feather 0/11/100/200, layout independence,
+ * share/scene restore, and visible text backing including rotated metadata.
+ */
+import fs from 'node:fs';
+import path from 'node:path';
+import puppeteer from 'puppeteer';
+
+const browser = await puppeteer.launch({
+  headless: true,
+  args: [
+    '--no-sandbox',
+    ...(process.platform === 'darwin'
+      ? ['--use-angle=metal', '--enable-gpu']
+      : ['--use-gl=angle', '--use-angle=swiftshader']),
+  ],
+});
+const page = await browser.newPage();
+const errors = [];
+page.on('pageerror', (error) => errors.push(error.message));
+let failures = 0;
+const check = (name, passed, detail) => {
+  console.log(`[${passed ? 'PASS' : 'FAIL'}] ${name}`);
+  if (!passed) {
+    failures += 1;
+    if (detail) console.log(JSON.stringify(detail));
+  }
+};
+const readScope = () =>
+  page.evaluate(() => {
+    const scope = window.__godsEyeView.styleManager.getVisualState().scope;
+    const canvas = document.getElementById('scope-mask');
+    const context = canvas.getContext('2d');
+    const radialX = Math.round(
+      canvas.width / 2 + Math.min(canvas.width, canvas.height) * 0.35,
+    );
+    return {
+      enabled: scope.enabled,
+      feather: scope.featherPct / 100,
+      cornerAlpha: context.getImageData(1, 1, 1, 1).data[3],
+      radialAlpha: context.getImageData(
+        radialX,
+        Math.round(canvas.height / 2),
+        1,
+        1,
+      ).data[3],
+      checked: document.getElementById('scope-toggle').checked,
+      disabled: document.getElementById('scope-feather-slider').disabled,
+      value: Number(document.getElementById('scope-feather-slider').value),
+      readout: document.getElementById('scope-feather-value').textContent,
+    };
+  });
+
+const readHudGlyphs = () =>
+  page.evaluate(() => {
+    const hud = document.getElementById('intel-hud');
+    const probe = document.createElement('span');
+    probe.style.display = 'none';
+    hud.appendChild(probe);
+    const baseline = {
+      color: getComputedStyle(probe).color,
+      shadow: getComputedStyle(probe).textShadow,
+    };
+    probe.remove();
+    const glyphs = [
+      '.hud-mode',
+      '.hud-system',
+      '.hud-summary-label',
+      '.hud-summary',
+      '.hud-orbital',
+      '#hud-mgrs',
+      '#hud-coll',
+    ].map((selector) => {
+      const el = hud.querySelector(selector);
+      const style = getComputedStyle(el);
+      let opacity = 1;
+      for (
+        let current = el;
+        current && current !== hud;
+        current = current.parentElement
+      )
+        opacity *= Number(getComputedStyle(current).opacity);
+      return {
+        selector,
+        color: style.color,
+        shadow: style.textShadow,
+        opacity,
+      };
+    });
+    return { baseline, glyphs };
+  });
+
+async function settleTextBackings(enabled) {
+  // The pre-existing active-style value transitions all properties for 300ms.
+  // Wait for its backing to finish changing before inspecting or capturing it.
+  await page
+    .waitForFunction(
+      (scopeEnabled) => {
+        const expected = scopeEnabled
+          ? 'rgba(0, 0, 0, 0)'
+          : 'rgba(0, 0, 0, 0.7)';
+        return [
+          ...document.querySelectorAll(
+            '#intel-hud .hud-readout, .scene-text-holdout',
+          ),
+        ].every(
+          (el) =>
+            getComputedStyle(el).backgroundColor === expected &&
+            getComputedStyle(el).boxShadow === 'none',
+        );
+      },
+      { timeout: 2_000 },
+      enabled,
+    )
+    .catch(() => null);
+}
+
+const readSceneChrome = () =>
+  page.evaluate(() => {
+    const title = document.querySelector('#title-bar h1');
+    const eye = title.querySelector('.title-logo');
+    const subtitle = document.querySelector('#title-bar .subtitle');
+    const label = document.querySelector('#style-indicator .indicator-label');
+    const rect = (el, text = false) => {
+      if (!el.getClientRects().length) return null;
+      const range = document.createRange();
+      range.selectNodeContents(el);
+      const box = text
+        ? range.getBoundingClientRect()
+        : el.getBoundingClientRect();
+      return {
+        left: box.left,
+        top: box.top,
+        right: box.right,
+        bottom: box.bottom,
+      };
+    };
+    const titleBox = rect(title);
+    const eyeBox = rect(eye);
+    const backing = getComputedStyle(title, '::before');
+    const plate = {
+      left: titleBox.left + parseFloat(backing.left),
+      top: titleBox.top + parseFloat(backing.top),
+      right: titleBox.right - parseFloat(backing.right),
+      bottom: titleBox.bottom - parseFloat(backing.bottom),
+    };
+    const contains = (box) =>
+      Object.entries(box).every(([side, value]) =>
+        ['left', 'top'].includes(side)
+          ? plate[side] <= value + 0.5
+          : plate[side] >= value - 0.5,
+      );
+    const probe = document.createElement('span');
+    document.body.appendChild(probe);
+    probe.style.color = 'var(--text-dim)';
+    const dim = getComputedStyle(probe).color;
+    probe.style.color = 'var(--text-secondary)';
+    const secondary = getComputedStyle(probe).color;
+    probe.remove();
+    return {
+      positions: {
+        title: titleBox,
+        eye: eyeBox,
+        text: rect(title.querySelector('[translate="no"]'), true),
+        subtitle: rect(subtitle, true),
+      },
+      titleUnbacked: backing.backgroundColor === 'rgba(0, 0, 0, 0)',
+      titleCovered:
+        backing.position === 'absolute' &&
+        backing.backgroundColor === 'rgba(0, 0, 0, 0.7)' &&
+        contains(titleBox) &&
+        contains(eyeBox),
+      leftAligned:
+        !rect(subtitle) || Math.abs(plate.left - rect(subtitle).left) <= 0.5,
+      colors: [getComputedStyle(subtitle).color, getComputedStyle(label).color],
+      dim,
+      secondary,
+    };
+  });
+
+function checkSceneChrome(name, before, after) {
+  const stable = Object.keys(before.positions).every((key) => {
+    const a = before.positions[key];
+    const b = after.positions[key];
+    return a && b
+      ? Object.keys(a).every((side) => Math.abs(a[side] - b[side]) <= 0.5)
+      : a === b;
+  });
+  check(`${name}: title, eye and subtitle stay in place across Scope`, stable, {
+    before,
+    after,
+  });
+  check(
+    `${name}: OFF title plate covers the eye and aligns with the subtitle`,
+    before.titleUnbacked && after.titleCovered && after.leftAligned,
+    after,
+  );
+  check(
+    `${name}: secondary labels brighten only with Scope OFF`,
+    before.colors.every((color) => color === before.dim) &&
+      after.colors.every((color) => color === after.secondary),
+    { before: before.colors, after: after.colors },
+  );
+}
+
+async function openApplication(url) {
+  await page.goto(url.href, { waitUntil: 'domcontentloaded' });
+  await page.waitForFunction(
+    () => window.__godsEyeView?.styleManager?._applicationShortcuts,
+    { timeout: 60_000 },
+  );
+  await page.waitForFunction(
+    () => {
+      const cover = document.getElementById('loading-screen');
+      return (
+        cover?.classList.contains('hidden') &&
+        Number(getComputedStyle(cover).opacity) === 0
+      );
+    },
+    { timeout: 60_000 },
+  );
+}
+
+try {
+  await page.setViewport({ width: 1440, height: 900 });
+  const url = new URL(process.env.QA_BASE_URL || 'http://127.0.0.1:4173');
+  url.searchParams.set('welcome', '0');
+  // This browser has a fresh profile. Start without authored state so the
+  // first assertion exercises the defaults rather than a share-link restore.
+  url.hash = '';
+  await openApplication(url);
+  const fresh = await readScope();
+  check(
+    'bare-URL fresh boot opens Scope ON with 100% feather',
+    fresh.enabled &&
+      fresh.checked &&
+      !fresh.disabled &&
+      fresh.feather === 1 &&
+      fresh.value === 100 &&
+      fresh.readout === '100%' &&
+      fresh.cornerAlpha > 0,
+    fresh,
+  );
+
+  // Use a known city view for canvas and readability checks below.
+  url.hash =
+    'v=2&lat=30.2672&lon=-97.7431&alt=2500&heading=0&pitch=-45&roll=0&map=esri&sc=1&scf=100&l=';
+  // Changing only the hash does not rerun startup restoration. Leave the app
+  // document first so this fixture is applied by a new application boot.
+  await page.goto('about:blank');
+  await openApplication(url);
+  await page.evaluate(() => {
+    const manager = window.__godsEyeView.styleManager;
+    manager.setPanelCollapsed('pp-toggles', false, {
+      persist: false,
+      syncShare: false,
+    });
+    manager.hud.setMode('on');
+    manager.setStyle('normal');
+  });
+  const initial = await readScope();
+  check(
+    'Austin fixture restores Scope ON and 100% feather',
+    initial.enabled &&
+      initial.checked &&
+      !initial.disabled &&
+      initial.feather === 1 &&
+      initial.value === 100 &&
+      initial.readout === '100%' &&
+      initial.cornerAlpha > 0,
+    initial,
+  );
+  const name = await page.$eval('#scope-toggle', (el) => ({
+    type: el.type,
+    label: el.labels?.[0]?.textContent.trim(),
+  }));
+  check(
+    'Scope uses a native checkbox with a visible label',
+    name.type === 'checkbox' && name.label?.includes('Scope'),
+    name,
+  );
+  await page.click('#scope-toggle');
+  const off = await readScope();
+  check(
+    'click disables Scope and its feather slider',
+    !off.enabled &&
+      !off.checked &&
+      off.disabled &&
+      off.feather === 1 &&
+      off.cornerAlpha === 0,
+    off,
+  );
+  await page.focus('#scope-toggle');
+  await page.keyboard.press('Space');
+  const on = await readScope();
+  check(
+    'Space re-enables the native checkbox without losing feather',
+    on.enabled &&
+      on.checked &&
+      !on.disabled &&
+      on.feather === 1 &&
+      on.cornerAlpha > 0,
+    on,
+  );
+
+  const paintedAlpha = [];
+  for (const pct of [0, 11, 100, 200]) {
+    await page.$eval(
+      '#scope-feather-slider',
+      (el, value) => {
+        el.value = String(value);
+        el.dispatchEvent(new Event('input', { bubbles: true }));
+      },
+      pct,
+    );
+    const state = await readScope();
+    paintedAlpha.push(state.radialAlpha);
+    check(
+      `feather ${pct}% reaches the mask and readout`,
+      state.value === pct &&
+        state.feather === pct / 100 &&
+        state.readout === `${pct}%`,
+      state,
+    );
+  }
+  check(
+    'painted gradient widens beyond the old 100% ceiling',
+    paintedAlpha[0] === 0 &&
+      paintedAlpha[1] === 0 &&
+      paintedAlpha[2] > 0 &&
+      paintedAlpha[3] > paintedAlpha[2],
+    paintedAlpha,
+  );
+  await page.focus('#scope-feather-slider');
+  await page.keyboard.press('Home');
+  check('native Home reaches the hard edge', (await readScope()).feather === 0);
+  await page.keyboard.press('End');
+  check(
+    'native End reaches the expanded 200% maximum',
+    (await readScope()).feather === 2,
+  );
+  await page.click('#scope-toggle');
+  for (const layout of ['minimal', 'operator', 'cyber', 'tactical']) {
+    await page.select('#hud-layout-select', layout);
+    const state = await readScope();
+    check(
+      `Scope OFF and 200% survive ${layout}`,
+      !state.enabled &&
+        !state.checked &&
+        state.disabled &&
+        state.feather === 2 &&
+        state.value === 200 &&
+        state.cornerAlpha === 0,
+      state,
+    );
+  }
+
+  const restored = await page.evaluate(async () => {
+    const manager = window.__godsEyeView.styleManager;
+    const links = manager.shareLinkManager;
+    manager._syncShareState();
+    const params = links._buildHashParams();
+    const encoded = { enabled: params.get('sc'), feather: params.get('scf') };
+    await manager.applyVisualState({ scope: { enabled: true, featherPct: 0 } });
+    await manager._visualSettings.restoreShareState({
+      scopeEnabled: encoded.enabled === '1',
+      scopeFeatherPct: Number(encoded.feather),
+    });
+    const shared = manager.getVisualState().scope;
+    await manager.applyVisualState({
+      scope: { enabled: true, featherPct: 200 },
+    });
+    const scene = manager.getVisualState().scope;
+    await manager.applyVisualState({
+      scope: { enabled: false, featherPct: 200 },
+    });
+    return { encoded, shared, scene };
+  });
+  check(
+    'share state serializes and restores Scope OFF with 200%',
+    restored.encoded.enabled === '0' &&
+      restored.encoded.feather === '200' &&
+      restored.shared.enabled === false &&
+      restored.shared.featherPct === 200,
+    restored,
+  );
+  check(
+    'scene state restores Scope ON with 200%',
+    restored.scene.enabled === true && restored.scene.featherPct === 200,
+    restored,
+  );
+
+  for (const layout of ['minimal', 'operator', 'tactical']) {
+    await page.select('#hud-layout-select', layout);
+    await page.evaluate(() =>
+      window.__godsEyeView.styleManager.applyVisualState({
+        scope: { enabled: true, featherPct: 100 },
+      }),
+    );
+    await settleTextBackings(true);
+    const originalGlyphs = await readHudGlyphs();
+    const originalChrome = await readSceneChrome();
+    const original = await page.evaluate(() => {
+      const hud = document.getElementById('intel-hud');
+      const wrappers = [...hud.querySelectorAll('.hud-readout')];
+      const scene = [...document.querySelectorAll('.scene-text-holdout')];
+      const unexpectedBackings = [...wrappers, ...scene]
+        .map((el) => {
+          const style = getComputedStyle(el);
+          return {
+            selector: el.id || el.className,
+            background: style.backgroundColor,
+            shadow: style.boxShadow,
+          };
+        })
+        .filter(
+          (style) =>
+            style.background !== 'rgba(0, 0, 0, 0)' || style.shadow !== 'none',
+        );
+      return {
+        markerAbsent: !document.documentElement.hasAttribute('data-scope-mask'),
+        unbacked: unexpectedBackings.length === 0,
+        unexpectedBackings,
+        wrappersTransparent: wrappers.every(
+          (el) => getComputedStyle(el).display === 'contents',
+        ),
+        operatorFrame:
+          hud.dataset.variant !== 'operator' ||
+          (getComputedStyle(hud.querySelector('.hud-corner'))
+            .backgroundColor === 'rgba(0, 0, 0, 0.36)' &&
+            getComputedStyle(hud.querySelector('.hud-top-bar'))
+              .backgroundImage !== 'none'),
+      };
+    });
+    check(
+      `${layout}: Scope ON retains the original presentation without new backplates`,
+      original.markerAbsent &&
+        original.unbacked &&
+        original.wrappersTransparent &&
+        original.operatorFrame,
+      original,
+    );
+    check(
+      `${layout}: original HUD color, glow and metadata alpha remain intact`,
+      originalGlyphs.glyphs.every(
+        (glyph) =>
+          glyph.color === originalGlyphs.baseline.color &&
+          glyph.shadow === originalGlyphs.baseline.shadow,
+      ) &&
+        originalGlyphs.glyphs.find(
+          (glyph) => glyph.selector === '.hud-summary-label',
+        ).opacity === 0.55 &&
+        originalGlyphs.glyphs.find((glyph) => glyph.selector === '.hud-orbital')
+          .opacity === 0.7 &&
+        originalGlyphs.glyphs.find((glyph) => glyph.selector === '#hud-coll')
+          .opacity === 0.5,
+      originalGlyphs,
+    );
+    if (process.env.QA_SCREENSHOT_DIR) {
+      fs.mkdirSync(process.env.QA_SCREENSHOT_DIR, { recursive: true });
+      await page.screenshot({
+        path: path.join(
+          process.env.QA_SCREENSHOT_DIR,
+          `scope-on-${layout}.png`,
+        ),
+      });
+    }
+    await page.evaluate(() =>
+      window.__godsEyeView.styleManager.applyVisualState({
+        scope: { enabled: false },
+      }),
+    );
+    await settleTextBackings(false);
+    const backedGlyphs = await readHudGlyphs();
+    checkSceneChrome(layout, originalChrome, await readSceneChrome());
+    check(
+      `${layout}: Scope OFF adds backing without changing glyph styles`,
+      JSON.stringify(backedGlyphs) === JSON.stringify(originalGlyphs),
+      backedGlyphs,
+    );
+    const coverage = await page.evaluate(() => {
+      const hud = document.getElementById('intel-hud');
+      const walker = document.createTreeWalker(hud, NodeFilter.SHOW_TEXT);
+      const missing = [];
+      let visible = 0;
+      let node;
+      while ((node = walker.nextNode())) {
+        if (
+          !node.textContent.trim() ||
+          node.parentElement.closest('.hud-bracket')
+        )
+          continue;
+        const range = document.createRange();
+        range.selectNodeContents(node);
+        if (
+          ![...range.getClientRects()].some(
+            (rect) => rect.width > 0 && rect.height > 0,
+          )
+        )
+          continue;
+        visible += 1;
+        const backing = node.parentElement.closest('.hud-readout');
+        const color = backing && getComputedStyle(backing).backgroundColor;
+        if (
+          !backing ||
+          color !== 'rgba(0, 0, 0, 0.7)' ||
+          getComputedStyle(backing).boxShadow !== 'none' ||
+          backing.parentElement.closest('.hud-readout')
+        )
+          missing.push(node.textContent.trim());
+      }
+      const wrapped = [...hud.querySelectorAll('.hud-readout')].filter(
+        (el) => el.offsetWidth > 0 && el.offsetHeight > 0,
+      );
+      const empty = wrapped.filter((el) => !el.innerText.trim()).length;
+      const overlaps = [];
+      for (const parent of new Set(wrapped.map((el) => el.parentElement))) {
+        const siblings = wrapped.filter((el) => el.parentElement === parent);
+        for (let i = 1; i < siblings.length; i += 1) {
+          const previous = siblings[i - 1].getBoundingClientRect();
+          const current = siblings[i].getBoundingClientRect();
+          const horizontal =
+            Math.min(previous.right, current.right) -
+            Math.max(previous.left, current.left);
+          const vertical =
+            Math.min(previous.bottom, current.bottom) -
+            Math.max(previous.top, current.top);
+          // Horizontal bars share a vertical band. Only intersecting text boxes
+          // can stack their backing alpha; allow subpixel layout rounding.
+          if (horizontal > 0.5 && vertical > 0.5) {
+            overlaps.push({
+              parent: parent.className,
+              previous: siblings[i - 1].innerText,
+              current: siblings[i].innerText,
+              vertical,
+            });
+          }
+        }
+      }
+      const lineIds = [
+        'hud-mgrs',
+        'hud-latlon',
+        'hud-gsd',
+        'hud-alt',
+        'hud-timestamp',
+        'hud-bottom-line',
+      ];
+      const multiline = lineIds.filter((id) => {
+        const el = document.getElementById(id);
+        if (!el.getClientRects().length) return false;
+        const range = document.createRange();
+        range.selectNodeContents(el);
+        return (
+          range.getBoundingClientRect().height >
+          parseFloat(getComputedStyle(el).lineHeight) * 1.5
+        );
+      });
+      const edges = [...hud.querySelectorAll('.hud-edge')]
+        .filter((el) => getComputedStyle(el).display !== 'none')
+        .map((el) => {
+          const box = el.querySelector('.hud-readout').getBoundingClientRect();
+          return (
+            getComputedStyle(el).transform !== 'none' &&
+            box.height > box.width &&
+            Number(getComputedStyle(el).opacity) === 1
+          );
+        });
+      const broadBackings = [
+        ...hud.querySelectorAll('.hud-corner, .hud-top-bar, .hud-bottom-bar'),
+      ].filter(
+        (el) =>
+          el.offsetWidth > 0 &&
+          getComputedStyle(el).backgroundColor !== 'rgba(0, 0, 0, 0)',
+      );
+      return {
+        scopeOff: document.documentElement.dataset.scopeMask === 'off',
+        visible,
+        missing,
+        empty,
+        overlaps,
+        multiline,
+        edges,
+        broadBackings: broadBackings.length,
+      };
+    });
+    check(
+      `${layout}: all visible HUD text has one backing`,
+      coverage.scopeOff &&
+        coverage.visible > 0 &&
+        coverage.missing.length === 0 &&
+        coverage.empty === 0 &&
+        coverage.broadBackings === 0,
+      coverage,
+    );
+    check(
+      `${layout}: adjacent readout backings do not overlap`,
+      coverage.overlaps.length === 0,
+      coverage,
+    );
+    check(
+      `${layout}: desktop telemetry remains single line; rotated backing follows the labels`,
+      coverage.multiline.length === 0 && coverage.edges.every(Boolean),
+      coverage,
+    );
+    if (process.env.QA_SCREENSHOT_DIR) {
+      fs.mkdirSync(process.env.QA_SCREENSHOT_DIR, { recursive: true });
+      await page.screenshot({
+        path: path.join(
+          process.env.QA_SCREENSHOT_DIR,
+          `scope-off-${layout}.png`,
+        ),
+      });
+    }
+  }
+  const details = await page.evaluate(() => {
+    const summary = document.getElementById('hud-summary');
+    summary.textContent = 'LONG TELEMETRY SUMMARY '.repeat(30);
+    const ais = document.getElementById('hud-ais-vessel');
+    ais.textContent = 'AIS: 4 VESSELS\nLATEST OBSERVATION';
+    return {
+      summaryClipped:
+        summary.scrollWidth > summary.clientWidth &&
+        getComputedStyle(summary).textOverflow === 'ellipsis',
+      aisMultiline:
+        getComputedStyle(ais).whiteSpace === 'pre-line' &&
+        ais.textContent.split('\n').length === 2 &&
+        ais.getBoundingClientRect().height + 0.5 >=
+          parseFloat(getComputedStyle(ais).lineHeight) * 2,
+      recColor: getComputedStyle(document.getElementById('hud-rec-dot')).color,
+    };
+  });
+  check(
+    'summary clipping, multiline AIS and red REC dot retain their behavior',
+    details.summaryClipped &&
+      details.aisMultiline &&
+      details.recColor === 'rgb(255, 51, 51)',
+    details,
+  );
+  await page.setViewport({ width: 390, height: 844 });
+  await page.select('#hud-layout-select', 'minimal');
+  const narrow = await page.evaluate(() =>
+    [...document.querySelectorAll('#intel-hud .hud-readout')]
+      .filter(
+        (el) =>
+          el.getClientRects().length &&
+          getComputedStyle(el).display !== 'contents',
+      )
+      .every((el) => {
+        const box = el.getBoundingClientRect();
+        return box.left >= 0 && box.right <= innerWidth;
+      }),
+  );
+  check('narrow HUD text backings stay within the viewport', narrow);
+  for (const layout of ['minimal', 'operator', 'tactical']) {
+    await page.select('#hud-layout-select', layout);
+    await page.evaluate(() =>
+      window.__godsEyeView.styleManager.applyVisualState({
+        scope: { enabled: true },
+      }),
+    );
+    await settleTextBackings(true);
+    const before = await readSceneChrome();
+    await page.evaluate(() =>
+      window.__godsEyeView.styleManager.applyVisualState({
+        scope: { enabled: false },
+      }),
+    );
+    await settleTextBackings(false);
+    checkSceneChrome(`narrow ${layout}`, before, await readSceneChrome());
+  }
+  check('runtime has no uncaught browser errors', errors.length === 0, errors);
+} finally {
+  await browser.close();
+}
+console.log(`RESULT: ${failures} failures`);
+process.exitCode = failures ? 1 : 0;

scripts/qa-segmented-controls.mjs

@@ -0,0 +1,322 @@
+#!/usr/bin/env node
+/** Run against a dev server or built preview with QA_BASE_URL (default :4179). */
+import fs from 'node:fs';
+import puppeteer from 'puppeteer';
+
+const browser = await puppeteer.launch({
+  executablePath:
+    process.env.PUPPETEER_EXECUTABLE_PATH || (await puppeteer.executablePath()),
+  headless: true,
+  args: ['--use-gl=angle', '--use-angle=swiftshader'],
+});
+const page = await browser.newPage();
+const errors = [];
+const failures = [];
+page.on('pageerror', (error) => errors.push(error.message));
+const check = (name, passed, detail = '') => {
+  console.log(
+    `[${passed ? 'PASS' : 'FAIL'}] ${name}${detail ? ` — ${detail}` : ''}`,
+  );
+  if (!passed) failures.push(name);
+};
+const base = process.env.QA_BASE_URL || 'http://localhost:4179';
+const shots = process.env.QA_SHOTS_DIR || 'qa-shots/segmented-controls';
+fs.mkdirSync(shots, { recursive: true });
+
+try {
+  await page.setViewport({ width: 1440, height: 900 });
+  await page.goto(`${base}/?welcome=0`, { waitUntil: 'domcontentloaded' });
+  await page.waitForFunction(
+    () => window.__godsEyeView?.styleManager?._applicationShortcuts,
+    { timeout: 60000 },
+  );
+  await page.waitForFunction(
+    () =>
+      document.getElementById('loading-screen')?.classList.contains('hidden'),
+    { timeout: 60000 },
+  );
+  await page.evaluate(() =>
+    window.__godsEyeView.styleManager.setPanelCollapsed('pp-toggles', false, {
+      persist: false,
+      syncShare: false,
+    }),
+  );
+
+  const surface = await page.evaluate(() => {
+    const groups = [...document.querySelectorAll('[role="radiogroup"]')];
+    const buttons = groups.flatMap((group) => [
+      ...group.querySelectorAll('[role="radio"]'),
+    ]);
+    return {
+      groups: groups.length,
+      buttons: buttons.length,
+      shared:
+        groups.every((g) => g.classList.contains('gev-segmented')) &&
+        buttons.every((b) => {
+          const style = getComputedStyle(b);
+          return (
+            b.classList.contains('gev-segment') &&
+            style.fontSize === '9px' &&
+            style.minHeight === '24px' &&
+            style.borderRadius === '0px'
+          );
+        }),
+    };
+  });
+  check(
+    'all six one-of-many groups use the shared surface',
+    surface.groups === 6 && surface.buttons === 15 && surface.shared,
+    JSON.stringify(surface),
+  );
+
+  await page.evaluate(() =>
+    document.getElementById('models3d-mode-all').click(),
+  );
+  check(
+    'model selection reaches both aircraft layers',
+    await page.evaluate(() => {
+      const dm = window.__godsEyeView.dataManager;
+      return (
+        ['flights', 'military'].every(
+          (id) => dm.layers.get(id).module.getParams().models3dMode === 'all',
+        ) &&
+        document
+          .getElementById('models3d-mode-all')
+          .getAttribute('aria-checked') === 'true'
+      );
+    }),
+  );
+  await page.focus('#models3d-mode-all');
+  await page.keyboard.press('ArrowLeft');
+  check(
+    'Display retains its click-only arrow policy',
+    await page.evaluate(
+      () =>
+        document
+          .getElementById('models3d-mode-all')
+          .getAttribute('aria-checked') === 'true',
+    ),
+  );
+  await page.focus('#models3d-mode-proximity');
+  await page.keyboard.press('Space');
+  check(
+    'native Space selects model coverage',
+    await page.evaluate(
+      () =>
+        document
+          .getElementById('models3d-mode-proximity')
+          .getAttribute('aria-checked') === 'true',
+    ),
+  );
+  await page.evaluate(() =>
+    document.getElementById('detection-allocation-weighted').click(),
+  );
+  check(
+    'allocation selection still updates application tuning',
+    await page.evaluate(
+      () =>
+        window.__godsEyeView.styleManager._detectionAllocationPreference ===
+          'WEIGHTED' &&
+        document
+          .getElementById('detection-allocation-weighted')
+          .getAttribute('aria-checked') === 'true',
+    ),
+  );
+
+  await page.evaluate(() =>
+    document.querySelector('[data-shape="pin"]').click(),
+  );
+  check(
+    'drawing shape still uses its existing feature action',
+    await page.evaluate(
+      () =>
+        window.__gevDrawTool?.shape === 'pin' &&
+        document
+          .querySelector('[data-shape="pin"]')
+          .getAttribute('aria-checked') === 'true',
+    ),
+  );
+
+  // Off-layer controls still own params; no catalog/provider request is needed.
+  await page.evaluate(() =>
+    document.querySelector('[data-sl-pano="flat"]').click(),
+  );
+  check(
+    'panorama choice reaches the Street Level layer',
+    await page.evaluate(
+      () =>
+        window.__godsEyeView.dataManager.layers
+          .get('street-level')
+          .module.getParams().pano === 'flat',
+    ),
+  );
+  await page.evaluate(() =>
+    document.querySelector('[data-sl-pano="flat"]').dispatchEvent(
+      new KeyboardEvent('keydown', {
+        key: 'Home',
+        bubbles: true,
+        cancelable: true,
+      }),
+    ),
+  );
+  check(
+    'Street Level Home retains selection and roving tab state',
+    await page.evaluate(
+      () =>
+        window.__godsEyeView.dataManager.layers
+          .get('street-level')
+          .module.getParams().pano === 'all' &&
+        document
+          .querySelector('[data-sl-pano="all"]')
+          .getAttribute('tabindex') === '0',
+    ),
+  );
+  await page.evaluate(() =>
+    document.querySelector('[data-sl-render="fill"]').click(),
+  );
+  check(
+    'fit/fill keeps its stored render preference',
+    await page.evaluate(
+      () =>
+        localStorage.getItem('gev:street-level:render-mode') === 'fill' &&
+        document
+          .querySelector('[data-sl-render="fill"]')
+          .getAttribute('aria-checked') === 'true',
+    ),
+  );
+
+  await page.evaluate(() =>
+    document.querySelector('.ri-mode-btn[data-mode="ab"]').click(),
+  );
+  check(
+    'imagery mode reaches its controlled layer state',
+    await page.evaluate(
+      () =>
+        window.__godsEyeView.dataManager.layers
+          .get('recent-imagery')
+          .module.getSnapshot().mode === 'ab',
+    ),
+  );
+  await page.evaluate(() =>
+    document.getElementById('ri-mode').dispatchEvent(
+      new KeyboardEvent('keydown', {
+        key: 'ArrowRight',
+        bubbles: true,
+        cancelable: true,
+      }),
+    ),
+  );
+  check(
+    'imagery arrows wrap from the current selected value',
+    await page.evaluate(
+      () =>
+        window.__godsEyeView.dataManager.layers
+          .get('recent-imagery')
+          .module.getSnapshot().mode === 'image' &&
+        document
+          .querySelector('.ri-mode-btn[data-mode="image"]')
+          .getAttribute('aria-checked') === 'true',
+    ),
+  );
+
+  await page.evaluate(() => {
+    const manager = window.__godsEyeView.styleManager;
+    manager._setDetectionAllocation('ELASTIC', {
+      syncShare: false,
+      persist: false,
+    });
+    document
+      .getElementById('models3d-mode-proximity')
+      .scrollIntoView({ block: 'center' });
+  });
+  await page.screenshot({ path: `${shots}/desktop.png` });
+  await page.setViewport({ width: 620, height: 900 });
+  await page.evaluate(() =>
+    document
+      .getElementById('models3d-mode-proximity')
+      .scrollIntoView({ block: 'center' }),
+  );
+  await page.screenshot({ path: `${shots}/narrow.png` });
+  check(
+    'narrow selectors stay within their panel',
+    await page.evaluate(() =>
+      [...document.querySelectorAll('.pp-mode-seg')]
+        .filter((g) => g.getClientRects().length)
+        .every((group) => group.scrollWidth <= group.clientWidth + 1),
+    ),
+  );
+  const cyber = await page.evaluate(() => {
+    const root = document.documentElement;
+    const previous = root.getAttribute('data-ui-theme');
+    root.setAttribute('data-ui-theme', 'cyber');
+    const selected = [
+      ...document.querySelectorAll('.gev-segment[aria-checked="true"]'),
+    ];
+    // Check the final theme colors, independent of software-GL frame cadence.
+    for (const button of selected)
+      for (const animation of button.getAnimations()) animation.finish();
+    const backgrounds = selected.map(
+      (button) => getComputedStyle(button).backgroundColor,
+    );
+    const radii = [...document.querySelectorAll('.gev-segmented')].map(
+      (group) => getComputedStyle(group).borderRadius,
+    );
+    const consistent =
+      selected.length === 6 &&
+      backgrounds.every((color) => color === backgrounds[0]) &&
+      radii.every((radius) => radius === '1px');
+    if (previous === null) root.removeAttribute('data-ui-theme');
+    else root.setAttribute('data-ui-theme', previous);
+    return { consistent, count: selected.length, backgrounds, radii };
+  });
+  check(
+    'Cyber theme styles every selected segment consistently',
+    cyber.consistent,
+    JSON.stringify(cyber),
+  );
+  await page.evaluate(async () => {
+    const { dataManager, styleManager } = window.__godsEyeView;
+    await dataManager.setEnabled('recent-imagery', true);
+    styleManager.setPanelCollapsed('recent-imagery-panel', false, {
+      persist: false,
+      syncShare: false,
+    });
+  });
+  for (const width of [1440, 620, 390]) {
+    await page.setViewport({ width, height: 900 });
+    await page.focus('.ri-mode-btn[aria-checked="true"]');
+    const modeLayout = await page.evaluate(() => {
+      const group = document.getElementById('ri-mode');
+      const bounds = group.getBoundingClientRect();
+      const style = getComputedStyle(group);
+      const top = bounds.top + parseFloat(style.borderTopWidth);
+      const bottom = bounds.bottom - parseFloat(style.borderBottomWidth);
+      const buttons = [...group.querySelectorAll('[role="radio"]')];
+      return {
+        visible: bounds.width > 0 && bounds.height > 0,
+        contained: buttons.every((button) => {
+          const rect = button.getBoundingClientRect();
+          return rect.top >= top - 0.5 && rect.bottom <= bottom + 0.5;
+        }),
+        groupHeight: bounds.height,
+        buttonHeights: buttons.map(
+          (button) => button.getBoundingClientRect().height,
+        ),
+      };
+    });
+    check(
+      `imagery mode buttons and focus outline fit their row at ${width}px`,
+      modeLayout.visible && modeLayout.contained,
+      JSON.stringify(modeLayout),
+    );
+  }
+  check('no uncaught browser errors', errors.length === 0, errors.join(' | '));
+} catch (error) {
+  console.error('Browser errors:', errors);
+  await page.screenshot({ path: `${shots}/failure.png` }).catch(() => {});
+  throw error;
+} finally {
+  await browser.close();
+}
+console.log(`RESULT: ${failures.length} failures`);
+process.exitCode = failures.length ? 1 : 0;

scripts/qa-sky-model-lighting.mjs

@@ -0,0 +1,147 @@
+#!/usr/bin/env node
+/**
+ * Lit airplane regression: StarrySky must match a black environment baseline.
+ * A white environment is a positive control: it must visibly brighten the
+ * same model. Each case uses a fresh scene and dynamic environment map.
+ * Usage: node scripts/qa-sky-model-lighting.mjs [--url http://localhost:4333/]
+ */
+import assert from 'node:assert/strict';
+import puppeteer from 'puppeteer';
+
+const i = process.argv.indexOf('--url');
+const base = i > 0 ? process.argv[i + 1] : 'http://localhost:4333/';
+const url = new URL('/__qa_sky_model__', base);
+const browser = await puppeteer.launch({
+  headless: true,
+  args: ['--no-sandbox', '--ignore-gpu-blocklist'],
+});
+try {
+  const page = await browser.newPage();
+  page.on('pageerror', (error) => console.log('PAGEERR', error.message));
+  await page.setRequestInterception(true);
+  page.on('request', (request) => {
+    if (request.url() === url.href)
+      request.respond({
+        contentType: 'text/html',
+        body: '<!doctype html><html><body></body></html>',
+      });
+    else if (new URL(request.url()).origin !== url.origin) request.abort();
+    else request.continue();
+  });
+  await page.goto(url.href);
+  const results = await page.evaluate(async () => {
+    window.CESIUM_BASE_URL = '/cesium/';
+    // Use StarrySky's exact Vite dependency URL, including its version query.
+    const source = await fetch('/src/sky/starrySky.js').then((r) => r.text());
+    const cesiumUrl = source.match(
+      /from ["']([^"']*\/cesium\.js[^"']*)["']/,
+    )?.[1];
+    if (!cesiumUrl) throw new Error('run against the Vite dev server');
+    const C = await import(cesiumUrl);
+    const { StarrySky } = await import('/src/sky/starrySky.js');
+    const time = C.JulianDate.fromIso8601('2026-10-19T00:00:00Z');
+    const results = {};
+    for (const kind of ['black', 'starry', 'white']) {
+      const canvas = document.createElement('canvas');
+      canvas.width = 400;
+      canvas.height = 300;
+      document.body.append(canvas);
+      const scene = new C.Scene({ canvas });
+      scene.rethrowRenderErrors = true;
+      let cubeMap;
+      try {
+        scene.backgroundColor = C.Color.BLACK;
+        scene.light = new C.DirectionalLight({
+          direction: new C.Cartesian3(1, 0, 0),
+          intensity: 0.2,
+        });
+        if (kind === 'starry') {
+          scene.skyBox = new StarrySky({ requestRender() {} });
+          scene.skyBox._loading = true; // visible sky is outside this probe
+        } else {
+          const value = kind === 'white' ? 255 : 0;
+          const face = {
+            width: 1,
+            height: 1,
+            arrayBufferView: new Uint8Array([value, value, value, 255]),
+          };
+          cubeMap = new C.CubeMap({
+            context: scene.context,
+            source: Object.fromEntries(
+              [...C.CubeMap.faceNames()].map((name) => [name, face]),
+            ),
+          });
+          scene.skyBox = { _cubeMap: cubeMap, update() {}, destroy() {} };
+        }
+        const position = C.Cartesian3.fromDegrees(0, 0, 10000);
+        const model = await C.Model.fromGltfAsync({
+          url: '/models/airplane.glb',
+          modelMatrix: C.Transforms.eastNorthUpToFixedFrame(position),
+        });
+        scene.primitives.add(model);
+        scene.camera.lookAt(position, new C.HeadingPitchRange(0.4, -0.5, 45));
+        let framed = false;
+        for (let frame = 0; frame < 240; frame++) {
+          scene.initializeFrame();
+          scene.render(time);
+          if (model.ready && !framed) {
+            scene.camera.viewBoundingSphere(
+              model.boundingSphere,
+              new C.HeadingPitchRange(
+                0.4,
+                -0.5,
+                model.boundingSphere.radius * 3,
+              ),
+            );
+            framed = true;
+          }
+          await new Promise(requestAnimationFrame);
+        }
+        if (!model.ready || !model.environmentMapManager.radianceCubeMap)
+          throw new Error(`${kind}: model or dynamic lighting did not load`);
+        scene.initializeFrame();
+        scene.render(time);
+        const gl = scene.context._gl;
+        const px = new Uint8Array(canvas.width * canvas.height * 4);
+        gl.readPixels(
+          0,
+          0,
+          canvas.width,
+          canvas.height,
+          gl.RGBA,
+          gl.UNSIGNED_BYTE,
+          px,
+        );
+        let total = 0;
+        let visible = 0;
+        for (let p = 0; p < px.length; p += 4) {
+          const luma = 0.299 * px[p] + 0.587 * px[p + 1] + 0.114 * px[p + 2];
+          total += luma;
+          if (luma > 1) visible++;
+        }
+        results[kind] = { total, visible };
+      } finally {
+        scene.destroy();
+        cubeMap?.destroy();
+        canvas.remove();
+      }
+    }
+    return results;
+  });
+  console.log(JSON.stringify(results));
+  assert.ok(results.black.visible > 100, 'the lit model must be visible');
+  assert.ok(
+    Math.abs(results.starry.total - results.black.total) <=
+      results.black.total * 0.01,
+    'StarrySky must match black environment lighting within 1%',
+  );
+  assert.ok(
+    results.white.total > results.black.total * 1.03,
+    'white environment control must brighten the model by at least 3%',
+  );
+  console.log(
+    'PASS: lit airplane matches black sky; white control is brighter',
+  );
+} finally {
+  await browser.close();
+}

scripts/qa-status-badges.mjs

@@ -0,0 +1,276 @@
+#!/usr/bin/env node
+/** Badge acceptance on dev/preview. Camera state is a disposable controller fixture. */
+import fs from 'node:fs';
+import puppeteer from 'puppeteer';
+
+const browser = await puppeteer.launch({
+  headless: true,
+  args: ['--use-gl=angle', '--use-angle=swiftshader'],
+});
+const page = await browser.newPage();
+page.setDefaultNavigationTimeout(60000);
+const errors = [];
+page.on('pageerror', (error) => errors.push(error.message));
+let checks = 0;
+let failures = 0;
+const check = (name, passed, detail) => {
+  checks++;
+  console.log(`[${passed ? 'PASS' : 'FAIL'}] ${name}`);
+  if (!passed) {
+    failures++;
+    console.log(JSON.stringify(detail));
+  }
+};
+const out = 'qa-shots/status-badges';
+fs.mkdirSync(out, { recursive: true });
+try {
+  for (const lang of ['en', 'ru']) {
+    await page.setViewport({ width: 1440, height: 900 });
+    await page.goto(
+      `${process.env.QA_BASE_URL || 'http://127.0.0.1:4189'}/?welcome=0&lang=${lang}`,
+      { waitUntil: 'domcontentloaded' },
+    );
+    await page.waitForFunction(
+      () =>
+        window.__godsEyeView?.styleManager?._cctvControls &&
+        document.getElementById('loading-screen')?.classList.contains('hidden'),
+      { timeout: 60000 },
+    );
+    await page.evaluate(async () => {
+      const { dataManager, styleManager: manager } = window.__godsEyeView;
+      await dataManager.setEnabled('wind', true);
+      manager.setPanelCollapsed('weather-panel', false, {
+        persist: false,
+        syncShare: false,
+      });
+      manager.setPanelCollapsed('cctv-panel', false, {
+        persist: false,
+        syncShare: false,
+      });
+      const owner = manager._cctvControls;
+      owner._cctvUnsubscribe?.();
+      owner._cctvUnsubscribe = null;
+      owner.actions = { ...owner.actions, isEnabled: () => true };
+      owner._renderCctvState({
+        enabled: true,
+        activeCameraId: 'badge-fixture',
+        cameras: [{ id: 'badge-fixture', city: 'QA', name: 'Badge fixture' }],
+        activeCamera: {
+          id: 'badge-fixture',
+          city: 'QA',
+          headingDeg: 30,
+          pitchDeg: -10,
+          fovDeg: 45,
+          rangeM: 120,
+          mountHeightM: 8,
+          sourceKind: 'snapshot',
+          sourceStatus: 'degraded',
+          calBadge: 'curated',
+          calDirty: false,
+        },
+      });
+      window.__qaBadgeText =
+        document.getElementById('cctv-source-badge').textContent;
+    });
+    await page.waitForSelector('.weather-coverage.gev-status-badge');
+    const inventory = await page.evaluate(() => {
+      const source = document.getElementById('cctv-source-badge');
+      const quality = document.getElementById('cctv-quality-chip');
+      const coverage = [...document.querySelectorAll('.weather-coverage')];
+      return {
+        shared: [source, quality, ...coverage].every((node) =>
+          node.classList.contains('gev-status-badge'),
+        ),
+        live:
+          source.getAttribute('role') === 'status' &&
+          source.getAttribute('aria-live') === 'polite',
+        silent: [quality, ...coverage].every(
+          (node) =>
+            !node.hasAttribute('aria-live') &&
+            !node.hasAttribute('role') &&
+            !node.hasAttribute('tabindex'),
+        ),
+        coverage:
+          coverage.length > 0 &&
+          coverage.every(
+            (node) =>
+              node.textContent &&
+              !node.hidden &&
+              node.classList.contains('gev-status-badge--plain'),
+          ),
+        source: source.textContent,
+      };
+    });
+    check(
+      `${lang}: CCTV and populated Weather badges share the view`,
+      inventory.shared && inventory.coverage,
+      inventory,
+    );
+    check(
+      `${lang}: existing announcement and read-only semantics remain intact`,
+      inventory.live && inventory.silent,
+      inventory,
+    );
+    check(
+      `${lang}: source wording uses the active locale`,
+      lang === 'en'
+        ? inventory.source === 'SNAPSHOT · DEGRADED'
+        : inventory.source !== 'SNAPSHOT · DEGRADED',
+      inventory,
+    );
+
+    for (const state of ['loading', 'error', 'retained', 'ready', 'idle']) {
+      const result = await page.evaluate((state) => {
+        const owner = window.__godsEyeView.styleManager._cctvControls;
+        owner._cctvFrame.dataset.loading = state === 'loading' ? 'true' : '';
+        owner._cctvFrame.dataset.error = ['error', 'retained'].includes(state)
+          ? 'true'
+          : '';
+        owner._cctvFrameWrap.classList.toggle(
+          'has-frame',
+          state === 'retained',
+        );
+        owner._syncCctvSourceBadge(
+          owner._cctvState.activeCamera,
+          state !== 'idle',
+        );
+        const badge = document.getElementById('cctv-source-badge');
+        return {
+          state: badge.dataset.frameState,
+          text: badge.textContent,
+          color: getComputedStyle(badge).color,
+        };
+      }, state);
+      const expected = {
+        loading: ['loading', 'rgb(255, 229, 155)'],
+        error: ['error', 'rgb(255, 176, 176)'],
+        retained: ['ready', 'rgb(157, 239, 255)'],
+        ready: ['ready', 'rgb(157, 239, 255)'],
+        idle: ['idle', 'rgb(157, 239, 255)'],
+      }[state];
+      check(
+        `${lang}: ${state} keeps its frame state and palette`,
+        result.state === expected[0] &&
+          result.color === expected[1] &&
+          (!['ready', 'retained'].includes(state) ||
+            result.text === inventory.source),
+        result,
+      );
+    }
+    for (const [calBadge, dirty, color] of [
+      ['raw-prior', false, 'rgb(143, 231, 255)'],
+      ['curated', false, 'rgb(255, 230, 162)'],
+      ['calibrated', false, 'rgb(173, 255, 191)'],
+      ['curated', true, 'rgb(255, 208, 138)'],
+    ]) {
+      const result = await page.evaluate(
+        ({ calBadge, dirty }) => {
+          const owner = window.__godsEyeView.styleManager._cctvControls;
+          document.getElementById('cctv-next-btn').focus();
+          owner._renderCctvState({
+            ...owner._cctvState,
+            activeCamera: {
+              ...owner._cctvState.activeCamera,
+              calBadge,
+              calDirty: dirty,
+            },
+          });
+          const badge = document.getElementById('cctv-quality-chip');
+          return {
+            state: badge.dataset.calBadge,
+            color: getComputedStyle(badge).color,
+            focus: document.activeElement.id,
+          };
+        },
+        { calBadge, dirty },
+      );
+      check(
+        `${lang}: ${dirty ? 'edited' : calBadge} keeps provenance color and control focus`,
+        result.state === (dirty ? 'edited' : calBadge) &&
+          result.color === color &&
+          result.focus === 'cctv-next-btn',
+        result,
+      );
+    }
+    for (const theme of ['tactical', 'cyber']) {
+      await page.evaluate(
+        (theme) => window.__godsEyeView.styleManager._setHudVariant(theme),
+        theme,
+      );
+      for (const width of [1440, 620, 390]) {
+        await page.setViewport({ width, height: 900 });
+        for (const panelId of ['cctv-panel', 'weather-panel']) {
+          await page.evaluate(async (panelId) => {
+            const manager = window.__godsEyeView.styleManager;
+            for (const other of ['cctv-panel', 'weather-panel']) {
+              if (other !== panelId)
+                manager.setPanelCollapsed(other, true, {
+                  persist: false,
+                  syncShare: false,
+                });
+            }
+            manager.setPanelCollapsed(panelId, false, {
+              persist: false,
+              syncShare: false,
+            });
+            await new Promise((resolve) =>
+              requestAnimationFrame(() => requestAnimationFrame(resolve)),
+            );
+          }, panelId);
+          const layout = await page.evaluate((panelId) => {
+            const selector =
+              panelId === 'cctv-panel'
+                ? '#cctv-source-badge, #cctv-quality-chip'
+                : '.weather-coverage';
+            return [...document.querySelectorAll(selector)].map((node) => {
+              const rect = node.getBoundingClientRect();
+              const panel = node.closest(`#${panelId}`).getBoundingClientRect();
+              return {
+                id: node.id || 'weather-coverage',
+                text: node.textContent,
+                width: rect.width,
+                height: rect.height,
+                scroll: node.scrollWidth,
+                client: node.clientWidth,
+                left: rect.left,
+                right: rect.right,
+                panelLeft: panel.left,
+                panelRight: panel.right,
+                fits:
+                  rect.width > 0 &&
+                  rect.height > 0 &&
+                  rect.left >= panel.left - 1 &&
+                  rect.right <= panel.right + 1 &&
+                  node.scrollWidth <= node.clientWidth + 1,
+              };
+            });
+          }, panelId);
+          check(
+            `${lang}/${theme}: ${panelId} badges fit at ${width}px`,
+            layout.length >= (panelId === 'cctv-panel' ? 2 : 1) &&
+              layout.every((node) => node.fits),
+            layout,
+          );
+          if (width === 390)
+            await page.screenshot({
+              path: `${out}/${lang}-${theme}-${panelId}-${width}.png`,
+            });
+        }
+      }
+    }
+    const disposed = await page.evaluate(() => {
+      const owner = window.__godsEyeView.styleManager._cctvControls;
+      const badge = document.getElementById('cctv-quality-chip');
+      const text = badge.textContent;
+      owner.destroy();
+      owner._renderCctvState(null);
+      return badge.textContent === text;
+    });
+    check(`${lang}: disposal prevents late state painting`, disposed);
+  }
+  check('no uncaught browser errors', errors.length === 0, errors);
+} finally {
+  await browser.close();
+}
+console.log(`${checks} checks; ${failures} failures`);
+process.exitCode = failures ? 1 : 0;

scripts/qa-traffic-oblique.mjs

@@ -80,9 +80,7 @@ try {
       page.evaluate(() => {
         const { viewer, dataManager } = window.__godsEyeView;
         let upper = 0,
-          lower = 0,
-          near = 0;
-        const camera = viewer.camera.positionWC;
+          lower = 0;
         dataManager.layers
           .get('traffic')
           .module.visitMotionDots((id, key, p) => {

scripts/qa-traffic.mjs

@@ -25,12 +25,13 @@
  * Visual proof saved to qa-shots/ (gitignored).
  *
  * Run:  node scripts/qa-traffic.mjs --url http://localhost:4410
- * Add --fixtures for synthetic roads and the recorded flow tile without a key;
- * that mode does not qualify live source access or quota accounting.
+ * Add --fixtures for synthetic road/flow tiles and a flat terrain surface without a key;
+ * that mode does not qualify geographic terrain, live source access or quota accounting.
  * Exits non-zero on any FAIL. Does not commit anything.
  */
 
 import puppeteer from 'puppeteer';
+import { captureQaScreenshot } from './qa-chrome.mjs';
 import fs from 'node:fs';
 import path from 'node:path';
 import { fileURLToPath } from 'node:url';
@@ -44,10 +45,12 @@ const getOpt = (name, dflt) => {
   const i = argv.indexOf(name);
   return i >= 0 && argv[i + 1] ? argv[i + 1] : dflt;
 };
-const APP_URL = getOpt('--url', 'http://localhost:4410');
+const appUrl = new URL(getOpt('--url', 'http://localhost:4410'));
+appUrl.searchParams.set('welcome', '0');
+const APP_URL = appUrl.href;
 const HEADFUL = argv.includes('--headful');
 const FIXTURES = argv.includes('--fixtures');
-const fixtureResponse = FIXTURES ? (await import('./traffic-fixtures.mjs')).trafficFixtureResponse : () => null;
+const { installTrafficRoutes } = await import('./traffic-fixtures.mjs');
 
 const CHROME_EXECUTABLE_CANDIDATES = [
   process.env.PUPPETEER_EXECUTABLE_PATH,
@@ -80,6 +83,10 @@ const sleep = (ms) => new Promise((r) => setTimeout(r, ms));
 
 /** Enable traffic + teleport, then poll the layer until settled. */
 async function settleTraffic(page, view, { minCount = 1, timeoutS = 30 } = {}) {
+  // The app deliberately stops rendering hidden pages. Programmatic camera
+  // changes do not activate a headful window the way a real UI click does.
+  await page.bringToFront();
+  await page.waitForFunction(() => document.visibilityState === 'visible');
   return page.evaluate(async (v, minC, tS) => {
     const gev = window.__godsEyeView;
     const dm = gev.dataManager;
@@ -97,6 +104,7 @@ async function settleTraffic(page, view, { minCount = 1, timeoutS = 30 } = {}) {
     });
     let s = null;
     for (let i = 0; i < tS; i++) {
+      if (document.visibilityState !== 'visible') throw new Error('Traffic QA page became hidden; rendering is intentionally paused');
       await new Promise((r) => setTimeout(r, 1000));
       s = mod.getStats();
       // Retained roads from the previous city can satisfy count/loading before
@@ -122,8 +130,8 @@ async function main() {
     return;
   }
 
-  const statusBefore = FIXTURES ? {hasKey:true,dailyCount:0} : await fetch(`${APP_URL}/api/tomtom/status`).then((r) => r.json()).catch(() => null);
-  if (FIXTURES) console.log('Source mode: synthetic roads and recorded flow tiles; live quota is not qualified.');
+  const statusBefore = FIXTURES ? {hasKey:true,dailyCount:0} : await fetch(`${appUrl.origin}/api/tomtom/status`).then((r) => r.json()).catch(() => null);
+  if (FIXTURES) console.log('Source mode: synthetic road/flow tiles and a flat terrain surface; live quota is not qualified.');
   if (!statusBefore?.hasKey) {
     console.error('\x1b[31mServer has no TomTom key — run against the keyed dev server (:4410).\x1b[0m');
     process.exitCode = 2;
@@ -135,8 +143,10 @@ async function main() {
     headless: HEADFUL ? false : 'new',
     ...(findChromeExecutable() ? { executablePath: findChromeExecutable() } : {}),
     args: [
-      '--no-sandbox', '--disable-setuid-sandbox', '--use-gl=angle', '--use-angle=swiftshader',
-      '--disable-dev-shm-usage', '--disable-web-security',
+      '--no-sandbox', '--disable-setuid-sandbox',
+      ...(!HEADFUL ? ['--use-gl=angle', '--use-angle=swiftshader'] : []),
+      '--disable-backgrounding-occluded-windows',
+      '--disable-dev-shm-usage',
       '--disable-background-timer-throttling', '--disable-renderer-backgrounding',
       '--window-size=1440,900',
     ],
@@ -144,24 +154,22 @@ async function main() {
 
   let exitCode = 0;
   try {
-    const page = await browser.newPage();
-    const onFixture = (request) => {
-      const response = fixtureResponse(request);
-      if (response) void request.respond(response); else void request.continue();
-    };
-    if (FIXTURES) { await page.setRequestInterception(true); page.on('request', onFixture); }
+    let page = await browser.newPage();
+    // Keep this visible-page regression deterministic even if the OS starts
+    // Chrome minimized. Use browser focus emulation, not patched DOM getters.
+    const focusSession = await page.createCDPSession();
+    await focusSession.send('Emulation.setFocusEmulationEnabled', { enabled: true });
     await page.setViewport({ width: 1440, height: 900 });
 
-    // Track flow-tile requests + traffic console lines for (ii)/(iii)/(v).
+    // Track flow-tile requests for the (iii) budget check.
     const flowRequests = [];
     page.on('request', (req) => {
       if (req.url().includes('/api/tomtom/flow/')) flowRequests.push(req.url());
     });
-    const trafficLogs = [];
-    page.on('console', (msg) => {
-      const t = msg.text();
-      if (t.includes('[Data:Traffic]')) trafficLogs.push(t);
-    });
+    const pageErrors = [];
+    if (FIXTURES) await installTrafficRoutes(page, { origin: appUrl.origin, fixtures: true, onError: error => pageErrors.push(error.message) });
+    page.on('pageerror', error => { pageErrors.push(error.message); console.error('PAGE ERROR:', error.message); });
+    page.on('console', message => { if (message.type() === 'error') console.error('BROWSER ERROR:', message.text()); });
 
     console.log('Loading app...');
     await page.goto(APP_URL, { waitUntil: 'domcontentloaded', timeout: 60000 });
@@ -194,7 +202,7 @@ async function main() {
         `coverage=${mumbai.flowCoveragePct}% tiles=${mumbai.tilesFetched}`);
       if (mumbai.mode !== 'live' || !(mumbai.count > 0) || !(colored > 0)) exitCode = 1;
       await sleep(1200);
-      await page.screenshot({ path: path.join(SHOTS_DIR, 'traffic-live-flow.png') });
+      await captureQaScreenshot(page, { path: path.join(SHOTS_DIR, 'traffic-live-flow.png') }, { headful: HEADFUL });
     }
 
     // ── (iv) uncovered-roads param — hide vs sim ─────────────────────────────
@@ -227,7 +235,7 @@ async function main() {
         (hid.flowBuckets?.sim || 0) === 0 && hid.count > 0,
         `count=${hid.count} sim=${hid.flowBuckets?.sim}`);
       if ((hid.flowBuckets?.sim || 0) !== 0) exitCode = 1;
-      await page.screenshot({ path: path.join(SHOTS_DIR, 'traffic-live-hide-mode.png') });
+      await captureQaScreenshot(page, { path: path.join(SHOTS_DIR, 'traffic-live-hide-mode.png') }, { headful: HEADFUL });
     } else {
       record('PARAM: hide mode renders zero sim (white) dots', null,
         'view had 100% coverage (no sim dots to hide) — inconclusive here, covered by unit tests');
@@ -235,30 +243,26 @@ async function main() {
 
     // ── (ii) C4 oblique bounds ───────────────────────────────────────────────
     console.log('\n(ii) C4 — oblique fetch bounds land at the look-at point...');
-    trafficLogs.length = 0;
-    await settleTraffic(page, { lon: -97.72, lat: 30.245, height: 2500, heading: 315, pitch: -20 }, { minCount: 100 });
+    const oblique = await settleTraffic(page, { lon: -97.72, lat: 30.245, height: 2500, heading: 315, pitch: -20 }, { minCount: 100 });
     {
-      const fetchLine = trafficLogs.find((t) => t.includes('fetch') && t.includes('['));
-      let ok = false; let detail = 'no fetch log captured';
-      if (fetchLine) {
-        const m = fetchLine.match(/\[(-?[\d.]+),(-?[\d.]+),(-?[\d.]+),(-?[\d.]+)\]/);
-        if (m) {
-          const [s, w, n, e] = m.slice(1).map(Number);
-          const cLat = (s + n) / 2; const cLon = (w + e) / 2;
-          const dKm = Math.sqrt(((cLat - 30.245) * 111) ** 2 + ((cLon - (-97.72)) * 111 * Math.cos(30.27 * Math.PI / 180)) ** 2);
-          ok = dKm > 1 && dKm <= 13; // look-at ~6.9 km ahead; clamp allows ≤12 (+margin)
-          detail = `box center (${cLat.toFixed(4)},${cLon.toFixed(4)}) is ${dKm.toFixed(1)} km from camera (want 1–13 km; pre-fix bug: 25+ km)`;
-        }
+      const bounds = oblique?.roadBounds;
+      let ok = false; let detail = 'no road bounds published';
+      if (bounds) {
+        const cLat = (bounds.south + bounds.north) / 2;
+        const cLon = (bounds.west + bounds.east) / 2;
+        const dKm = Math.hypot((cLat - 30.245) * 111, (cLon + 97.72) * 111 * Math.cos(30.27 * Math.PI / 180));
+        ok = dKm > 1 && dKm <= 13;
+        detail = `road box center is ${dKm.toFixed(1)} km from camera (want 1–13 km)`;
       }
       record('C4: oblique fetch box centers on the look-at point', ok, detail);
       if (!ok) exitCode = 1;
-      await page.screenshot({ path: path.join(SHOTS_DIR, 'traffic-c4-oblique.png') });
+      await captureQaScreenshot(page, { path: path.join(SHOTS_DIR, 'traffic-c4-oblique.png') }, { headful: HEADFUL });
     }
 
     // ── (iii) budget honesty ─────────────────────────────────────────────────
     console.log('\n(iii) Budget — dailyCount grew by ≤ requests this run...');
     {
-      const statusAfter = FIXTURES ? statusBefore : await fetch(`${APP_URL}/api/tomtom/status`).then((r) => r.json());
+      const statusAfter = FIXTURES ? statusBefore : await fetch(`${appUrl.origin}/api/tomtom/status`).then((r) => r.json());
       const grew = statusAfter.dailyCount - statusBefore.dailyCount;
       const ok = grew >= 0 && grew <= flowRequests.length;
       record('BUDGET: /api/tomtom/status growth ≤ page tile requests', FIXTURES ? null : ok,
@@ -268,25 +272,22 @@ async function main() {
 
     // ── (v) KEYLESS fallback (intercepted — server key untouched) ────────────
     console.log('\n(v) KEYLESS — intercepted status, expect pure simulation...');
-    if (FIXTURES) page.off('request', onFixture);
-    await page.setRequestInterception(true);
+    // Keyless is an independent fresh-session contract. Close the keyed page
+    // so its workers, terrain work and intercepted cache cannot leak into it.
+    await page.close();
+    page = await browser.newPage();
+    await page.setViewport({ width: 1440, height: 900 });
+    const keylessFocus = await page.createCDPSession();
+    await keylessFocus.send('Emulation.setFocusEmulationEnabled', { enabled: true });
+    page.on('pageerror', error => { pageErrors.push(error.message); console.error('PAGE ERROR:', error.message); });
+    page.on('console', message => { if (message.type() === 'error') console.error('BROWSER ERROR:', message.text()); });
     const keylessFlowReqs = [];
-    page.on('request', (req) => {
-      const url = req.url();
-      if (url.includes('/api/tomtom/status')) {
-        req.respond({ status: 200, contentType: 'application/json', body: JSON.stringify({ hasKey: false }) });
-        return;
-      }
-      if (url.includes('/api/tomtom/flow/')) {
-        keylessFlowReqs.push(url);
-        req.respond({ status: 503, contentType: 'application/json', body: JSON.stringify({ error: 'no_key' }) });
-        return;
-      }
-      const response = fixtureResponse(req);
-      if (response) { void req.respond(response); return; }
-      try { req.continue(); } catch { /* already handled */ }
+    await installTrafficRoutes(page, {
+      origin: appUrl.origin, fixtures: FIXTURES, keyless: true,
+      onFlow: url => keylessFlowReqs.push(url),
+      onError: error => pageErrors.push(error.message),
     });
-    await page.reload({ waitUntil: 'domcontentloaded', timeout: 60000 });
+    await page.goto(APP_URL, { waitUntil: 'domcontentloaded', timeout: 60000 });
     await page.waitForFunction(
       () => window.__godsEyeView?.viewer && window.__godsEyeView?.dataManager,
       { timeout: 60000 },
@@ -316,8 +317,9 @@ async function main() {
         exitCode = 1;
       }
       await sleep(1000);
-      await page.screenshot({ path: path.join(SHOTS_DIR, 'traffic-sim-keyless.png') });
+      await captureQaScreenshot(page, { path: path.join(SHOTS_DIR, 'traffic-sim-keyless.png') }, { headful: HEADFUL });
     }
+    record('BROWSER: no uncaught page exceptions', pageErrors.length === 0, pageErrors.join('; '));
   } catch (e) {
     console.error('\x1b[31mHarness error:\x1b[0m', e);
     exitCode = 3;

scripts/qa-transit-browser.mjs

@@ -47,6 +47,7 @@ export async function reportTransitVisibility(page, label) {
     const layer = app.dataManager.layers.get('transit').module;
     const state = layer._transitStateForTest();
     return {
+      pageVisibility: document.visibilityState,
       total: state._vehicles.size,
       visible: state._visible.size,
       moving: state._moving.size,
@@ -59,6 +60,10 @@ export async function reportTransitVisibility(page, label) {
     };
   });
   console.log(`  ${label}: ${JSON.stringify(result)}`);
+  if (result.pageVisibility !== 'visible')
+    throw new Error(
+      `${label}: Transit QA requires a visible page; hidden pages deliberately pause polling`,
+    );
   if (result.renderLoop === false || result.renderErrors.length)
     throw new Error(
       `${label}: Cesium render loop stopped or raised an error: ${JSON.stringify(result.renderErrors)}`,

scripts/qa-transit-controls.mjs

@@ -1,6 +1,7 @@
 const pause = (ms) => new Promise((resolve) => setTimeout(resolve, ms));
 export const BOSTON = {
   id: 'boston',
+  feedId: 'mbta',
   label: 'Boston (MBTA)',
   lat: 42.3554,
   lon: -71.0605,
@@ -11,6 +12,7 @@ const LIVE_CITIES = [
   BOSTON,
   {
     id: 'austin',
+    feedId: 'capmetro-austin',
     label: 'Austin (CapMetro)',
     lat: 30.2672,
     lon: -97.7431,
@@ -19,6 +21,7 @@ const LIVE_CITIES = [
   },
   {
     id: 'minneapolis',
+    feedId: 'metrotransit-msp',
     label: 'Minneapolis (Metro Transit)',
     lat: 44.9778,
     lon: -93.265,
@@ -27,6 +30,7 @@ const LIVE_CITIES = [
   },
   {
     id: 'helsinki',
+    feedId: 'hsl-helsinki',
     label: 'Helsinki (HSL)',
     lat: 60.1699,
     lon: 24.9384,
@@ -35,6 +39,7 @@ const LIVE_CITIES = [
   },
   {
     id: 'oslo',
+    feedId: 'entur-norway',
     label: 'Oslo (Entur)',
     lat: 59.9139,
     lon: 10.7522,

scripts/qa-transit-recovery.mjs

@@ -1,6 +1,6 @@
 /** Camera-jump regression against an existing server; never starts a server. */
 import puppeteer from 'puppeteer';
-import { chromeExecutablePath } from './qa-chrome.mjs';
+import { chromeExecutablePath, captureQaScreenshot } from './qa-chrome.mjs';
 import { mkdir, writeFile } from 'node:fs/promises';
 import { reduceTrailPixels } from '../src/layers/transit/qaMetrics.js';
 
@@ -307,7 +307,7 @@ try {
   result.pixelPass = pixels.pass;
   result.pixelDetails = pixels;
   result.errors = errors;
-  await page.screenshot({ path: `${shots}/recovery.png` });
+  await captureQaScreenshot(page, { path: `${shots}/recovery.png` });
   await writeFile(`${shots}/recovery.json`, JSON.stringify(result, null, 2));
   for (const key of ['on', 'off', 'onAgain', 'offAgain']) delete result[key];
   const pass =

scripts/qa-transit-scenes.mjs

@@ -1,3 +1,4 @@
+import { captureQaScreenshot } from './qa-chrome.mjs';
 import { getRegisteredTransitFeed } from '../src/data/transitFeeds.js';
 
 // Not registered or active: camera discovery and live polls never own this feed.
@@ -219,7 +220,7 @@ export async function runFleetBudgets({
         allocations.layerFrameBytes / allocationTrace.rows.length <= 8192,
       `${allocations.layerFrameBytes / allocationTrace.rows.length} transit-authored bytes/frame; whole frame ${allocations.frameBytes / allocationTrace.rows.length}; top three ${JSON.stringify(details.topAllocatorsPerFrame)}; collected objects included. Full profile saved.`,
     );
-    await page.screenshot({
+    await captureQaScreenshot(page, {
       path: `${shots}/${tag}-fleet-${count}.jpg`,
       type: 'jpeg',
       quality: 85,
@@ -392,7 +393,7 @@ export async function runBostonMatrix({
         JSON.stringify({ pixels, contrast }),
         { unexercised: pixels.length < 6 },
       );
-      await page.screenshot({
+      await captureQaScreenshot(page, {
         path: `${shots}/${tag}-matrix-${background.name}-${look.name}-fleet.jpg`,
         type: 'jpeg',
         quality: 90,
@@ -407,7 +408,7 @@ export async function runBostonMatrix({
           target.key,
         );
         await wait(500);
-        await page.screenshot({
+        await captureQaScreenshot(page, {
           path: `${shots}/${tag}-matrix-${background.name}-${look.name}-${target.route}-selected.jpg`,
           type: 'jpeg',
           quality: 90,
@@ -431,7 +432,7 @@ export async function runBostonMatrix({
         );
       }
       await wait(300);
-      await page.screenshot({
+      await captureQaScreenshot(page, {
         path: `${shots}/${tag}-matrix-${background.name}-${look.name}-restored.jpg`,
         type: 'jpeg',
         quality: 90,
@@ -579,7 +580,7 @@ export async function runBostonLive({
       JSON.stringify(selection),
       { unexercised: !target },
     );
-    await page.screenshot({
+    await captureQaScreenshot(page, {
       path: `${shots}/${tag}-boston-live-${view.name}.jpg`,
       type: 'jpeg',
       quality: 90,
@@ -1010,7 +1011,7 @@ export async function runTrailVisibility({
     stable: pixels.stable[i],
     eligible: pixels.eligible[i],
   }));
-  await page.screenshot({
+  await captureQaScreenshot(page, {
     path: `${shots}/${tag}-${altitude}m-trail-visible.jpg`,
     type: 'jpeg',
     quality: 95,

scripts/qa-transit.mjs

@@ -36,10 +36,11 @@ import {
  */
 import { mkdir, readFile, writeFile } from 'node:fs/promises';
 import puppeteer from 'puppeteer';
-import { chromeExecutablePath } from './qa-chrome.mjs';
+import { chromeExecutablePath, captureQaScreenshot } from './qa-chrome.mjs';
 import { createTransitHistory } from '../server/providers/transitHistory.js';
 import { DETECTION_THEME_MAP } from '../src/overlays/worldOverlayTokens.js';
 import { transitModeTier } from '../src/data/transitPresetStyle.js';
+import { TRANSIT_POLL_MS } from '../src/layers/transit/policy.js';
 
 import {
   reduceAnchor,
@@ -47,8 +48,6 @@ import {
   reduceScenario,
   reduceSensorContrast,
   reduceScriptedMotion,
-  reduceMotion,
-  reduceFleet,
 } from '../src/layers/transit/qaMetrics.js';
 
 const BASE = process.env.QA_BASE_URL || 'http://localhost:4173';
@@ -266,6 +265,7 @@ const browser = await puppeteer.launch({
   executablePath: chromeExecutablePath(),
   args: [
     '--no-sandbox',
+    '--disable-backgrounding-occluded-windows',
     '--disable-background-timer-throttling',
     '--disable-renderer-backgrounding',
     '--window-size=1920,1080',
@@ -273,6 +273,10 @@ const browser = await puppeteer.launch({
   ],
 });
 const page = await browser.newPage();
+// This gate measures visible-page motion. OS minimization must not silently
+// switch it into the app's intentional hidden-tab polling pause.
+const focus = await page.createCDPSession();
+await focus.send('Emulation.setFocusEmulationEnabled', { enabled: true });
 boundPageEvaluations(page);
 await page.setViewport({ width: 1920, height: 1080 });
 const pageErrors = [];
@@ -288,11 +292,13 @@ page.on('request', (request) => {
 });
 
 const shot = (name, caption) =>
-  page
-    .screenshot({ path: `${SHOTS}/${name}`, type: 'jpeg', quality: 82 })
-    .then(() => {
-      console.log(`  shot ${name} — ${caption}`);
-    });
+  captureQaScreenshot(page, {
+    path: `${SHOTS}/${name}`,
+    type: 'jpeg',
+    quality: 82,
+  }).then(() => {
+    console.log(`  shot ${name} — ${caption}`);
+  });
 
 const view = (city) =>
   `${BASE}/?welcome=0#lat=${city.lat}&lon=${city.lon}&alt=600&heading=${city.heading}&pitch=-45`;
@@ -391,22 +397,42 @@ try {
         orientation: { heading: 0, pitch: (-40 * Math.PI) / 180, roll: 0 },
       });
     }, city);
-    await page.waitForFunction(
-      () =>
-        (window.__godsEyeView.dataManager.layers
-          .get('transit')
-          .module.getStats().count || 0) > 0,
-      { timeout: 90_000 },
-    );
+    const arrived = await page
+      .waitForFunction(
+        (feedId) =>
+          [
+            ...window.__godsEyeView.dataManager.layers
+              .get('transit')
+              .module._transitStateForTest()
+              ._vehicles.keys(),
+          ].some((key) => key.startsWith(`${feedId}:`)),
+        { timeout: 90_000 },
+        city.feedId,
+      )
+      .then(
+        () => true,
+        () => false,
+      );
+    if (!arrived) {
+      check(
+        `${city.label}: live feed arrived`,
+        false,
+        `No vehicles from ${city.feedId}; retained vehicles from other cities cannot qualify this view`,
+        { unexercised: true },
+      );
+      continue;
+    }
     await wait(9_000);
-    const fleet = await page.evaluate(() => {
+    const fleet = await page.evaluate((feedId) => {
       const layer =
         window.__godsEyeView.dataManager.layers.get('transit').module;
       return {
-        count: layer._transitStateForTest()._vehicles.size,
+        count: [...layer._transitStateForTest()._vehicles.keys()].filter(
+          (key) => key.startsWith(`${feedId}:`),
+        ).length,
         stats: layer.getStats(),
       };
-    });
+    }, city.feedId);
     check(
       `${city.label}: vehicles are rendered`,
       fleet.count >= 20,
@@ -428,6 +454,7 @@ try {
         .module._transitStateForTest();
       let best = null;
       for (const entry of state._vehicles.values()) {
+        if (!entry.key.startsWith(`${c.feedId}:`)) continue;
         const d = Math.hypot(entry.to.lat - c.lat, entry.to.lon - c.lon);
         if (!best || d < best.d)
           best = { d, lat: entry.to.lat, lon: entry.to.lon, key: entry.key };
@@ -1609,6 +1636,7 @@ try {
             m[3] * v[0] + m[7] * v[1] + m[11] * v[2] + m[15] * v[3],
           ];
           const frames = [];
+          const observedPolls = new Set();
           const publicationsBefore = state._cardPublications || 0;
           let headSamples = 0,
             headErrorPx = 0,
@@ -1625,6 +1653,13 @@ try {
                 const proj = scene.camera.frustum.projectionMatrix;
                 const p = entry.marker.position;
                 const clip = mul(proj, mul(view, [p.x, p.y, p.z, 1]));
+                if (
+                  entry.marker.show !== false &&
+                  rect &&
+                  Number.isFinite(entry.pollSeq)
+                ) {
+                  observedPolls.add(entry.pollSeq);
+                }
                 frames.push({
                   t: performance.now() - t0,
                   mx: ((clip[0] / clip[3]) * 0.5 + 0.5) * canvas.clientWidth,
@@ -1670,7 +1705,15 @@ try {
                   headSamples++;
                 }
               }
-              if (performance.now() - t0 >= durationMs) finish();
+              const elapsed = performance.now() - t0;
+              // Keep at least 20 seconds of motion and require an observed poll
+              // transition. A fixed 20s wall-clock window can miss a 15s poll
+              // when an earlier refresh is still settling.
+              if (
+                (elapsed >= 20_000 && observedPolls.size >= 2) ||
+                elapsed >= durationMs
+              )
+                finish();
             };
             let remove;
             const finish = () => {
@@ -1678,6 +1721,7 @@ try {
               remove?.();
               resolve({
                 selected: true,
+                elapsedMs: performance.now() - t0,
                 frames,
                 textPublishes:
                   (state._cardPublications || 0) - publicationsBefore,
@@ -1692,7 +1736,7 @@ try {
           });
         },
         target.key,
-        20_000,
+        3 * TRANSIT_POLL_MS,
       );
     }
     check(
@@ -1713,8 +1757,9 @@ try {
       );
       check(
         'card text publication stays throttled while the anchor runs at frame rate',
-        anchor.textPublishes > 0 && anchor.textPublishes <= 20_000 / 250 + 3,
-        `${anchor.textPublishes} text publications in 20 s`,
+        anchor.textPublishes > 0 &&
+          anchor.textPublishes <= anchor.elapsedMs / 250 + 3,
+        `${anchor.textPublishes} text publications in ${(anchor.elapsedMs / 1000).toFixed(1)} s`,
       );
     } else {
       check(

scripts/qa-ui-disposal.mjs

@@ -43,11 +43,7 @@ try {
     const fpsReadout = document.querySelector('.frame-rate-readout');
     const fpsWasVisible = fpsReadout && !fpsReadout.hidden;
     const watchObserver = (name) => {
-      const owner =
-        name === '_draggableResizeObserver'
-          ? ui._panelPosition
-          : ui._panelLayout;
-      const observer = owner[name];
+      const observer = ui._panelLayout[name];
       if (!observer) return false;
       const disconnect = observer.disconnect.bind(observer);
       counts[name] = 0;
@@ -59,7 +55,6 @@ try {
     };
     const observed = [
       '_commandDockTrayObserver',
-      '_draggableResizeObserver',
       '_leftStackResizeObserver',
       '_rightStackResizeObserver',
       '_leftStackMutationObserver',
@@ -139,7 +134,6 @@ try {
       const focusBefore = document.activeElement;
       const stoppedBeforeRestoration =
         ui._panelLayout.destroyed &&
-        ui._panelPosition.destroyed &&
         ui._feedback.destroyed &&
         ui._recording.destroyed &&
         cockpit.destroyed &&
@@ -194,11 +188,7 @@ try {
               counts[field] === 1 && ui._contextControls[field] === null,
           ),
         observersReleased: observed.every(
-          (name) =>
-            counts[name] === 1 &&
-            (name === '_draggableResizeObserver'
-              ? ui._panelPosition
-              : ui._panelLayout)[name] === null,
+          (name) => counts[name] === 1 && ui._panelLayout[name] === null,
         ),
         subscriptionReleased:
           counts.cctv === 1 && ui._cctvControls._cctvUnsubscribe === null,

scripts/qa-vessel-cards.mjs

@@ -295,7 +295,7 @@ async function main() {
       );
 
       // Wait for the photoreal tileset and at least one vessel refresh.
-      const settled = await page
+      await page
         .waitForFunction(() => {
           const gev = window.__godsEyeView;
           const t = gev.tileset;

scripts/qa-visual-input.mjs

@@ -183,6 +183,38 @@ try {
       return manager.bloomEnabled !== before;
     }),
   );
+  const sliders = await page.evaluate(() => {
+    const ordinary = [
+      ...document.querySelectorAll('input[type="range"]'),
+    ].filter(
+      (input) => !input.matches('#radio-tuner-slider, .bhote-event-range'),
+    );
+    return {
+      count: ordinary.length,
+      shared: ordinary.every((input) =>
+        input.classList.contains('gev-quantitative-slider'),
+      ),
+      surface: ordinary.every((input) => {
+        const style = getComputedStyle(input);
+        return (
+          style.height === '18px' &&
+          style.appearance === 'none' &&
+          style.padding === '0px' &&
+          style.borderWidth === '0px' &&
+          (!input.disabled ||
+            (style.opacity === '0.42' && style.cursor === 'not-allowed'))
+        );
+      }),
+      tunerSeparate: !document
+        .getElementById('radio-tuner-slider')
+        .classList.contains('gev-quantitative-slider'),
+    };
+  });
+  check(
+    'ordinary sliders share one native surface',
+    sliders.count > 10 && sliders.shared && sliders.surface,
+  );
+  check('radio tuning keeps its specialized control', sliders.tunerSeparate);
   fs.mkdirSync('qa-shots/visual-input', { recursive: true });
   await page.screenshot({ path: 'qa-shots/visual-input/desktop.png' });
   await page.setViewport({ width: 620, height: 900 });

scripts/qa-voice-routing.mjs

@@ -1745,8 +1745,9 @@ async function runBehaviorLayer() {
       'behavior: analyst follow-up re-filters the remembered set',
       `count=${r?.count} followUp=${r?.coverage?.followUp}`,
     );
-    // A marine region resolves from the bundled Natural Earth pack in the page,
-    // without the slower geocode fallback.
+    // Require the bundled boundary source and the existing whole-query limit.
+    // This elapsed time includes record acquisition and filtering; the region
+    // resolver has its own separate fallback budget.
     const gulfStarted = Date.now();
     r = await run('analyst_query', {
       layers: ['flights'],
@@ -1757,9 +1758,10 @@ async function runBehaviorLayer() {
     report(
       r?.ok === true &&
         String(r?.coverage?.scope || '').includes('Gulf of Mexico') &&
+        r?.coverage?.scopeSource === 'natural-earth' &&
         gulfMs < 3000,
       'behavior: analyst resolves the Gulf of Mexico from the bundled pack',
-      `scope=${r?.coverage?.scope} ms=${gulfMs} err=${r?.error || ''}`,
+      `scope=${r?.coverage?.scope} source=${r?.coverage?.scopeSource} ms=${gulfMs} err=${r?.error || ''}`,
     );
 
     // (5) zoom_to_globe is ABSOLUTE full-earth (>12,000 km band)

scripts/qa-weather-swap.mjs

@@ -8,13 +8,7 @@
  *   node scripts/qa-weather-swap.mjs --url http://localhost:4173 --label google
  *     [--layer weather-satellite] [--product clouds] [--headless]
  */
-import {
-  existsSync,
-  mkdirSync,
-  readdirSync,
-  readFileSync,
-  writeFileSync,
-} from 'node:fs';
+import { existsSync, mkdirSync, readFileSync, writeFileSync } from 'node:fs';
 import path from 'node:path';
 import puppeteer from 'puppeteer';
 

scripts/qa-weather-teardown.mjs

@@ -61,6 +61,10 @@ const browser = await puppeteer.launch({
 
 const boot = async () => {
   const page = await browser.newPage();
+  // This probe measures active rendering; an OS-minimized window must not
+  // silently exercise the application's intentional hidden-page pause.
+  const focus = await page.createCDPSession();
+  await focus.send('Emulation.setFocusEmulationEnabled', { enabled: true });
   await page.setViewport({ width: 1400, height: 920, deviceScaleFactor: 1 });
   const errors = [];
   page.on('pageerror', (e) =>
@@ -141,7 +145,7 @@ const snapshot = (page) =>
         ),
       },
       weather,
-      windCells: wind.gpu?.pathCount ?? wind.paths ?? null,
+      windCells: wind.gpu?.pathCount ?? wind.paths ?? 0,
       enabled: [...dm.layers].filter(([, e]) => e.enabled).map(([id]) => id),
     };
   });
@@ -220,7 +224,7 @@ try {
   const baseline = await snapshot(a.page);
   console.log('baseline', JSON.stringify(baseline));
   for (const id of WEATHER) await setLayer(a.page, id, true);
-  await a.page
+  const weatherReady = await a.page
     .waitForFunction(
       () =>
         ['weather-radar', 'weather-satellite', 'weather-lightning'].every(
@@ -233,7 +237,13 @@ try {
         ),
       { timeout: 120_000 },
     )
-    .catch(() => console.log('  !! weather not ready'));
+    .then(
+      () => true,
+      () => false,
+    );
+  results.weatherReady = weatherReady;
+  if (!weatherReady)
+    console.log('  !! weather not ready — feature coverage incomplete');
   await sleep(2000);
   // exercise: history playback, wind reading, storm selection, product switch
   await a.page.evaluate(() => {
@@ -331,11 +341,25 @@ try {
     'errors (control run):',
     results.errorsB.length ? results.errorsB : 'none',
   );
+  // Resource ownership is an acceptance check; provider availability remains
+  // separately reported diagnostic evidence in both runs.
+  if (
+    !weatherReady ||
+    Object.keys(leak).length ||
+    [...a.errors, ...b.errors].some((e) => e.startsWith('pageerror:'))
+  ) {
+    process.exitCode = 1;
+  }
+} catch (error) {
+  results.failure = { name: error.name, message: error.message };
+  throw error;
+} finally {
+  // Preserve completed resource evidence even if a later provider or browser
+  // phase aborts. A partial run still exits nonzero.
   writeFileSync(
     path.join(outDir, 'results.json'),
     JSON.stringify(results, null, 2),
   );
   console.log(`wrote ${path.join(outDir, 'results.json')}`);
-} finally {
   await browser.close();
 }

scripts/run-unit-tests.mjs

@@ -1,7 +1,7 @@
 import { readdirSync } from 'node:fs';
 import { spawnSync } from 'node:child_process';
 import path from 'node:path';
-import { fileURLToPath, pathToFileURL } from 'node:url';
+import { pathToFileURL } from 'node:url';
 
 export const ALLOCATION_TEST_FILES = Object.freeze([
   'src/data/focusAllocations.test.mjs',

scripts/setup-doctor.mjs

@@ -124,6 +124,19 @@ export function resolveOpenSkyAuthMode({
   return OPENSKY_AUTH_MODES.has(mode) ? mode : OPENSKY_AUTH_MODE_DEFAULT;
 }
 
+/** Whether OPENSKY_CREDENTIALS_FILE is set, with the same precedence as the auth mode. The server reads that file when the client id and secret are empty. */
+export function resolveOpenSkyCredentialsFile({
+  authoritativeEnvironment = false,
+  environment = process.env,
+  rootDir = ROOT,
+} = {}) {
+  const environmentDefines = Object.prototype.hasOwnProperty.call(environment, 'OPENSKY_CREDENTIALS_FILE');
+  const value = authoritativeEnvironment && environmentDefines
+    ? String(environment.OPENSKY_CREDENTIALS_FILE || '')
+    : String(environment.OPENSKY_CREDENTIALS_FILE || '') || readDoctorDotenvValue('OPENSKY_CREDENTIALS_FILE', rootDir);
+  return isConfiguredValue(value.trim());
+}
+
 function hasKeychainItem(service, account) {
   if (process.platform !== 'darwin') return false;
   const result = spawnSync('security', [
@@ -153,10 +166,11 @@ export function resolveCredential(spec, {
 
 export function buildCapabilitySummary(
   credentials,
-  { openSkyAuthMode = OPENSKY_AUTH_MODE_DEFAULT } = {},
+  { openSkyAuthMode = OPENSKY_AUTH_MODE_DEFAULT, openSkyCredentialsFile = false } = {},
 ) {
   const configured = (name) => credentials[name]?.configured === true;
-  const hasOAuthCredentials = configured('OPENSKY_CLIENT_ID') && configured('OPENSKY_CLIENT_SECRET');
+  const hasClientPair = configured('OPENSKY_CLIENT_ID') && configured('OPENSKY_CLIENT_SECRET');
+  const hasOAuthCredentials = hasClientPair || openSkyCredentialsFile === true;
   const requestedOpenSkyMode = String(openSkyAuthMode || '').trim().toLowerCase();
   const openSkyMode = OPENSKY_AUTH_MODES.has(requestedOpenSkyMode)
     ? requestedOpenSkyMode
@@ -164,11 +178,13 @@ export function buildCapabilitySummary(
   const flights = openSkyMode === 'anon'
     ? 'OpenSky keyless anonymous access (rate-limited)'
     : openSkyMode === 'basic'
-      ? 'OpenSky Basic mode selected (credential presence and validity not verified)'
+      ? 'OpenSky Basic mode selected: OpenSky retired username/password sign-in, so flights load anonymously (rate-limited)'
       : openSkyMode === 'auto'
         ? 'OpenSky auto mode selected (runtime credential choice and validity not verified)'
-        : hasOAuthCredentials
+        : hasClientPair
           ? 'OpenSky OAuth credentials present (runtime mode and validity not verified)'
+          : hasOAuthCredentials
+            ? 'OpenSky OAuth credentials file set (OPENSKY_CREDENTIALS_FILE; file contents and validity not verified)'
           : 'OpenSky keyless anonymous access (rate-limited)';
   const route = selectMapStartupRoute({
     googleApiKey: configured('GOOGLE_MAPS_API_KEY') ? 'configured' : '',
@@ -215,6 +231,7 @@ export function inspectSetup({ includeKeychain = true, authoritativeEnvironment
     credentials,
     capabilities: buildCapabilitySummary(credentials, {
       openSkyAuthMode: resolveOpenSkyAuthMode({ authoritativeEnvironment, rootDir }),
+      openSkyCredentialsFile: resolveOpenSkyCredentialsFile({ authoritativeEnvironment, rootDir }),
     }),
   };
 }

scripts/track-regression.mjs

@@ -94,6 +94,7 @@
 
 import fs from 'node:fs';
 import puppeteer from 'puppeteer';
+import { arrivalRotationPassed } from '../src/tooling/trackArrivalObservation.mjs';
 import { classifyAircraft, CLASS_SCALE_3D, CLASS_MODEL_REAL } from '../src/data/aircraftClass.js';
 import { ensureGeoidReady, geoidHeight } from '../src/data/geoid.js';
 
@@ -2695,16 +2696,17 @@ async function main() {
     //       reappear wearing its stale/creation-north nose for up to 1 s).
     // Staged deterministically: park the camera nadir over the synthetic
     // cluster, let rotations settle, TAMPER a billboard's rotation, then
-    // trigger each path with the camera idle. The idle-drift catch-up
-    // (ROTATION_REFRESH_MS = 1 s) can coincidentally mask a regression in a
-    // ~300 ms SwiftShader frame window, so a regression shows as an
-    // intermittent (not guaranteed) failure — never a false failure.
+    // trigger each path with the camera idle. The fleet runs every 80 ms,
+    // independently of rendered FPS. Observe the first completed settle and
+    // reveal frames within 500 ms of forcing moveEnd, before the 1 s idle
+    // rotation refresh can repair an incorrect first reveal.
     // ============================================================
     console.log('\nChange 4 — arrival rotation: moveEnd settle pass + horizon-reveal pass');
     const arrival = await evalPage(async () => {
       const v = window.__godsEyeView.viewer;
       const dm = window.__godsEyeView.dataManager;
       const { screenProjectedRotation } = await import(`${window.__gevQaSourceBase || '/src'}/data/iconOrientation.js`);
+      const { observeArrivalRotation } = await import(`${window.__gevQaSourceBase || '/src'}/tooling/trackArrivalObservation.mjs`);
       // 3D models OFF for this phase: a model-handed-off billboard is hidden
       // and skips rotation updates entirely — the probes need live billboards
       // (this is also the app's default state the field report came from).
@@ -2766,39 +2768,29 @@ async function main() {
         const bb = findBB(id);
         if (!bb || !bb.show) return { error: `${id} missing/hidden` };
         const r0 = bb.rotation; // settled tamper origin; correctness uses a fresh projection below
-        // (a) settle pass: tamper, then raise moveEnd with the camera IDLE —
-        // the pose signature is unchanged, so only the moveEnd hook can fix
-        // this before the 1 s catch-up.
-        bb.rotation = r0 + 1.5;
-        v.camera.moveEnd.raiseEvent();
-        await nextFrames(2);
-        const afterMoveEnd = bb.rotation;
-        // A real-GPU fleet tick can land near the edge of the frame budget and
-        // advance the contact before the probe reads it. Compare with the
-        // production projection at the CURRENT position, not the now-stale r0.
-        const expectedMoveEnd = screenProjectedRotation(v.scene, bb.position, course, null);
-        // (b) reveal pass: tamper + hide — the next fleet tick must flip it
-        // visible AND correct the nose in that same tick (camera still idle,
-        // no moveEnd raised). Diagnostic fields (round 5): record WHICH frame
-        // the flip landed on (flipFrame; -1 = never within the extended
-        // window) and whether a 3D model owns this id — distinguishes "tick
-        // slow under load" from "occluder says hidden" from "model handoff".
-        bb.rotation = r0 + 1.5;
-        bb.show = false;
-        let flipFrame = -1;
-        for (let f = 1; f <= 6; f++) {
-          await nextFrames(1);
-          if (bb.show && flipFrame === -1) flipFrame = f;
-          if (f >= 2 && flipFrame !== -1) break;
-        }
-        const expectedReveal = screenProjectedRotation(v.scene, bb.position, course, null);
+        const observed = await observeArrivalRotation({
+          scene: v.scene,
+          startMoveEnd() {
+            // Only moveEnd can repair the tampered angle at the idle pose.
+            bb.rotation = r0 + 1.5;
+            v.camera.moveEnd.raiseEvent();
+          },
+          startReveal() {
+            // Hide immediately after the confirmed settle frame. The next
+            // eligible fleet tick must reveal AND re-aim in that same tick.
+            bb.rotation = r0 + 1.5;
+            bb.show = false;
+          },
+          read() {
+            return {
+              shown: bb.show,
+              rotationError: angDiff(bb.rotation,
+                screenProjectedRotation(v.scene, bb.position, course, null)),
+            };
+          },
+        });
         const hasModel = !!(window.__g3dFindModel && window.__g3dFindModel(id));
-        return {
-          r0,
-          dMoveEnd: angDiff(afterMoveEnd, expectedMoveEnd),
-          dReveal: angDiff(bb.rotation, expectedReveal),
-          shown: bb.show, flipFrame, hasModel,
-        };
+        return { r0, ...observed, hasModel };
       };
       const flightCourse = window.__SYNTH.flights.find((f) => f.icao === 'aaa002')?.track ?? 0;
       const militaryCourse = window.__SYNTH.military.find((m) => m.hex === 'bbb101')?.track ?? 0;
@@ -2807,22 +2799,13 @@ async function main() {
         military: await probe('bbb101', militaryCourse),
       };
     });
-    const fmtArr = (a) => (!a ? `no result (${arrival?.error || 'phase error'})` : a.error ? a.error
-      : `settle-err=${(a.dMoveEnd * 180 / Math.PI).toFixed(1)}° reveal-err=${(a.dReveal * 180 / Math.PI).toFixed(1)}° shown=${a.shown} flipFrame=${a.flipFrame} hasModel=${a.hasModel}`);
+    const fmtArr = (a) => (!a ? `no result (${arrival?.error || 'phase error'})` : a.error ? `${a.error}; elapsed=${Number(a.elapsedMs).toFixed(1)} ms`
+      : `settle-err=${(a.dMoveEnd * 180 / Math.PI).toFixed(1)}° reveal-err=${(a.dReveal * 180 / Math.PI).toFixed(1)}° shown=${a.shown} flipFrame=${a.flipFrame} settle=${a.moveEndMs.toFixed(1)} ms reveal=${a.revealMs.toFixed(1)} ms total=${a.elapsedMs.toFixed(1)} ms hasModel=${a.hasModel}`);
     const TAMPER_DEG = 1.5 * 180 / Math.PI; // ≈ 86° — an uncorrected nose stays this far off
-    // Reveal budget re-pinned 2 → 4 frames (round 5): the diagnostic probe
-    // shows the military flip consistently lands on frame 2 — the exact edge
-    // of the old budget — so any load hiccup flaked it (flights lands frame
-    // 1). The regression this protects against is a reveal that waits for
-    // the 1 s idle catch-up (~30-60 frames) or never re-aims; 4 frames still
-    // catches that with a wide margin, with zero-headroom flakes gone.
-    const arrOk = (a) => !!a && !a.error && a.shown
-      && (a.flipFrame === -1 ? false : a.flipFrame <= 4)
-      && a.dMoveEnd * 180 / Math.PI < 10 && a.dReveal * 180 / Math.PI < 10;
-    record(`arrival: moveEnd + reveal both re-aim within 4 frames, flights (tamper was ${TAMPER_DEG.toFixed(0)}°)`,
-      arrOk(arrival.flights), fmtArr(arrival.flights));
-    record(`arrival: moveEnd + reveal both re-aim within 4 frames, military (tamper was ${TAMPER_DEG.toFixed(0)}°)`,
-      arrOk(arrival.military), fmtArr(arrival.military));
+    record(`arrival: moveEnd + first reveal both re-aim before idle refresh, flights (tamper was ${TAMPER_DEG.toFixed(0)}°)`,
+      arrivalRotationPassed(arrival.flights), fmtArr(arrival.flights));
+    record(`arrival: moveEnd + first reveal both re-aim before idle refresh, military (tamper was ${TAMPER_DEG.toFixed(0)}°)`,
+      arrivalRotationPassed(arrival.military), fmtArr(arrival.military));
 
     // ============================================================
     // DISPLAY FLOOR (2026-08-19): a grounded contact must never render below

scripts/traffic-fixtures.mjs

@@ -1,56 +1,175 @@
-import { readFileSync } from 'node:fs';
-import { decodeFlowTile } from '../src/layers/traffic/flowDecode.js';
-import { tilesForBounds } from '../src/data/tomtomTiles.js';
+import { PbfWriter } from 'pbf';
 
-const tile = readFileSync(
-  new URL(
-    '../src/data/fixtures/tomtom-flow-austin-12-935-1686.pbf',
-    import.meta.url,
-  ),
-);
+const corsHeaders = { 'access-control-allow-origin': '*' };
 const json = (body) => ({
   status: 200,
+  headers: corsHeaders,
   contentType: 'application/json',
   body: JSON.stringify(body),
 });
 
-/** Reuse the recorded flow tile for an explicitly synthetic browser exercise. */
+// Cesium heightmap-1.0: 65x65 little-endian uint16 heights, scale .2,
+// offset -1000, followed by child availability and a uniform land mask.
+const flatTerrain = Buffer.alloc(65 * 65 * 2 + 2);
+for (let i = 0; i < 65 * 65; i++) flatTerrain.writeUInt16LE(5000, i * 2);
+
+/** Synthetic, geographically aligned motor roads at both source zooms. */
+export function trafficFixtureTile(zoom, flow = false) {
+  const writer = new PbfWriter();
+  writer.writeMessage(
+    3,
+    (_, layer) => {
+      layer.writeVarintField(15, 2);
+      layer.writeStringField(1, flow ? 'Traffic flow' : 'transportation');
+      layer.writeVarintField(5, 4096);
+      layer.writeStringField(3, flow ? 'traffic_level' : 'class');
+      layer.writeMessage(
+        4,
+        (_, value) => {
+          if (flow) value.writeDoubleField(3, 0.6);
+          else value.writeStringField(1, 'primary');
+        },
+        null,
+      );
+      if (flow) {
+        layer.writeStringField(3, 'road_type');
+        layer.writeMessage(
+          4,
+          (_, value) => value.writeStringField(1, 'Major road'),
+          null,
+        );
+      }
+      // z12 has four times the span of z14. Keep the same world spacing,
+      // and cover only alternate roads with flow to exercise hide/sim controls.
+      const step = 256 * 2 ** (zoom - 14);
+      for (let y = step; y < 4096; y += step) {
+        if (flow && (y / step) % 2) continue;
+        layer.writeMessage(
+          2,
+          (_, feature) => {
+            feature.writeVarintField(3, 2);
+            feature.writePackedVarint(2, flow ? [0, 0, 1, 1] : [0, 0]);
+            feature.writePackedVarint(4, [9, 0, y * 2, 10, 8192, 0]);
+          },
+          null,
+        );
+      }
+    },
+    null,
+  );
+  return Buffer.from(writer.finish());
+}
+
+/** Intercept the current vector sources; never fall through to live roads. */
 export function trafficFixtureResponse(request) {
   const url = new URL(request.url());
+  if (url.hostname === 'terrain.reearth.land') {
+    if (url.pathname.endsWith('/layer.json'))
+      return json({
+        tilejson: '2.1.0',
+        format: 'heightmap-1.0',
+        version: 'qa-flat',
+        scheme: 'tms',
+        projection: 'EPSG:4326',
+        minzoom: 0,
+        maxzoom: 0,
+        tiles: ['{z}/{x}/{y}.terrain?v={version}'],
+        available: [[{ startX: 0, startY: 0, endX: 1, endY: 0 }]],
+        attribution:
+          'Synthetic flat terrain for Traffic QA; not live elevation data',
+      });
+    if (/\/0\/[01]\/0\.terrain$/.test(url.pathname))
+      return {
+        status: 200,
+        contentType: 'application/octet-stream',
+        headers: corsHeaders,
+        body: flatTerrain,
+      };
+    throw new Error(`Unexpected terrain fixture request: ${url.pathname}`);
+  }
   if (url.pathname === '/api/tomtom/status')
     return json({ hasKey: true, dailyCount: 0 });
-  if (/^\/api\/tomtom\/flow\/\d+\/\d+\/\d+\.pbf$/.test(url.pathname))
-    return { status: 200, contentType: 'application/x-protobuf', body: tile };
-  if (url.pathname !== '/api/overpass') return null;
-  const query = new URLSearchParams(request.postData()).get('data') || '';
-  if (!query.includes('highway')) return null;
-  const match = query.match(/\((-?[\d.]+),(-?[\d.]+),(-?[\d.]+),(-?[\d.]+)\)/);
-  if (!match) throw new Error('Missing road fixture viewport');
-  const [south, west, north, east] = match.slice(1).map(Number);
-  const inside = ([lon, lat]) =>
-    lat >= south && lat <= north && lon >= west && lon <= east;
-  const segments = tilesForBounds({ south, west, north, east }, 12).flatMap(
-    ({ z, x, y }) => decodeFlowTile(tile, z, x, y),
+  const flow = url.pathname.match(
+    /^\/api\/tomtom\/flow\/(\d+)\/\d+\/\d+\.pbf$/,
   );
-  const elements = segments
-    .filter((segment) => segment.coords.some(inside))
-    .slice(0, 240)
-    .map((segment, index) => ({
-      type: 'way',
-      id: index + 1,
-      tags: { highway: 'primary', oneway: 'yes' },
-      geometry: segment.coords.map(([lon, lat]) => ({ lon, lat })),
-    }));
-  const latitude = (south + north) / 2,
-    longitude = (west + east) / 2;
-  elements.push({
-    type: 'way',
-    id: 99999,
-    tags: { highway: 'residential' },
-    geometry: [
-      { lat: latitude, lon: longitude },
-      { lat: latitude + 0.003, lon: longitude + 0.003 },
-    ],
+  if (flow)
+    return {
+      status: 200,
+      contentType: 'application/x-protobuf',
+      headers: corsHeaders,
+      body: trafficFixtureTile(Number(flow[1]), true),
+    };
+  if (url.hostname !== 'tiles.openfreemap.org') return null;
+  if (url.pathname === '/planet')
+    return json({
+      tilejson: '3.0.0',
+      minzoom: 0,
+      maxzoom: 14,
+      tiles: ['https://tiles.openfreemap.org/qa-traffic/{z}/{x}/{y}.pbf'],
+    });
+  const road = url.pathname.match(/^\/qa-traffic\/(\d+)\/\d+\/\d+\.pbf$/);
+  if (!road)
+    throw new Error(`Unrecognized road fixture request: ${url.pathname}`);
+  return {
+    status: 200,
+    contentType: 'application/x-protobuf',
+    headers: corsHeaders,
+    body: trafficFixtureTile(Number(road[1])),
+  };
+}
+
+/** Intercept provider URLs only; Cesium worker/module loading stays untouched. */
+export async function installTrafficRoutes(
+  page,
+  {
+    origin,
+    fixtures = false,
+    keyless = false,
+    onFlow = () => {},
+    onError = () => {},
+  },
+) {
+  const session = await page.createCDPSession();
+  const patterns = [
+    `${origin}/api/tomtom/status*`,
+    `${origin}/api/tomtom/flow/*`,
+    ...(fixtures
+      ? ['https://tiles.openfreemap.org/*', 'https://terrain.reearth.land/*']
+      : []),
+  ].map((urlPattern) => ({ urlPattern, requestStage: 'Request' }));
+  session.on('Fetch.requestPaused', async ({ requestId, request }) => {
+    try {
+      const url = new URL(request.url);
+      let response;
+      if (keyless && url.pathname === '/api/tomtom/status') {
+        response = json({ hasKey: false });
+      } else if (keyless && url.pathname.startsWith('/api/tomtom/flow/')) {
+        onFlow(request.url);
+        response = { ...json({ error: 'no_key' }), status: 503 };
+      } else if (fixtures) {
+        response = trafficFixtureResponse({ url: () => request.url });
+      }
+      if (!response) {
+        await session.send('Fetch.continueRequest', { requestId });
+        return;
+      }
+      await session.send('Fetch.fulfillRequest', {
+        requestId,
+        responseCode: response.status,
+        responseHeaders: Object.entries({
+          'content-type': response.contentType,
+          ...response.headers,
+        }).map(([name, value]) => ({ name, value })),
+        body: Buffer.from(response.body).toString('base64'),
+      });
+    } catch (error) {
+      if (page.isClosed()) return;
+      onError(error);
+      await session
+        .send('Fetch.failRequest', { requestId, errorReason: 'Failed' })
+        .catch(() => {});
+    }
   });
-  return json({ elements });
+  await session.send('Fetch.enable', { patterns });
+  return session;
 }

scripts/voice-bench/phrases.mjs

@@ -116,6 +116,9 @@ export const CORE_PHRASES = Object.freeze([
   // — camera verbs (tools #23/#24) —
   { phrase: 'Orbit around this area slowly', expect: 'move_camera', typedArgs: [where('move_camera', (a) => a.motion === 'orbit' && a.speed === 'slow')] },
   { phrase: 'Pan left a bit', expect: 'move_camera', typedArgs: [where('move_camera', (a) => a.motion === 'pan' && a.direction === 'left')] },
+  { phrase: 'Rotate the globe to the right', expect: 'move_camera', typedArgs: [where('move_camera', (a) => a.motion === 'rotate_globe' && (a.direction === undefined || a.direction === 'right'))] },
+  { phrase: 'Keep spinning the Earth slowly to the left', expect: 'move_camera', typedArgs: [where('move_camera', (a) => a.motion === 'rotate_globe' && a.direction === 'left' && a.speed === 'slow' && (a.mode === undefined || a.mode === 'continuous'))] },
+  { phrase: 'Turn the camera to look right', expect: 'move_camera', typedArgs: [where('move_camera', (a) => a.motion === 'rotate' && a.direction === 'right')] },
   { phrase: 'Stop moving the camera', expect: 'move_camera', typedArgs: [where('move_camera', (a) => a.motion === 'stop')] },
   { phrase: 'Fly the route we just drew', expect: 'fly_route' },