@riddledc/riddle-proof 0.7.20 → 0.7.22

package/dist/{chunk-6H742VFJ.js → chunk-ELZSPOWV.js}

@@ -79,11 +79,13 @@ function assessBasicGameplayEvidence(evidence, options = {}) {
   }
   const routeResults = (run.results || []).map((route) => augmentRouteAssessmentWithProgressionChecks(
     assessBasicGameplayRoute(route, options),
-    route
+    route,
+    options
   ));
   const failingRoutes = routeResults.filter((result) => !result.ok).map((result) => ({
     name: result.name,
     path: result.path,
+    assessment_mode: result.assessment_mode,
     failures: result.failures,
     warnings: result.warnings,
     suite_failures: result.suite_failures
@@ -110,6 +112,8 @@ function assessBasicGameplayRoute(route, options = {}) {
   const failOnConsoleError = options.failOnConsoleError ?? false;
   const failures = [];
   const warnings = [];
+  const assessmentMode = routeAssessmentMode(route);
+  const auditAssessment = isAuditAssessmentRoute(route);
   const initial = route.initial || {};
   const timed = route.timed || {};
   const afterAction = route.after_action || route.afterAction || {};
@@ -121,7 +125,9 @@ function assessBasicGameplayRoute(route, options = {}) {
   const continuedActionChange = changed(afterAction, afterContinue);
   const cleanupBase = route.after_continue || route.afterContinue ? afterContinue : afterAction;
   const cleanupActionChange = changed(cleanupBase, afterCleanup);
-  const surfaceVisible = numberValue(initial.visible_canvas_count) > 0 || numberValue(initial.enabled_clickable_count) > 0 || numberValue(initial.visible_large_node_count) >= minSurfaceLargeNodes;
+  const interactiveSurfaceVisible = numberValue(initial.visible_canvas_count) > 0 || numberValue(initial.enabled_clickable_count) > 0 || numberValue(initial.visible_large_node_count) >= minSurfaceLargeNodes;
+  const auditSurfaceVisible = numberValue(initial.body_text_length) >= minBodyTextLength || numberValue(initial.visible_large_node_count) >= minVisibleLargeNodes || numberValue(initial.enabled_clickable_count) > 0 || numberValue(initial.visible_canvas_count) > 0;
+  const surfaceVisible = auditAssessment ? auditSurfaceVisible : interactiveSurfaceVisible;
   const actionResults = listValue(route.action_results || route.actionResults);
   const continuedActionResults = listValue(route.continued_action_results || route.continuedActionResults);
   const continuedCleanupActionResults = listValue(route.continued_cleanup_action_results || route.continuedCleanupActionResults);
@@ -135,7 +141,7 @@ function assessBasicGameplayRoute(route, options = {}) {
   const responseStatus = firstNumber(route.http_status, route.response_status, route.status);
   const pageErrorCount = numberValue(route.page_error_count);
   const consoleErrorCount = numberValue(route.console_error_count);
-  const mobileOverflowPx = numberValue(mobile.overflow_px);
+  const mobileOverflowPx = horizontalBoundsOverflowPx(mobile);
   if (responseStatus !== null && responseStatus >= 400) failures.push("route_http_error");
   if (pageErrorCount > 0) failures.push("fatal_page_error");
   if (numberValue(initial.body_text_length) < minBodyTextLength && numberValue(initial.visible_large_node_count) < minVisibleLargeNodes) {
@@ -143,20 +149,21 @@ function assessBasicGameplayRoute(route, options = {}) {
   }
   if (!surfaceVisible) failures.push("no_game_surface");
   if (mobileOverflowPx > maxMobileOverflowPx) failures.push("mobile_horizontal_overflow");
-  if (!actionAttempted && !timedChange.changed) failures.push("primary_control_missing");
-  if (actionAttempted && !stateChangeObserved) failures.push("primary_control_inert");
+  if (!auditAssessment && !actionAttempted && !timedChange.changed) failures.push("primary_control_missing");
+  if (!auditAssessment && actionAttempted && !stateChangeObserved) failures.push("primary_control_inert");
   if (failOnConsoleError && consoleErrorCount > 0) failures.push("fatal_page_error");
   if (numberValue(initial.visible_canvas_count) > 0 && actionAttempted && !timedChange.canvas_changed && !actionChange.canvas_changed && !actionChange.screenshot_changed) {
     warnings.push("canvas_inert");
   }
   if (actionFailed) warnings.push("some_actions_failed");
-  if (warnOnMissingResetPath && !resetPathPresent && route.requires_reset !== false && actionAttempted && stateChangeObserved) {
+  if (!auditAssessment && warnOnMissingResetPath && !resetPathPresent && route.requires_reset !== false && actionAttempted && stateChangeObserved) {
     warnings.push("missing_reset_path");
   }
   if (warnOnConsoleError && consoleErrorCount > 0) warnings.push("critical_console_error");
   return {
     name: route.name,
     path: route.path,
+    assessment_mode: assessmentMode,
     ok: failures.length === 0,
     failures,
     warnings,
@@ -277,15 +284,16 @@ function assessBasicGameplayProgressionCheck(check) {
 function assessBasicGameplayProgressionChecks(route) {
   return progressionChecksForRoute(route).map((check) => assessBasicGameplayProgressionCheck(check));
 }
-function augmentBasicGameplayAssessmentWithProgressionChecks(assessment, evidence) {
+function augmentBasicGameplayAssessmentWithProgressionChecks(assessment, evidence, options = {}) {
   const run = extractBasicGameplayEvidence(evidence);
   if (!run?.results?.length) return assessment;
   const routeResults = assessment.route_results.map(
-    (result, index) => augmentRouteAssessmentWithProgressionChecks(result, run.results?.[index] || {})
+    (result, index) => augmentRouteAssessmentWithProgressionChecks(result, run.results?.[index] || {}, options)
   );
   const failingRoutes = routeResults.filter((result) => !result.ok).map((result) => ({
     name: result.name,
     path: result.path,
+    assessment_mode: result.assessment_mode,
     failures: result.failures,
     warnings: result.warnings,
     suite_failures: result.suite_failures
@@ -342,7 +350,7 @@ function attachBasicGameplayArtifactScreenshotHashes(evidence, routesOrOptions =
   }
   return evidence;
 }
-function createBasicGameplayCatchRecords(assessment, evidence) {
+function createBasicGameplayCatchRecords(assessment, evidence, options = {}) {
   const run = extractBasicGameplayEvidence(evidence);
   if (!run?.results?.length) return [];
   const catches = [];
@@ -416,6 +424,24 @@ function createBasicGameplayCatchRecords(assessment, evidence) {
         summary: `${route.name || route.path || "Route"}: responsive setup failed on ${failure.viewport?.label || "viewport"} (${failure.reason || "responsive_setup_failed"})`
       });
     }
+    for (const failure of responsiveBoundsFailures(route, options.maxMobileOverflowPx ?? 4)) {
+      catches.push({
+        site: run.site || null,
+        route: route.name,
+        path: route.path,
+        code: failure.code,
+        label: failure.label,
+        type: "responsive_bounds",
+        selector: null,
+        reason: failure.reason || "responsive_bounds_clipped",
+        phase: failure.viewport?.phase || void 0,
+        viewport: failure.viewport,
+        overflow_px: failure.overflow_px,
+        max_allowed_px: failure.max_allowed_px,
+        offenders: failure.offenders,
+        summary: `${route.name || route.path || "Route"}: responsive bounds exceeded ${failure.max_allowed_px}px on ${failure.viewport?.label || "viewport"} (${failure.overflow_px}px)`
+      });
+    }
     for (const check of assessBasicGameplayProgressionChecks(route).filter((item) => item.ok === false)) {
       catches.push({
         site: run.site || null,
@@ -570,13 +596,15 @@ function changed(before, after) {
 function canvasHashes(canvases) {
   return (canvases || []).map((canvas) => canvas.hash).filter(Boolean).join("|");
 }
-function augmentRouteAssessmentWithProgressionChecks(result, route) {
+function augmentRouteAssessmentWithProgressionChecks(result, route, options = {}) {
   const progressionFailures = assessBasicGameplayProgressionChecks(route).filter((check) => check.ok === false);
   const responsiveFailures = responsiveSetupFailures(route);
-  if (!progressionFailures.length && !responsiveFailures.length) return result;
+  const responsiveBounds = responsiveBoundsFailures(route, options.maxMobileOverflowPx ?? 4);
+  if (!progressionFailures.length && !responsiveFailures.length && !responsiveBounds.length) return result;
   const failures = new Set(result.failures);
   if (progressionFailures.length) failures.add("progression_assertion_failed");
   for (const failure of responsiveFailures) failures.add(failure.code);
+  for (const failure of responsiveBounds) failures.add(failure.code);
   return {
     ...result,
     ok: false,
@@ -592,7 +620,8 @@ function augmentRouteAssessmentWithProgressionChecks(result, route) {
         state_call: check.state_call || null,
         property_path: check.property_path || null
       })),
-      ...responsiveFailures
+      ...responsiveFailures,
+      ...responsiveBounds
     ]
   };
 }
@@ -618,6 +647,28 @@ function responsiveSetupFailures(route) {
   }
   return failures;
 }
+function responsiveBoundsFailures(route, maxOverflowPx) {
+  const failures = [];
+  for (const viewport of responsiveViewportsForRoute(route)) {
+    const overflowPx = horizontalBoundsOverflowPx(viewport);
+    if (overflowPx <= maxOverflowPx) continue;
+    failures.push({
+      code: "responsive_bounds_clipped",
+      label: `${viewport.label || "responsive"} horizontal bounds`,
+      reason: `horizontal bounds overflow ${overflowPx}px exceeded ${maxOverflowPx}px`,
+      overflow_px: overflowPx,
+      max_allowed_px: maxOverflowPx,
+      offenders: boundsOffendersForEvidence(viewport).slice(0, 10),
+      viewport: {
+        label: viewport.label || null,
+        width: numberValue(viewport.width) || null,
+        height: numberValue(viewport.height) || null,
+        phase: viewport.phase || null
+      }
+    });
+  }
+  return failures;
+}
 function responsiveViewportsForRoute(route) {
   return listValue(route.responsive_viewports || route.responsiveViewports).filter((item) => Boolean(recordValue(item)));
 }
@@ -627,6 +678,82 @@ function progressionChecksForRoute(route) {
 function metricValue(value) {
   return recordValue(value);
 }
+function horizontalBoundsOverflowPx(value) {
+  const record = recordValue(value);
+  if (!record) return 0;
+  let max = maxPositiveNumber(
+    record.overflow_px,
+    record.overflow,
+    record.bounds_overflow_px,
+    record.horizontal_overflow_px,
+    record.left_overflow_px,
+    record.right_overflow_px
+  );
+  for (const offender of boundsOffendersForEvidence(record)) {
+    max = Math.max(max, horizontalOffenderOverflowPx(offender));
+  }
+  return roundPixels(max);
+}
+function horizontalOffenderOverflowPx(value) {
+  const record = recordValue(value);
+  if (!record) return 0;
+  let max = maxPositiveNumber(
+    record.overflow,
+    record.overflow_px,
+    record.bounds_overflow_px,
+    record.horizontal_overflow_px,
+    record.left_overflow_px,
+    record.right_overflow_px,
+    record.leftOverflowPx,
+    record.rightOverflowPx
+  );
+  const clipped = recordValue(record.clipped || record.clip || record.clipping);
+  if (clipped) {
+    max = Math.max(max, maxPositiveNumber(
+      clipped.left,
+      clipped.right,
+      clipped.left_px,
+      clipped.right_px,
+      clipped.leftPx,
+      clipped.rightPx
+    ));
+  }
+  const rect = recordValue(record.rect || record.bounds || record.bounding_rect || record.boundingRect);
+  const viewportWidth = numericValue(record.viewport_width ?? record.viewportWidth);
+  if (rect && viewportWidth !== null) {
+    const left = numericValue(rect.left);
+    const right = numericValue(rect.right);
+    if (left !== null && left < 0) max = Math.max(max, Math.abs(left));
+    if (right !== null && right > viewportWidth) max = Math.max(max, right - viewportWidth);
+  }
+  return roundPixels(max);
+}
+function boundsOffendersForEvidence(value) {
+  const record = recordValue(value);
+  if (!record) return [];
+  const offenders = [
+    ...listValue(record.overflow_offenders),
+    ...listValue(record.overflowOffenders),
+    ...listValue(record.bounds_offenders),
+    ...listValue(record.boundsOffenders),
+    ...listValue(record.clipped_elements),
+    ...listValue(record.clippedElements),
+    ...listValue(record.clipping_offenders),
+    ...listValue(record.clippingOffenders)
+  ];
+  return offenders.filter((item) => Boolean(recordValue(item))).sort((a, b) => horizontalOffenderOverflowPx(b) - horizontalOffenderOverflowPx(a));
+}
+function maxPositiveNumber(...values) {
+  let max = 0;
+  for (const value of values) {
+    const number = numericValue(value);
+    if (number !== null && number > max) max = number;
+  }
+  return max;
+}
+function roundPixels(value) {
+  return Math.round(value * 100) / 100;
+}
 function textMatches(text, pattern, flags) {
   if (!pattern) return Boolean(text);
   try {
@@ -720,6 +847,24 @@ function countCodes(codes) {
   for (const code of codes) counts[code] = (counts[code] || 0) + 1;
   return counts;
 }
+function routeAssessmentMode(route) {
+  const raw = route.assessment_mode ?? route.assessmentMode ?? route.proof_mode ?? route.proofMode ?? null;
+  if (raw === null || raw === void 0) return route.audit === true ? "audit" : null;
+  const mode = String(raw).trim().toLowerCase().replace(/_/g, "-");
+  return mode || (route.audit === true ? "audit" : null);
+}
+function isAuditAssessmentRoute(route) {
+  const mode = routeAssessmentMode(route);
+  return route.audit === true || [
+    "audit",
+    "audit-only",
+    "no-diff",
+    "not-required",
+    "profile",
+    "report-only",
+    "static"
+  ].includes(String(mode || ""));
+}
 function firstNumber(...values) {
   for (const value of values) {
     const number = numericValue(value);

package/dist/{chunk-TPUR67H5.js → chunk-WTHSVHG5.js}

@@ -38,6 +38,79 @@ function stringValue(value) {
 function numberValue(value) {
   return typeof value === "number" && Number.isFinite(value) ? value : void 0;
 }
+function horizontalBoundsOverflowPx(value) {
+  if (!isRecord(value)) return 0;
+  let max = maxPositiveNumber(
+    value.overflow_px,
+    value.overflow,
+    value.bounds_overflow_px,
+    value.horizontal_overflow_px,
+    value.left_overflow_px,
+    value.right_overflow_px
+  );
+  for (const offender of boundsOffendersForEvidence(value)) {
+    max = Math.max(max, horizontalOffenderOverflowPx(offender));
+  }
+  return roundPixels(max);
+}
+function horizontalOffenderOverflowPx(value) {
+  if (!isRecord(value)) return 0;
+  let max = maxPositiveNumber(
+    value.overflow,
+    value.overflow_px,
+    value.bounds_overflow_px,
+    value.horizontal_overflow_px,
+    value.left_overflow_px,
+    value.right_overflow_px,
+    value.leftOverflowPx,
+    value.rightOverflowPx
+  );
+  const clipped = isRecord(value.clipped || value.clip || value.clipping) ? value.clipped || value.clip || value.clipping : void 0;
+  if (isRecord(clipped)) {
+    max = Math.max(max, maxPositiveNumber(
+      clipped.left,
+      clipped.right,
+      clipped.left_px,
+      clipped.right_px,
+      clipped.leftPx,
+      clipped.rightPx
+    ));
+  }
+  const rect = isRecord(value.rect || value.bounds || value.bounding_rect || value.boundingRect) ? value.rect || value.bounds || value.bounding_rect || value.boundingRect : void 0;
+  const viewportWidth = numberValue(value.viewport_width ?? value.viewportWidth);
+  if (isRecord(rect) && viewportWidth !== void 0) {
+    const left = numberValue(rect.left);
+    const right = numberValue(rect.right);
+    if (left !== void 0 && left < 0) max = Math.max(max, Math.abs(left));
+    if (right !== void 0 && right > viewportWidth) max = Math.max(max, right - viewportWidth);
+  }
+  return roundPixels(max);
+}
+function boundsOffendersForEvidence(value) {
+  if (!isRecord(value)) return [];
+  const offenders = [
+    ...Array.isArray(value.overflow_offenders) ? value.overflow_offenders : [],
+    ...Array.isArray(value.overflowOffenders) ? value.overflowOffenders : [],
+    ...Array.isArray(value.bounds_offenders) ? value.bounds_offenders : [],
+    ...Array.isArray(value.boundsOffenders) ? value.boundsOffenders : [],
+    ...Array.isArray(value.clipped_elements) ? value.clipped_elements : [],
+    ...Array.isArray(value.clippedElements) ? value.clippedElements : [],
+    ...Array.isArray(value.clipping_offenders) ? value.clipping_offenders : [],
+    ...Array.isArray(value.clippingOffenders) ? value.clippingOffenders : []
+  ];
+  return offenders.filter((item) => isRecord(item)).sort((a, b) => horizontalOffenderOverflowPx(b) - horizontalOffenderOverflowPx(a));
+}
+function maxPositiveNumber(...values) {
+  let max = 0;
+  for (const value of values) {
+    const number = numberValue(value);
+    if (number !== void 0 && number > max) max = number;
+  }
+  return max;
+}
+function roundPixels(value) {
+  return Math.round(value * 100) / 100;
+}
 function timeoutSecValue(value) {
   const number = numberValue(value);
   return number && number > 0 ? Math.ceil(number) : void 0;
@@ -380,7 +453,7 @@ function assessCheckFromEvidence(check, evidence) {
         message: "No applicable viewport evidence was captured for overflow check."
       };
     }
-    const failed = applicable.filter((viewport) => (viewport.overflow_px ?? 0) > maxOverflow);
+    const failed = applicable.filter((viewport) => horizontalBoundsOverflowPx(viewport) > maxOverflow);
     return {
       type: check.type,
       label: checkLabel(check),
@@ -388,9 +461,11 @@ function assessCheckFromEvidence(check, evidence) {
       evidence: {
         max_overflow_px: maxOverflow,
         overflow_px: applicable.map((viewport) => viewport.overflow_px ?? null),
+        bounds_overflow_px: applicable.map((viewport) => horizontalBoundsOverflowPx(viewport)),
+        overflow_offender_counts: applicable.map((viewport) => boundsOffendersForEvidence(viewport).length),
         viewports: applicable.map((viewport) => viewport.name)
       },
-      message: failed.length ? `Horizontal overflow exceeded ${maxOverflow}px in ${failed.length} viewport(s).` : void 0
+      message: failed.length ? `Horizontal bounds overflow exceeded ${maxOverflow}px in ${failed.length} viewport(s).` : void 0
     };
   }
   if (check.type === "no_fatal_console_errors") {
@@ -612,6 +687,77 @@ function textMatches(sample, check) {
   }
   return String(sample || "").includes(check.text || "");
 }
+function numberValue(value) {
+  return typeof value === "number" && Number.isFinite(value) ? value : undefined;
+}
+function maxPositiveNumber() {
+  let max = 0;
+  for (const value of arguments) {
+    const number = numberValue(value);
+    if (number !== undefined && number > max) max = number;
+  }
+  return max;
+}
+function roundPixels(value) {
+  return Math.round(value * 100) / 100;
+}
+function isRecord(value) {
+  return Boolean(value) && typeof value === "object" && !Array.isArray(value);
+}
+function boundsOffendersForEvidence(value) {
+  if (!isRecord(value)) return [];
+  const offenders = []
+    .concat(Array.isArray(value.overflow_offenders) ? value.overflow_offenders : [])
+    .concat(Array.isArray(value.overflowOffenders) ? value.overflowOffenders : [])
+    .concat(Array.isArray(value.bounds_offenders) ? value.bounds_offenders : [])
+    .concat(Array.isArray(value.boundsOffenders) ? value.boundsOffenders : [])
+    .concat(Array.isArray(value.clipped_elements) ? value.clipped_elements : [])
+    .concat(Array.isArray(value.clippedElements) ? value.clippedElements : [])
+    .concat(Array.isArray(value.clipping_offenders) ? value.clipping_offenders : [])
+    .concat(Array.isArray(value.clippingOffenders) ? value.clippingOffenders : []);
+  return offenders.filter(isRecord).sort((a, b) => horizontalOffenderOverflowPx(b) - horizontalOffenderOverflowPx(a));
+}
+function horizontalOffenderOverflowPx(value) {
+  if (!isRecord(value)) return 0;
+  let max = maxPositiveNumber(
+    value.overflow,
+    value.overflow_px,
+    value.bounds_overflow_px,
+    value.horizontal_overflow_px,
+    value.left_overflow_px,
+    value.right_overflow_px,
+    value.leftOverflowPx,
+    value.rightOverflowPx
+  );
+  const clipped = value.clipped || value.clip || value.clipping;
+  if (isRecord(clipped)) {
+    max = Math.max(max, maxPositiveNumber(clipped.left, clipped.right, clipped.left_px, clipped.right_px, clipped.leftPx, clipped.rightPx));
+  }
+  const rect = value.rect || value.bounds || value.bounding_rect || value.boundingRect;
+  const viewportWidth = numberValue(value.viewport_width != null ? value.viewport_width : value.viewportWidth);
+  if (isRecord(rect) && viewportWidth !== undefined) {
+    const left = numberValue(rect.left);
+    const right = numberValue(rect.right);
+    if (left !== undefined && left < 0) max = Math.max(max, Math.abs(left));
+    if (right !== undefined && right > viewportWidth) max = Math.max(max, right - viewportWidth);
+  }
+  return roundPixels(max);
+}
+function horizontalBoundsOverflowPx(value) {
+  if (!isRecord(value)) return 0;
+  let max = maxPositiveNumber(
+    value.overflow_px,
+    value.overflow,
+    value.bounds_overflow_px,
+    value.horizontal_overflow_px,
+    value.left_overflow_px,
+    value.right_overflow_px
+  );
+  for (const offender of boundsOffendersForEvidence(value)) {
+    max = Math.max(max, horizontalOffenderOverflowPx(offender));
+  }
+  return roundPixels(max);
+}
 function assessProfile(profile, evidence) {
   const checks = [];
   const viewports = evidence.viewports || [];
@@ -729,13 +875,19 @@ function assessProfile(profile, evidence) {
         });
         continue;
       }
-      const failed = applicable.filter((viewport) => (viewport.overflow_px || 0) > maxOverflow);
+      const failed = applicable.filter((viewport) => horizontalBoundsOverflowPx(viewport) > maxOverflow);
       checks.push({
         type: check.type,
         label: check.label || check.type,
         status: failed.length ? "failed" : "passed",
-        evidence: { max_overflow_px: maxOverflow, overflow_px: applicable.map((viewport) => viewport.overflow_px ?? null), viewports: applicable.map((viewport) => viewport.name) },
-        message: failed.length ? "Horizontal overflow exceeded " + maxOverflow + "px in " + failed.length + " viewport(s)." : undefined,
+        evidence: {
+          max_overflow_px: maxOverflow,
+          overflow_px: applicable.map((viewport) => viewport.overflow_px ?? null),
+          bounds_overflow_px: applicable.map((viewport) => horizontalBoundsOverflowPx(viewport)),
+          overflow_offender_counts: applicable.map((viewport) => boundsOffendersForEvidence(viewport).length),
+          viewports: applicable.map((viewport) => viewport.name)
+        },
+        message: failed.length ? "Horizontal bounds overflow exceeded " + maxOverflow + "px in " + failed.length + " viewport(s)." : undefined,
       });
       continue;
     }
@@ -965,14 +1117,55 @@ async function captureViewport(viewport) {
     const body = document.body;
     const documentElement = document.documentElement;
     const text = (body ? body.innerText : "").replace(/\s+/g, " ").trim();
+    const clientWidth = documentElement ? documentElement.clientWidth : window.innerWidth;
+    const scrollWidth = documentElement ? documentElement.scrollWidth : 0;
+    const viewportWidth = clientWidth || window.innerWidth;
+    const overflowOffenders = [];
+    for (const element of Array.from(body ? body.querySelectorAll("*") : [])) {
+      const rect = element.getBoundingClientRect();
+      if (!rect || rect.width < 1 || rect.height < 1) continue;
+      const style = window.getComputedStyle(element);
+      if (style.display === "none" || style.visibility === "hidden" || style.opacity === "0") continue;
+      const leftOverflow = Math.max(0, -rect.left);
+      const rightOverflow = Math.max(0, rect.right - viewportWidth);
+      const overflow = Math.max(leftOverflow, rightOverflow);
+      if (overflow <= 0.5) continue;
+      const tag = element.tagName ? element.tagName.toLowerCase() : "element";
+      const id = element.id ? "#" + element.id : "";
+      const className = typeof element.className === "string"
+        ? element.className.trim().split(/\s+/).filter(Boolean).slice(0, 2).join(".")
+        : "";
+      overflowOffenders.push({
+        selector: tag + id + (className ? "." + className : ""),
+        tag,
+        text: (element.textContent || "").replace(/\s+/g, " ").trim().slice(0, 120),
+        overflow,
+        left_overflow_px: leftOverflow,
+        right_overflow_px: rightOverflow,
+        viewport_width: viewportWidth,
+        rect: {
+          left: rect.left,
+          right: rect.right,
+          width: rect.width,
+        },
+      });
+    }
+    overflowOffenders.sort((a, b) => b.overflow - a.overflow);
+    const boundsOverflowPx = Math.max(
+      0,
+      scrollWidth - (clientWidth || viewportWidth),
+      ...overflowOffenders.map((offender) => offender.overflow),
+    );
     return {
       url: location.href,
       pathname: location.pathname,
       title: document.title,
       body_text_length: text.length,
       body_text_sample: text.slice(0, 8000),
-      scroll_width: documentElement ? documentElement.scrollWidth : 0,
-      client_width: documentElement ? documentElement.clientWidth : window.innerWidth,
+      scroll_width: scrollWidth,
+      client_width: clientWidth,
+      bounds_overflow_px: Math.round(boundsOverflowPx * 100) / 100,
+      overflow_offenders: overflowOffenders.slice(0, 10),
     };
   }).catch((error) => ({
     url: page.url(),
@@ -982,6 +1175,8 @@ async function captureViewport(viewport) {
     body_text_sample: "",
     scroll_width: 0,
     client_width: viewport.width,
+    bounds_overflow_px: 0,
+    overflow_offenders: [],
     evaluation_error: String(error && error.message ? error.message : error).slice(0, 1000),
   }));
   const selectors = {};
@@ -1020,6 +1215,8 @@ async function captureViewport(viewport) {
     scroll_width: dom.scroll_width,
     client_width: dom.client_width,
     overflow_px: Math.max(0, (dom.scroll_width || 0) - (dom.client_width || viewport.width)),
+    bounds_overflow_px: dom.bounds_overflow_px,
+    overflow_offenders: dom.overflow_offenders || [],
     selectors,
     text_matches,
     setup_action_results: setupActionResults,
@@ -1051,6 +1248,8 @@ function buildProfileEvidence(currentViewports) {
       routes: currentViewports.map((viewport) => viewport.route),
       titles: currentViewports.map((viewport) => viewport.title),
       overflow_px: currentViewports.map((viewport) => viewport.overflow_px),
+      bounds_overflow_px: currentViewports.map((viewport) => viewport.bounds_overflow_px),
+      overflow_offender_counts: currentViewports.map((viewport) => (viewport.overflow_offenders || []).length),
     },
   };
 }