kaloko 0.7.1 → 0.8.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "kaloko",
-  "version": "0.7.1",
+  "version": "0.8.0",
   "description": "See what your AI agents built: every screen, language and device walked, assessed and approved on one canvas.",
   "keywords": [
     "qa",
@@ -32,7 +32,7 @@
     "access": "public"
   },
   "scripts": {
-    "test": "node --test --test-timeout=900000 test/*.test.mjs worker/test/*.test.mjs"
+    "test": "node scripts/test.mjs"
   },
   "dependencies": {
     "ajv": "^8.20.0",

package/schemas/scenario.v1.json

@@ -84,6 +84,10 @@
       "default": "web",
       "description": "What the flow runs on. web: pages in a browser (an installed PWA too: display_modes). android/ios/electron/desktop/windows: an app, driven by the environment's app block (adb, iOS Simulator or device, Playwright Electron, macOS window, Windows UI Automation) or captured with kaloko capture --image. Node paths are deep links for apps."
     },
+    "page": {
+      "enum": ["landing", "work", "list", "settings", "form", "doc"],
+      "description": "Default page type of every step (a step may set its own). landing: a public or marketing page; work: an app screen where people work (overview, canvas, inbox); list: a list or table of items; settings: settings or billing; form: a form to fill in; doc: documentation or long text. The usability pack picks its questions by type. Not set: landing for steps with the seo pack or scenarios allowed on production, work otherwise."
+    },
     "tags": {
       "type": "array",
       "items": {
@@ -307,6 +311,10 @@
           ],
           "description": "For `kaloko walk --affected`: globs of repository files (relative to the config) that shape this step, next to the routes and imports Kaloko finds itself; `always` walks the step on every affected walk (sign-in, consent)."
         },
+        "page": {
+          "enum": ["landing", "work", "list", "settings", "form", "doc"],
+          "description": "What kind of page this step is (see the scenario's page); the usability pack asks per type, e.g. one primary call to action only on landing pages."
+        },
         "packs": {
           "type": "array",
           "items": {
@@ -321,7 +329,7 @@
               "design"
             ]
           },
-          "description": "Check packs whose criteria are added to this node (ids AC1xx seo, AC2xx usability, AC3xx a11y, AC4xx perf, AC5xx console, AC6xx design: checks against the design reference)."
+          "description": "Check packs whose criteria are added to this node (ids AC1xx seo, AC2xx usability, AC3xx a11y, AC4xx perf, AC5xx console, AC6xx errors, AC7xx app, AC8xx design: checks against the design reference)."
         },
         "capture": {
           "$ref": "#/$defs/capture"
@@ -528,6 +536,12 @@
         "pack": {
           "type": "string",
           "description": "Set by the CLI on criteria that came from a pack."
+        },
+        "environments": {
+          "type": "array",
+          "minItems": 1,
+          "items": { "type": "string" },
+          "description": "Environments where this criterion applies, e.g. [production] for hreflang to the live domain, the live demo or the sitemap. On any other environment the walk reports it as not applicable (not_evaluated with na: environment) and it does not make the step partial."
         }
       }
     },

package/skills/kaloko/reference/acceptance.md

@@ -42,12 +42,42 @@ sharpen each purpose and add the criteria the page must really meet.
 criteria (ids `AC1xx` for `seo`, `AC2xx` for `usability`) at load time:
 `seo` checks one H1, title and description length, canonical, hreflang for
 every locale, Open Graph, indexing, viewport, `html lang`, overflow and
-console; `usability` asks the evaluator about purpose, one primary action
-and link texts and checks unlabeled inputs. A node's own criterion with the
+console; `usability` checks unlabeled inputs and link texts and asks the
+evaluator questions that fit the step's page type. A node's own criterion with the
 same id wins. Pack criteria are marked `pack` on the canvas and do not count
 as drift in `--coverage`; the plan may still mention them by id. Use packs
 for public pages and landings; task flows keep their own criteria.
 
+Set `page` on every step (or once on the scenario) so the usability pack
+asks the right questions:
+
+| `page` | for | asks |
+| --- | --- | --- |
+| `landing` | public and marketing pages | purpose in the first screen (`AC201`), exactly one primary call to action (`AC202`) |
+| `work` | app screens where people work: overview, canvas, detail, inbox item | the heading says what the screen is for (`AC205`) |
+| `list` | lists and tables: runs, projects, inbox | `AC205`, each item says what it is and how to open it (`AC207`) |
+| `settings` | settings, billing, tokens | `AC205`, each setting says what it changes and how it is saved (`AC208`) |
+| `form` | sign-up, sign-in, a form to fill in | `AC205`, how to send it and what happens next (`AC206`) |
+| `doc` | documentation, guides, terms | `AC201`, headings and short paragraphs (`AC209`) |
+
+Every type also gets `AC203` and `AC204`. Without `page` a step with the
+`seo` pack, or any step of a scenario allowed on production, is `landing`;
+everything else is `work`. Do not put `landing` on signed-in screens: "one
+primary call to action" is a marketing rule, and a work screen rightly offers
+several actions.
+
+A criterion that only makes sense on production (hreflang pairs pointing at
+the live domain, an embedded live demo, the production sitemap) carries
+`environments: [production]`. Walked anywhere else it is reported as not
+applicable to that environment (`not_evaluated` with `not_applicable:
+environment`) and does not make the step partial.
+
+When a scenario walks several locales, a text check (`text_matches`,
+`title_matches`, …) must match every language: write
+`pattern: "(Your data|Vaše data)"`. `kaloko validate` warns when a pattern
+reads in one language only (it looks for diacritics and common Czech or
+English words; one plain word such as a brand name is left alone).
+
 - `a11y` (`AC3xx`): images with alt, links and buttons with a name, labelled
   fields, heading levels not skipped, WCAG AA text contrast, a `main`
   landmark, unique ids (`AC301`–`AC307`, read from the page). After the

package/src/cli.mjs

@@ -6,7 +6,7 @@ import { AsyncLocalStorage } from 'node:async_hooks'
 import { availableParallelism } from 'node:os'
 import yaml from 'js-yaml'
 import { loadConfig, environment, urlFor, baseUrl, CONFIG_FILE, LEGACY_CONFIG_FILE } from './lib/config.mjs'
-import { loadScenario, validateScenario } from './lib/scenario.mjs'
+import { loadScenario, parseScenario, validateScenario, scenarioWarnings } from './lib/scenario.mjs'
 import { createRun, resolveRun, readCaptures, listRuns } from './lib/run.mjs'
 import { gitMeta, projectAndIssue, appVersion } from './lib/git.mjs'
 import { startBrowser, stopBrowser, connectBrowser, currentPage, launchEphemeral, consoleLog, allStates, resetSession, acquireWalkLock } from './lib/browser.mjs'
@@ -233,7 +233,7 @@ Results
   signoff --verify <file.json|file.pdf> [--key file|url] [--json]
                                     Check a record someone handed over (no token needed); exit 1 when it does not verify
   stability --pull [--scenario id] [--json]
-                                    Regions people drew on screenshots on kaloko.app (step detail → Page → Draw a
+                                    Regions people drew on screenshots on kaloko.app (step detail → Mark a changing
                                     region) go into the scenario's ignore: of their steps; walk them again after
   screens [words] [--project p] [--product p] [--module m] [--scenario id] [--locale l] [--viewport v] [--device d]
           [--status pass|partial|fail|skip] [--environment e] [--designs] [--all] [--json] [--cursor c]
@@ -987,10 +987,12 @@ const commands = {
     if (!args._.length) throw new UserError('Usage: kaloko validate <scenario.yml>...')
     let failed = 0
     for (const file of args._) {
-      const scenario = yaml.load(await readFile(file, 'utf8'))
+      let scenario
+      try { scenario = parseScenario(await readFile(file, 'utf8'), file) } catch (e) { if (!(e instanceof UserError)) throw e; failed++; say(`✕ ${e.message}`); continue }
       const problems = validateScenario(scenario)
       if (!problems.length) expandPacks(scenario)
       if (problems.length) { failed++; say(`✕ ${file}\n  - ${problems.join('\n  - ')}`) } else say(`✓ ${file}`)
+      if (!problems.length) for (const w of scenarioWarnings(scenario)) say(`  ! ${w}`)
       if (args.coverage) {
         // the plan is scenario.source (relative to the working directory or to the scenario file), or --source
         const candidates = typeof args.source === 'string' ? [resolve(args.source)] : scenario.source ? [resolve(scenario.source), resolve(file, '..', scenario.source), resolve(file, '..', '..', scenario.source)] : []
@@ -1223,7 +1225,7 @@ const commands = {
     const parallel = concurrency > 1 && locales.length > 1
     const scenarioDir = resolve(root, run.meta.scenario_file, '..')
     // semantic questions of every new capture start right away; the walk ends with the verdicts (--no-evaluate: skip)
-    const prefetch = args['no-evaluate'] ? null : semanticPrefetch({ scenario, config, root })
+    const prefetch = args['no-evaluate'] ? null : semanticPrefetch({ scenario, config, root, environment: env?.name || null })
     const walked = await readCaptures(run.dir)
     // recordings and traces (batch D, #12): opt-in recordings, traces unless turned off; encoded in an own headless Chrome
     const recSettings = recordSettings({ args, config, scenario })

package/src/lib/browser.mjs

@@ -138,10 +138,22 @@ export async function currentPage (context, match) {
   return real[real.length - 1] || pages[pages.length - 1] || context.newPage()
 }
 
+/**
+ * Launches a browser with a time limit and one more try: on a busy machine a browser now and then starts but never
+ * answers, and Playwright would wait for it forever. Playwright ends the process of a launch that timed out.
+ * KALOKO_LAUNCH_TIMEOUT (seconds, default 45) sets the limit.
+ */
+export async function launchWithRetry (browserType, options = {}) {
+  const timeout = (Number(process.env.KALOKO_LAUNCH_TIMEOUT) || 45) * 1000
+  try { return await browserType.launch({ timeout, ...options }) } catch (e) {
+    if (!/Timeout/i.test(String(e?.name) + String(e?.message))) throw e
+    return browserType.launch({ timeout, ...options })
+  }
+}
+
 export async function launchEphemeral (config) {
   const { chromium } = await import('playwright')
-  const browser = await chromium.launch({ headless: true, channel: config.browser.channel || undefined })
-  return browser
+  return launchWithRetry(chromium, { headless: true, channel: config.browser.channel || undefined })
 }
 
 /**

package/src/lib/build.mjs

@@ -4,7 +4,7 @@ import { existsSync } from 'node:fs'
 import { join, resolve } from 'node:path'
 import { readJson, writeJson } from './util.mjs'
 import { readCaptures, runPaths, listRuns } from './run.mjs'
-import { latestCaptures, evaluationSource, stepIdOf } from './evaluate.mjs'
+import { latestCaptures, evaluationSource, stepIdOf, appliesOn } from './evaluate.mjs'
 import { fieldsOf, DEFAULT_SEMANTIC_SAMPLE } from './stack.mjs'
 import { layout } from './scenario.mjs'
 import { assembleNode, summarize, statusOf, worst } from './manifest-core.mjs'
@@ -149,7 +149,10 @@ async function runMedia ({ run, entries }) {
 async function buildStack ({ run, node, base, captures, attachments }) {
   const paths = runPaths(run.dir)
   const fields = fieldsOf(node).map((f) => ({ id: f.id, label: f.label || f.id }))
-  const crit = (node.criteria || []).map((c) => ({ id: c.id, text: c.text, type: c.check.type, pack: c.pack || null }))
+  const environment = run.meta?.environment?.name || null
+  const crit = (node.criteria || []).map((c) => ({ id: c.id, text: c.text, type: c.check.type, pack: c.pack || null, ...(appliesOn(c, environment) ? {} : { not_applicable: 'environment' }) }))
+  // criteria limited to other environments do not decide the status of a page
+  const live = new Set(crit.filter((c) => !c.not_applicable).map((c) => c.id))
   const byItem = new Map()
   for (const c of captures.filter((x) => x.node === node.id && x.item)) {
     const cap = await readJson(join(run.dir, c.file))
@@ -165,10 +168,10 @@ async function buildStack ({ run, node, base, captures, attachments }) {
   const items = [...byItem.values()].sort((a, b) => a.order - b.order).map(({ order, ...it }) => {
     const per = Object.values(it.results)
     const verdictOf = (id) => worst(per.map((r) => r[id]?.[0]).filter(Boolean))
-    const verdicts = crit.map((c) => verdictOf(c.id)).filter((v) => v !== 'not_reached')
+    const verdicts = crit.filter((c) => live.has(c.id)).map((c) => verdictOf(c.id)).filter((v) => v !== 'not_reached')
     const status = statusOf(verdicts, per.length > 0)
-    const by_locale = Object.fromEntries(Object.keys(it.captures).map((l) => [l, statusOf(Object.entries(it.results).filter(([k]) => k.startsWith(`${l}|`)).flatMap(([, r]) => Object.values(r).map((x) => x[0])), true)]))
-    return { ...it, status, by_locale, fails: crit.filter((c) => verdictOf(c.id) === 'fail').map((c) => c.id), review: crit.filter((c) => ['needs_review', 'not_evaluated'].includes(verdictOf(c.id))).map((c) => c.id) }
+    const by_locale = Object.fromEntries(Object.keys(it.captures).map((l) => [l, statusOf(Object.entries(it.results).filter(([k]) => k.startsWith(`${l}|`)).flatMap(([, r]) => Object.entries(r).filter(([id]) => live.has(id)).map(([, x]) => x[0])), true)]))
+    return { ...it, status, by_locale, fails: crit.filter((c) => live.has(c.id) && verdictOf(c.id) === 'fail').map((c) => c.id), review: crit.filter((c) => live.has(c.id) && ['needs_review', 'not_evaluated'].includes(verdictOf(c.id))).map((c) => c.id) }
   })
   const summary = { pass: 0, partial: 0, fail: 0, skip: 0 }
   for (const it of items) summary[it.status]++

package/src/lib/changelog.mjs

@@ -361,14 +361,35 @@ export function docsConfigBlock ({ products = null, full = false } = {}) {
   return `${lines.join('\n')}\n`
 }
 
-/** Apps of a monorepo that look like products (apps/* with a package.json), for kaloko init. */
+/**
+ * Apps of a monorepo that look like products, for kaloko init: the folders of the workspaces (package.json
+ * `workspaces`, pnpm-workspace.yaml `packages`), apps/* and packages/*. A folder needs a package.json; outside apps/*
+ * it must also run as an app (a dev, start or serve script), so shared libraries and configs are left out. Only
+ * offered when there are at least two.
+ */
 export async function detectProducts (root) {
-  const out = []
-  for (const base of ['apps']) {
-    const names = await readdir(join(root, base)).catch(() => [])
-    for (const n of names.sort()) {
-      const pkg = await readJson(join(root, base, n, 'package.json'))
-      if (pkg) out.push({ slug: slugOf(n), name: pkg.name ? String(pkg.name).replace(/^@[^/]+\//, '') : n, dir: `${base}/${n}`, path: `${base}/${n}/package.json` })
+  const globs = new Set(['apps/*', 'packages/*'])
+  const rootPkg = await readJson(join(root, 'package.json'))
+  const ws = Array.isArray(rootPkg?.workspaces) ? rootPkg.workspaces : Array.isArray(rootPkg?.workspaces?.packages) ? rootPkg.workspaces.packages : []
+  for (const g of ws) globs.add(String(g))
+  const pnpm = await readFile(join(root, 'pnpm-workspace.yaml'), 'utf8').catch(() => '')
+  for (const m of pnpm.matchAll(/^\s*-\s*['"]?([^'"\n#]+?)['"]?\s*$/gm)) globs.add(m[1].trim())
+  const out = []; const seen = new Set()
+  for (const g of [...globs].sort()) {
+    if (g.startsWith('!')) continue
+    // "dir/*" (one level) or a plain folder; deeper patterns are left to the person
+    const m = g.replace(/\/+$/, '').match(/^([^*]+?)(\/\*)?$/)
+    if (!m) continue
+    const dirs = m[2] ? (await readdir(join(root, m[1])).catch(() => [])).sort().map((n) => `${m[1]}/${n}`) : [m[1]]
+    for (const dir of dirs) {
+      if (seen.has(dir)) continue
+      const pkg = await readJson(join(root, dir, 'package.json'))
+      if (!pkg) continue
+      const runs = ['dev', 'start', 'serve'].some((k) => pkg.scripts?.[k])
+      if (!dir.startsWith('apps/') && !runs) continue
+      seen.add(dir)
+      const n = basename(dir)
+      out.push({ slug: slugOf(n), name: pkg.name ? String(pkg.name).replace(/^@[^/]+\//, '') : n, dir, path: `${dir}/package.json` })
     }
   }
   return out.length > 1 ? out : []

package/src/lib/dimensions.mjs

@@ -8,6 +8,7 @@
 // `scope.variants` names the dimensions of each key; `scope.dimensions` lists the values for the canvas switchers.
 import { UserError } from './util.mjs'
 import { devicePreset, emulationOf, presetSummary, presetNames } from './devices.mjs'
+import { launchWithRetry } from './browser.mjs'
 
 export const BROWSERS = ['chromium', 'webkit', 'firefox']
 export const COLOR_SCHEMES = ['light', 'dark']
@@ -318,7 +319,7 @@ export async function launchEngine (engine, { channel, headless = true } = {}) {
   const type = pw[engine]
   if (!type) throw new UserError(`Unknown browser engine ${engine}. Use: ${BROWSERS.join(', ')}.`)
   try {
-    return await type.launch({ headless, ...(engine === 'chromium' && channel ? { channel } : {}) })
+    return await launchWithRetry(type, { headless, ...(engine === 'chromium' && channel ? { channel } : {}) })
   } catch (error) {
     if (/Executable doesn't exist|install/i.test(error.message)) throw new UserError(`${engine} is not installed for Playwright. Run: kaloko browser install --browsers ${engine}`)
     throw error

package/src/lib/docs-core.mjs

@@ -288,11 +288,12 @@ export const escapeHtml = esc
 
 /** Inline Markdown: code, bold, italics, links (safe schemes; `link(href)` may rewrite or drop them). Images are removed. */
 export function inlineHtml (s, { link = null } = {}) {
-  let out = esc(String(s).replace(/!\[[^\]]*\]\([^)]*\)/g, ''))
+  let out = esc(String(s).replace(/!\[[^[\]]*\]\([^()]*\)/g, ''))
   const codes = []
   out = out.replace(/`([^`]+)`/g, (_, c) => { codes.push(`<code>${c}</code>`); return `\u0000${codes.length - 1}\u0000` })
   out = out.replace(/\*\*([^*]+)\*\*/g, '<b>$1</b>').replace(/__([^_]+)__/g, '<b>$1</b>').replace(/(^|[\s(])_([^_]+)_(?=$|[\s).,;:!?])/g, '$1<i>$2</i>').replace(/(^|[\s(])\*([^*\s][^*]*)\*(?=$|[\s).,;:!?])/g, '$1<i>$2</i>')
-  out = out.replace(/\[([^\]]+)\]\(([^)\s]+)(?:\s+&quot;[^&]*&quot;)?\)/g, (_, t, href) => {
+  // no [ inside the brackets, at most one pair of ( ) in the target: a long run of [ stays linear
+  out = out.replace(/\[([^[\]]+)\]\(([^()[\]\s]+(?:\([^()\s]*\)[^()[\]\s]*)?)(?:\s+&quot;[^&]*&quot;)?\)/g, (_, t, href) => {
     const raw = href.replace(/&amp;/g, '&')
     const target = link ? link(raw) : raw
     if (target == null) return t
@@ -302,7 +303,7 @@ export function inlineHtml (s, { link = null } = {}) {
 }
 
 const LIST = /^(\s{0,3})([-*+]|\d{1,9}[.)])\s+(.*)$/
-const IMG = /!\[([^\]]*)\]\(([^)\s]+)(?:\s+"[^"]*")?\)/g
+const IMG = /!\[([^[\]]*)\]\(([^()[\]\s]+)(?:\s+"[^"]*")?\)/g
 
 /**
  * Markdown to HTML for docs: headings (with ids), paragraphs, lists (nested by indentation), fenced code,
@@ -361,16 +362,18 @@ function blocks (lines, o) {
       continue
     }
     if (/^\s{0,3}([-*_])(\s*\1){2,}\s*$/.test(l)) { flush(); out.push('<hr>'); i++; continue }
-    if (/^\s{0,3}>/.test(l)) {
+    // quotes nest at most 16 deep; deeper > are text (100 000 levels would overflow the stack)
+    if (/^\s{0,3}>/.test(l) && (o.quoteDepth || 0) < 16) {
       flush()
       const buf = []
       while (i < lines.length && /^\s{0,3}>/.test(lines[i])) buf.push(lines[i++].replace(/^\s{0,3}>\s?/, ''))
-      out.push(`<blockquote>${blocks(buf, { ...o, notice: null })}</blockquote>`)
+      out.push(`<blockquote>${blocks(buf, { ...o, notice: null, quoteDepth: (o.quoteDepth || 0) + 1 })}</blockquote>`)
       continue
     }
     if (/^\s*\|.*\|\s*$/.test(l) && i + 1 < lines.length && /^\s*\|?\s*:?-{2,}:?\s*(\|\s*:?-{2,}:?\s*)*\|?\s*$/.test(lines[i + 1])) {
       flush()
-      const row = (x) => x.trim().replace(/^\||\|$/g, '').split('|').map((c) => c.trim())
+      // GFM: `\|` is a pipe inside a cell (also inside code), not a column break
+      const row = (x) => x.trim().replace(/^\||(?<!\\)\|$/g, '').split(/(?<!\\)\|/).map((c) => c.trim().replace(/\\\|/g, '|'))
       const head = row(l); i += 2
       const rows = []
       while (i < lines.length && /^\s*\|.*\|\s*$/.test(lines[i])) rows.push(row(lines[i++]))

package/src/lib/docs.mjs

@@ -5,7 +5,7 @@
 import { readFile, readdir, writeFile, mkdir, mkdtemp, rm } from 'node:fs/promises'
 import { execFile } from 'node:child_process'
 import { promisify } from 'node:util'
-import { join, resolve, relative, dirname } from 'node:path'
+import { join, resolve, relative, dirname, sep, isAbsolute } from 'node:path'
 import { tmpdir } from 'node:os'
 import { UserError, sha256 } from './util.mjs'
 import { findStepRefs, cleanVersion } from './changelog-core.mjs'
@@ -210,7 +210,9 @@ export async function unpack (buf, dir) {
   for (const [name, read] of entries) {
     if (name.endsWith('/')) continue
     const target = resolve(dir, name)
-    if (!target.startsWith(resolve(dir) + '/')) throw new UserError(`The export holds a path outside its folder: ${name}`)
+    // relative() rather than a '/' prefix test, so the check also holds with Windows separators (a\..\..\x)
+    const rel = relative(resolve(dir), target)
+    if (!rel || rel === '..' || rel.startsWith(`..${sep}`) || isAbsolute(rel) || name.includes('\0')) throw new UserError(`The export holds a path outside its folder: ${name}`)
     await mkdir(dirname(target), { recursive: true })
     await writeFile(target, read())
     n++

package/src/lib/evaluate.mjs

@@ -17,6 +17,8 @@ export function latestCaptures (entries) {
 }
 
 export const criteriaHash = (node) => sha256(node.criteria || [])
+/** A criterion with `environments` (e.g. [production]) applies only there; without a known environment it applies. */
+export const appliesOn = (c, environment) => !environment || !Array.isArray(c.environments) || !c.environments.length || c.environments.includes(environment)
 /** Folder of a capture under steps/: the node, or steps/<node>/items/<item> for a page of a stack step. */
 export const stepIdOf = (e) => (e.item ? `${e.node}/items/${e.item}` : e.node)
 export const evaluationSource = (node, capture) => sha256({ capture, criteria: node.criteria || [], purpose: node.purpose || '' })
@@ -26,8 +28,9 @@ export const evaluationSource = (node, capture) => sha256({ capture, criteria: n
  * asked, the vision evaluator. Every semantic verdict with a score carries a one-sentence `reason`: the vision
  * model's own, or a sentence saying what the text evaluator read (it returns a probability only).
  */
-export function combine ({ node, capture, jev, vision = null, thresholds }) {
+export function combine ({ node, capture, jev, vision = null, thresholds, environment = null }) {
   return (node.criteria || []).map((c) => {
+    if (!appliesOn(c, environment)) return { id: c.id, type: c.check.type, verdict: 'not_evaluated', evidence: `Applies on ${c.environments.join(', ')} only; this walk ran on ${environment}.`, na: true, not_applicable: 'environment' }
     if (c.check.type === 'deterministic') {
       const r = capture.checks?.[c.id]
       const verdict = r == null || r.ok == null ? 'not_evaluated' : r.ok ? 'pass' : 'fail'
@@ -64,6 +67,8 @@ export async function evaluateRun ({ run, scenario, config, root, fetchImpl }) {
   const cacheDir = join(resolve(root, config.output), '.cache', 'jev')
   const nodes = new Map(scenario.nodes.map((n) => [n.id, n]))
   const paths = runPaths(run.dir)
+  // criteria limited to other environments (environments: [production]) are reported as not applicable here
+  const environment = run.meta?.environment?.name || null
   const report = { evaluated: 0, semantic_calls: 0, semantic_cached: 0, skipped: [], model: settings.model, drift: 0, outdated: new Set(), via: {}, hosted: null, hostedStop: null, findings: [] }
   // the vision evaluator (#17): flagged and uncertain criteria, a bounded number of calls per evaluation
   const vset = visionSettings(config)
@@ -101,7 +106,7 @@ export async function evaluateRun ({ run, scenario, config, root, fetchImpl }) {
       const current = capture.criteria_hash === criteriaHash(node)
       // console triage needs the evaluator only when the capture has console errors
       const outOfSample = entry.item && !sampled.get(entry.node)?.has(entry.item)
-      const semantic = outOfSample ? [] : (node.criteria || []).filter((c) => c.check.type === 'semantic' && !(c.check.about === 'console' && !(capture.console_errors || []).length))
+      const semantic = outOfSample ? [] : (node.criteria || []).filter((c) => c.check.type === 'semantic' && appliesOn(c, environment) && !(c.check.about === 'console' && !(capture.console_errors || []).length))
       // quick signals ride along on every captured page state (also steps without semantic criteria)
       const signals = settings.signals !== false && !outOfSample && !!capture.state
       // an imported screen without page text (#11) has nothing to ask about: a person decides on the canvas
@@ -126,7 +131,7 @@ export async function evaluateRun ({ run, scenario, config, root, fetchImpl }) {
       const source = evaluationSource(node, capture)
       if (drift && current && needsDrift(node)) { capture.checks = { ...capture.checks, ...await driftForCapture({ node, entry, capture, runDir: run.dir, ctx: drift }) }; report.drift++ }
       if (styleTokens?.tokens && current && tokenCriteria(node).length) capture.checks = { ...capture.checks, ...storedValueChecks(node, capture, { ...styleTokens, recorded: !!capture.rechecked_at, only: (c) => !!c.check.token && STYLE_ASSERTS.has(c.check.assert) }) }
-      let criteria = combine({ node, capture: current ? capture : {}, jev, vision: seen, thresholds: settings.thresholds })
+      let criteria = combine({ node, capture: current ? capture : {}, jev, vision: seen, thresholds: settings.thresholds, environment })
       // pages outside the semantic sample carry only the deterministic results
       if (outOfSample) criteria = criteria.filter((c) => c.type !== 'semantic' || c.evidence === 'no console errors')
       const evaluation = {
@@ -175,7 +180,7 @@ function signalsOf (jev) {
   return Object.keys(out).length ? out : null
 }
 
-export function semanticPrefetch ({ scenario, config, root }) {
+export function semanticPrefetch ({ scenario, config, root, environment = null }) {
   const settings = { ...DEFAULTS, ...(config.evaluators?.jev || {}), thresholds: { ...DEFAULTS.thresholds, ...(config.evaluators?.jev?.thresholds || {}) } }
   const cacheDir = join(resolve(root, config.output), '.cache', 'jev')
   const nodes = new Map(scenario.nodes.map((n) => [n.id, n]))
@@ -197,7 +202,7 @@ export function semanticPrefetch ({ scenario, config, root }) {
       for (const e of [].concat(entries || [])) {
         if (e?.type !== 'capture' || e.item) continue
         const node = nodes.get(e.node)
-        const semantic = (node?.criteria || []).filter((c) => c.check.type === 'semantic')
+        const semantic = (node?.criteria || []).filter((c) => c.check.type === 'semantic' && appliesOn(c, environment))
         if (!semantic.length && settings.signals === false) continue
         queue.push(async () => {
           const capture = await readJson(join(runDir, e.file))

package/src/lib/manifest-core.mjs

@@ -99,24 +99,29 @@ export function assembleNode ({ node, pos, locales, viewportNames, captures, att
       // semantic answers carry the thresholds they were judged by and where they were evaluated (own key or Kaloko)
       // semantic answers carry their one-sentence reason (#17) and whether the evaluator saw the screenshot
       const seen = r.provider && /-vision$/.test(r.provider)
-      loc[c.viewport] = { verdict: r.verdict, evidence: r.evidence, score, note: r.note ?? null, ...(r.na ? { na: true } : {}), ...(score != null && ev.thresholds ? { th: [ev.thresholds.fail, ev.thresholds.pass] } : {}), ...(r.type === 'semantic' && (seen ? ev.vision?.via : ev.semantic?.via) ? { via: seen ? ev.vision.via : ev.semantic.via } : {}), ...(r.reason ? { reason: r.reason, ...(r.reason_source === 'model' ? { reason_by: 'model' } : {}) } : {}), ...(seen ? { vision: true, ...(r.text_score != null ? { text_score: r.text_score } : {}) } : {}) }
+      loc[c.viewport] = { verdict: r.verdict, evidence: r.evidence, score, note: r.note ?? null, ...(r.na ? { na: true } : {}), ...(r.not_applicable ? { not_applicable: r.not_applicable } : {}), ...(score != null && ev.thresholds ? { th: [ev.thresholds.fail, ev.thresholds.pass] } : {}), ...(r.type === 'semantic' && (seen ? ev.vision?.via : ev.semantic?.via) ? { via: seen ? ev.vision.via : ev.semantic.via } : {}), ...(r.reason ? { reason: r.reason, ...(r.reason_source === 'model' ? { reason_by: 'model' } : {}) } : {}), ...(seen ? { vision: true, ...(r.text_score != null ? { text_score: r.text_score } : {}) } : {}) }
       if (r.evidence && (!agg.evidence || r.verdict !== 'pass')) agg.evidence = r.evidence
       if (r.reason && (!agg.reason || (r.verdict !== 'pass' && agg.reason_verdict === 'pass'))) { agg.reason = r.reason; agg.reason_verdict = r.verdict }
     }
   }
   const criteria = [...perCriterion.values()].map(({ reason_verdict: _rv, ...agg }) => {
     for (const l of applicable) for (const vp of viewportNames) ((agg.by_locale[l] ||= {})[vp] ||= { verdict: 'not_reached' })
-    const verdicts = counted(applicable.flatMap((l) => viewportNames.map((vp) => agg.by_locale[l][vp])))
-    return { ...agg, verdict: aggregate(verdicts) }
+    const entries = applicable.flatMap((l) => viewportNames.map((vp) => agg.by_locale[l][vp]))
+    const verdicts = counted(entries)
+    // a criterion limited to other environments (environments: [production]) is not applicable on this walk:
+    // reported as such, and it does not make the step partial
+    const offEnv = entries.some((e) => e.not_applicable) && entries.every((e) => e.not_applicable || e.verdict === 'not_reached')
+    return { ...agg, verdict: aggregate(verdicts), ...(offEnv ? { not_applicable: 'environment' } : {}) }
   })
+  const counting = criteria.filter((c) => !c.not_applicable)
   const byLocale = {}
   for (const l of locales) {
     const captured = !!capturesOut[l]
-    const vs = criteria.map((c) => aggregate(counted(Object.values(c.by_locale[l] || {}))))
+    const vs = counting.map((c) => aggregate(counted(Object.values(c.by_locale[l] || {}))))
     if (applicable.includes(l) && viewportNames.some((vp) => !capturesOut[l]?.[vp])) vs.push('not_reached')
     byLocale[l] = statusOf(vs, captured)
   }
-  const verdicts = criteria.map((c) => c.verdict)
+  const verdicts = counting.map((c) => c.verdict)
   if (applicable.some((l) => viewportNames.some((vp) => !capturesOut[l]?.[vp]))) verdicts.push('not_reached')
   return {
     ...base,
@@ -137,7 +142,7 @@ export function summarize (nodes, sessions = null) {
   const screens = nodes.filter((n) => n.kind !== 'decision')
   const summary = { pass: 0, partial: 0, fail: 0, skip: 0, criteria: {} }
   for (const n of screens) summary[n.status]++
-  for (const n of screens) for (const c of n.criteria) summary.criteria[c.verdict] = (summary.criteria[c.verdict] || 0) + 1
+  for (const n of screens) for (const c of n.criteria) if (!c.not_applicable) summary.criteria[c.verdict] = (summary.criteria[c.verdict] || 0) + 1
   if (sessions) {
     summary.by_session = {}
     for (const key of Object.keys(sessions)) summary.by_session[key] = { pass: 0, partial: 0, fail: 0, skip: 0 }

package/src/lib/pack-help.mjs

@@ -18,6 +18,11 @@ export const PACK_HELP = {
   AC202: { cs: 'Jedna jasná hlavní akce', why: ['Several equally loud buttons make people hesitate; none leaves them without a next step.', 'Několik stejně výrazných tlačítek lidi zdrží; žádné je nechá bez dalšího kroku.'], fix: ['Give one action the primary style; make the others secondary or links.', 'Jedné akci dejte hlavní styl, ostatní udělejte vedlejší nebo jako odkazy.'] },
   AC203: { cs: 'Formulářová pole mají viditelný popisek', why: ['A placeholder disappears as people type; they forget what the field was.', 'Placeholder při psaní zmizí a lidé zapomenou, co do pole patří.'], fix: ['Add a <label for="…"> (or aria-label) to every visible input.', 'Ke každému viditelnému poli doplňte <label for="…"> (nebo aria-label).'] },
   AC204: { cs: 'Odkazy a tlačítka říkají, co udělají', why: ['"Click here" or "More" does not say where it leads, especially out of context or to a screen reader.', '„Klikněte zde“ nebo „Více“ neřekne, kam vede, zvlášť mimo kontext nebo ve čtečce.'], fix: ['Name the result: "Download the price list", "Continue to payment".', 'Pojmenujte výsledek: „Stáhnout ceník“, „Pokračovat k platbě“.'] },
+  AC205: { cs: 'Z nadpisu je jasné, k čemu obrazovka je', why: ['People switch between screens all day; a vague heading makes them check where they are.', 'Lidé mezi obrazovkami přepínají celý den; s mlhavým nadpisem musí hledat, kde vlastně jsou.'], fix: ['Name the screen after what it shows or does: "Runs of the checkout flow", not "Dashboard".', 'Pojmenujte obrazovku podle toho, co ukazuje nebo dělá: „Běhy flow pokladny“, ne „Nástěnka“.'] },
+  AC206: { cs: 'Je jasné, jak formulář odeslat a co bude dál', why: ['When the send button or the next step is unclear, people submit twice or give up.', 'Když není jasné odesílací tlačítko nebo další krok, lidé odešlou dvakrát nebo to vzdají.'], fix: ['Label the button with the result ("Send the link") and say in one sentence what happens next.', 'Tlačítko pojmenujte podle výsledku („Poslat odkaz“) a jednou větou řekněte, co bude dál.'] },
+  AC207: { cs: 'Každá položka seznamu říká, co je zač a jak ji otevřít', why: ['A row with only an id or a date makes people open items one by one to find the right one.', 'Řádek jen s identifikátorem nebo datem nutí lidi otevírat položky jednu po druhé.'], fix: ['Show a name and a state in every row and make the name the link.', 'V každém řádku ukažte název a stav a z názvu udělejte odkaz.'] },
+  AC208: { cs: 'Každé nastavení říká, co změní a jak se uloží', why: ['People leave settings unsure whether the change took effect.', 'Lidé odcházejí z nastavení a nevědí, jestli se změna projevila.'], fix: ['Add a short hint under each setting and either a save button or a visible "Saved".', 'Pod každé nastavení přidejte krátkou nápovědu a buď tlačítko Uložit, nebo viditelné „Uloženo“.'] },
+  AC209: { cs: 'Text jde rychle projít: nadpisy a krátké odstavce', why: ['Readers of documentation scan for their question; a wall of text hides the answer.', 'Čtenář dokumentace hledá svou otázku očima; souvislý text odpověď schová.'], fix: ['Split the text under headings that name the question and keep paragraphs to a few sentences.', 'Rozdělte text pod nadpisy, které pojmenují otázku, a odstavce držte na pár větách.'] },
   AC301: { cs: 'Obrázky mají alternativní text', why: ['Without alt text, blind visitors and search engines do not know what an image shows.', 'Bez alt textu nevidomí ani vyhledávače nevědí, co obrázek ukazuje.'], fix: ['Add alt="…" describing the image; decorative images get alt="".', 'Doplňte alt="…" s popisem obrázku; dekorativní obrázky dostanou alt="".'] },
   AC302: { cs: 'Odkazy a tlačítka mají přístupný název', why: ['An icon button without a name is read as just "button".', 'Tlačítko s ikonou bez názvu čtečka přečte jen jako „tlačítko“.'], fix: ['Add visible text or aria-label to icon-only links and buttons.', 'Odkazům a tlačítkům jen s ikonou doplňte text nebo aria-label.'] },
   AC303: { cs: 'Formulářová pole mají popisky', why: ['Screen reader users hear only "edit text" for a field without a label.', 'Uživatel čtečky uslyší u pole bez popisku jen „editační pole“.'], fix: ['Connect a <label> to each field (for/id) or use aria-label / aria-labelledby.', 'Ke každému poli připojte <label> (for/id) nebo použijte aria-label / aria-labelledby.'] },

package/src/lib/packs.mjs

@@ -33,13 +33,23 @@ export const PACKS = {
   },
   usability: {
     base: 200,
-    title: 'Usability: purpose, primary action, forms, feedback',
-    criteria: () => [
-      { id: 'AC201', text: 'The purpose of the page is clear within the first screen', check: { type: 'semantic', question: 'Is the purpose of this page clear from its heading and first paragraph alone?', scope: 'main, body' } },
-      { id: 'AC202', text: 'One clear primary action', check: { type: 'semantic', question: 'Is there exactly one clearly primary call to action on the page?', scope: 'main, body' } },
-      { id: 'AC203', text: 'Form fields have visible labels', check: det('count', { selector: 'input:not([type=hidden]):not([type=submit]):not([aria-label]):not([id])', min: 0, max: 0 }) },
-      { id: 'AC204', text: 'Links and buttons say what they do', check: { type: 'semantic', question: 'Do the link and button texts describe what happens when they are used, rather than generic words like "click here"?', scope: 'main, body' } }
-    ]
+    title: 'Usability by page type (`page` on the step or scenario): purpose, a primary action on landing pages, forms, lists, settings, link texts',
+    criteria: ({ page = 'landing' } = {}) => {
+      const sem = (question) => ({ type: 'semantic', question, scope: 'main, body' })
+      const on = (...types) => types.includes(page)
+      return [
+        ...(on('landing', 'doc') ? [{ id: 'AC201', text: 'The purpose of the page is clear within the first screen', check: sem('Is the purpose of this page clear from its heading and first paragraph alone?') }] : []),
+        ...(on('work', 'list', 'settings', 'form') ? [{ id: 'AC205', text: 'The heading says what the screen is for', check: sem('Is it clear from the heading and the content of this screen what it is for?') }] : []),
+        // one loud call to action is a landing-page rule; work screens, lists and settings rightly offer several actions
+        ...(on('landing') ? [{ id: 'AC202', text: 'One clear primary action', check: sem('Is there exactly one clearly primary call to action on the page?') }] : []),
+        ...(on('form') ? [{ id: 'AC206', text: 'It is clear how to send the form and what happens next', check: sem('Is it clear which button sends the form and what happens after it is sent?') }] : []),
+        ...(on('list') ? [{ id: 'AC207', text: 'Each item in the list says what it is and how to open it', check: sem('Does each item in the list show what it is (for example a name and its state) and how to open it?') }] : []),
+        ...(on('settings') ? [{ id: 'AC208', text: 'Each setting says what it changes and how it is saved', check: sem('Does each setting say what it changes, and is it clear whether a change is saved by itself or with a button?') }] : []),
+        ...(on('doc') ? [{ id: 'AC209', text: 'The text can be scanned: headings and short paragraphs', check: sem('Is the text split into headings and short paragraphs that a reader can scan?') }] : []),
+        { id: 'AC203', text: 'Form fields have visible labels', check: det('count', { selector: 'input:not([type=hidden]):not([type=submit]):not([aria-label]):not([id])', min: 0, max: 0 }) },
+        { id: 'AC204', text: 'Links and buttons say what they do', check: sem('Do the link and button texts describe what happens when they are used, rather than generic words like "click here"?') }
+      ]
+    }
   },
   a11y: {
     base: 300,
@@ -103,6 +113,20 @@ export const PACKS = {
   }
 }
 
+/** Page types a step (or the whole scenario) declares with `page`; the usability pack asks per type. */
+export const PAGE_TYPES = ['landing', 'work', 'list', 'settings', 'form', 'doc']
+
+/**
+ * The page type of a node: its own `page`, then the scenario's `page`, else inferred. A step with the seo pack or a
+ * scenario allowed on production is a public page (landing); anything else is an app screen (work).
+ */
+export function pageTypeOf (node, scenario = {}) {
+  if (node?.page) return node.page
+  if (scenario?.page) return scenario.page
+  if ((node?.packs || []).includes('seo') || (scenario?.environments || []).includes('production')) return 'landing'
+  return 'work'
+}
+
 /**
  * Adds the criteria of each pack listed on a node (`node.packs`) that the node does not already define.
  * Mutates and returns the scenario; safe to call twice.
@@ -117,7 +141,7 @@ export function expandPacks (scenario) {
     for (const name of node.packs) {
       const pack = PACKS[name]
       if (!pack) throw new Error(`node "${node.id}": unknown pack "${name}" (known: ${Object.keys(PACKS).join(', ')})`)
-      for (const c of pack.criteria({ locales })) {
+      for (const c of pack.criteria({ locales, page: pageTypeOf(node, scenario) })) {
         if (have.has(c.id)) continue
         node.criteria.push({ ...c, pack: name })
         have.add(c.id)

package/src/lib/scenario.mjs

@@ -5,8 +5,31 @@ import { UserError } from './util.mjs'
 import { expandPacks } from './packs.mjs'
 import { jsGuard } from './assertions.mjs'
 
+// a scenario holds thousands of values, not millions: aliases (&a, *a) can expand a few kilobytes of YAML into
+// billions that validation and its JSON copy would walk ("billion laughs"), so the expanded size has a ceiling
+const MAX_VALUES = 1_000_000
+const MAX_DEPTH = 64
+
+/** The data of a scenario's YAML text; a UserError when it is no YAML or expands beyond MAX_VALUES or MAX_DEPTH. */
+export function parseScenario (text, file = 'scenario') {
+  let data
+  try { data = yaml.load(text) } catch (e) { throw new UserError(`Scenario ${file} is not valid YAML: ${String(e?.message || e).split('\n')[0]}`) }
+  let n = 0
+  const stack = [[data, 0]]
+  while (stack.length) {
+    const [v, depth] = stack.pop()
+    if (!v || typeof v !== 'object') continue
+    if (depth >= MAX_DEPTH) throw new UserError(`Scenario ${file} is nested deeper than ${MAX_DEPTH} levels.`)
+    const kids = Object.values(v)
+    // counted before they are pushed, so a shared alias cannot grow the stack past the ceiling either
+    if ((n += kids.length) > MAX_VALUES) throw new UserError(`Scenario ${file} expands to more than ${MAX_VALUES} values (YAML aliases?).`)
+    for (const k of kids) stack.push([k, depth + 1])
+  }
+  return data
+}
+
 export async function loadScenario (file) {
-  const data = yaml.load(await readFile(file, 'utf8'))
+  const data = parseScenario(await readFile(file, 'utf8'), file)
   const problems = validateScenario(data)
   if (!problems.length) expandPacks(data)
   if (problems.length) throw new UserError(`Scenario ${file} is invalid:\n  - ${problems.join('\n  - ')}`)
@@ -54,6 +77,45 @@ export function validateScenario (data) {
   return problems
 }
 
+const TEXT_ASSERTS = new Set(['text_matches', 'text_absent', 'title_matches', 'meta_matches'])
+const ACCENTED = /[áčďéěíňóřšťúůýžäöüßąćęłńśźżàâçèêëîïôûùÿœñ]/i
+const EN_WORDS = new Set(['the', 'and', 'of', 'to', 'in', 'for', 'with', 'your', 'you', 'is', 'are', 'on', 'by', 'or', 'not', 'no', 'an', 'this', 'what', 'how'])
+const CS_WORDS = new Set(['a', 'i', 'v', 've', 'na', 'do', 'se', 'je', 'jsou', 'pro', 's', 'z', 'k', 'od', 'po', 'jak', 'co', 'nebo', 'ani', 'už', 'vaše', 'váš'])
+
+/** Language of one alternative of a text pattern: 'other' (diacritics or a Czech word), 'en' (an English word) or null. */
+function branchLanguage (branch) {
+  const text = branch.replace(/\\./g, ' ').replace(/\[[^\]]*\]/g, ' ')
+  if (ACCENTED.test(text)) return 'other'
+  const words = (text.match(/\p{L}+/gu) || []).map((w) => w.toLowerCase())
+  if (words.some((w) => CS_WORDS.has(w) && w.length > 1)) return 'other'
+  if (words.some((w) => EN_WORDS.has(w))) return 'en'
+  return null
+}
+
+/**
+ * Warnings that do not make a scenario invalid. A text criterion in a scenario with several locales whose pattern
+ * reads in one language only fails (or passes by accident) in the others. The heuristic is deliberately simple:
+ * the pattern is split at `|` and each alternative gets a language: a letter with a diacritic or a common Czech
+ * word means not English, a common English word ("the", "and", "your") means English, anything else (a brand,
+ * one plain word, "SOC 2") is unknown. It warns only when every alternative has a language and they all agree, so
+ * "Plans and payment" or "Vaše data" warn and "Your data|Vaše data", "Slack" or "Design drafts" do not.
+ * Pack criteria are left out.
+ */
+export function scenarioWarnings (data) {
+  const out = []
+  if (!data || (data.locales || []).length < 2 || !Array.isArray(data.nodes)) return out
+  for (const node of data.nodes) {
+    for (const c of node.criteria || []) {
+      const k = c.check || {}
+      if (c.pack || k.type !== 'deterministic' || !TEXT_ASSERTS.has(k.assert) || typeof k.pattern !== 'string') continue
+      const langs = k.pattern.split('|').map(branchLanguage)
+      if (langs.some((l) => !l) || new Set(langs).size !== 1) continue
+      out.push(`node "${node.id}": ${c.id} pattern /${k.pattern}/ reads in one language only, but the scenario walks ${data.locales.join(', ')}; add the other language as an alternative (English|Czech) or move the check to a per-locale step`)
+    }
+  }
+  return out
+}
+
 /**
  * Layered layout: column = longest path from a root, lane = explicit `lane`
  * or inherited from the parent (+1 for each extra `alt` branch).

package/src/lib/stability.mjs

@@ -292,7 +292,7 @@ export async function pullDrawn ({ root, config, run, args, say, client }) {
   const scenarioId = typeof args.scenario === 'string' ? args.scenario : run.meta.scenario.id
   const data = await client.request('GET', `/orgs/${config.org}/scenarios/${encodeURIComponent(scenarioId)}/ignore-regions`)
   const regions = data.regions || []
-  if (!regions.length) { say(`No drawn regions wait for ${scenarioId}. Draw them on a screenshot on kaloko.app (step detail → Page → Draw a region).`); return { applied: [], skipped: [], regions: [] } }
+  if (!regions.length) { say(`No drawn regions wait for ${scenarioId}. Draw them on a screenshot on kaloko.app (step detail → Mark a changing region).`); return { applied: [], skipped: [], regions: [] } }
   const byNode = new Map()
   for (const r of regions) (byNode.get(r.node_id) || byNode.set(r.node_id, []).get(r.node_id)).push(r.scenario_entry)
   const file = resolve(root, run.meta.scenario_file)

package/src/lib/unzip.mjs

@@ -2,30 +2,48 @@
 // deflated entries from the central directory. No ZIP64; entries are read when asked for.
 import { inflateRawSync } from 'node:zlib'
 
+// a zip comes from someone else (a trace, a downloaded export): an entry inflates to at most what the central directory
+// declares, the declarations have a ceiling, and entries may not share their data (overlapping entries multiply a small
+// deflate stream, the "non-recursive zip bomb")
+export const MAX_ENTRY_BYTES = 1024 * 1024 * 1024
+export const MAX_TOTAL_BYTES = 4 * 1024 * 1024 * 1024
+
 /** Entries of a zip archive: Map name → () => Buffer. */
 export function readZip (buf) {
   let eocd = -1
   for (let i = buf.length - 22; i >= Math.max(0, buf.length - 65557); i--) if (buf.readUInt32LE(i) === 0x06054b50) { eocd = i; break }
   if (eocd < 0) throw new Error('not a zip archive (no end of central directory)')
+  const broken = (why) => new Error(`broken zip archive: ${why}`)
   const count = buf.readUInt16LE(eocd + 10)
   let at = buf.readUInt32LE(eocd + 16)
   const out = new Map()
+  const spans = []
+  let total = 0
   for (let n = 0; n < count; n++) {
-    if (buf.readUInt32LE(at) !== 0x02014b50) throw new Error('broken zip central directory')
+    if (at + 46 > eocd || buf.readUInt32LE(at) !== 0x02014b50) throw new Error('broken zip central directory')
     const method = buf.readUInt16LE(at + 10)
     const size = buf.readUInt32LE(at + 20)
+    const declared = buf.readUInt32LE(at + 24)
     const nameLen = buf.readUInt16LE(at + 28); const extraLen = buf.readUInt16LE(at + 30); const commentLen = buf.readUInt16LE(at + 32)
     const local = buf.readUInt32LE(at + 42)
+    if (at + 46 + nameLen > eocd) throw broken('a name runs past the central directory')
     const name = buf.subarray(at + 46, at + 46 + nameLen).toString('utf8')
     at += 46 + nameLen + extraLen + commentLen
     if (name.endsWith('/')) continue
+    if (local + 30 > buf.length || buf.readUInt32LE(local) !== 0x04034b50) throw broken(`${name} has no local header`)
+    const start = local + 30 + buf.readUInt16LE(local + 26) + buf.readUInt16LE(local + 28)
+    if (start + size > buf.length) throw broken(`${name} runs past the end`)
+    if (declared > MAX_ENTRY_BYTES || (total += declared) > MAX_TOTAL_BYTES) throw broken(`${name} would inflate beyond the size we accept`)
+    spans.push([start, start + size, name])
     out.set(name, () => {
-      const start = local + 30 + buf.readUInt16LE(local + 26) + buf.readUInt16LE(local + 28)
       const data = buf.subarray(start, start + size)
-      if (method === 0) return Buffer.from(data)
-      if (method === 8) return inflateRawSync(data)
+      if (method === 0) { if (size !== declared) throw broken(`${name}: stored size differs from its declared size`); return Buffer.from(data) }
+      // inflating stops at the declared size: an entry that claims little and inflates to more is refused
+      if (method === 8) { try { return inflateRawSync(data, { maxOutputLength: Math.max(1, declared) }) } catch (e) { throw broken(`${name}: ${e.code === 'ERR_BUFFER_TOO_LARGE' ? 'inflates beyond its declared size' : 'cannot be inflated'}`) } }
       throw new Error(`${name}: unsupported compression method ${method}`)
     })
   }
+  spans.sort((a, b) => a[0] - b[0])
+  for (let k = 1; k < spans.length; k++) if (spans[k][0] < spans[k - 1][1]) throw broken(`${spans[k][2]} overlaps ${spans[k - 1][2]}`)
   return out
 }

package/templates/scenario.yml

@@ -30,6 +30,7 @@ nodes:
     title: Landing page
     path: /
     purpose: A visitor understands the offer and can start the flow.
+    page: landing              # landing | work | list | settings | form | doc: the usability questions fit the type
     # packs: [seo, usability]   # adds the SEO basics (AC101…) and usability questions (AC201…) to this step
     execution:
       strategy: playwright   # playwright | agent | manual

package/viewer/index.html

@@ -294,6 +294,7 @@ table.runs{border-collapse:collapse;width:100%;font-size:12.5px}
 }
 
 .toast{position:fixed;left:50%;bottom:22px;transform:translateX(-50%);background:var(--ink);color:var(--panel);padding:8px 14px;border-radius:999px;font-size:13px;z-index:30;box-shadow:var(--shadow)}
+.sess-lost{position:fixed;left:50%;top:16px;transform:translateX(-50%);z-index:60;display:flex;flex-wrap:wrap;gap:8px 12px;align-items:center;background:var(--panel);color:var(--ink);border:1px solid var(--fail);border-radius:10px;padding:10px 14px;font-size:13px;box-shadow:var(--shadow);width:max-content;max-width:calc(100vw - 32px)}
 
 @media (max-width:1100px){
   .main{grid-template-columns:minmax(0,1fr)}
@@ -1099,6 +1100,11 @@ Object.assign(I18N.cs, { dim_browser:'Prohlížeč', dim_color_scheme:'Barevné
 Object.assign(I18N.en, { dim_browser:'Browser', dim_color_scheme:'Colour scheme', dim_reduced_motion:'Motion', dim_forced_colors:'Forced colours', dim_display_mode:'Display mode', frame:'Frame', frameTitle:'Show the capture in the device frame', safeAreas:'Safe areas', safeTitle:'Show the notch, the home indicator and where the first screen ends', safeArea:'Safe area: keep content out of it', firstScreenEnd:'end of the first screen', altCompare:'Beside:', pickSearch:'Search…', pickNone:'Nothing matches.', pickFailing:'How many values have failing steps', keyLoc:'L picks the locale, [ and ] move to the previous and next' });
 Object.assign(I18N.cs, { devMode:'Dev mode', devTab:'Dev', devTitle:'Míry, tokeny a stavy prvků pro vývoj', devTabEl:'Prvek', devTabTokens:'Tokeny', devEmpty:'Najeďte myší na prvek v náhledu a klikněte na něj. Shift + šipky procházejí strom prvků, se stisknutým Alt uvidíte vzdálenosti k dalšímu prvku.', devStart:'Vybrat hlavní obsah', devNavLabel:'Procházet prvky', navParent:'Rodič', navChild:'Potomek', navPrev:'Předchozí', navNext:'Další', g_type:'Typografie', g_color:'Barvy', g_space:'Mezery', g_size:'Rozměry', g_shape:'Tvar', g_layout:'Rozložení', notToken:'není token', nearest:'nejbližší', typedRaw:'Hodnota je v CSS napsaná natvrdo, i když token existuje; použijte proměnnou.', typedRawShort:'natvrdo', copyTokenPath:'Kopírovat cestu tokenu', contrast:'Kontrast', aaPass:'splňuje AA', aaFail:'nesplňuje AA', aaNeed:'potřeba', largeText:'velký text', contrastApprox:'Pod textem je obrázek, kontrast je přibližný.', states:'Stavy', stDefault:'výchozí', stNone:'Styly stránky pro tento prvek žádné stavy nedefinují.', changedInState:'Zvýrazněné hodnoty se v tomto stavu mění.', distances:'Vzdálenosti', toParent:'K rodiči', toTarget:'K prvku', measure:'Měřit', measureHint:'Podržte Alt a najeďte na jiný prvek, nebo zapněte Měřit a klepněte na něj.', assets:'Obrázky a ikony', download:'Stáhnout', assetFail:'Soubor se nepodařilo stáhnout.', copyCssVars:'Kopírovat CSS s proměnnými', copyTokens:'Kopírovat tokeny (JSON)', copyPrompt:'Kopírovat pokyn pro agenta', copyLine:'Kopírovat pokyn k této hodnotě', pinFromDev:'Komentovat tento prvek', tokUsed:'Použité na tomto kroku', tokOff:'Hodnoty mimo sadu tokenů', tokHard:'V CSS natvrdo místo tokenu', tokUnused:'Nepoužité', tokNone:'Krok nemá sadu tokenů (tokens.json).', tokHlN:'Zvýrazněno prvků:', tokHint:'Klikněte na token a náhled zvýrazní prvky, které ho používají.', devShotNote:'Míry a tokeny jsou ze snímku, jak ho zachytilo CLI; stavy a stahování obrázků potřebují živou stránku.', devNoSpec:'Tento snímek nemá spec. Projděte krok znovu aktuálním CLI (kaloko walk).', devLocalLive:'Ze souboru na disku čte Dev mode snímek; živou stránku měří na kaloko.app.', devAgentHint:'Totéž dostane agent: kaloko spec %N nebo MCP get_step_spec.', devLoading:'Načítám…', keyDev:'Dev mode v detailu kroku: míry, tokeny a stavy prvků (M měří, Shift + šipky procházejí prvky)', promptHead:'Postavte %E podle schváleného návrhu v Kaloku (krok %S).', promptUse:'Pro %W použijte token %T.', promptOff:'%P %V není token; nejbližší je %T. Pevnou hodnotu použijte jen po domluvě s designérem.', promptOffNone:'%P %V není token.', promptSpec:'Spec celého kroku: kaloko spec %N' });
 Object.assign(I18N.en, { devMode:'Dev mode', devTab:'Dev', devTitle:'Measurements, tokens and states of elements for development', devTabEl:'Element', devTabTokens:'Tokens', devEmpty:'Hover an element in the preview and click it. Shift + arrows move through the element tree; hold Alt to see the distances to another element.', devStart:'Select the main content', devNavLabel:'Move through elements', navParent:'Parent', navChild:'Child', navPrev:'Previous', navNext:'Next', g_type:'Typography', g_color:'Colors', g_space:'Spacing', g_size:'Size', g_shape:'Shape', g_layout:'Layout', notToken:'not a token', nearest:'nearest', typedRaw:'The CSS has this value typed raw although a token exists; use the custom property.', typedRawShort:'typed raw', copyTokenPath:'Copy the token path', contrast:'Contrast', aaPass:'passes AA', aaFail:'fails AA', aaNeed:'needs', largeText:'large text', contrastApprox:'There is an image behind the text; the contrast is approximate.', states:'States', stDefault:'default', stNone:'The page styles define no states for this element.', changedInState:'Highlighted values change in this state.', distances:'Distances', toParent:'To the parent', toTarget:'To', measure:'Measure', measureHint:'Hold Alt and hover another element, or turn on Measure and tap it.', assets:'Images and icons', download:'Download', assetFail:'The file could not be downloaded.', copyCssVars:'Copy CSS with variables', copyTokens:'Copy tokens (JSON)', copyPrompt:'Copy prompt for an agent', copyLine:'Copy the prompt line for this value', pinFromDev:'Comment on this element', tokUsed:'Used on this step', tokOff:'Values outside the token set', tokHard:'Typed raw in the CSS instead of a token', tokUnused:'Not used', tokNone:'This step has no token set (tokens.json).', tokHlN:'Elements highlighted:', tokHint:'Click a token to highlight the elements that use it.', devShotNote:'Measurements and tokens come from the screenshot as the CLI captured it; states and image downloads need the live page.', devNoSpec:'This capture has no spec. Walk the step again with the current CLI (kaloko walk).', devLocalLive:'From disk, Dev mode reads the screenshot; the live page is measured on kaloko.app.', devAgentHint:'An agent gets the same: kaloko spec %N or MCP get_step_spec.', devLoading:'Loading…', keyDev:'Dev mode in the step detail: measurements, tokens and states of elements (M measures, Shift + arrows move through elements)', promptHead:'Build %E as approved in Kaloko (step %S).', promptUse:'Use token %T for the %W.', promptOff:'%P %V is not a token; the nearest is %T. Use the raw value only if the designer agrees.', promptOffNone:'%P %V is not a token.', promptSpec:'Spec of the whole step: kaloko spec %N' });
+Object.assign(I18N.cs, { sessionLost:'Přihlášení vypršelo. Přihlaste se znovu, rozepsaný text tu na vás počká.', signInAgain:'Přihlásit se znovu' });
+Object.assign(I18N.en, { sessionLost:'Your session has expired. Sign in again; what you were writing waits here.', signInAgain:'Sign in again' });
+// back after signing in again: the session expired on the canvas (sessionLost), the server kept the path, but the
+// sign-in mail cannot carry the fragment (the open step, the comments), so the canvas stored it for this moment
+(() => { try { const r = JSON.parse(localStorage.getItem('qawalk-return') || 'null'); if (!r) return; localStorage.removeItem('qawalk-return'); if (r.path === location.pathname && r.hash && !location.hash && Date.now() - r.at < 864e5) history.replaceState(null, '', location.pathname + location.search + r.hash); } catch {} })();
 const storedLang = (() => { try { return localStorage.getItem('qawalk.lang'); } catch { return null; } })();
 // #lang=cs|en in a link forces the language of the canvas for that page (a shared link, a walk in another locale):
 // it wins over the account, the cookie and the browser, and stays in the address while the canvas rewrites it
@@ -1357,7 +1363,7 @@ const sessColor = (key) => SESSION_COLORS[Math.max(0, sessions().indexOf(key)) %
 const sessTitle = (key) => key ? loc(RUN.sessions?.[key]?.title) || key : '';
 const sessChip = (key) => key && RUN.sessions?.[key] ? `<span class="sess" style="--sc:${sessColor(key)}" title="${esc(key)}"><i></i>${esc(sessTitle(key))}</span>` : '';
 const nodeSt = (n) => { const status = n.by_locale?.[S.loc] || n.status; return ['pass', 'partial', 'fail', 'skip'].includes(status) ? status : 'skip'; };
-const critVerdict = (c, l = S.loc) => { if (c.counts) return c.verdict || 'not_reached'; const vs = viewports().map((v) => c.by_locale?.[l]?.[v.name]?.verdict || 'not_reached'); return vs.every((v) => v === 'not_reached') ? 'not_reached' : worst(vs.map((v) => v === 'not_reached' ? 'not_evaluated' : v)); };
+const critVerdict = (c, l = S.loc) => { if (c.not_applicable) return 'not_reached'; if (c.counts) return c.verdict || 'not_reached'; const vs = viewports().map((v) => c.by_locale?.[l]?.[v.name]?.verdict || 'not_reached'); return vs.every((v) => v === 'not_reached') ? 'not_reached' : worst(vs.map((v) => v === 'not_reached' ? 'not_evaluated' : v)); };
 const critSt = (c) => VSTAT[critVerdict(c)];
 const prevRun = () => (RUN.history || []).find((h) => h.started_at < RUN.started_at);
 const fmtDate = (iso) => { if (!iso) return ''; const d = new Date(iso); return `${d.getDate()}. ${d.getMonth() + 1}. ${d.getFullYear()} ${String(d.getHours()).padStart(2, '0')}:${String(d.getMinutes()).padStart(2, '0')}`; };
@@ -1426,6 +1432,7 @@ function commentsBase (scope) {
 }
 async function cApi (scope, path, method, body) {
   const res = await fetch(commentsBase(scope) + path, { method, credentials: 'same-origin', headers: body ? { 'Content-Type': 'application/json' } : {}, body: body ? JSON.stringify({ ...body, ...(isDraft() ? { branch: RUN.draft.branch } : {}) }) : undefined });
+  if (res.status === 401) throw sessionLost();
   const data = await res.json().catch(() => ({}));
   if (!res.ok) throw new Error(data.error || `HTTP ${res.status}`);
   return data;
@@ -1452,6 +1459,8 @@ function rerenderComments (all = false) {
 const draftKey = (scope, nodeId, sub) => `qawalk-draft|${APP()?.org || 'local'}|${scope === 'flow' ? `flow:${RUN.scenario.id}` : isDraft() ? `draft:${RUN.scenario.id}` : RUN.id}|${nodeId || ''}|${sub || 'new'}`;
 const loadDraft = (k) => { try { return localStorage.getItem(k) || ''; } catch { return ''; } };
 const saveDraft = (k, v) => { try { if (v) localStorage.setItem(k, v); else localStorage.removeItem(k); } catch {} };
+// notes outside the comment composer (verdict, return, issue) carry their draft key: typed text is kept the same way
+document.addEventListener('input', (e) => { const k = e.target?.dataset?.draft; if (k) saveDraft(k, e.target.value); });
 const noteHtml = (s) => esc(s).replace(/(^|\s)@([\w.+-]+(?:@[\w.-]+)?)/g, '$1<b class="c-at">@$2</b>').replace(/\n/g, '<br>');
 /** Numbers of the threads pinned on this step's screenshot (the same numbers as the marks on the image). */
 function pinNumbers (nodeId) {
@@ -2197,9 +2206,13 @@ function closeStack (keepHash) {
   if (S.st?.inline) { if (keepHash === true) return; const id = S.st.id; S.st = null; riRender({ focus: id }); setHash(null); return; } // folder → back to the run index
   $('si').hidden = true; if (keepHash !== true) setHash(null);
 }
+// a CSV cell: text from crawled pages that starts like a formula (= + - @ tab CR) gets a leading ' so a spreadsheet
+// shows it instead of running it, also after a ; or a line break (Excel with a semicolon separator splits there; the
+// same rule as the audit CSV, worker/src/audit-log.js); numbers stay numbers
+function csvCell (v) { if (typeof v === 'number') return String(v); const s = v == null ? '' : String(v); const x = (/^[=+\-@\t\r]/.test(s) ? `'${s}` : s).replace(/([;\r\n]["\s]*)(?=[=+\-@])/g, "$1'"); return /[",\n\r]/.test(x) ? `"${x.replace(/"/g, '""')}"` : x; }
 function stackCsv (n, data) {
   const cols = data.fields || [];
-  const q = (v) => { const x = v == null ? '' : String(v); return /[",\n;]/.test(x) ? `"${x.replace(/"/g, '""')}"` : x; };
+  const q = csvCell;
   const rows = [['path', 'url', 'status', 'failing', 'review', ...cols.map((f) => f.label || f.id)], ...S.st.filtered.map((it) => [it.path, it.url, it.status, (it.fails || []).join(' '), (it.review || []).join(' '), ...cols.map((f) => it.fields?.[f.id])])];
   const blob = new Blob(['' + rows.map((r) => r.map(q).join(',')).join('\n')], { type: 'text/csv;charset=utf-8' });
   const a = document.createElement('a'); a.href = URL.createObjectURL(blob); a.download = `${RUN.scenario?.id || 'run'}-${n.id}.csv`; document.body.appendChild(a); a.click(); a.remove(); setTimeout(() => URL.revokeObjectURL(a.href), 1000);
@@ -2359,7 +2372,7 @@ function riKey (e) {
   return false;
 }
 function riCsv () {
-  const q = (v) => { const x = v == null ? '' : String(v); return /[",\n;]/.test(x) ? `"${x.replace(/"/g, '""')}"` : x; };
+  const q = csvCell;
   const rows = [['step', 'title', 'kind', 'path', 'status', 'criteria_passed', 'criteria', 'failing', 'http', 'console_errors', 'pages']];
   for (const e of S.ri.entries || []) {
     if (e.type === 'page') { rows.push([`${e.n.id}~${e.it.id}`, e.it.title || '', 'page', e.it.path, e.it.status, '', '', (e.it.fails || []).join(' '), e.it.fields?.http ?? '', '', '']); continue; }
@@ -2640,6 +2653,7 @@ function renderAll () { renderChrome(); renderNodes(); if (S.right) renderReport
 /* Evidence of the built-in checks is a fixed English template (kept as is in the data, for agents and the API);
    the canvas says it as a sentence in the reader's language. Unknown text and HTML snippets stay as they are. */
 const EVIDENCE = [
+  [/^Applies on (.+) only; this walk ran on (.+)\.$/, (m) => [`Does not apply on ${m[2]}: this check runs on ${m[1]} only`, `Na prostředí ${m[2]} se netýká: tahle kontrola běží jen na ${m[1]}`]],
   [/^no visible link to the home page$/, () => ['No visible link to the home page', 'Chybí viditelný odkaz na úvodní stránku']],
   [/^no visible (.+)$/, (m) => [`Nothing visible matches ${m[1]}`, `Na stránce není vidět nic, co odpovídá ${m[1]}`]],
   [/^(\d+)× (.+)$/, (m) => [`Found ${m[1]}× ${m[2]}`, `Nalezeno ${m[1]}× ${m[2]}`]],
@@ -3545,9 +3559,9 @@ function renderReport () {
    ${APP() && isDraft() ? `<div class="sec"><h4>${T('draft')} #${esc(RUN.draft.seq)}</h4><p class="note">${T('draftInfo')}</p><div id="draftChanges" class="note"></div></div>` : ''}
    ${versionNotesHtml()}
    ${APP() && !isDraft() ? `<div class="sec verdict-sec"><h4 class="vhead"><span>${isDesign() ? T('versionVerdict') : T('runVerdict')}</span><span class="badge st-${RUN.verdict?.verdict === 'accepted' ? 'pass' : RUN.verdict?.verdict === 'returned' ? 'fail' : 'skip'}">${T(RUN.verdict?.verdict || 'pending')}</span>${RUN.verdict?.baseline ? `<span class="badge st-partial">${T('baseline')}</span>` : ''}</h4>${RUN.verdict?.by || (RUN.baseline_id && RUN.baseline_id !== RUN.id) ? `<p class="note" style="margin:0 0 8px">${RUN.verdict?.by ? `${esc(RUN.verdict.by)}${RUN.verdict.via === 'token' || RUN.verdict.via === 'agent' ? ` <span class="badge st-skip">${T(RUN.verdict.via === 'agent' ? 'viaAgent' : 'viaToken')}</span>` : ''} · ${fmtDate(RUN.verdict.at)}` : ''}${RUN.baseline_id && RUN.baseline_id !== RUN.id ? `${RUN.verdict?.by ? ' · ' : ''}<a class="pr" href="${runHref(RUN.baseline_id)}">${T('baseline')} →</a>` : ''}</p>` : ''}${RUN.verdict?.note ? `<p class="note">${esc(RUN.verdict.note)}</p>` : ''}${RUN.verdict?.approvers ? `<p class="note">${RUN.verdict.awaiting.length ? `${T('awaiting')}: <b>${RUN.verdict.awaiting.map(esc).join(', ')}</b>` : `${T('approvedByAll')}`}${RUN.verdict.approved_by.length ? ` · ${T('approvedBy')}: ${RUN.verdict.approved_by.map(esc).join(', ')}` : ''}${RUN.verdict.approved_by_tokens?.length ? ` · ${T('approvedBy')} ${T('approvedByTokens')}: ${RUN.verdict.approved_by_tokens.map((a) => esc(a.email)).join(', ')}` : ''}</p>` : ''}
-     ${canWrite() ? `<textarea id="rvVerdictNote" hidden rows="2" placeholder="${T('verdictNotePh')}" style="width:100%;font:inherit;padding:8px;border:1px solid var(--line);border-radius:6px;background:var(--panel);color:var(--ink);margin:0 0 8px"></textarea>
+     ${canWrite() ? `<textarea id="rvVerdictNote" ${loadDraft(draftKey('run', '', 'verdict')) ? '' : 'hidden '}rows="2" placeholder="${T('verdictNotePh')}" data-draft="${esc(draftKey('run', '', 'verdict'))}" style="width:100%;font:inherit;padding:8px;border:1px solid var(--line);border-radius:6px;background:var(--panel);color:var(--ink);margin:0 0 8px">${esc(loadDraft(draftKey('run', '', 'verdict')))}</textarea>
      <div class="share__row"><button class="btn btn--primary" data-verdict="accepted">${isDesign() ? T('acceptVersion') : T('accept')}</button><button class="btn" data-verdict="returned">${isDesign() ? T('returnVersion') : T('ret')}</button></div>
-     <div class="vmore"><button class="linkish" id="rvNoteShow">${T('addNote')}</button>${RUN.verdict?.verdict === 'accepted' && !isDesign() ? `<button class="linkish" data-baseline="${RUN.verdict.baseline ? 'unset' : 'set'}">${RUN.verdict.baseline ? T('unsetBaseline') : T('setBaseline')}</button>` : ''}${APP().user?.role === 'admin' ? `<button class="linkish" data-public="${RUN.public ? 'off' : 'on'}" title="${T('publicHint')}">${RUN.public ? T('makePrivate') : isDesign() ? T('makePublicVersion') : T('makePublic')}</button>` : ''}</div>` : ''}${RUN.public ? `<p class="note" style="margin:6px 0 0"><span class="badge st-partial">${T('publicRun')}</span> ${T('publicNote')}</p>` : ''}${signoffHtml()}</div>` : ''}
+     <div class="vmore">${loadDraft(draftKey('run', '', 'verdict')) ? '' : `<button class="linkish" id="rvNoteShow">${T('addNote')}</button>`}${RUN.verdict?.verdict === 'accepted' && !isDesign() ? `<button class="linkish" data-baseline="${RUN.verdict.baseline ? 'unset' : 'set'}">${RUN.verdict.baseline ? T('unsetBaseline') : T('setBaseline')}</button>` : ''}${APP().user?.role === 'admin' ? `<button class="linkish" data-public="${RUN.public ? 'off' : 'on'}" title="${T('publicHint')}">${RUN.public ? T('makePrivate') : isDesign() ? T('makePublicVersion') : T('makePublic')}</button>` : ''}</div>` : ''}${RUN.public ? `<p class="note" style="margin:6px 0 0"><span class="badge st-partial">${T('publicRun')}</span> ${T('publicNote')}</p>` : ''}${signoffHtml()}</div>` : ''}
    ${commentsPanel()}
    <div class="sec"><p class="verdict">${esc(c.pass)} / ${tot} ${T('stepsDone')} <em>· ${ok}/${all.length} ${T('criteriaWord')} (${esc(S.loc)})</em></p>
      <div class="stack">${['pass', 'partial', 'fail', 'skip'].map((k) => `<i style="width:${c[k] / tot * 100}%;background:var(--${k})"></i>`).join('')}</div>
@@ -3578,7 +3592,7 @@ function renderReport () {
   const sc = $('shareCopy'); if (sc) sc.onclick = async () => { const link = $('shareUrl').textContent; try { await navigator.clipboard.writeText(link); toast(T('linkCopied')); } catch { toast(link); } };
   const showNote = () => { const t = $('rvVerdictNote'); if (!t) return; t.hidden = false; $('rvNoteShow')?.remove(); t.focus(); };
   if ($('rvNoteShow')) $('rvNoteShow').onclick = showNote;
-  $('rside').querySelectorAll('[data-verdict]').forEach((b) => { b.onclick = async () => { const note = $('rvVerdictNote').value.trim(); if (b.dataset.verdict === 'returned' && !note) { showNote(); toast(T('noteRequired')); return; } b.disabled = true; try { await postJson('/verdict', { verdict: b.dataset.verdict, note }); toast(T('saved')); await reloadRun(); } catch (e) { toast(e.message); b.disabled = false; } }; });
+  $('rside').querySelectorAll('[data-verdict]').forEach((b) => { b.onclick = async () => { const note = $('rvVerdictNote').value.trim(); if (b.dataset.verdict === 'returned' && !note) { showNote(); toast(T('noteRequired')); return; } b.disabled = true; try { await postJson('/verdict', { verdict: b.dataset.verdict, note }); saveDraft(draftKey('run', '', 'verdict'), ''); toast(T('saved')); await reloadRun(); } catch (e) { toast(e.message); b.disabled = false; } }; });
   $('rside').querySelectorAll('[data-public]').forEach((b) => { b.onclick = async () => { if (b.dataset.public === 'on' && !confirm(T('publicConfirm'))) return; b.disabled = true; try { await postJson('/public', { public: b.dataset.public === 'on' }); toast(T('saved')); await reloadRun(); } catch (e) { toast(e.message); b.disabled = false; } }; });
   $('rside').querySelectorAll('[data-baseline]').forEach((b) => { b.onclick = async () => { b.disabled = true; try { await postJson('/verdict', { verdict: 'accepted', note: RUN.verdict?.note || '', baseline: b.dataset.baseline === 'set' }); toast(T('saved')); await reloadRun(); } catch (e) { toast(e.message); b.disabled = false; } }; });
   $('rside').querySelectorAll('[data-go],tr[data-id]').forEach((el) => { el.onclick = () => { if (byId(el.dataset.go || el.dataset.id)) openLb(el.dataset.go || el.dataset.id); }; });
@@ -3756,8 +3770,18 @@ const sameAsCmp = (n) => !!(S.cmp && isDesign() && n.kind !== 'decision' && revO
 const headOf = (n, loc = S.loc) => RUN.revisions?.[`${n.id}|${loc}`] || null;
 const who = (a) => a ? (a.agent ? `${a.agent} (${T('viaAgent')} ${a.email})` : a.email) : '';
 
+/**
+ * The session ended while the canvas was open (an API call answered 401): one bar says so and links to sign in with
+ * the way back; every unsent text is already in localStorage (drafts) and stays. Returns the error to throw.
+ */
+function sessionLost () {
+  try { localStorage.setItem('qawalk-return', JSON.stringify({ path: location.pathname, hash: location.hash, at: Date.now() })); } catch {}
+  if (!$('sessLost')) document.body.insertAdjacentHTML('beforeend', `<div id="sessLost" class="sess-lost" role="alert"><span>${esc(T('sessionLost'))}</span><a class="btn btn--primary" href="/login?next=${encodeURIComponent(location.pathname + location.search)}">${esc(T('signInAgain'))}</a></div>`);
+  return new Error(T('sessionLost'));
+}
 async function apiJson (method, url, body) {
   const res = await fetch(url, { method, credentials: 'same-origin', headers: body ? { 'Content-Type': 'application/json' } : {}, body: body ? JSON.stringify(body) : undefined });
+  if (res.status === 401) throw sessionLost();
   const data = await res.json().catch(() => ({}));
   if (!res.ok) throw new Error(data.error || `HTTP ${res.status}`);
   return data;
@@ -4710,7 +4734,7 @@ function issuesBlock (n, v) {
       ${trackers.length > 1 ? `<label>${esc(T('issTracker'))} <select id="issTracker">${trackers.map((t) => `<option value="${esc(t.kind)}">${esc(t.label)} · ${esc(t.target)}</option>`).join('')}</select></label>` : ''}
       <label>${esc(T('issCriterion'))} <select id="issCrit"><option value="">${esc(T('issWholeStep'))}</option>${crit.map((c) => `<option value="${esc(c.id)}" ${pick && pick.id === c.id ? 'selected' : ''}>${esc(c.id)} · ${esc(String(critText(c)).slice(0, 60))}</option>`).join('')}</select></label>
       <label>${esc(T('issName'))} <input id="issName" maxlength="200" placeholder="${esc(T('issNamePh'))}"></label>
-      <label>${esc(T('issNote'))} <textarea id="issNote" rows="2"></textarea></label>
+      <label>${esc(T('issNote'))} <textarea id="issNote" rows="2" data-draft="${esc(draftKey('step', n.id, 'issue'))}">${esc(loadDraft(draftKey('step', n.id, 'issue')))}</textarea></label>
       <div class="share__row"><button class="btn btn--primary" data-iss-send="${esc(n.id)}" data-iss-vp="${esc(v?.name || '')}">${esc(T('issSend'))}</button><button class="btn" data-iss-cancel>${esc(T('cancel'))}</button></div></div>`;
   } else if (can) tail = `<div class="share__row">${trackers.map((t) => `<button class="btn" data-iss-new="${esc(n.id)}" data-iss-kind="${esc(t.kind)}">${esc(T('issNew')(t.label))}</button>`).join('')}</div>`;
   return `<div class="sec iss"><h4>${esc(T('issTitle'))}</h4>${items}${tail}</div>`;
@@ -4722,9 +4746,10 @@ async function issSend (step, vp) {
   ISS.busy = true; toast(T('issSending'));
   try {
     const res = await fetch(`${a.api}/orgs/${a.org}/issues`, { method: 'POST', credentials: 'same-origin', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ run_id: a.run, step, to, criterion: $('issCrit')?.value || undefined, title: $('issName')?.value.trim() || undefined, note: $('issNote')?.value.trim() || undefined, locale: S.loc, viewport: vp || undefined }) });
+    if (res.status === 401) throw sessionLost();
     const out = await res.json().catch(() => ({}));
     if (!res.ok) throw new Error(out.error || `HTTP ${res.status}`);
-    ISS.form = null;
+    ISS.form = null; saveDraft(draftKey('step', step, 'issue'), '');
     toast(T('issSent')(out.key));
     await issLoad();
     await refreshComments();
@@ -4794,13 +4819,13 @@ const rvItems = () => [...(RV.data?.items || []), ...RV.extra];
 const rvCur = () => rvItems()[RV.idx] || null;
 const RV_GROUP = { fail: 0, returned: 0, needs_review: 1, not_evaluated: 1, revoked: 1, changed: 2, new: 2, comments: 3 };
 const rvDay = (iso) => (iso ? fmtDate(iso).replace(/ \d{2}:\d{2}$/, '') : '');
-const rvOpenCrit = (c) => Object.values(c.by_locale || {}).some((vps) => Object.values(vps || {}).some((r) => ['needs_review', 'not_evaluated'].includes(r?.verdict)));
+const rvOpenCrit = (c) => !c.not_applicable && Object.values(c.by_locale || {}).some((vps) => Object.values(vps || {}).some((r) => ['needs_review', 'not_evaluated'].includes(r?.verdict)));
 
 /** A read-only queue from the run itself (local preview, export, public run): no carry-over, no comparison. */
 function rvLocalQueue () {
   const items = []; let clear = 0;
   flowOrder().forEach((n, position) => {
-    const vs = (n.criteria || []).map((c) => c.verdict).filter(Boolean);
+    const vs = (n.criteria || []).filter((c) => !c.not_applicable).map((c) => c.verdict).filter(Boolean);
     const reasons = [];
     if (n.status === 'fail' || vs.includes('fail')) reasons.push('fail');
     if (vs.includes('needs_review')) reasons.push('needs_review');
@@ -4960,7 +4985,7 @@ function rvEndHtml () {
   const carried = (d.carried || []).length ? `<div class="sec"><h4>${esc(T('rvCarriedTitle'))}</h4><p class="note">${esc(T('rvCarriedLead'))}</p><ul class="rvm__list">${d.carried.map((x) => `<li><span class="badge st-pass">✓</span><button class="linkish" data-rv-show="${esc(x.step)}">${esc(loc(byId(x.step)?.title) || x.step)}</button><span class="note">${esc((x.kind === 'run' ? T('rvCarriedRun') : T('rvCarriedStep'))(x.from_run, x.approved_by, rvDay(x.approved_at)))}</span>${rvWritable() ? `<button class="linkish" data-rv-revoke="${esc(x.step)}">${esc(T('rvRevoke'))}</button>` : ''}</li>`).join('')}</ul></div>` : '';
   const v = RUN.verdict || d.verdict || {};
   const verdict = rvWritable() ? `<div class="sec verdict-sec"><h4 class="vhead"><span>${T('runVerdict')}</span><span class="badge st-${v.verdict === 'accepted' ? 'pass' : v.verdict === 'returned' ? 'fail' : 'skip'}">${T(v.verdict || 'pending')}</span></h4><p class="note">${esc(T('rvVerdictLead'))}${returned ? ` ${esc(T('rvReturnedHint'))}` : ''}</p>${v.approvers ? `<p class="note">${v.awaiting?.length ? `${T('awaiting')}: <b>${v.awaiting.map(esc).join(', ')}</b>` : T('approvedByAll')}</p>` : ''}
-    <textarea id="rvVNote" rows="2" placeholder="${esc(T('verdictNotePh'))}" style="width:100%;font:inherit;padding:8px;border:1px solid var(--line);border-radius:6px;background:var(--panel);color:var(--ink);margin:0 0 8px"></textarea>
+    <textarea id="rvVNote" rows="2" placeholder="${esc(T('verdictNotePh'))}" data-draft="${esc(draftKey('run', '', 'verdict'))}" style="width:100%;font:inherit;padding:8px;border:1px solid var(--line);border-radius:6px;background:var(--panel);color:var(--ink);margin:0 0 8px">${esc(loadDraft(draftKey('run', '', 'verdict')))}</textarea>
     <div class="share__row"><button class="btn btn--primary" data-rv-verdict="accepted">${T('accept')}</button><button class="btn" data-rv-verdict="returned">${T('ret')}</button></div></div>` : '';
   return `<div class="rvm__end"><h3>${esc(head)}</h3><p class="note">${esc(sum)}</p>${d.reference ? `<p class="note">${esc(T('rvComparedWith'))}: <a class="pr" href="${runHref(d.reference.id)}">${fmtDate(d.reference.started_at)}${d.reference.accepted_by ? ` · ${esc(d.reference.accepted_by)}` : ''}</a></p>` : ''}${list}${carried}${verdict}</div>`;
 }
@@ -5088,7 +5113,7 @@ async function rvVerdict (verdict, b) {
   const note = $('rvVNote')?.value.trim() || '';
   if (verdict === 'returned' && !note) { toast(T('noteRequired')); $('rvVNote')?.focus(); return; }
   b.disabled = true;
-  try { await postJson('/verdict', { verdict, note }); toast(T('saved')); await reloadRun(); await rvLoad(); rvRender(); } catch (e) { toast(e.message); b.disabled = false; }
+  try { await postJson('/verdict', { verdict, note }); saveDraft(draftKey('run', '', 'verdict'), ''); toast(T('saved')); await reloadRun(); await rvLoad(); rvRender(); } catch (e) { toast(e.message); b.disabled = false; }
 }
 /** Starts review mode support once the run is on screen: the button, its count and the hash. */
 function rvInit () {
@@ -5150,9 +5175,11 @@ function applyReviewerVerdicts () {
   const summary = { pass: 0, partial: 0, fail: 0, skip: 0 };
   for (const n of RUN.nodes) {
     if (n.kind === 'decision') continue;
-    for (const c of n.criteria) { const vs = RUN.scope.locales.map((l) => { const vps = Object.values(c.by_locale?.[l] || {}); return vps.length ? worstV(vps.map((v) => v.verdict)) : 'not_reached'; }).filter((v) => v !== 'not_reached'); c.verdict = vs.length ? worstV(vs) : 'not_reached'; }
-    n.by_locale = Object.fromEntries(RUN.scope.locales.map((l) => [l, statusOf(n.criteria.map((c) => { const vps = Object.values(c.by_locale?.[l] || {}); return vps.length ? worstV(vps.map((v) => v.verdict)) : 'not_reached'; }), !!n.captures?.[l])]));
-    n.status = statusOf(n.criteria.filter((c) => c.verdict !== 'not_reached').map((c) => c.verdict), Object.keys(n.captures || {}).length > 0);
+    // a criterion limited to another environment (not_applicable) stays out of the status
+    const live = n.criteria.filter((c) => !c.not_applicable);
+    for (const c of live) { const vs = RUN.scope.locales.map((l) => { const vps = Object.values(c.by_locale?.[l] || {}); return vps.length ? worstV(vps.map((v) => v.verdict)) : 'not_reached'; }).filter((v) => v !== 'not_reached'); c.verdict = vs.length ? worstV(vs) : 'not_reached'; }
+    n.by_locale = Object.fromEntries(RUN.scope.locales.map((l) => [l, statusOf(live.map((c) => { const vps = Object.values(c.by_locale?.[l] || {}); return vps.length ? worstV(vps.map((v) => v.verdict)) : 'not_reached'; }), !!n.captures?.[l])]));
+    n.status = statusOf(live.filter((c) => c.verdict !== 'not_reached').map((c) => c.verdict), Object.keys(n.captures || {}).length > 0);
     summary[n.status]++;
   }
   RUN.summary = { ...RUN.summary, ...summary };
@@ -5160,6 +5187,7 @@ function applyReviewerVerdicts () {
 async function postJson (path, body) {
   const a = APP();
   const res = await fetch(`${a.api}/orgs/${a.org}/runs/${a.run}${path}`, { method: 'POST', credentials: 'same-origin', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify(body) });
+  if (res.status === 401) throw sessionLost();
   if (!res.ok) throw new Error((await res.json().catch(() => ({}))).error || `HTTP ${res.status}`);
   return res.json();
 }